@import url("search.css");

/* This is a little convoluted, my apologies. It's just the initial draft during design */
/* TODO: mobile version, cleaner CSS */

@font-face {font-family: AGBold; src: url('AGBold.otf');}
@font-face {font-family: AGMd; src: url('AGMd.otf');}
@font-face {font-family: AGreg; src: url('AGreg.otf');}

body {
	font-family:AGReg, Helvetica, sans-serif; 
	font-size:12px; 
	padding:0; 
	margin:0;
	/*display:none;*/
	background:url(../images/background.png) repeat-x;
}
body#home {background:url(../images/background_home.png) repeat-x;}
#wrapper {background:url(../images/background_bottom.png) repeat-x bottom left;}

h1, h2, h3, h4 {font-weight:normal;}

a img {border:none;}

.hidden {display:none;}

#top_bar {padding:29px 0 0 0; margin-bottom:0;}

#top_bar #menu-nav-menu {margin:0; padding:0; float:left; text-transform:lowercase; font-family:AGMd, sans-serif;}
#top_bar #menu-nav-menu li {list-style-type:none; display:inline; margin-right:18px;}
#top_bar #menu-nav-menu li a {font-size:14px; color:#999; text-decoration:none; font-weight:normal;}
#top_bar #menu-nav-menu li a:hover, #top_bar #menu-nav-menu li a#current  {color:#000;}

#top_bar #menu-item-123 a {
	display:inline-block; 
	text-indent:-9999px; 
	width:120px; 
	height:17px; 
	background:url(../images/logo_header.png);
}

#top_bar li .sub-menu {display:none;}
#top_bar li:hover .sub-menu, #top_bar li .sub-menu:hover {
	display:block; 
	position:absolute; 
	padding:.5em 1em; 
	 -webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	border:1px solid #ccc;
	background:#fff;
	left:300px;
	top:45px;
	z-index:3;
}
#top_bar li:hover .sub-menu li {float:left; clear:both; line-height:2em;}

#top_bar li#menu-item-4963:hover .sub-menu, #top_bar li#menu-item-4963 .sub-menu:hover {left:371px;}

#social {display:inline; float:left; margin-left:165px;}
#social a img {margin-right:5px;}

#search {/*float:right; margin-top:-6px;*/ position:absolute; top:19px; right:0; /*solves webkit woes*/}

#content_banner {text-transform:lowercase; margin-top:30px; padding:10px 0; height:174px;}
#content_banner div {color:#fff; height:154px; width:200px; padding:10px;}
#content_banner div h2 {
	font-size:24px; 
	background:rgba(0, 0, 0, 0.75); 
	display:inline; 
	line-height:1.3em; 
	text-shadow:1px 2px 3px #333; 
	color:#fff; 
	text-decoration:none;
}
#content_banner div p {font-size:14px; text-shadow:1px 2px 4px #000; margin-top:.5em; font-family:AGMd, sans-serif;}
#content_banner div#story1 {background:url(../images/content_banner_1.png) no-repeat;}
#content_banner div#story2 {background:url(../images/content_banner_2.png) no-repeat;}
#content_banner div#story3 {background:url(../images/content_banner_3.png) no-repeat;}
#content_banner div#story4 {background:url(../images/content_banner_4.png) no-repeat;}

#section_title {margin-top:29px; margin-bottom:12px; text-transform:capitalize;}
#section_title a {color:#fff;}
#section_title a:hover {text-decoration:none;}
#section_title h1 {color:#fff; line-height:16px;}

#content {font-family:Arial, Helvetica, sans-serif; overflow:auto; /*position:absolute;*/ /* for readabiliy, overwritten for title etc. below */}
#content #date, #content #author, #photographer {font-family:AGreg, sans-serif; /* for display */}

#content #article_title {
	font-family:AGBold, sans-serif; 
	font-size:40px; 
	line-height:.9em; 
	margin:.4em 0 .2em 0; 
	display:block;
	width:535px;
}
#content p {line-height:1.5em; font-size:14px; text-align:justify;}
#content #date {
	position:absolute; 
	top:0; 
	right:0; 
	padding:.5em .7em; 
	border:1px solid #999; 
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	font-family:AGreg, sans-serif; 
}
#content #date #month {display:block; text-align:center; font-size:14px;}
#content #date #day {display:block; text-align:center; font-size:30px;}
#content #date #year {display:block; text-align:center; font-size:14px;}
#content #author, #content #photographer {font-size:16px; text-align:left; margin-top:0; margin-bottom:0;}
#content img.aligncenter, #content object {max-width:620px;}

#sidebar_wrapper {position:absolute;}

#sidebar {position:absolute; top:0; right:0; width:100%;}


#prev_next {margin:0; padding:0; padding:.5em 1em; margin-top:14px;}
#prev_next li {list-style-type:none; display:inline-block; }
#prev_next li a {color:#999; text-decoration:none; font-size:18px;}
#prev_next li a:hover {color:#000;}
#prev_next li span#next a {margin-left:1.1em;}
#prev_next li span#prev a {display:inline-block; width:8em;} /* fixes IE display error */

