/*
 Theme Name:   Twenty Thirteen Child
 Theme URI:    http://dev.heidistjohn.com/blog/twentythirteen-child/
 Description:  Twenty Thirteen Child Theme
 Author:       Jay St. John
 Author URI:   http://jaystjohn.com
 Template:     twentythirteen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twentythirteen-child
*/

/* Overriding CSS */
html {
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;   
	font-size:90%;
	
	}
body {
	color: #666666;
}	
h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	font-family: 'Lora', Garamond, serif; 
	line-height: 1.3;
}

h1 {
	font-size: 34px;
	margin: 33px 0;
}

h2 {
	font-size: 26px;
	margin: 25px 0;
}

h3 {
	font-size: 18px;
	margin: 22px 0;
}

h4 {
	font-size: 16px;
	margin: 25px 0;
}

h5 {
	font-size: 12px;
	margin: 30px 0;
}

h6 {
	font-size: 10px;
	margin: 36px 0;
}

a:link,
a:visited,
a:active { color:  #663300; }
a:hover { color: #000000; }

.entry-title a:link,
.entry-title a:visited,
.entry-title a:active { color: #666666; }


#content,
#primary,
.sidebar-container,
.sidebar .entry-header,
.sidebar .entry-content,
.sidebar .entry-summary,
.sidebar .entry-meta,
.site-main .sidebar-inner { 
	background-color: #ffffff; 
	margin: 0;
	padding: 0;	
	/*max-width:1200px;*/
	width:100%;
}
#main {
	/*background-color: #B8AEB1;*/
	background: rgb(184,174,177); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(184,174,177,1) 0%, rgba(255,255,255,1) 100%, rgba(125,185,232,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(184,174,177,1) 0%,rgba(255,255,255,1) 100%,rgba(125,185,232,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(184,174,177,1) 0%,rgba(255,255,255,1) 100%,rgba(125,185,232,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b8aeb1', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */	
	width:100%;
	height: 100%;
}
#primary {
	padding: 0 40px;
	background-color:transparent;
} 
#content {
	background-color:#ffffff;
	padding: 40px 40px 0;
}
.site-info { /* Footer */
	/*max-width: 1600px;*/
	width:100%;
	padding:20px;
}
.site-footer,
.comment-respond {
	background-color: rgba(220, 220, 220, .3);
}
#masthead,
.site-header { /* Wraps Header */
	width: 100%;
	height: 140px;
	z-index: 1000;
	background-image: none;
	margin:0;
	-moz-box-shadow: 0px 5px 5px rgba(68,68,68,0.3);
	-webkit-box-shadow: 0px 5px 5px rgba(68,68,68,0.3);
	box-shadow: 0px 5px 5px rgba(68,68,68,0.3);
}

.site-header-image { /* HSJ Logo */
	position: absolute;
	left: 50px;
	top: 20px;
	width: 300px;
}
.site-header .home-link { /* pushes down navbar */
	min-height: 0;
	height: 55px;
}
.site-header .navbar {
	width: 60%;
	max-width: 1000px;
	margin:0;
	margin-left: 400px;
	background-color: #ffffff;
}

.entry-header {
	padding:0;
}

.site-header .search-form {
	right: 8%;
	top: 160px; 
}

.site-main { 
	margin: 0;
}
.site-main .sidebar-container {
	top: 8em;
	right: 5%;
	margin: 0;
	padding: 0;
	width: 100%;
}
.site-main .sidebar-inner {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
}
.site-main .widget-area { width:300px; }
.widget {
	background-color: rgba(220, 220, 220, .8);
}
.site-footer .sidebar-container {
	background-color:#ffffff;
}
.site-footer .widget-title {
	color:#666666;
}

.nav-menu li a { padding:12px 18px; }
.nav-menu li li a { padding: 10px 15px; }
.nav-menu .sub-menu, 
.nav-menu .children {
    background-color: #ffffff;
    border-width:1px 2px 2px 1px;    
    border-style: solid;
    border-color: #dddddd;
}

.nav-menu li a:link,
.nav-menu li a:active,
.nav-menu li a:visited { background-color:transparent; color: #666666; }
.nav-menu > li:hover > a { background-color: #eeeeee; color: #666666; }

ul.nav-menu ul a:hover,
.nav-menu ul ul a:hover,
ul.nav-menu ul a:focus,
.nav-menu ul ul a:focus { background-color: #cccccc; color: #000000; }
.nav-menu ul > li:hover > a { background-color: #eeeeee; color: #666666; }

button:hover, 
button:focus, 
input[type="submit"]:hover, 
input[type="button"]:hover, 
input[type="reset"]:hover, 
input[type="submit"]:focus, 
input[type="button"]:focus, 
input[type="reset"]:focus {
    background: #666666;
    background: -webkit-linear-gradient(top, #666666 0%, #333333 100%);
    background: linear-gradient(to bottom, #666666 0%, #333333 100%);
    outline: none;
}

button, 
input[type="submit"], 
input[type="button"], 
input[type="reset"] {
    background: #666666;
    background: -webkit-linear-gradient(top, #666666 0%, #333333 100%);
    background: linear-gradient(to bottom, #666666 0%, #333333 100%);
    border: none;
    border-bottom: 3px solid #111111;
    border-radius: 2px;
    color: #fff;
    display: inline-block;
    padding: 11px 24px 10px;
    text-decoration: none;
}

/* Template Name: Page Of Posts Two Columns*/
.entry-content-two-columns-row { clear: both; }
.col1 {  max-width: 50%; float: left; padding: 0px 15px 0px 0px; }
.col2 {  max-width: 50%; float: right; padding: 0px 0px 0px 15px; }

/* Blog/Podcast layout */
#content {
	width:70%;
	text-align: center;
}
.post {
	text-align: center;
}
.postLink {
	position:relative;
	width:100%; /*300px;*/
	max-width:600px; 
	min-width:320px;
	height:auto;
	padding:0px;
	margin: 0 auto 8em;
	display: inline-block;
	vertical-align: top;
	border: 1px solid #eeeeee;
	border-radius: 0 0 8pt 8pt;
	text-align:left;
	background-color: #eeeeee;
	/* IE fix. */
	*display: inline;
	zoom: 1;
}

/* Makes whole div clickable. */
.postLink a {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	text-decoration: underline;
	z-index: 10; 
	background-color: #FFF; /* Fix to make div clickable in IE */
	opacity: 0; /* Fix to make div clickable in IE */
	filter: alpha(opacity=1); /* Fix to make div clickable in IE */
	transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
	-webkit-transition: opacity .25s ease-in-out;
}
.postLink a:hover {
	opacity:0.2;
	filter: alpha(opacity=20);
}
.postLink .entry-header,
.postLink .entry-meta,
.postLink .entry-content {
	background-color:transparent;
	color: #000000;
	width:100%;
}
.postLink .entry-thumbnail {
	margin:0 auto;
}
.postLink .entry-header {
	text-align: center;
	padding:0;
}
.postLink .entry-content {
	padding: 0 10px;
}
.entry-content .size-medium:first-of-type {
	display:none;
}

.postLink .entry-header img.wp-post-image {
	width: 600px;
	margin: 0 auto;
}

.entry-meta > span {
    display:block!important;
}
.sidebar .entry-header .entry-meta,
.postLink .entry-meta {
	text-align: left;
	padding:10px;
}
.postLink .entry-title a,
.postLink .entry-meta a,
.postLink .entry-content a,
.postLink .powerpress_links a {
	display: inline-block;
	position: relative;
	opacity: 1;	
	width: auto;
	height: auto;
	text-align: left;
	line-height: 1;	
	color: #000000; 
	background-color: transparent;
}
.postLink .entry-title a,
.postLink h1.entry-title {
	opacity: 1;
	font-weight: normal;
	text-transform: uppercase;
}
.postLink .entry-title a,
.postLink .entry-meta  a,
.postLink .powerpress_links a {
	font-size: 1em;
	font-weight: normal;
	margin: 0;
	margin: 5px 10px;	
	margin-left: 2%;	
}
.postLink .entry-meta a {
	margin-right:0;
	color: #999999;	
}
.postLink .powerpress_links {
	margin: 5px auto;
}
.postLink .entry_content a { text-decoration-line: underline; }

.postLink .entry-meta .date,
.postLink .entry-meta .categories-links,
.postLink .entry-meta .tags-links,
.postLink .entry-meta .author,
.postLink .entry-meta .edit-link {
	margin:auto 5px;
}
.postLink .entry-meta .date,
.postLink .entry-meta .author {
	float:right;
}
.postLink .podcast_meta {
	text-align:center;
	padding: 10px;
}

.postLink a.podcast-meta-download,
.postLink a.podcast-meta-new-window {
	display:inline;
}

@media (max-width: 1069px) {

	#main,
	#content { 
		width: 100%; 
	}
	
	.archive-header,
	.search .page-header,
	.archive .page-header,
	.blog .page-header,
	.error404 .page-content,
	.search .page-content,
	.archive .page-content,
	.attachment .entry-header,
	.attachment .entry-content,
	.post-navigation .nav-links,
	.sidebar .site-info,
	.site-footer .widget-area {
		padding-left: 20px;
		padding-right: 20px;
	}

	.site-main .sidebar-container,
	.site-main .sidebar-inner {
		position:relative;
		right: auto;
		width: 100%;
		max-width: 100%;
		margin:auto;
	}

	.site-main .widget-area {
		width:100%;
		margin: auto;

	}
	
	.widget {
		width:100%;
		max-width: 800px;
		margin: auto;
		text-align:center;
	}	
	.site_info {
		position:relative;
	}
	.site-footer {
		clear:both;
	}
	

}

/* Iphone SIze */
@media (max-width: 643px) {
	
	/* Template Name: Page Of Posts Two Columns */
	.col1 {  max-width: 100%!important; float: none; }
	.col2 {  max-width: 100%!important; float: none; padding: 0px; }

	#content,
	#primary {
		width:100%;
		padding:0;
	}
	#primary { padding: 30px 0 ; }
	
	/* Small menu */
	#masthead,
	.site-header {
		z-index: 1000;
	}
	.site-header .home-link { /* pushes down navbar */
		min-height: 0;
		height: 140px;
		text-align:center;
	}
	.site-header-image { /* HSJ Logo */
		position: static;
		margin:20px auto;
		width: 250px;
	}			
	.site-header .navbar {	
		width: 100%;
		max-width:645px;
		margin-left: 0;	
		background-color: rgba(247, 245, 231, 1);
	}
	.site-header .search-form {
		top: 95px;
		left: 1.5em;
	}
	.menu-toggle {
		cursor: pointer;
		font: bold 16px/1.3 "Open Sans", Helvetica, sans-serif;
		margin: 0;
	}
	.menu-toggle, .menu-toggle:hover, .menu-toggle:focus, .menu-toggle:active {
		background: none;
		border: none;
		color: #141412;
		padding: 12px 0 12px 20px;
	}
	.post { text-align: center; }
	.postLink { margin: auto; width: 80%; }
	.postLink img { width:100%; }
	.site-main .widget-area { 
		width:100%; 
		margin: 0; 
		text-align:center; 
	}
	.widget img {
		margin:auto;
		width: 50%;
	}	
	.sidebar .paging-navigation .nav-links {
		padding: 0 60px 0 60px;
	}	
}
	