/*  
Theme Name: 51/50s
Theme URI: http://5150smusic.com/
Author: Not Evil Music / Niklas Rämö
*/

/* LOAD FONTS */

@font-face {
	font-family: "DroidSerif";
	font-weight: normal;
	src: url("fonts/DroidSerif-Regular-webfont.eot");
	src: local('☺'),
		   url("fonts/DroidSerif-Regular-webfont.woff") format("woff"),
		   url("fonts/DroidSerif-Regular-webfont.ttf") format("truetype"),
		   url("fonts/DroidSerif-Regular-webfont.svg#webfont") format("svg");
	}

@font-face {
	font-family: "DroidSerif";
	font-weight: bold;
	src: url("fonts/DroidSerif-Bold-webfont.eot");
	src: local('☺'),
		   url("fonts/DroidSerif-Bold-webfont.woff") format("woff"),
		   url("fonts/DroidSerif-Bold-webfont.ttf") format("truetype"),
		   url("fonts/DroidSerif-Bold-webfont.svg#webfont") format("svg");
	}

@font-face {
	font-family: "Bebas";
	font-weight: bold;
	src: url("fonts/BEBAS___-webfont.eot");
	src: local('☺'),
		   url("fonts/BEBAS___-webfont.woff") format("woff"),
		   url("fonts/BEBAS___-webfont.ttf") format("truetype"),
		   url("fonts/BEBAS___-webfont.svg#webfont") format("svg");
	}

/* BEGIN MAIN STRUCTURE */

html, body { height:100%; }

body {
  	background: #dfd0b3 url(images/bg.jpg) repeat-y center top;
	color: #50443b;
    font-family: DroidSerif,Georgia,Times,"Times New Roman",serif;
	font-size: 14px;
	font-weight: normal;
	font-style: normal;
	margin: 0 auto;
	text-align: left;
	}
	
#page-wrap-1 {}

#page-wrap-2 { background: transparent url(images/header.jpg) no-repeat center top; }
	
#page {
    margin: 0 auto;
	width: 960px;
	}

#header {
  	height: 450px;
  	position: relative;
    z-index: 2;
    margin: 0 auto;
	width: 960px;
	}
	
#content {}
	
#sidebar {
	float: right;
    margin: 0 30px 0 0;
	width: 300px;
	}
	
#widecolumn {
	float: left;
	margin: 0 0 0 30px;
	width: 520px;
	}

.post { padding: 0 0 2em 0; }
	
.post-date {
	font-size: 13px;
	color: #8c7868;
	margin: -1em 0 1em 0;
	}
	
.post-date span {
	text-transform: uppercase;
	}


.entry { 
	background: url(images/menu-div.gif) no-repeat center bottom;
	padding: 0 0 0.5em 0;
	}

.post-navigation {
	padding-top: 10px;
	font-size: 30px;
	width: 100%;
	text-align: center;
	}

#footer {
	background: transparent url(images/footer.jpg) no-repeat center top;
	clear: both;
	margin: 0 auto;
	height: 300px;
	}
	
#footer .wrapper {
	padding-top: 250px;
	width: 960px;
	margin: 0 auto;
	}
	
#footer p {
	font-size: 13px;
	color: #8c7868;
	text-align: center;
	}
	
/* BEGIN TYPOGRAPHY */

p { 
	line-height: 1.5em;
	margin-bottom: 1.4em;
	}

input, textarea {}
	
h1,h2,h3,h4 {
    font-family: Bebas,Georgia,serif;
	word-spacing: 0.25em;
	line-height: 1em;
	text-transform: uppercase;
	margin: 0 0 1.4em 0;
	}
	
h1 { font-size: 18px; }

h2 { font-size: 18px; }

h3 { font-size: 16px; }

