/*  
Theme Name: Aerin
Theme URI: http://testblog.co.uk
Author: aerin
Author URI: http://quick-plugin.com
Description: This theme isn't full of bells and whistles and clever features. It is however a simple responsive base you can use as for custom layout creation. Easy to style with sidebar and footer widgets, header logo, taglines, analytics editor and reset functions.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: red, gray, light, two-columns, right-sidebar, flexible-width, custom-header, custom-menu, full-width-template, post-formats, sticky-post, theme-options, threaded-comments
Palette: #A00B15 #B52C00 #343838

This theme, like WordPress, is licensed under the GPL. Play with it and discover the flexibility of WordPress themes.
*/

/***** RESET EVERYTHING *****/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, ins, kbd, q, s, samp, small, strike, strong, tt, var, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
	}
header,footer,nav {
	display:block;
	}
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/***** TYPOGRAPHY AND LINKS *****/

@font-face {
	font-family : opensans;
	src:url('images/OpenSans-Semibold-webfont.eot');
	src:url('images/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		url('images/OpenSans-Semibold-webfont.woff') format('woff'),
		url('images/OpenSans-Semibold-webfont.ttf') format('truetype');
	}	

@font-face {
	font-family : ssp;
	src:url('images/SourceSansPro-Regular-webfont.eot');
	src:url('images/SourceSansPro-Regular-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		url('images/SourceSansPro-Regular-webfont.woff') format('woff'),
		url('images/SourceSansPro-Regular-webfont.ttf') format('truetype');
	}

body {
	text-align: center;
	font-family: ssp, Helvetica, Arial, sans-serif;
	}
h1, h1 a:link, h1 a:visited {
	font-family: opensans, courier;
	color: #8C0005;
	font-weight: bold;
	text-align: left;
	text-decoration: none;
	}
h1 a:hover {
	color: #343838;
	}
h2, h2 a:link,  h2 a:visited {
	font-family: opensans, Helvetica, Arial, sans-serif;
	color: #B52C00;
	font-weight: bold;
	text-align: left;
	margin: 6px 0 6px 0;
	text-decoration: none;
	clear:both;
	}
h2 a:hover, {
	color: #343838;
	}
h3, h3 a:link, h3 a:visited{
	color: #A9A17A;
	font-weight: bold;
	margin: 6px 0 6px 0;
	text-decoration: none;
	}
h4, h5, h6, dt {
	color: #8E9E82;
	font-weight: bold;
	margin: 0 0 6px 0;
	clear: both;
	}
code, pre {
	font-family: courier;
	padding: 4px 0;
	}
blockquote {
	font-style: italic;
	padding: 0 6px 0 6px
	}
cite, strong {
	font-weight: bold;
	}
q {
	font-style: italic;
	}

/***** PAGE STRUCTURE *****/
#wrapper {
	margin: 15px auto;
	padding: 8px;
	text-align: left;
	max-width: 1060px;
	background: #FFF;
	}

/***** HEADER *****/
header {
	background: #FFF;
	margin-bottom: 20px;
	border-bottom: 1px solid #343838;
	}
#navbar {
	clear:both;
	}
#logo img {
	float:left;
	max-width:100%;
	height:auto;
	overflow:hidden;
	margin-bottom: 8px;
	}
#tagline {
	margin: 10px 0;
	color: #000;
	}

/***** NAVIGATION *****/
nav {
	background: #FFF;
	display: block;
	float: left;
	margin: 0 auto;
	padding: 0;
	font-size: 100%;
	line-height: 2em;
	}
nav ul {
	list-style: none;
	margin: 0;
	padding-left: 0;
	}
nav li {
	float: left;
	position: relative;
	}
nav a {
	color: #343838;
	background: #FFF;
	display: block;
	padding: 0 10px 0 10px;
	text-decoration: none;
	}
nav li:hover > a, nav a:focus, nav .current-menu-item > a, nav .current-menu-ancestor > a, nav .current_page_item > a, nav .current_page_ancestor > a {
	color: #FFF !important;
	background: #343838;
	text-decoration: none;
	}
nav ul ul {
	display:none;
	float: left;
	margin: 0;
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 99999;
	}
nav ul ul a {
	background: #A8A39D !important;
	border-top: 1px solid #343838;
	color: #495370;
	height: auto;
	padding: 0 5px !important;
	width: 200px;
	}
nav ul ul ul {
	left: 100%;
	top: 0;
	}
nav ul ul ul a {
	background: #999 !important;
	color: #444;
	}
nav ul li:hover > ul {
	display: block;
	}

/***** SEARCH *****/
.navsearch {
	float:right;
	}
