/*  

Theme Name: Sister (Bronco)
Description: Default Bronco theme for blogs supporting a main website, adapted to conform to styling of main website
Version: 99.1.0
Author: Kean Richmond
Author URI: http://www.bronco.co.uk

============================================================
------------------------------------------------------------
TO DO ON DUPLICATION TO NEW WEBSITE
-- Update edittable styles below 
-- Update absolute URL of sharrr.php in jsOnload.js
------------------------------------------------------------
============================================================

*/


/* 
------------------------------------------------------------
RESET
------------------------------------------------------------
*/
html,*{margin:0;padding:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400;}fieldset,iframe,img{border:0;}table{border-collapse:collapse;border-spacing:0;}th{font-style:normal;font-weight:400;text-align:left;}ol,ul{list-style:none;}cite{font-style:normal;}a{outline:none;}header,section,footer,aside,nav,article,figure,main{display:block;}

@font-face 						{font-family:'Raleway'; src:url('/inc/fonts/raleway-medium-webfont.eot'); src:url('/inc/fonts/raleway-medium-webfont.eot?#iefix') format('embedded-opentype'), url('/inc/fonts/raleway-medium-webfont.woff2') format('woff2'), url('/inc/fonts/raleway-medium-webfont.woff') format('woff'), url('/inc/fonts/raleway-medium-webfont.ttf') format('truetype'); font-weight:300; font-style:normal;}

@font-face 						{font-family:'Raleway'; src:url('/inc/fonts/raleway-medium-webfont.eot'); src:url('/inc/fonts/raleway-medium-webfont.eot?#iefix') format('embedded-opentype'), url('/inc/fonts/raleway-medium-webfont.woff2') format('woff2'), url('/inc/fonts/raleway-medium-webfont.woff') format('woff'), url('/inc/fonts/raleway-medium-webfont.ttf') format('truetype'); font-weight:500; font-style:normal;}

@font-face 						{font-family:'Raleway'; src:url('/inc/fonts/raleway-semibold-webfont.eot'); src:url('/inc/fonts/raleway-semibold-webfont.eot?#iefix') format('embedded-opentype'), url('/inc/fonts/raleway-semibold-webfont.woff2') format('woff2'), url('/inc/fonts/raleway-semibold-webfont.woff') format('woff'), url('/inc/fonts/raleway-semibold-webfont.ttf') format('truetype'); font-weight:600; font-style:normal;}

@font-face 						{font-family:'Raleway'; src:url('/inc/fonts/raleway-bold-webfont.eot'); src:url('/inc/fonts/raleway-bold-webfont.eot?#iefix') format('embedded-opentype'), url('/inc/fonts/raleway-bold-webfont.woff2') format('woff2'), url('/inc/fonts/raleway-bold-webfont.woff') format('woff'), url('/inc/fonts/raleway-bold-webfont.ttf') format('truetype'); font-weight:700; font-style:normal;}


/* 
------------------------------------------------------------
EDITABLE STYLES
------------------------------------------------------------
*/

/*--- 1. Colours ---------------------------------------------------------------------------*/

