/*
Theme Name: SFBase
Theme URI: http://wolffdesign.com.au
Author: Spencer Feng
Author URI: http://wolffdesign.com.au/who-is-wolff/team/#spencer
Description: A WordPress responsive theme created.
Version: 1.0
*/

@import url("css/3rd/normalize.css");
@import url("css/3rd/bootstrap.css");

/* Site variables 
======================================================================== 
@site-red: #cf3679
======================================================================== */


/* clearfix 
======================================================================== */
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}


/* General 
======================================================================== */

.right-align {
	text-align:right;
}
.left-align {
	text-align:left;
}
.center-align {
	text-align:center;
}

.text-bold {
	font-weight:bold;
}
.text-light {
	font-weight:light;
}

.responsive-image {
	width:100%;
	height:auto;
}

.display-block {
	display:block;
}

/* .inner clearfix */
.inner:before,
.inner:after {
    content: " ";
    display: table;
}
.inner:after {
    clear: both;
}
.inner {
    *zoom: 1;
}

.page-or-post-title {
	padding:0;
	margin:0 0 12px 0 !important;
	font-size: 22px;
	line-height: 28px;
	color:#094c53;
}

.clear {
	clear:both;
}


/* Site general 
======================================================================== */

body {
	background:#cf3679;
}

p {
	font-size:14px;
	line-height:1.5;
}

.site-red {
	color:#CF3679;
}	

div#siteContainer {
	max-width:980px;
	margin-left:auto;
	margin-right:auto;
}

.site-red-text {
	color:#cf3679;
}

.container {
	max-width:980px;
}

.content-main > .inner {
	padding:0 20px;
}

.content-main h1,
.content-main h2,
.content-main h3 {
	clear:both;
	margin-top:20px;
	margin-bottom:20px;
}
.content-main h1 {
	font-size:21px;
}
.content-main h2 {
	font-size:17px;
}
.content-main h3 {
	font-size:13px;
}
.content-main h4 {
	font-size:10px;
}

.mobile-hidden {
	display:none;
}
@media screen and (min-width:768px){
	.mobile-hidden {
		display:block;
	}
}

@media screen and (min-width:768px){
	.desktop-hidden {
		display:none;
	}
}

#pagination {
	margin-top: 30px;
}


/* Header
======================================================================== */

#headerTopLeft {
	text-align:center;
	margin-bottom:20px;
}
@media screen and (min-width:768px){
	#headerTopLeft {
		text-align:left;
		margin-bottom:0px;
	}
}

h1#headerLogo {
	margin-top:0;
	margin-bottom:0;
}
h1#headerLogo img {
	max-width:406px;
}

#headerTopRight {
	text-align:center;
}
@media screen and (min-width:768px){
	#headerTopRight {
		text-align:right;
	}
}

#headerCallUs,
#headerEmail {
	margin-bottom:10px;
}
#headerDonate a {
	display:inline-block;
	width:213px;
	height:73px;
	background:url('images/header_donate_btn.jpg') no-repeat;
	text-indent:-9999px;
}


/* Header mobile main navigation
======================================================================== */

/* Toggle button */
/*#navCollapse {
	display:block;
	margin:0 auto;
	margin-bottom:20px;
	background-color:#5C6670;
	text-align:center;
	width:100%;
	color:#ffffff;
	cursor:pointer;
	border-radius:0px;
	-webkit-border-radius:0px;
	-moz-border-radius:0px;
	position:relative;
	padding:10px 10px;
}
#navCollapse:hover {
	text-decoration:none;
}

#navCollapse span.icon-bar-wrapper {
	float:left;
	margin-right:20px;
}
#navCollapse span.icon-bar-text {
	float:left;
}

#navCollapse span.icon-bar {
	display:block;
	width:22px;
	height:2px;
	background-color:#ffffff;
	margin-top:4px;
	margin-bottom:4px;
	border-radius:1px;
	-webkit-border-radius:1px;
	-moz-border-radius:1px;
}

#navCollapse span.icon-bar-wrapper, #nav-collapse span.icon-bar-text {
	display:block;
}
#navCollapse span#icon-bar-text {
	font-weight:bold;
}

/* mobile main navigation */
/*span.mobile-menu-arrow {
	display:block;
	width:7px;
	height:4px;
	background-image:url('../images/mobile-nav-arrow.png');
	background-color:transparent;
	position:absolute;
	right:5px;
	top:50%;
}
nav#headerMobileMainNavContainer {
	margin-top:10px;
}
nav#headerMobileMainNavContainer  ul {
	list-style:none;
	padding:0;
	display:none;
}
nav#headerMobileMainNavContainer > ul li {
	z-index:9;
}
nav#headerMobileMainNavContainer  ul#headerMobileMainNav  li a {
	font-size:1.4em;
	display:block;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:5px;
	border-bottom:1px solid #cccccc;
	text-decoration:none;
	position:relative;
	color:#5C6670;
}

/* first level navigation */
/*.activeParentMenu {
	text-decoration:none;
	background-color:#5C6670;
	color:#ffffff !important;
}

/* second level navigation */
/*nav#headerMobileMainNavContainer  ul#headerMobileMainNav > li > ul {
	display:none;
	list-style:none;
	padding-left:10%;
}

/* third level navigation */
/*nav#headerMobileMainNavContainer ul#headerMobileMainNav > li > ul > li > ul {
	display:none;
	list-style:none;
	padding-left:10%;
}


/* Header desktop main navigation
======================================================================== */