#searchform input {
	font-family: ssp, Helvetica, Arial, sans-serif;
	margin: 3px 0 0 0;
	width: 270px;
	padding: 3px 4px 0 4px;
	color: #343838;
	font-size: 110%;
	border: 1px solid #343838;
	}
#searchform span {
	display: none;
	}

/***** PRIMARY *****/
#primary {
	background: #FFF;
	width: calc(100% - 300px);
	width: -webkit-calc(100% - 300px);
	max-width: 760px;
	float: left;
	padding: 0;
	margin: 0 0 8px 0;
	}
.entry h1 {
	margin: 0 0 8px 0;
	padding: 0;
	font-size: 200%;
	}
.entry h2 {
	font-size: 160%;
	}
.entry p {
	margin-bottom: 8px;
	}
.entry ul {
	list-style-position: inside;
	}
.entry ul ul{
	margin-left: 1em;
	}
.entry img{
	margin-bottom: 8px;
	max-width:100%;
	height:auto;
	overflow: hidden;
	}
.primarymetadata, .date, .tags {
	font-size: 80%;
	color: #607890;
	}
.primarymetadata a {
	color: #607890;
	}
.navigation {
	clear:both;
	padding: 5px 0 5px 0;
	}
.aside {
	margin: 0 10px;
	padding: 8px;
	border-left: 5px solid #7CB490;
	background: #FFF2AF;
	}

/***** IMAGES *****/
.entry .alignright {
	float: right;
	padding: 5px;
	margin: 5px 0 5px 5px;
	}
.entry .alignleft {
	float: left;
	padding: 5px;
	margin: 5px 5px 5px 0;
	}
.entry .aligncenter{
	display: block;
	padding: 5px;
	margin: 5px auto;
	}
a img {
	padding: 0px;
	background: none;
	border: none;
	}
.wp-caption {
	max-width: 100%;
	padding: 4px;
	}
.wp-caption .wp-caption-text, .gallery-caption, .entry-caption {
	font-style: italic;
	}
.sticky, .bypostauthor {
	}

/***** SECONDARY *****/
#secondary {
	width: 280px;
	text-align: left;
	float:right;
	}
#secondary h2 {
	color: #343838;
	display:block;
	padding: 0;
	margin: 0 0 8px 0;
	font-size: 200%;
	}

/***** WIDGET LISTS ******/
#secondary ul {
	padding: 0 0 8px 0;
	}
.menu-footer-container ul {
	padding: 0;
	}
#secondary ul li, ul#menu-footer li {
	display: block;
	list-style-type: none;
	}
#secondary ul li a, ul#menu-footer li a {
	color: #343838;
	text-decoration: none;
	padding: 5px 0 3px 0;
	display: block;
	border-bottom: 1px solid #ccc;
	}
#secondary ul li a:hover, ul#menu-footer li a:hover {
	background: #343838;
	padding-left: 4px;
	color: #FFF;
	}
#secondary.children, #secondary.children li, #secondary.children li a, #menu-footer.children, #menu-footer.children li, #menu-footer.children li a,{
	border:none;
	}

/***** FOOTER *****/

footer {
	text-align: left;
	background: #FFF;
	width:100%;
	padding: 10px 0 0 0;
	clear:both;
	}
footer h2 {
	color: #343838;
	padding: 0;
	margin: 0 0 8px 0;
	font-size: 200%;
	}
footer p {
	color: #343838;
	margin: 8px 0 0 0;
	}
footer a:hover {
	text-decoration: underline;
	}
#left-footer {
	float: left;
	width: calc(100% - 300px);
	width: -webkit-calc(100% - 300px);
	max-width: 660px;
	}
#right-footer {
	float: right;
	width: 280px;
	}
#signoff {
	clear: both;
	padding: 10px 0 10px 0;
	width: 100%;
	border-top: 1px solid #343838;
	}

/***** COMMENTS *****/
#comments {
	clear:left;
	}
#comments h2 {
	font-size: 160%;
	}
#comments ol, #comments ul{
	margin: 0;
	padding: 0;
	list-style: none;
	}
#comments li{
	margin-top:8px;
	padding: 8px;
	}
#comments ol.commentlist li {
	border: 1px solid #8E9E82;
	}
#comments ul.children li {
	margin: 8px 0 0 55px;
	border: 1px solid #8E9E82;
	background: #F5FFFA;
	}
#comments .comment-avatar {
	width: 55px;
	margin:0;
	float: left;
	}
#comments .comment-content {
	margin: 0  0 8px 55px;
	}
#comments .comment-content cite a.url {
	text-decoration: none;
	color: #495370;
	}
#comments.comment-notes, #comments.form-allowed-tags, #comments.comment-form-comment label {
	display: none;
	}