#meta {
	padding:0 10px; 
	border:2px solid #999; 
	margin:15px 0 0 0; 
	-webkit-border-radius:5px; 
	-moz-border-radius:5px;
	border-radius:5px;
}
#meta a {color:#000;}
#meta a:hover {text-decoration:none;}
#meta .music_player_alt {color:#999; font-style:italic;}
#meta #tags span{font-weight:bold; display:inline-block; width:3.5em; height:3em; float:left;}
#meta #categories {clear:both;}
#meta #categories span{font-weight:bold; display:inline-block; width:6.5em; height:3em; float:left;}
#meta #related {clear:both;}
#meta #related span {font-weight:bold; display:inline-block; width:8em; height:3em; float:left;}
#meta p#editPost {display:block; clear:both;}
#meta p#musicFromPost {display:block; width:100%;}

#footer {
	padding:15px 0 12px 0; 
	margin-top:25px; 
	overflow:auto; 
	color:#fff; 
	font-family:Arial, Helvetica, sans-serif;
	background:#000;
}
#footer_nav ul {margin:0; padding:0; float:right;}
#footer_nav .sub-menu {display:none;}
#footer_nav ul li {display:inline; list-style-type:none;}
#footer_nav ul li a {font-size:12px; color:#fff; margin-right:.5em; line-height:1em; color:#999;}
#footer_nav ul li a:hover {text-decoration:none; color:#fff;}
#footer_nav #recent {margin-top:1em;}

#footer #copyright p {margin:0; font-size:10px;}
#footer #copyright a {color:#fff;}
#footer #copyright img {margin:0 3px 3px 0; vertical-align:middle}

#footer #contact {border-top:1px solid #333; margin-top:14px; text-align:center;}
#footer div .contact_individual {
	display:inline-block; 
	width:175px; 
	padding:0 5px; 
	height:100px; 
	vertical-align:top;
	text-align:center;
}
#footer div .contact_individual:hover {background:#333;}
#footer div .contact_individual p {font-family:Arial, Helvetica, sans-serif; font-size:12px;}
#footer div .contact_individual .name {font-size:14px; margin-bottom:0; font-family:AGMd, sans-serif;}
#footer div .contact_individual .name span {display:block; font-family:AGreg, sans-serif;}
#footer div .contact_individual .name a {color:#ccc; text-decoration:none;}
#footer div .contact_individual .name a:hover {color:#fff;}
#footer div .contact_individual .role {margin-bottom:1em; font-size:10px;}

#subsections {background:#000; margin-top:25px;}
#subsections div {height:340px;}
#subsections div h3 a, #subsections div h4 a, #subsections div p a {text-decoration:none; color:#000;}
#subsections div h3 a {color:#fff;}
#subsections div h3 a:hover {color:#ccc;}
#subsections div h3 {
	font-family:AGBold;
	font-size:24px;
	color:#fff; 
	background:#000;
	margin-top:0; margin-bottom:5px; 
	padding:10px; 
	width:280px;
	-moz-border-radius:5px; -webkit-border-radius:5px;
	border-radius:5px;
}
#subsections div h4 {
	font-family:AGMd; 
	font-size:18px; 
	margin-top:5px; 
	margin-bottom:0; 
	border-bottom:2px solid #999;
	padding-bottom:5px;
}
#subsections div h4 a:hover {color:#666;}
#subsections div p {font-family:arial, helvetica, sans-serif; font-size:14px;}
#subsections div p a {display:block; border-bottom:1px solid #ccc; color:#333;}
#subsections div p a:hover {border-bottom:1px solid #000; color:#000;}

#subsections div span {font-family:arial, helvetica; font-size:14px;}

#podcast_section span {display:none;}
#podcast_section h4 {padding-top:15px;}

#category_articles {overflow:hidden;}
#category_articles div {height:250px;}
#category_articles div h4 {
	margin:15px 0 0 0; 
	background:#000; 
	padding:0 10px; width:280px; 
	-moz-border-radius-topleft:5px; 
	-moz-border-radius-topright:5px;
	-webkit-border-top-left-radius:5px;
	-webkit-border-top-right-radius:5px;
}
#category_articles div img {border:none;}
#category_articles div h4 a {font-family:AGBold; font-size:18px; color:#fff; margin-left:-10px; padding:10px; display:block; width:280px;}
#category_articles div p {font-family:arial, helvetica, sans-serif; margin-top:5px;}

#postNav {display:block; margin-top:1em; text-align:center;}
#postNav a {font-family:arial, helvetica, sans-serif; font-size:18px; color:#999; margin-right:1em; text-decoration:none;}
#postNav a:hover {color:#000;}
#category_articles a {text-decoration:none;}

#disqus_thread {font-family:arial, helvetica, sans-serif;}

#podcastMainPlayer {min-height:250px;}

#page {font-family:arial, helvetica, sans-serif; font-size:14px;}
#page p#aboutIntro {font-family:AGreg; font-size:24px; margin-top:10px;}
#page h2 {font-family:AGMd; font-size:24px}
#page div {font-size:18px;}
#page #edit {margin-top:25px;}
/* #page p#aboutIntro span {font-size:72px; text-transform:uppercase; float:left; margin:0 10px 0 0} */

#notFoundSearch {font-family:arial, helvetica, sans-serif;}

img#ad {-webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}

#banner_ad:before {content:'Advertisement';}

.alignleft {float:left; padding-right:1em;}

.gallery {max-width:620px; overflow:hidden;} /*overflow hidden, temp fix */


p#join_tmm a {
	background:#ff9100;
	border-radius:100px;
	-moz-border-radius:100px;
	color:#fff;
	font-weight:bold;
	left:570px;
	top:28px;
	text-decoration:none;
	position:absolute;
	padding:.4em 1em;
}
p#join_tmm a:hover {
	background:#C46F00;
}
p#join_tmm a:focus {
	top:30px;
	left:571px;
}