/*div.menu-header-desktop-main-menu-container {
	background:#a5a5a5;
	border-bottom:4px solid #fddd40;
	margin-top:35px;
	margin-bottom:10px;
	position:relative;
}
div.menu-header-desktop-main-menu-container:after {
	content:"";
	width:100%;
	height:4px;
	background:#a5a5a5;
	position:absolute;
	bottom:-8px;
	left:0;
}

ul#headerMainNav,
ul#headerMainNav ul {
	list-style:none;
	padding:0;
	margin:0;
}
ul#headerMainNav li {
	padding:0;
	margin:0;
	position:relative;
}
ul#headerMainNav li  a {
	display:block;
	color:#ffffff;
	font-size:13px;
}
ul#headerMainNav li  a:hover {
	text-decoration:none;
}

/* First level */
/*ul#headerMainNav {
	padding-top:10px;
}
ul#headerMainNav > li {
	float:left;
} 
ul#headerMainNav > li > a {
	margin-left:8px;
	margin-right:8px;
	text-align:center;
	padding:5px 10px 5px 10px;
}
ul#headerMainNav > li.current-menu-item > a,
ul#headerMainNav > li > a:hover,
ul#headerMainNav > li.sfHover > a {
	background:#fddd40;
	color:#000000;
}

ul#headerMainNav > li:hover > ul {
	display:block;
}

/* Second level */
/*ul#headerMainNav > li > ul {
	display:none;
	z-index:9999;
	width: 200px;
	padding: 0px 0px 10px 0px;
	
	position:absolute;
	left: 10px;
    top: 37px;
	
	border-radius:0 0 5px 5px;
	-webkit-border-radius:0 0 5px 5px;
	-moz-border-radius:0 0 5px 5px;
}

ul#headerMainNav > li > ul > li a {
	color:#000;
	background:#A5A5A5;
	border-bottom:2px solid #fff;
	padding:0px 5px 0px 8px;
}
ul#headerMainNav > li > ul > li a:hover {
	background:#FDDD40;
}


/* Footer
======================================================================== */

footer #footerRow1 > .inner {
	background:#fddd40;
	padding-top:30px;
	padding-bottom:30px;
}
@media (min-width: 768px) and (max-width: 991px) {
	footer #footerRow1 > .inner {
		margin-left:-15px;
		margin-right:-15px;
	}
}
@media (min-width: 992px) { 

	footer #footerRow1 > .inner {
		margin-left:15px;
		margin-right:15px;
	}

}

.footer-widget-title:before {
	content:url('images/footer_title_image.jpg');
	position:relative;
	top:11px;
	left:-7px;
}
.footer-widget-title {
	color: #5428a0;
	margin-bottom:30px;
	font-size:18px;
}
#footerGalleryCol .footer-widget-title {
	margin-left:25px;
}
#footerGalleryCol .widget a img {
	margin-bottom:5px;
}

#footerLinksCol .widget ul li,
#footerLinksCol .widget ul li a {
	color: #5428a0;
}
#footerLinksCol .widget ul li {
	margin-bottom:10px;
}

#footerLinksCol .widget ul li a {
	font-size:16px;
}

#footerContactCol {
	color: #5428a0;
}
#footerContactCol .textwidget {
	margin-left:20px;
}
#footerContactCol .textwidget > div {
	margin-bottom:12px;
}
#footerContactCol .widget #footerPhone{
	background:url('images/footer_phone.jpg') no-repeat;
	padding-left:30px;
}
#footerContactCol .widget #footerEmail {
	background:url('images/footer_email.jpg') no-repeat 0 50%;
	padding-left:30px;
}
#footerContactCol .widget #footerSocialFacebook {
	display:inline-block;
}
#footerContactCol .widget #footerSocialFacebook a {
	display:inline-block;
	background:url('images/footer_social_facebook_btn.png') no-repeat;
	width:27px;
	height:27px;
	text-indent:-9999px;
}
#footerContactCol .widget #footerSocialTwitter {
	display:inline-block;
}
#footerContactCol .widget #footerSocialTwitter a {
	display:inline-block;
	background:url('images/footer_social_twitter_btn.png') no-repeat;
	width:28px;
	height:27px;
	text-indent:-9999px;
}

