/*
Theme Name: Rosemary
Author: Joanthan McKinnell
Author URI: http://www.mckinnell.ca
Description: Theme built for the portfollio site of Rosemary Counter
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: white, pink, red, minimalist
*/


@import "fonts/quicksand/stylesheet.css";


.alignleft {
    float: left;   
}

.alignright {
    float:right;   
}

.floatnone {
    float:none;
    clear:both;
}

html {
	font-size: 62.5%;
}

body {
	font-family: 'QuicksandBook', serif;
	font-size: 1.3rem;
	background: #f1f0f0;
}

.container {
	margin: 39px auto;
	width: 900px;
}

header.main {
	border: 1px dotted #979495;
	border-width: 1px 0;
	width: 100%;
	padding: 0 31px ;
	float: left;
    margin-bottom: 34px;
}

.brand {
	width: 330px;
	margin-right: 25px;
	float: left;
}

.brand a.logo {
	display: block;
	background: url(images/logo.png) no-repeat center center;
	width: 325px;
	height: 58px;
	display: block;
	text-indent: -10000px;
	margin: 12px 0 0 0;
	padding: 9px 0px;
	box-sizing: content-box;
	border-bottom: 1px dotted #979495;
}

.brand span.footer {
	display: block;
	text-align: center;
	text-transform: uppercase;
	font-size: 1.3rem;
	padding: 20px 0 8px 0;
	margin: 0 0 12px 0;
	letter-spacing: 0.350rem;
	line-height: 1;
}

header.main nav ul {
	list-style: none;
	
}

header.main nav ul li {
	float: left;
}

header.main nav ul li a {
	color: #000;
	background: url(images/icon_about.png) no-repeat center 15px;
	font-family: 'QuicksandBold', serif;
	font-size: 1.3rem;
    letter-spacing: 0.3rem;
	line-height: 1;
	text-transform: uppercase;
	display: block;
	padding: 86px 25px 10px 25px;
	border-left: 1px dotted #979495;
}

header.main nav ul li a:hover {
    color: #e51937;
}

header.main nav ul li.last-horz  a{
	border-right: 1px dotted #979495; 
}

header.main nav ul li#clips a {
	background-image: url(images/icon_clips.png);
}

header.main nav ul li#book a {
	background-image: url(images/icon_book.png);
}

header.main nav ul li#blog a {
	background-image: url(images/icon_blog.png);
    background-position: 5px center;
}

header.main nav ul li#contact a {
	background-image: url(images/icon_contact.png);
}

header.main nav ul li.vert a {
    background-position: left center;
	padding: 23px 0 21px 44px;
	margin: 0 0 0 24px;
    
	border: none;
    border-bottom: 1px dotted #979495;
    text-align:center;
    width: 140px;
}


header.main nav ul li.vert:last-child a {
    border-bottom: none;
    margin-top: 4px;
}


/**
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    contenteditable attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    *zoom: 1;
}



/* Footer */

footer {
    width: 100%;
    padding-top: 5%;
    clear:both;
    
}

.headshot {
    width: 17%;
    height: auto;
    float: left;
    margin: 0 3% 9% 0;
    border-radius: 100%;
}

.profile {
    width: 51%;   
    float: left;
}

.profile p {
    font-size: 1.2rem;
    color: #9b9b9b;
    font-family: 'Georgia', serif;
}

.profile p .dropcap {
    font-family: 'QuickSandBook', sans-serif;
    color: #e51937;
    text-transform:uppercase;
   
}

.subnav {
    width: 49%;
    float: left;
    padding-left: 5%;
}

.subnav ul {
    margin: 0 0 7% 0;
    padding: 0;
    float:right;
    
}

.subnav ul li {
    float:left;
    list-style: none;
    
}

.subnav ul li a {
    color: #000;
    font-family: 'QuickSandBook', sans-serif;
    font-size: 1.3rem;
    text-transform: uppercase;
    padding: 11px;
    border-left: 1px dotted #979495;
    display:block;
}

.subnav ul li a:hover {
    color: #e51937;
}

.subnav ul li:last-child a {
    border-right: 1px dotted #979495;
}

.copyright {
    font-family: 'QuickSandBook', sans-serif;
    font-size: 1.2rem;
    float: right;
}

.copyright .logo_text { 
    text-indent: -5000px;
    display:inline-block;
    background: url(images/logo_copyright.png) no-repeat top center;
    width: 175px;
    height: 30px;
    padding: 8px;
}