body,
footer a					{color:#434648;} /* Text */
.back-to-top:before			{border-color:rgba(67,70,72,0); border-bottom-color:#434648;}


h1, h2, h3, h4, h5, h6, .sidebar label, .sidebar h6 {color:#28282E;} /* Headings */
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, 
a:hover						{color:#28282E;} /* Links */


.primary, /* Top Bar / Main Colour */
#comments cite, #nav-toggle,
.post-meta a:hover			{color:#D2232A;}
.header, .paging a:hover	{background:#D2232A;}

input[type='submit']:hover		{border-color:#28282E; color:#28282E;}
input[type='submit']		{border-color:#D2232A; color:#D2232A;}


/* Highlight */
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover, 
a							{color:#D2232A;}


.pagetitle, /* Low Contrast / Secondary */
h2, h4, h6, .post-meta, .post-meta a,
#comments time				{color:#7D8D95;}
input[type='submit'],
.paging a					{background:#7D8D95;}
.content blockquote			{border-color:#7D8D95;}


.background, /* Full Background - Grey */
body, .comment-content,
.sidebar					{background:#EEF1F2;}
.comment-content:before		{border-color:rgba(255,255,255,0); border-bottom-color:#F5F3F4;}
@media screen and (max-width:619px){
	#js #nav li				{border-color:#F5F3F4;}
}

.primary-offset, /* Contrast to Primary Colour - White */
.nav-main, .nav-main a, .paging a, 
.header						{color:#FFF;}
#nav-toggle					{background:#FFF;}
.nav-main li				{border-color:#FFF;}



/*--- 2. Fonts ---------------------------------------------------------------------------*/

.primary-font, /* Text */
body,
input[type='text']
input[type='submit'],
textarea					{font-family:Raleway, Helvetica, Arial, sans-serif; font-weight:500;}


h1, h2, h3, h4, h5, h6,
.pagetitle					{font-weight:300;}



/*--- 3. Logo ---------------------------------------------------------------------------*/

.logo						{margin:29px 0;} /* (120px - Height) /2 */
.no-svg .logo				{background:url(/inc/img/logo--white.png) center no-repeat; height:62px; text-indent:-9999px; width:200px;}



/* 
------------------------------------------------------------
CORE STYLES
------------------------------------------------------------
*/

/*--- 1-0. Common Elements ---------------------------------------------------------------------------*/

html						{font-size:62.5%;}
body						{font-size:14px; font-size:1.4rem; min-width:220px;}

.wrap						{padding:0 10px;}
main						{background:#FFF; height:100%; margin:0 -10px; overflow:hidden; padding:0 10px;}	
	
@media screen and (min-width:620px){
	.wrap					{padding:0 5%;}
	main					{box-shadow:0 0 3px rgba(0,0,0,0.1); margin:0; padding:0 40px;}
}

@media screen and (min-width:1080px){
	.wrap					{padding:0 7.5%;}
}

@media screen and (min-width:1280px){
	.wrap					{padding:0 10%;}
}

@media screen and (min-width:1600px){
	.wrap					{margin:0 auto; padding:0; width:1280px;}
}



/*--- 1-1. Heading ---------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6		{line-height:1.1em;}
h1, h2						{font-size:30px; font-size:3rem;}
h3, h4						{font-size:24px; font-size:2.4rem;}
h5, h6						{font-size:18px; font-size:1.8rem;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a	{text-decoration:none;}


/*--- 1-2. Form Elements ---------------------------------------------------------------------------*/

form						{font-size:14px; font-size:1.4rem;}
form p						{height:100%; overflow:hidden; padding:15px 0 10px 0;}

label						{display:block; font-weight:600; margin-bottom:4px;}
input[type='text'],
textarea					{color:#666; float:left; ffont-size:14px; font-size:1.4rem; margin-right:6px; padding:10px 10px 9px 10px;}
textarea					{height:140px; width:480px;}
input[type='submit']		{background:none; border-width:2px; border-style:solid; border-radius:5px; cursor:pointer; font-size:14px; font-size:1.4rem; height:39px; margin-top:10px; min-width:80px; padding:0 10px;}

.hint						{float:left; font-size:12px; font-size:1.2rem; font-style:italic; margin-top:4px;}
.hint:before				{content:"* ";}

@media screen and (max-width:819px){
	input[type='text'],
	textarea				{width:100%;}	
}

@media screen and (min-width:820px){
	#author, #url			{width:260px;}
	#email					{width:480px;}
	.hint					{margin-top:12px;}
}



/*--- 1-3. Skip Link ---------------------------------------------------------------------------*/

.skip-link					{float:left; margin:0 0 0 -9999px; text-decoration:none;}
.skip-link:focus			{background:#333333; border-bottom:1px solid #FFFFFF; border-right:1px solid #FFFFFF; color:#FFFFFF; font-size:11px; margin:0; padding:3px 7px 3px 5px; position:relative; z-index:1000;}


/*--- 1-4. Clearfix ---------------------------------------------------------------------------*/

* html .clearfix			{height:1%; overflow:visible;}/* float clearing for IE6 */
*+html .clearfix			{min-height:1%;}/* float clearing for IE7 */
.clearfix:after				{clear:both; content:"."; display:block; height:0; font-size:0; visibility:hidden;}


/*--- 2. SITEWIDE ELEMENTS -----------------------------------------------------------------------------------------------------------------------------------*/

/*--- 2-1. Layout ---------------------------------------------------------------------------*/

.sidebar					{margin:40px 0; padding:0 20px 28px 20px; }

@media screen and (min-width:820px){
	
	.main-col-outer			{float:left; margin-right:-220px; width:100%;}
	.main-col-inner			{margin-right:220px; padding-right:60px;}

	.sidebar				{float:right; width:220px;}
	
}

@media screen and (min-width:1080px){
	
	.main-col-outer			{margin-right:-300px;}
	.main-col-inner			{margin-right:300px; padding-right:100px;}

	.sidebar				{width:300px;}
	
}


/*--- 2-2. Header ---------------------------------------------------------------------------*/

.header						{/*height:120px;*/height:100%; overflow:hidden;}
.logo						{float:left; max-width:70%;}



/*--- 2-3. Navigation ---------------------------------------------------------------------------*/

@media screen and (max-width:619px){ /* Mobile */
	
	#nav ul 					{display:block; width:100%;}
	#nav li 					{border-top:1px solid #FFF; display:block; width:100%;}
	#nav a						{display:block; padding:10px; text-decoration:none;}
	#nav a:hover				{background:rgba(255,255,255,0.2);}
	.js #nav 					{clear:both; clip:rect(0 0 0 0); display:block; margin:0 -10px; max-height:0; overflow:hidden; zoom:1;}
	#nav.opened 				{max-height:9999px;}
	#nav-toggle 				{float:right; font-weight:bold; margin-top:41px; min-width:20%; padding:8px 10px 9px 10px; text-align:center; text-decoration:none; text-transform:uppercase;}
	#nav-toggle:hover			{opacity:0.7;}
}

@media screen and (min-width:620px){ /* Desktop */
	.js #nav.closed				{max-height:none;}
	#nav-toggle 				{display:none;}
  
	.nav-main 					{float:right; font-weight:bold; margin-top:50px; text-transform:uppercase;}
	.nav-main li				{border-left-width:2px; border-left-style:solid; float:left; padding:0 18px 1px 18px;}
	.nav-main li:first-child	{border:0;}
	.nav-main li:last-child		{padding-right:0;}
	.nav-main a					{text-decoration:none;}
	.nav-main a:hover			{opacity:0.7;}
}

.pagetitle					{display:block; font-size:36px; font-size:3.6rem; line-height:1.05em; padding:40px 0 42px 0;}


/*--- 2-4. Footer ---------------------------------------------------------------------------*/

footer						{clear:both; font-size:12px; font-size:1.2rem; margin:40px 0 37px 0; text-align:center;}
footer a					{text-decoration:none;}
footer a:hover				{opacity:0.4;}

.back-to-top				{display:inline-block; font-weight:700; margin:6px 0 9px; position:relative; text-transform:uppercase;}
.back-to-top:before			{border-width:4px; border-style:solid; content:" "; height:0; left:50%; margin-left:-4px; position:absolute; top:-10px; width:0;}

.bronco						{margin-top:-1px;}


/*--- 2-5. Sidebar ---------------------------------------------------------------------------*/

.sidebar h6					{padding:45px 0 24px 0;}
.sidebar form				{padding-bottom:12px;}
.sidebar label				{font-size:18px; font-size:1.8rem; padding:13px 0 1px 0;}
.sidebar input[type='text']	{border:0; padding:11px 15px 10px 15px; width:100%;}

.sidebar li li				{border-bottom:1px dotted rgba(0,0,0,0.2); padding:8px 0;}
.sidebar li li:last-child	{border-bottom:0;}
.sidebar li a				{text-decoration:none;}


/*--- 2-6. Article ---------------------------------------------------------------------------*/

article						{padding-bottom:16px;}
#index article				{padding-bottom:39px;}
article h1					{padding:36px 0 9px 0;}

.entry						{margin-top:14px;}
.content p					{line-height:1.7em; padding:12px 0;}
#single .content > p:first-of-type	{font-size:18px; font-size:1.8rem; line-height:1.45em;}
.content blockquote			{border-left-width:4px; border-left-style:solid; margin:10px 0; padding:0 20px;}
.content cite				{font-style:italic;}
.content ul					{list-style:square; margin:10px 28px;}
.content ol					{list-style:decimal; margin:10px 28px;}
.content li					{line-height:1.7em; padding:4px 12px;}
.content img				{height:auto; max-width:100%;}

.content h1, .content h2, .content h3, .content h4, .content h5, 
.content h6					{padding:27px 0 5px 0;}

.alignleft					{float:left; margin:10px 10px 10px 0;}
.alignright					{float:right; margin:10px 0 10px 10px;}


/*--- 2-7. Paging ---------------------------------------------------------------------------*/

.paging 					{height:100%; margin:21px 0 40px 0; overflow:hidden;}
.paging a					{display:block; min-width:140px; padding:9px 10px; text-align:center; text-decoration:none;}
.older						{float:right;}
.newer						{float:left;}


/*--- 2-8. Sharing ---------------------------------------------------------------------------*/

.sharing					{height:100%; overflow:hidden; padding-bottom:36px;}
.sharing div				{margin-top:16px;}
.sharing a					{color:#FFF; display:block; padding:9px 10px; text-align:center; text-decoration:none;}
.sharing a:hover			{opacity:0.5;}
.twitter					{background:#25C0E9;}
.facebook					{background:#3B5998;}
.google						{background:#DF4C39;}

@media screen and (min-width:320px){
	.sharing div				{float:left; margin-left:20px;}
	.sharing div:first-of-type	{margin-left:0;}	
}

@media screen and (min-width:620px){
	.sharing a				{min-width:120px;}
}


/*--- 2-9. Comments ---------------------------------------------------------------------------*/

#comments					{margin:40px 0 18px 0;}
#comments h4				{margin-bottom:12px;}
#comments li				{padding:18px 0;}
#comments time				{display:block; margin-bottom:2px;}
#comments cite				{font-weight:700;}
#comments cite a			{text-decoration:none;}
.comment-content			{border-radius:3px; margin-top:12px; padding:3px 20px 5px; position:relative;}
.comment-content:before		{border-width:8px; border-style:solid; content:" "; height:0; left:20px; position:absolute; top:-15px; width:0;}
.comment-content p			{line-height:1.7em; padding:7px 0;}

#commentform				{padding:40px 0;}
#commentform h4				{padding-bottom:15px;}


/*--- 2-10. 404 ---------------------------------------------------------------------------*/

#four-o-four h1				{padding:36px 0 9px 0;}