/* 
Theme Name: Gender Focus
Description: Custom WordPress theme for Gender Focus based on Bootstrap 3.2.0
Author: Kasia Gawlak / CodeWord Media Design
Version: 1.0 
*/

/* ----- IMPORT BOOTSTRAP DEFAULTS --------------------------- */

@import url('bootstrap/css/bootstrap.min.css');
@import url('bootstrap/css/bootstrap-theme.min.css');

/* ----- ADD SUPPORT FOR WORDPRESS IMAGE CLASSES ------------- */

.alignleft { float: left; margin-right: 15px; margin-bottom: 5px }
.alignright { float: right; margin-left: 15px; margin-bottom: 5px }
.aligncenter { display: block; margin: 15px auto }

/* ----- RESET/OVERRIDE DEFAULT BOOTSTRAP CSS ---------------- */

body { color: #111; font-family: "Open Sans"; font-weight: 400 }
.bold { font-weight: 700 }
h1,h2,h3,h4,h5,h6,.crimson-text, #related-posts a.post-title { font-family: "Crimson Text"; font-weight: 600 }
.post-label, .navbar-nav>li>a, .first-post-meta, .preview-post-meta, .btn-default, .social-widget h3, h1.archive-h1, .content .meta, .author-social .meta { font-family: "Open Sans Condensed"; font-weight: 700 }

a, a:hover { color: #bd9df5 }

h1,h2,h3,h4,h5,h6 { margin: 0; padding: 0; line-height: 1 }

.navbar { /* margin-bottom: 0 */ }

.navbar-default {
    background: transparent;
    border: 0;
    background-image: none;
    filter: none;
    webkit-box-shadow: none;
    box-shadow: none;
}

.navbar-toggle { margin: 0; border: 0 }
.navbar-default .navbar-toggle:hover { background: transparent }
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background: transparent }

.navbar-collapse { padding: 0 }
.navbar-default .navbar-collapse { margin-top: 15px; border-color: #eee }

.navbar-nav { margin: 7.5px 0 }
.navbar-nav>li>a { padding: 7.5px 0; font-size: 18px }
.navbar-default .navbar-nav>li>a { color: #999; text-transform: uppercase }
.navbar-default .navbar-nav>li>a:hover { color: #333 }
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover {
    background: transparent;
    color: #bd9df5;
    filter: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.pagination-wrapper { text-align: center }
.pagination { margin: 0; font-size: 12px }
.pagination>li>a, .pagination>li>span { color: #bd9df5; padding: 4px 8px }
.pagination>li>a:hover, .pagination>li>span:hover { color: #111 }

.pagination>.active>a, 
.pagination>.active>span, 
.pagination>.active>a:hover, 
.pagination>.active>span:hover, 
.pagination>.active>a:focus, 
.pagination>.active>span:focus { background-color: #bd9df5; border-color: #bd9df5 }

/* ----- CUSTOM HEADER & MENU STYLES ------------------------- */

#header { margin-top: 15px }
.header-img { max-height: 75px }
.navbar-search { width: 50%; float: left }
.social-icons { width: 50%; float: right; font-size: 26px; text-align: right; margin-top: 2px }
.social-icons a:hover { color: #333 }



/* ----- CUSTOM CONTENT STYLES ------------------------------- */

.black { color: #111 }
.dark-grey { color: #333 }
.grey { color: #999 }
.light-grey { color: #ccc }
.purple { color: #bd9df5 }
.caps { text-transform: uppercase; letter-spacing: 1px }
.white-bg { background: #fff }

.post-container { 
	-webkit-box-shadow: 0 0 5px 0 rgba(50, 50, 50, 0.75);
	-moz-box-shadow:    0 0 5px 0 rgba(50, 50, 50, 0.75);
	box-shadow:         0 0 5px 0 rgba(50, 50, 50, 0.75);
}

#first-post-image, .preview-post-image { position: relative }

.post-label { 
	position: absolute; 
	bottom: 0; 
	right: 0; 
	background: #bd9df5; 
	text-transform: uppercase; 
	color: #fff; 
	font-weight: bold; 
	line-height: 1; 
	padding: 7.5px; 
	font-size: 20px;
	-moz-border-radius-topleft: 7.5px;
	-webkit-border-top-left-radius: 7.5px;
	 border-top-left-radius: 7.5px;
	/*-webkit-box-shadow: -2px -2px 5px 0 rgba(50, 50, 50, 0.75);
	-moz-box-shadow:    -2px -2px 5px 0 rgba(50, 50, 50, 0.75);
	box-shadow:         -2px -2px 5px 0 rgba(50, 50, 50, 0.75);*/
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}
.post-label a { color: #fff }
.post-label a:hover { color: #fff; text-decoration: none }

.preview-post { margin: 15px 0 }
.archive-container .preview-post { margin: 0 }

#first-post-content, .preview-post-content { padding: 15px }
#first-post-content p, .preview-post-content p { margin: 0; padding: 0; font-size: 16px }
#first-post-content h1, .preview-post-content h1 { 
	margin-bottom: 5px; 
	font-size: 36px;
}
#first-post-content h1 a, .preview-post-content h1 a, #first-post-content h1 a:hover, .preview-post-content h1 a:hover { color: #333 }
.first-post-meta, .preview-post-meta { margin-bottom: 15px; text-transform: uppercase; font-size: 16px; color: #999 }

.content h2 { font-size: 28px; margin: 15px 0 }
.content h3 { font-size: 24px; margin: 15px 0 }
.content p { font-size: 18px; margin: 15px 0 }
.content ul, .content ol { padding-left: 25px }
.content li { font-size: 18px; margin: 15px 0 }
.content img { max-width: 100%; height: auto }
.content img.box-shadow {
	-webkit-box-shadow: 0 0 5px 0 rgba(50, 50, 50, 0.75);
	-moz-box-shadow:    0 0 5px 0 rgba(50, 50, 50, 0.75);
	box-shadow:         0 0 5px 0 rgba(50, 50, 50, 0.75);
}
.content .meta { margin-bottom: 15px; text-transform: uppercase; font-size: 16px; color: #999; margin-top: 10px }
.content .meta .share { margin-top: 10px }
.content blockquote {
	padding: 0px 20px;
}
.content blockquote p { font-size: 120%; color: #666 }
.content p.wp-caption-text { font-size: 90%; color: #999 }
.content .wp-caption { max-width: 100% !important; height: auto }


.content .tagline p { font-size: 95% }

.post-excerpt { }
.post-excerpt-grid { padding: 10px 0 }
.post-excerpt-grid h2 { /* font-size: 24px */ }
.post-excerpt-grid p { padding-bottom: 0 }

h1.archive-h1 { text-align: center; color: #111; font-size: 28px }

.author-bio .avatar { 
	float: left; 
	margin-right: 15px; 
	margin-bottom: 5px; 
	-webkit-box-shadow: 0 0 5px 0 rgba(50, 50, 50, 0.75);
	-moz-box-shadow:    0 0 5px 0 rgba(50, 50, 50, 0.75);
	box-shadow:         0 0 5px 0 rgba(50, 50, 50, 0.75);  
}
.author-social { font-size: 24px; line-height: 1; margin-top: 15px }
.author-social .fa { padding-right: 10px }

.btn-full-width, .btn-full-width:hover { 
	width: 100%; 
	text-align: center; 
	text-transform: uppercase; 
	letter-spacing: 1; 
	font-size: 20px; 
	background: #bd9df5; 
	color: #fff; 
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); 
}

.btn-subscribe { line-height: 1 }

.social-widget { margin: 15px 0 }
.social-widget h3 { text-transform: uppercase; color: #999 }

.right { text-align: right }

#popular-posts img { 
	width: 100%; height: auto; 
	-moz-border-radius-bottomright: 7.5px;
	-webkit-border-bottom-right-radius: 7.5px;
	border-bottom-right-radius: 7.5px;
	-webkit-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.5);
	-moz-box-shadow:    1px 1px 5px 0px rgba(0, 0, 0, 0.5);
	box-shadow:         1px 1px 5px 0px rgba(0, 0, 0, 0.5);
}
#popular-posts .preview-post-content { padding: 10px 10px 10px 0 }
#popular-posts .preview-post-content h1 { font-size: 16px; line-height: 1 }
#popular-posts .preview-post-content .preview-post-meta { font-size: 12px; margin: 0; line-height: 1 }

#related-posts ul { list-style: none; padding: 0 }
#related-posts li.related-post-item { border-bottom: 1px solid #eee; padding-bottom: 15px }
#related-posts li.related-post-item:last-child { border-bottom: 0; padding-bottom: 0 }
#related-posts li.related-post-item:before, #related-posts li.related-post-item:after { display: table; content: " "; }
#related-posts li.related-post-item:after { clear: both }
#related-posts .wp-post-image { float: left; margin-right: 15px; margin-bottom: 5px }
#related-posts p { font-size: 14px; margin: 0 }
#related-posts a.post-title { display: block; margin-bottom: 15px; font-size: 24px; line-height: 1 }

#comments-widget h3 { margin-bottom: 15px }
#comments-widget .dsq-clearfix { font-weight: bold; color: #666 }
#comments-widget .dsq-clearfix p { font-weight: normal; font-size: 90%; color: #111 }
#comments-widget p.dsq-widget-meta { font-weight: bold; font-size: 85% }

#feedburner-widget { margin: 0 }
#feedburner-widget h3 { margin-bottom: 7.5px }

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin-bottom: 30px;
}

.video-container iframe, .video-container object, .video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* ----- CUSTOM SIDEBAR STYLES ------------------------------- */

.sidebar { }

/* ----- CUSTOM FOOTER STYLES -------------------------------- */

#footer .credit { text-align: center }
.footer-widget a, .footer-widget a:hover { color: #999 }

/* ----- RESPONSIVE STYLES ----------------------------------- */

@media (min-width: 481px) {
	
	.content h2 { font-size: 32px }
	.content h3 { font-size: 28px }
	
	h1.archive-h1 { font-size: 36px }
	
	#popular-posts img { 
		border-radius: 0; 
		-moz-border-radius: 0; 
		-webkit-border-radius: 0;
		-webkit-box-shadow: 1px 0px 5px 0px rgba(0, 0, 0, 0.5);
		-moz-box-shadow:    1px 0px 5px 0px rgba(0, 0, 0, 0.5);
		box-shadow:         1px 0px 5px 0px rgba(0, 0, 0, 0.5);
	}
	#popular-posts .preview-post-content h1 { font-size: 18px; line-height: 1 }
	#popular-posts .preview-post-content .preview-post-meta { font-size: 13px; margin: 0; line-height: 1 }
	
	.pagination { font-size: 14px }
	.pagination>li>a, .pagination>li>span { padding: 6px 12px }
	
}

/* Small devices (tablets - 768px and up) */
@media (min-width: 768px) {
    
	.alignleft { float: left; margin-right: 30px; margin-bottom: 10px }
	.alignright { float: right; margin-left: 30px; margin-bottom: 10px }
	
    .navbar-collapse { padding: 0 }
	.navbar-default .navbar-collapse { margin-top: 0 }
	
	.navbar-nav { margin: 15px 0 0 15px }
    .navbar-nav>li>a { padding: 0 0 0 19px; font-size: 20px }
	
	.navbar-search .input-group { padding: 15px 0 0 30px }
	.social-icons { width: 25%; padding-top: 10px }
	
	.header-img { max-height: 100px }
	
	#first-post { position: relative }
	#first-post-content { position: absolute; top: 10%; width: 100% }
	#first-post-content h1 { font-size: 36px; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);  }
	#first-post-content h1 a, #first-post-content h1 a:hover { color: #eee }
	.preview-post { margin: 30px 0 0 0 }
	.preview-post-content h1 { font-size: 24px }
	.first-post-meta { color: #ccc; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); }
	.preview-post-meta { font-size: 14px }
	#first-post-content p { color: #fff; text-shadow: 1px 1px 1px rgba(0, 0, 0, 1); font-size: 14px }
	.preview-post-content p { font-size: 14px }
	.post-label { font-size: 18px }
	#first-post-label { font-size: 24px }
    
    .post-excerpt-row .col-sm-6:nth-child(2n+1) { clear: left; }
    .post-excerpt-grid { padding: 15px 0 }
	
	.btn-archive { margin: 30px 0 }

    .content .meta .share { text-align: right; margin-top: 5px }
	
	h1.archive-h1 { font-size: 48px }
	
	.author-bio .avatar { margin-right: 30px; margin-bottom: 10px }
	
	#popular-posts img { 
		width: 100%; height: auto; 
		-moz-border-radius-bottomright: 7.5px;
		-webkit-border-bottom-right-radius: 7.5px;
		border-bottom-right-radius: 7.5px;
		-webkit-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.5);
		-moz-box-shadow:    1px 1px 5px 0px rgba(0, 0, 0, 0.5);
		box-shadow:         1px 1px 5px 0px rgba(0, 0, 0, 0.5);
	}
	#popular-posts .preview-post-content h1 { font-size: 16px; line-height: 1 }
	#popular-posts .preview-post-content .preview-post-meta { font-size: 12px; margin: 0; line-height: 1 }
	
	#feedburner-widget { margin: 15px 0 }
	
	#related-posts li.related-post-item { width: 30%; float: left; margin-left: 5%; border-bottom: 0; padding-bottom: 0 }
	#related-posts li.related-post-item:first-child { margin-left: 0 }

    #footer { /* margin-bottom: 30px */ }
	.footer-widget a.widget_sp_image-image-link img.alignleft { margin: 0 auto; float: none; display: block }
}

/* Large devices (desktops, some tablets - 992px and up) */
@media (min-width: 992px) {    
        
    .navbar-nav { margin: 15px 0 0 5px }
	.navbar-nav>li>a { padding: 0 0 0 40px; font-size: 24px }
	
	.navbar-search .input-group { padding: 25px 0 0 45px }
	.social-icons { width: 25%; padding-top: 15px; font-size: 36px }
	
	#first-post-content { top: 10% }
	#first-post-content h1 { font-size: 42px }
	.preview-post-content h1 { font-size: 28px }
	.first-post-meta { font-size: 18px }
	.preview-post-meta { font-size: 14px }
	#first-post-content p { font-size: 16px }
	.preview-post-content p { font-size: 14px }
	.post-label { font-size: 24px }
	#first-post-label { font-size: 28px }
	
	.header-img { max-height: 125px }
    
    .post-excerpt-row .col-sm-6:nth-child(2n+1) { clear: none; }
    .post-excerpt-row .col-md-4:nth-child(3n+1) { clear: left; }
	
	.content h1 { font-size: 48px }
	.content h2 { font-size: 36px }
	.content h3 { font-size: 28px }
	.content p, .content li { font-size: 20px }
	
	h1.archive-h1 { font-size: 60px }
	
	#popular-posts img { 
	width: 100%; height: auto; 
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
#popular-posts .preview-post-content { padding: 10px }
#popular-posts .preview-post-content h1 { font-size: 18px; line-height: 1 }
#popular-posts .preview-post-content .preview-post-meta { font-size: 12px; margin: 0; line-height: 1 }
	#popular-posts p { font-size: 12px; line-height: 14px; margin-top: 15px }
	
	#footer .credit { text-align: right }
    
}

/* Large desktop (large desktops - 1200px and up) */
@media (min-width: 1200px) {
	
    .navbar-nav { margin: 30px 0 0 25px }
	.navbar-nav>li>a { padding: 0 0 0 50px; font-size: 28px }
	
	.navbar-search .input-group { padding: 30px 0 0 75px }
	.social-icons { padding-top: 20px }
	
	#first-post-content { top: 15% }
	#first-post-content h1 { font-size: 48px }
	.preview-post-content h1 { font-size: 28px }
	.first-post-meta { font-size: 18px }
	.preview-post-meta { font-size: 14px }
	#first-post-content p { font-size: 18px }
	.preview-post-content p { font-size: 14px }
	.post-label { font-size: 24px }
	#first-post-label { font-size: 28px }
	
	.header-img { max-height: 100% }
	
}