.comment-meta.commentmetadata {
	clear:left;
	color: #343838;
	font-style: italic;
	margin: 0 0 0 55px;
	}
#comments div.reply {
	text-align: right;
	}
#comments div a.comment-reply-link {
	text-decoration: none;
	color: #343838;
	margin-left: 55px;
	}

/***** COMMENT FORM *****/
#commentform {
	margin: 10px 0 0 0;
	}
#reply-title {
	color: #6F0B00;
	font-size: 140%;
	margin-top: 8px;
	}
#commentform input, #commentform textarea, #commentform #submit{
	font-family: ssp, Helvetica, Arial, sans-serif;
	margin-bottom: 8px;	
	padding: 6px;
	color: #343838;
	font-size: 100%;
	border: 1px solid #343838;
	}
#commentform textarea{
	width: calc(100% - 14px);
	width: -webkit-calc(100% - 14px);
	}
#commentform #submit {
	width: 100%;
	color: #FFF;
	background: #343838;
	text-align: center;
	cursor: pointer;
	font-size: 120%;
	padding: 2px 0;
	}
.form-allowed-tags {
	display:none;
	}


/***** Styles for screen 768px and lower *****/
@media screen and (max-width: 768px) and (min-width: 601px) {
	header {
		border: none;
		}
	.navsearch {
		background: #CCC;
		padding: 10px 0;
		clear: both;
		display:block;
		text-align: center;
		width: 100%;
		}
	footer {
		margin: 0;
		padding: 0;
		}
	}

/***** Styles for screen 600px and lower *****/
@media screen and (max-width: 600px) {
	#wrapper {
		margin:0;
		padding: 4px;
		}
	header {
		border: none;
		}
	nav, nav ul {
  		width: 100%;
		}
	nav ul ul li,nav ul ul li a{
		display: none;
		}
	nav li {
  		box-sizing:border-box;
		-moz-box-sizing:border-box; /* Firefox */
		-webkit-box-sizing:border-box; /* Safari */
		width:50%;
		border:1px solid #FFF;
		float:left;
  		}
	nav a {
	  	text-align: left;
	  	width: calc(100% - 20px);
	  	background: #343838;
		padding: 0px 10px;
		color: #FFF;
		margin: 0;
  		}
	nav li:hover > a, nav a:focus, nav .current-menu-item > a, nav .current-menu-ancestor > a, nav .current_page_item > a, nav .current_page_ancestor > a {
		color: #FFF !important;
		background: #A00B15;
		}
	.navsearch {
		background: #CCC;
		padding: 6px 0;
		clear: both;
		display:block;
		text-align: center;
		width: 100%;
		}
	#primary {
		width: calc(100% - 210px);
		width: -webkit-calc(100% - 210px);
		max-width: 390px;
		}
	#secondary {
		width: 200px;
		text-align: left;
		float:right;
		}
	#left-footer {
		float: left;
		width: calc(100% - 210px);
		width: -webkit-calc(100% - 210px);
		}
	#right-footer {
		float: right;
		width: 200px;
		}
	}

/***** Styles for screen 480px and lower *****/
@media only screen and (max-width: 480px) {
	#primary {
		width: calc(100% - 190px);
		width: -webkit-calc(100% - 190px);
		border: 1px solid #FFF;
		}
	#secondary {
		width: 180px;
		text-align: left;
		float:right;
		border: 1px solid #FFF;
		}
	#left-footer {
		float: left;
		width: calc(100% - 190px);
		width: -webkit-calc(100% - 190px);
		}
	#right-footer {
		float: right;
		width: 180px;
		}
	body{font-size: 80%;}
	.entry h1, #secondary h2, footer h2{font-size: 140%;}
	.entry h2{font-size: 120%;}
	.entry h3{font-size: 100%;}
	.navsearch {
		box-sizing:border-box;
		-moz-box-sizing:border-box; /* Firefox */
		-webkit-box-sizing:border-box; /* Safari */
		width: 100%;
		border: 1px solid #fff;
		}
	#commentform input, #commentform textarea {
		width: calc(100% - 14px);
		width: -webkit-calc(100% - 14px);
		}
	header, #tagline, #logo img{margin:0 0 5px 0}
	}

/***** Smartphone *****/
@media only screen and (max-width : 320px) {
	#primary {
		width:100%;
		}
	#secondary {
		width: 100%;
		}
	.navsearch, #secondary{
		float:left;
		}
	.navsearch input {
		width: 270px;
		}
	#left-footer {
		float: left;
		width: calc(100% - 130px);
		width: -webkit-calc(100% - 130px);
		}
	#right-footer {
		float: right;
		width: 120px;
		}
	}