#footerRow2 {
	margin-top:20px;
	margin-bottom:30px;
}
#footerRow2 a {
	color:#000000;
}


/* Home page
======================================================================== */

#homePageSliderContainer {
	margin-bottom:30px;
}

#homeBanner1 a,
#homeBanner3 a {
	color:#ad96d4;
	font-weight:bold;
}
#homeBanner2 a,
#homeBanner4 a {
	color:#d83183;
	font-weight:bold;
}

#homeYellowBar {
	margin-top:30px;
}
#homeYellowBarContent {
	background:#fddd40;
	font-size:30px;
	padding:20px 30px;
	color:#5428a0;
}

#homePageContent {
	margin-top:40px;
}

/* Blog List */
.latest-blog-list .blog-list-item-description {
	margin-left: 70px;
}
.latest-blog-list {
	width: 100%;
	margin: 0 0 26px 0;
}
.latest-blog-list .blog-list-item-date {
	background: #f4f4f4;
	color: #666666;
	width: 50px;
	text-align: center;
	font-size: 20px;
	line-height: 20px;
	font-weight: bold;
	padding: 10px 0 0 0;
	float: left;
	margin-top: 11px;
}
.latest-blog-list .blog-list-item-date {
	border-radius: 2px;
	overflow: hidden;
}
.latest-blog-list .blog-list-item-date span {
	display: block;
	background: #666666;
	font-size: 11px;
	line-height: 11px;
	font-weight: bold;
	padding: 5px 0;
	margin: 10px 0 0 0;
	text-transform: uppercase;
	color: #ffffff;
}
.blog-list-item-description h4 a {
	font-size: 16px;
	color:#666;
	font-weight: normal;
}
.blog-list-item-description > span {
	display: none;
}
.blog-list-item-excerpt a {
	color:#b3272d;
}

/* sidebar
======================================================================== */
.content-sidebar .widget {
	margin-bottom: 20px;
}


/* custom list page
======================================================================== */
.custom-list-row {

}

hr.custom-list-row-sep {
	border:none;
	border-top:1px dotted #cccccc;
	margin-left:15px;
	margin-right:15px;
	margin-top:30px;
	margin-bottom:30px;
}
.custom-list-row:nth-last-child(2) hr.custom-list-row-sep {
	border-top:1px dotted #ffffff;
}

h2.custom-list-title {
	margin-top:0;
	font-size:16px;
}
h2.custom-list-title a:hover {
	text-decoration:none;
}


/* Blog Listing Page
======================================================================== */
.post-date-info {
	margin:10px 0;
	color:#666;
}


/* Single Blog Page
======================================================================== */
.post-content-top > .inner {
	margin-left: -15px;
	margin-right: -15px;
}
.post-content-top {
	margin-bottom: 20px;
}

/* sharebox */
.sharebox {
	border-top: 1px solid #efefef;
	border-bottom: 1px solid #efefef;
	margin-bottom: 40px;
	padding: 10px 0 10px 0;
	margin-top: 30px;
}
.sharebox h4 {
	float: left;
	margin: 11px 0 0 10px;
	color: #777777;
	font-size: 13px;
}
.sharebox .social-icons {
	float: right;
	list-style: none;
	margin: 0;
}
.social-icons ul li {
	display: block;
	float: left;
	margin: 0;
	padding: 0;
	background-image: none !important;
}
.sharebox .social-icons a {
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	display: block;
	width: 40px;
	height: 40px;
	text-indent: -9999px;
	background-position: 0px 0px;
	background-repeat: no-repeat;
	opacity: 0.6;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.sharebox .social-icons a:hover {
	background-position: 0 -40px;
	background-color: #666;
}
.social-facebook a {
	background: url('images/icons/facebook.png') no-repeat 0 0;
}
.social-twitter a {
	background: url('images/icons/twitter.png') no-repeat 0 0;
}
.social-linkedin a {
	background: url('images/icons/linkedin.png') no-repeat 0 0;
}


/* Search Results Page
======================================================================== */
.single-search-result {
	border-top:3px solid #e1dcd0;
	padding:15px 0;
}
.single-search-result h2 {
	margin-top: 0;
}


/* Responsive image gallery plugin customisation
======================================================================== */
.responsive-lightbox-image-gallery-container {
	margin-top:20px;
}


/* Image alignment in a page or post
======================================================================== */
img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
.alignright {float:right; }
.alignleft {float:left; }
.aligncenter {display: block; margin-left: auto; margin-right: auto}