h4 {
	font-size: 16px;
	color: #FFFFFF;
	text-shadow: 1px 1px 0px #999999;
	filter: dropshadow(color=#999999, offx=1, offy=1);
	}	

	
h4.twitter {
	background: transparent url(images/sidebar-h4-twitter.gif) no-repeat;
	display: block;
	height: 53px;
	width: 276px;
	padding: 12px 12px 0 12px;
	margin: 0;
	}
	
h4.twitter span.twitter-followers {
	font-size: 14px;
	padding-top: 1px;
	display: inline-block;
	text-align: right;
	float:right;
	width: 200px;
	}
    
a, a:visited, p a, p a:visited {
	color: #d35b45;
	text-decoration: none;
	} 

a.facebook-share {
	color: #627aac;
	} 
	
a:hover, p a:hover {
	color: #8c7868;
	text-decoration: underline;
	}
	
h4.twitter a {
	color: #d6f5ff;
	text-decoration: none;
	}
	
h4.twitter a:hover {
	color: #FFFFFF;
	text-decoration: underline;
	}

.post-navigation a {
	text-decoration: none;
	display:inline-block;
	padding: 0 0.2em;
	margin-right: 5px;
	}
	
.post-navigation a:hover {
	text-decoration: none;
	}

/* BEGIN LIST STYLES */
	
.entry ul {
	list-style-type: circle;
	list-style position: inside;
	padding: 1em 1em 0 1.5em;
	margin: 0 0 1.5em 0;
	}
	
.entry ul li {
	line-height: 2em;
	}
	
.entry ol {
	padding: 0 0 0 30px;
	margin: 0;
	}

.entry ol li {
	margin: 0;
	padding: 0;
    list-style: decimal outside;
	}
	
.entry dl {
	line-height: 1.5em;
	margin-bottom: 1.4em;
	}
	
.entry dt {
	font-weight: bold;
	float: left;
	width: 30%;
	clear: both;
	padding-bottom: 10px;
	}
	
.entry dd {
	float: right;
	width: 70%;
	padding-bottom: 10px;
	}
	
/* BEGIN IMAGE STYLES */

img.framed, div.framed {
	background: #ddc7b7;
	outline: 1px solid #c7b4a6;
	border-top: 1px solid #f8e5d7;
	width: 500px;
	height: auto;
	padding: 9px;
	}
	
div.framed {
	margin-bottom: 1.4em;
	}

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}
	
/* OTHER STUFF */

hr { display: none; }

.center {text-align: center;}

.alignright { float: right; }

.alignleft { float: left; }

.divider-1 {
	background: #ddc7b7;
	border-bottom: 1px solid #FDF7F3;
	width: 100%;
	height: 1px;
	margin: 0 0 1.4em 0;
	}

.floatclear { clear: both; }

.hide {
	font-size: 1px;
	text-indent: -9999px;
	outline:none;
	}

.first {margin-top: 0px;}
	
.clearfix:after {
 	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
	}

.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */
	
/* BEGIN NAVIGATION */

#menu {
    font-family: Georgia,DroidSerif,Times,"Times New Roman",serif;
	font-size: 13px;
	float: left;
	margin: 390px 30px 0 30px;
	overflow: hidden;
	text-transform: uppercase;
	}
	
#menu ul {
	list-style-type: none;
	}

#menu li {
	float: left;
   	list-style: none;
   	margin-right: 6px;
	}
	
#menu li a {
   	display: block;
	color: #50443b;
	text-decoration: none;
	padding: 5px 8px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px; 
	}
	
#menu li a:hover {
	color: #f8e5d7;
	background: #8c7868;
	text-decoration: none;
	-webkit-box-shadow: 1px 1px 0px  #ffffff;
	-moz-box-shadow: 1px 1px 0px #ffffff;
	box-shadow: 1px 1px 0px #ffffff; 
	}
	
#menu li.current a {
	color: #f8e5d7;
	background: #50443b;
	-webkit-box-shadow: 1px 1px 0px  #ffffff;
	-moz-box-shadow: 1px 1px 0px #ffffff;
	box-shadow: 1px 1px 0px #ffffff; 
	}
	
#menu li.current a:hover {
	color: #f8e5d7;
	border: none;
	background: #8c7868;
	}
	
.menu-div {
  	background: url(images/menu-div.gif) no-repeat center top;
  	display: block;
  	float: left;
  	margin-top: 12px;
  	height: 2px;
  	width: 100%;
	}
	
/* BEGIN MUSIC PAGE */

.album-wrap {
	font-size: 13px;
	width: 500px;
	padding: 9px;
	border: 1px solid #8c7868 ;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin: 1.4em 0;
	}
