@charset "utf-8";
 
 
@import url("framework.css");
 
.sectiontitle{margin-bottom:80px;}
.sectiontitle *{margin:0;}

.emphasise{margin-bottom:80px;}
.emphasise figure{position:relative; max-width:320px;}
.emphasise figure::after{display:block; position:absolute; top:0; width:100%; height:100%; content:"";}
.emphasise figure:last-child{margin-bottom:0;} 
.emphasise figure figcaption{display:block; position:absolute; bottom:0; width:100%; padding:0 30px 20px; z-index:1;}
.emphasise figure figcaption strong{display:block; text-transform:capitalize;}

.posts figure{display:block; margin-bottom:50px;}
.posts figure:last-child{margin-bottom:0;}
.posts figure > div, .posts figure figcaption{display:block; float:left; width:50%;}
.posts figure > div{}
.posts figure > div img{}
.posts figure figcaption{padding:50px 0 0 50px;}
.posts figure figcaption{}
.posts figure figcaption *{margin:0;}
.posts figure figcaption .heading{margin-bottom:30px;}
.posts figure figcaption footer{margin-top:30px;}
/* Reverse the display */
.posts figure:nth-child(even) > div{float:right;}
.posts figure:nth-child(even) figcaption{float:left; padding-left:0; padding-right:50px;}
 

/* Split Box
--------------------------------------------------------------------------------------------------------------- */
/* .splitclrs{}
.split{}

.split > div{display:block; float:left; width:50%; padding:80px 50px 80px 0;}
.split > div:nth-child(2){float:right; padding-right:0; padding-left:50px;} */

 
a:active, a:focus{background:transparent;} 
hr, .borderedbox{border-color:#D7D7D7;}
label span{color:#FF0000; background-color:inherit;}
input:focus, textarea:focus, *:required:focus{border-color:#56AED4;}
.overlay{color:#FFFFFF; background-color:inherit;}
.overlay::after{color:inherit; background-color:rgba(0,0,0,.55);}

.btn, .btn.inverse:hover{color:#FFFFFF; background-color:#05B3F2; border-color:#05B3F2;}
.btn:hover, .btn.inverse{color:inherit; background-color:transparent; border-color:inherit;}

blockquote::before{color:rgba(0,0,0,.05);}


/* Flexslider */
.flex-direction-nav a, .flex-direction-nav .flex-disabled:hover{color:#FFFFFF;}
.flex-direction-nav a:hover{color:#F08714;}


/* Rows */
.row0, .row0 a{color:#929292; background-color:#F6F6F6;}
.row0{box-shadow:0 10px 10px rgba(0,0,0,.05);}
.row1{color:#929292; background-color:#FFFFFF;}
.row2, .row2 a{}
.row3{color:#929292; background-color:#FFFFFF;}
.row4{color:#CBCBCB; background-color:#222222;}
.row5, .row5 a{color:#CBCBCB; background-color:#1A1A1A;}

    


/* Split Box */
.splitclrs{color:#929292; background:linear-gradient(to right, #F6F6F6 0%,#F6F6F6 50%,#FFFFFF 50%,#FFFFFF 100%);}
@media screen and (max-width:750px){
	.splitclrs{background:none;}
	.split > div:first-child{color:inherit; background-color:#F6F6F6;}
	.split > div:last-child{color:inherit; background-color:#FFFFFF;}
}

    
/* Media Queries
--------------------------------------------------------------------------------------------------------------- */
@-ms-viewport{width:device-width;}


/* Max Wrapper Width - Laptop, Desktop etc.
--------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width:978px){
	.hoc, .split{max-width:978px;}
}


/* Mobile Devices
--------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:900px){
	.hoc{max-width:90%;}

	#topbar{}

	#header{}

	#mainav{}
	#mainav ul{display:none;}
	#mainav form{display:block;}

	#breadcrumb{}

	.container{}
	#comments input[type="reset"]{margin-top:10px;}
	.pagination li{display:inline-block; margin:0 5px 5px 0;}

	#footer{}

	#copyright{}
	#copyright p:first-of-type{margin-bottom:10px;}
}


@media screen and (min-width:750px) and (max-width:900px){
	.split > div, .split > div:nth-child(2){padding:80px 5%;}

	.posts figure figcaption{padding-top:0;}
}


@media screen and (max-width:750px){
	.imgl, .imgr{display:inline-block; float:none; margin:0 0 10px 0;}
	.fl_left, .fl_right{display:block; float:none;}
	.group .group > *:last-child, .clear .clear > *:last-child, .clear .group > *:last-child, .group .clear > *:last-child{margin-bottom:0;}/* Experimental - Needs more testing in different situations, stops double margin when stacking */
	.one_half, .one_third, .two_third, .one_quarter, .two_quarter, .three_quarter{display:block; float:none; width:auto; margin:0 0 30px 0; padding:0;}

	#topbar{text-align:center;}
	#topbar > div:first-of-type > ul{margin-bottom:15px;}

	#pageintro li article{max-width:none; width:100%; overflow:visible;}
	#pageintro li .heading{font-size:3rem;}

	.split > div{display:block; width:100%;}
	.split > div, .split > div:nth-child(2){padding:80px 5%;}

	.posts figure{max-width:500px;}/* Same width as the image */
	.posts figure > div, .posts figure figcaption, .posts figure:nth-child(even) > div, .posts figure:nth-child(even) figcaption{display:block; float:none; width:100%;}
	.posts figure figcaption, .posts figure:nth-child(even) figcaption{padding:50px 0 0 0;}
}


@media screen and (max-width:450px){
	#topbar ul li{margin-bottom:2px; padding-right:0; border-right:none;}
}


/* Other
--------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:650px){
	.scrollable{display:block; width:100%; margin:0 0 30px 0; padding:0 0 15px 0; overflow:auto; overflow-x:scroll;}
	.scrollable table{margin:0; padding:0; white-space:nowrap;}

	.inline li{display:block; margin-bottom:10px;}
	.pushright li{margin-right:0;}

	.font-x2{font-size:1.4rem;}
	.font-x3{font-size:1.6rem;}
}