.content {
    position:relative;
    float: left;
    width: 100%;
}

/* Home Page Styles */




.best-picks {
    border-bottom: 2px solid #e51937;
    float:left;
    position:relative;
    width: 100%;
}

.best-picks .view_more {
    position: absolute;
    bottom: -15px;
    right: 0;
    width: 163px;
    height: 30px;
    padding: 8px 10px;
    background: #f1f0f0;
    border: 2px solid #e51937;
    display:block;
    text-align: center;
    color: #000;
    text-transform: uppercase;
    
}

.best-picks .view_more:hover {
    background: #e51937;
    color: #fff;
}

.best-picks .view_more:after {
    content: '';
    position: absolute;
    left: -14px;
    top: -17px;
    border-width: 15px 12px;
    border-style: solid;
    border-color: transparent  transparent  #db1835 transparent;
    z-index:-1;
    
}

.best-picks .first-feature {
    width: 48%;
    float: left;
    padding-bottom: 4%;
    margin: 0 2% 0 0;
    border-bottom: 1px solid #e4e3e4;
}

.best-picks .secondary_features {
    width: 48%;
    float: right;
    border-left: 1px solid #e4e3e4;
    padding-left: 2%
}

.best-picks .latest {
    width: 50%;
    float:left;
    padding: 3% 2.3%;
    
}

.best-picks .latest ul li {
    list-style: none;
    padding: 1% 0;
    font-size: 1.4rem
}    

.best-picks .latest ul li a:hover {
    text-decoration: underline;
}

.best-picks .secondary-feature {
    float:left;
    margin-bottom: 22px;
    padding-bottom: 24px;
    border-bottom: 1px solid #e4e3e4;
    width:100%;
}

.best-picks .secondary-feature h1 {
    margin: 0 0 5px 0;
}

.best-picks h1 {
    font-family: 'Georgia', sans-serif;
    font-size:1.9rem;
    font-weight:normal;
}

.from {
    font-family: 'QuicksandBookOblique', sans-serif;
    font-size:1.2rem;
    text-transform:uppercase;
    padding-bottom: 13px;
    display:inline-block;
}


.best-picks .secondary-feature .from {
    padding-bottom: 9px;    
}

.best-picks .first-feature .from {
    padding-bottom: 9px;
   
}
    
.best-picks .blurb {
    font-family: 'Georgia', serif;
    font-style:italic;
    font-size: 1.3rem;
    
}

.best-picks .first-feature .featured_image {
    width: 240px;
    float: left;
    margin: 0 20px;
     position:relative;
}


.best-picks .secondary-feature .featured_image {
    width: 115px;
    float: left;
    margin: 0 20px 20px 0;
    position:relative;
}

.best-picks .first-feature .featured_image:before {
    content: 'Featured';
    left: -4%;
    bottom:0;
    position: absolute;
    background: #e51937;
    color: #fff;
    font-size:1.0rem;
    padding: 8px 20px 4px 20px;
    letter-spacing: 2.3px;
    text-transform:uppercase;
}

.best-picks .first-feature .featured_image:after {
    content: '';
    left: -8.7%;
    bottom: 3.7%;
    border-width: 11px;
    border-style:solid;
    border-color: transparent #f19081 transparent transparent;
    position:absolute;
    z-index:-1;
}


.best-picks .read_more {
    text-decoration: underline;
}

.best-picks .read_more:hover {
    text-decoration: none;
}

time {
    font-size: 1.2rem;
    color: #555;
}

/* CLips */


.best-picks.clips {
    width: 100%;
    padding-left: 22%;
    float: left;
}

.best-picks.clips .secondary-feature {
    width: 33.3333%;
    padding-right: 3%;
    padding-left: 3%;
    border-left: 1px solid #c9cacc;
    border-bottom: 0;
    height: 361px;
}
.best-picks.clips .secondary-feature:first-child {
    border-left: 0;
}
    
.best-picks.clips .secondary-feature .featured_image {
    width: 80%;
    float:none;
    margin: 0 auto;
    position:relative;
}

.best-picks.clips .secondary-feature h1 {
    font-size: 1.5rem;
    margin: 18px 0;
    text-align: center;
}

.best-picks.clips .secondary-feature h1 a {
    color:#000;
}

.best-picks.clips .secondary-feature h1 a:hover {
    color: #e51937;
}
    
.best-picks.clips .secondary-feature .from {
    font-size: 1.0rem;
    text-align: center;
    display:block;
    margin-bottom: 6px;
}
.best-picks.clips .secondary-feature .blurb {
    text-align:center;
}