.album-wrap p {
	padding: 0;
	margin: 0;
	}
.album-wrap-left {
	float: left;
	width: 150px;
	padding-right: 20px;
	}
img.album-cover {
	width: 150px;
	height: auto;
	}
p.album-buy {
	font-family: arial;
	font-weight: bold;
	background: #88c4d8;
	color: #ffffff;
	width: 100%;
	display: block;
	text-align: center;
	text-transform: uppercase;
	padding: 6px 0;
	margin: 5px 0 0 0;
	text-shadow: 1px 1px 0px #999999;
	filter: dropshadow(color=#999999, offx=1, offy=1);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	}
p.album-buy:hover {
	background: #85d3ec;
	text-decoration: none;
	cursor:pointer;
	cursor:hand;
	}
ul.album-stores {
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 100%;
	}
ul.album-stores li {
	padding: 0;
	}
ul.album-stores li a {
	text-align: center;
	background: #88c4d8;
	color: #ffffff;
	display: block;
	padding: 3px 0;
	margin-top: 1px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	}
ul.album-stores li a:hover {
	background: #85d3ec;
	text-decoration: none;
	}
.album-wrap-right {
	float: right;
	width: 330px;
	}
h2.album-title {
	font-size: 16px;
	width: 100%;
	display: inline-block;
	}
h2.album-title span {
	float: right;
	color: #999;
	}
ul.album-tracklist {
	list-style-type: none;
	margin: 0 0 1.4em 0;
	padding: 0;
	width: 100%;
	}
ul.album-tracklist li {
	display: block;
	padding: 0;
	}
ul.album-tracklist li span {
	color: #999999;
	display: inline-block;
	width: 25px;
	}
ul.album-tracklist li em {
	color: #999999;
	display: inline-block;
	width: 30px;
	float: right;
	font-style: normal;
	}
p.album-info-trigger {
	background: #DDC7B7;
	width: 100%;
	display: block;
	text-align: center;
	padding: 6px 0;
	margin: 0 0 1.4em 0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	}
p.album-info-trigger:hover {
	color: #f8e5d7;
	background: #8c7868;
	cursor:pointer;
	cursor:hand;
	}
dl.album-info {
	width: 100%;
	margin:0;
	padding:0;
	}
	
/* START PHOTOS PAGE STYLING */
	
.photo-gallery {}

.photo-gallery h2 {
	background: #ffffff;
	padding: 10px;
	font-size: 15px;
	display: block;
	width: 482px;
	border: 1px solid #e3d3c7;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}

.photo-gallery ul {
	list-style-type: none;
	margin: 0 0 1.4em 0;
	padding: 0;
	width: 100%;
	}

.photo-gallery li {
	padding: 0!important;
	margin: 0!important;
	}

.photo-gallery li a img {
	background: #ffffff;
	width: 100px;
	height: 100px;
	padding: 6px;
	margin: 0 16px 16px 0;
	float: left;
	display: block;
	border: 1px solid #e3d3c7;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	}

.photo-gallery a:hover img {
	background: #333333;
	border: 1px solid #333333;
	}
	
/* START VIDEOS PAGE STYLING */

#accordion_wrap {
	display: none;
	margin-bottom: 1.4em;
	}

h2.accordion_trigger {
    margin: 10px 0 0 0;
	}
	
h2.accordion_trigger a {
	color: #50443b;
  	background: url(images/videos-bg.gif) no-repeat 0 0;
    font-family: DroidSerif,Georgia,Times,"Times New Roman",serif;
	font-size: 13px;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	text-transform: none;
	word-spacing: normal;
	display: table-cell;
	vertical-align: middle;
	height: 38px;
	width: 500px;
	padding: 0 10px;
	}
	
h2.accordion_trigger a:hover {
  	background: url(images/videos-bg.gif) no-repeat 0 -38px;
	text-decoration: none;
	}
	
h2.active a, h2.active a:hover {
  	background: url(images/videos-bg.gif) no-repeat 0 -76px;
	text-decoration: none;
	}

.accordion_container {
	width: 520px;
	overflow: hidden;
	margin-bottom: 10px;
	}
	
.accordion_container p {
	display: none;
	}
	
.accordion_container .block {
  	background: url(images/videos-bg.gif) repeat-y -520px 0;
	padding: 5px 10px 7px 10px;
	}
	
.video-meta {
	width: 100%;
  	padding: 10px 0 0 0;
	}
	
.facebook-share a, .twitter-share a {
  	background: url(images/videos-bg.gif) no-repeat;
	display: inline-block;
	height: 20px;
	width: 68px;
	float: right;
	margin-left: 4px;
	}
	
.twitter-share a {
	background-position: 0 -114px;
	}
	
.twitter-share a:hover {
	background-position: -68px -114px;
	}
	
.facebook-share a {
	background-position: -136px -114px;
	}
	
.facebook-share a:hover {
	background-position: -204px -114px;
	}

.accordion_container .block-bottom {
  	background: url(images/videos-bg.gif) no-repeat 0px -35px;
  	display: block;
	height: 3px;
	width: 520px;
	}
	
/* START WP-PAGENAVI PLUGIN */

.wp-pagenavi a, .wp-pagenavi a:link, .wp-pagenavi a:visited {
	color: #8c7868;
	text-decoration: none;
	font-size: 16px;
	display:inline-block;
	padding: 4px 7px;
	margin-right: 5px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	}

.wp-pagenavi a:hover, .wp-pagenavi a:active {	
	color: #f8e5d7;
	background: #8c7868;
	text-decoration: none;
	}

.wp-pagenavi span.pages, .wp-pagenavi span.extend, .wp-pagenavi span.current {
	color: #f8e5d7;
	background: #d35b45;
	text-decoration: none;
	font-size: 16px;
	display:inline-block;
	padding: 4px 7px;
	margin-right: 5px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	}

/* START TWITTER WIDGET PRO PLUGIN */

.twitter-pro {
	width: 300px;
	font-size: 13px;
	line-height: 1.2em;
	padding-bottom: 30px;
	}

.twitter-pro a.twitterwidget-title, .twitter-pro .from-meta { display: none; }

.twitter-pro ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

.twitter-pro ul li {
	margin: 0;
	padding: 11px 0 0 0;
	background: transparent url(images/tweet-top.gif) no-repeat 15px 0px;
	}

.twitter-pro ul li .entry-content {
	background: #ddc7b7;
	display: block;
	width: 280px;
	padding: 10px;
	margin-bottom: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	}

.twitter-pro ul li .entry-meta a {
	font-size: 11px;
	color: #8c7868;
	display: block;
	width: 280px;
	padding: 0 10px;
	text-align: right;
	}
	
/* HOT STUFF SLIDESHOW STYLES */

.hot-stuff {
	float: left;
	position: relative;
	}
	
.hot-stuff-header {
	background: transparent url(images/sidebar-h4-hot.gif) no-repeat center top;
	width: 300px;
	height: 65px;
	display: block;
	}
	
.hot-stuff h4 {
	float: left;
	padding: 12px 12px 0 12px;
	margin: 0;
	}
	
/* Paging Styles */

.tabs-menu {
	padding: 14px 12px 0 12px;
	float: right;
	z-index: 100; /*--Assures the paging stays on the top layer--*/
	display: none; /*--Hidden by default, will be later shown with jQuery--*/
	}

.tabs-menu a {
	text-indent: -9999px;
	outline:none;
	background: url(images/hot-stuff-selectors.png) no-repeat;
	background-position: 0 0; 
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-left: 2px;
	}
	
.tabs-menu a.active {
	background-position: -32px 0; 
	}
	
.tabs-menu a:hover {
	background-position: -16px 0; 
	}
	
.tabs-menu a.active:hover {
	background-position: -48px 0; 
	}
	
/* Tabs content styles */

.hot-stuff-content {
	background: #ddc7b7;
	display: block;
	height: 280px;
	width: 280px;
	padding: 10px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	}

.tabs-content {
	height: 280px;
	width: 280px;
	overflow: hidden; /*--Hides anything outside of the set width/height--*/
	position: relative;
	}
	
.tabs-content-wrap {
	position: absolute;
	top: 0;
	left: 0;
	}

.tabs-content-wrap img {
	float: left;
	}