.best-picks .secondary-feature .featured_image .category {
    left: -7%;
    bottom: 0;
    position: absolute;
    background: #e51937;
    color: #fff;
    font-size: 1.0rem;
    padding: 8px 20px 4px 20px;
    letter-spacing: 2.3px;
    text-transform: uppercase;
}

.best-picks .secondary-feature .featured_image .category:before {
    content: '';
    left: -9.7%;
    top: -48%;
    border-width: 11px;
    border-style: solid;
    border-color: transparent #f19081 transparent transparent;
    position: absolute;
    z-index: -1;
}


.clip-nav {
    width: 22%;
    float:left;
    position: absolute;
    padding: 0 0 0 4%;
    margin: 0;
    z-index:2;
}

.clip-nav a:hover {
    color: #e51937;
}

.categories {
    font-family: 'QuickSandBold', sans-serif;
    color:#e70f47;
    text-transform: uppercase;
    font-size: 1.2rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

.categories ul  {
    padding: 0;
    margin: 0;
}
.categories ul li {
    list-style: none;
    padding: 13px 0;
    margin: 0;
    font-family: 'Georgia', serif;
    font-style: italic;
    font-size: 1.2rem;
    text-transform: none;
    border: 1px dotted #bdbcbc;
    border-width: 0 0 1px 0;
}

.categories ul li:last-child {
    border: none;   
}

.categories ul li a {
    color: #000;
    width: 100%;
    display: block;
}

.categories ul li.current-cat a {
    color:#c9cacc;
}

.category-blog .best-picks.clips {
    width: 100%;
    padding: 0 0 0 5%;  
}


.category-blog .best-picks .secondary-feature .featured_image .category {
    display:none;
}

.placeholder {
    margin: 20px 0;
}

/* Single Post */

.single-post article {
    padding: 0 3.6%;   
}


.single-post h1, .page h1 {
    font-family: 'Georgia', sans-serif;
    font-size:2.2rem;
    font-weight:900;
}

.single-post h3 {
    font-family: 'QuicksandBookOblique', sans-serif;
}

.single-post h2, .page h2 {
    font-family: 'QuicksandBook', sans-serif;
    font-size: 16px;
}

.single-post .from {
    border-bottom: 1px dotted #979495;
    margin-bottom: 4%;
    width: 100%;
    letter-spacing: 0.1rem;
}

.single-post .from .publication {
    color: #e70f47;
}


.single-post .featured_images {
    width: 30%;
    float: left;
    margin: 0 0 2% 3%;
}


.single-post .featured_images img {
    margin-top: 10px;
}   

.you_may_like {
    width: 59%;
    float: left;
    padding:0 3.6%;
}

.you_may_like h3 {
    font-size: 1.8rem;
    font-family: 'Georgia', serif;
    font-weight: 900;
    text-align: center;
}

.single-post article p {
    font-family: Georgia, serif;
    font-size: 1.6rem;
    margin-bottom: 0.9em
}

.you_may_like ul li {
    width: 25%;
    float: left;
    list-style: none;
    text-align: center;
}

.you_may_like ul li .from {
    font-family: 'QuicksandBook', serif;
    font-size: 1.0rem;
    line-height:1.1;
    border: none;
}

.you_may_like ul li div, .you_may_like ul li time  {
    display: block;
    float: none;
    font-size: 1.0rem;
}

.you_may_like ul li img.wp-post-image {
    width: 80%;
    float:none;
}

.you_may_like ul li h1 {
    font-weight:normal;
    font-size: 1.6rem;
    
}

.article-copy {
    width: 67%;
    padding-right: 8%;
    float:left;
    display:block;
}

.post-pagination {
    float: right;
    padding: 2% 0;
    font-family: 'QuicksandBold';
}


.post-pagination .page-numbers {
    line-height:0.3;
    font-family: 'QuicksandBold';
    margin: 0 2px;
}

.post-pagination .next {
    text-indent: -10000px;
    border: 5px solid #ec1747;
    border-color: transparent transparent transparent #ec1747;
    display:inline-block;
    height:0;
    width: 0;
    margin: 0 2px;
}

.post-pagination .prev {
    text-indent: -10000px;
    border: 5px solid #ec1747;
    border-color: transparent #ec1747 transparent transparent ;
    display:inline-block;
    height:0;
    width: 0;
    margin: 0 2px;
}