/*
Theme Name: JustinBennett.net
Theme URI: http://www.goldenapplewebdesign.com
Description:  custom WP theme, created as a child theme to the Thematic Framework
Author: Justin Bennett
Author URI: http://www.goldenapplewebdesign.com
Template: thematic
Version: 1.0
.
copyright 2012
.
*/

@import url(../thematic/style.css);

/*-------------------- MAIN LAYOUT ---------------------*/

body {
	background:#000 url(images/jb-back-tile3.png) repeat fixed;
	background-size: .2%;
}
#wrapper {
	background:url(images/jb-back-grade.png) top repeat-x fixed;
}
#topbar-wrap {
	position:absolute;
	margin:0 auto;
	top:0;
	width:100%;
	height:10px;
	z-index:10;	
}
#topbar {
	background:#900;
	position:relative;
	margin:0 auto;
	width:959px;
	height:10px;
}
#botbar {
	position:fixed;
	bottom:0px;
}
#header, #branding {
	height:283px;
	padding:0;
}
#header {
	padding-top:10px;
	background:url(images/jbheader1.png) top no-repeat;
}
.page-id-13 #header, .page-id-24 #header, .page-id-6 #header  {
	background:url(images/jbheader5.png) top no-repeat;
}
.page-id-20 #header, .page-id-11 #header {
	background:url(images/jbheader2.png) top no-repeat;
}
.page-id-16 #header {
	background:url(images/jbheader3.png) top no-repeat;
}
#branding {
	position:relative;
	width:959px;
	box-shadow: #333 0px -1px 19px;
	-moz-box-shadow: #333 0px -1px 19px;
	-webkit-box-shadow: #333 0px -1px 19px;
	border-bottom:none;
}
#endorse {
	position:absolute;
	top:6px;
	left:11px;
	background:#000;
	background: rgba(0, 0, 0, .5);
}
#header-widget-right {
	position:absolute;
	top:259px;
	right:25px;
	z-index:200;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size:10px;
}
#header-widget-right a {
	color:#fc0;
	text-decoration:none;
}
#header-widget-right ul {
	list-style:none;
}
#header-widget-right li {
	float:right;
	margin-left:10px;
}
#header-widget-right .execphpwidget, .qtranxs_language_chooser {
	float:left;
}
#header-widget-right .execphpwidget img {
	margin-right:6px;
}
#blog-title, #blog-description {
	float:right;
	padding-right:23px;
	background:#000;
	background: rgba(0, 0, 0, .5);
	width:350px;
	text-align:right;
}
.lang-it #blog-title, .lang-it #blog-description {
	width:380px;
}
#blog-title {
	padding-top:3px;
}
#blog-description {
	padding-bottom:5px;
	border-radius:0 0 0 15px;
	-moz-border-radius:0 0 0 15px;
	-webkit-border-radius:0 0 0 15px;
	clear:both;
}
#access {
	background:#000;
	background: rgba(0, 0, 0, .7);
	border:none;
	margin:-31px auto 0;
	width:959px;
}
#main {
	background:#f6f6f6;
	/*border:#000 1px solid;*/
	box-shadow: #333 0px -1px 19px;
	-moz-box-shadow: #333 0px -1px 19px;
	-webkit-box-shadow: #333 0px -1px 19px;
	padding-top:40px;
	width:959px;
}
#content {
	margin-left:23px;
}
.entry-content .wp-post-image {
	background:#F4F4F4;
	float:left;
	margin:0 18px 20px 0;
}
.wp-caption {
	background-color:#F4F4F4;
	padding:5px 0 0;
}
.wp-caption p.wp-caption-text {
	padding:2px;
}
#primary, #page-bottom {
	background:#eee;
}
#primary {
	border:none;
}
.main-aside {
	right:23px;
}
.aside p {
	margin-bottom:9px;
}
.aside hr {
	margin-top:20px;
}
.aside ul ul {
	list-style:none;
	margin:0 0 25px 0;
}
.aside ul ul img {
	float:left;
	padding:3px 10px 10px 0;
}
.aside ul ul li {
	clear:both;
}
.aside ul ul.releases {
	margin-bottom:30px;
}
.aside ul ul.news li {
	padding-bottom:10px;
}
#footer {
	border:none;
	background:#333;
	box-shadow: #000 0px 1px 19px;
	-moz-box-shadow: #000 0px 1px 19px;
	-webkit-box-shadow: #000 0px 1px 19px;
	margin-top:40px;
}
.print {
	display:none;
}






/*-------------------- NAVBAR ----------------------*/

.sf-menu, .sf-menu a {
	border:none;
}
.sf-menu li {
	background:none;
}
.sf-menu a, .sf-menu a:visited {
	color:#FC0;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size:13px;
}
.sf-menu a:hover {
	background:none;
}
.sf-menu li:hover {
	background:none;
}
.sf-menu li a:hover {
	color:#FFF;
}
.sf-menu li.current_page_item {
	background:#900;
}






/*-------------------- TYPOGRAPHY ----------------------*/

a { text-decoration:none; }

body, input, textarea {
	color: #666;
}
#blog-title a {
	color:#FC0;
}
#blog-title a:hover {
	color:#FFF;
}
#blog-title {
	font-size:30px;
	font-weight:normal;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif
}
#blog-description {
	color:#CCC;
	font-size:14px;
}
h1.entry-title, .aside h3 {
	color:#900;
	padding-bottom:0;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}
.aside h3 {
	padding-bottom:10px;
	font-size:16px;
}
.entry-content h2, .type-albums h2 {
	font-size:19px;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	padding:5px 0 10px;
	color:#900;
	font-weight:normal;
	font-style:italic;
}
.type-albums .entry-meta {
	display:none;
}
div.date {
	color:#999;
	font-size:12px;
	font-weight:normal;
	padding-bottom:16px;
}
.wp-caption-text {
	font-size:11px;
	line-height:16px;
}
hr {
	clear:both;
	background-color: #ddd;
}
.page-title {
	font-size:16px;
	color:#900;
	padding-bottom:10px;
}




/*------------------- PAGE SPECIFIC --------------------*/

.home .edit-link, .disco .edit-link {
	clear:none;
	display:inline;
}
.home .entry-content h2 {
	padding-bottom:3px;
}
.disco .entry-content {
	padding-top:26px;
}
.entry-content img.vid-thumb {
	border:#FC0 3px solid;
	float:left;
	margin:0 18px 20px 0;
}
.page-id-20 .alignleft {
	margin-right:3px;
}
.page-id-20 #content {
	width:576px;
}
.shop-box {
	clear:both;
}

.home .eshopdetails, .type-albums .eshopdetails, .type-albums .entry-utility, .single-albums #nav-below {
	display:none;
}

.addtocart {
	float: right;
	margin-left: 20px;
}
.eshop input[type="submit"] {
	background:green !important;
}


.page-id-261 .eshop input[type="submit"] {
	background: none !important;
	color: black;
	font-size: 13px;
	border: none;
	text-decoration: underline;
}
.eshop .cartopt label {
	background:none !important;
}

.gotocheckout, .rtnshopping {
	background: green;
	padding: 8px !important;
	border: #777 1px solid;
	border-radius: 5px;
}
.gotocheckout a, .rtnshopping a {
	color: #fff;
	text-decoration: none;
}

.single-albums #content {
	width: 574px;
}
.single-albums .entry-content img {
	max-width: 20%;
}
.single-albums .entry-content {
	position:relative;
}
.single-albums form.eshop {
	position:absolute;
	top:0;
	right:0;
	width:42%;
	margin-top: 22px;
	margin-right: -24px;
}
.album-specs {
	width:68%;
}
.single-albums .eshop input[type="submit"] {
	float: right;
	margin: 16px;
}
.single-albums form.eshop label {
	position: absolute;
	top: 0;
	right: 0;
}

.shop-box img {
	max-width:75px;
}



/*--------------- FANCYBOX STYLES -----------------*/

tr {
	border:none;
}







/*--------------- ESHOP STYLES -----------------*/


#eshoptestmode, form.eshop label.qty, form.eshop input.iqty, form.eshop legend, form.eshop span.sgloptiondetails {
	display:none !important;
}
form.addtocart {
	clear:none !important;
}
.addtocart {
	padding:0 !important;
}
.eshop fieldset {
	background:none!important;
}
.eshopbutton {
	font-size:12px;
}
.price {
	display:inline;
	color:#F00;
}
li.eshop-widget {
	margin-bottom:25px;
	border-bottom:#ccc 1px solid;
}
a.cartlink {
	margin-top:5px;
	display:inline-block;
}
p.eshopwidget {
	background: url(images/cart-big.png) right 17px no-repeat;
}
.custdetails form.eshop legend {
	display:inherit !important;
}
.eshop input[type="submit"] {
	border: none !important;
	padding: 5px 10px;
	border-radius: 20px !important;
	font-family: sans-serif;
}
.eshop input[type="submit"] {
	font-family:FontAwesome;
}
.eshop input.button:hover {
	opacity:.8;
}


/*--------------- J PLAYER STYLES -----------------*/

.popout-wrap-mjp {
	margin-top: 4px;
	font-family: FontAwesome, sans-serif;
	font-size: 12px;
	opacity: .8;
	margin-bottom:32px;
}
.popout-image-mjp {
	display:none;
}
.popout-text-mjp {
	padding: 0 10px 0 10px !important;
}








/*--------------- CROSS BROWSER TWEAKS -----------------*/


.ie7 #header-widget-right {
	top:230px;
}
.ie7 #blog-title, .ie8 #blog-title, .ie7 #blog-description, .ie8 #blog-description, .ie7 #endore, .ie7 #access, .ie8 #endore, .ie8 #access {
	background:url(images/alpha.png);
}


/*------------------- HEADER ANIMATIONS --------------------*/

#header {
    -webkit-animation-name: bounce-background;
    -webkit-animation-timing-function: ease-out;
    -webkit-animation-duration: 15s;
    -webkit-animation-iteration-count: 1;
    -moz-animation-name: bounce-background;
    -moz-animation-timing-function: ease-out;
    -moz-animation-duration: 15s;
    -moz-animation-iteration-count: 1;
    animation-name: bounce-background;
    animation-timing-function: ease-out;
    animation-duration: 15s;
    animation-iteration-count: 1;
}
@-webkit-keyframes bounce-background {
    0% {
        background-position: bottom;
    }
    /*50% {
        background-position: top;
    }*/
    100% {
        background-position: top;
    }
}
@-moz-keyframes bounce-background {
    0% {
        background-position: bottom;
    }
    /*50% {
        background-position: top;
    }*/
    100% {
        background-position: top;
    }
}
@keyframes bounce-background {
    0% {
        background-position: bottom;
    }
    /*50% {
        background-position: top;
    }*/
    100% {
        background-position: top;
    }
}








/*--------------- RESPONSIVE STYLES -----------------*/

@media screen and (max-width: 960px) { 

body {
	min-width:100%;
}
#topbar, #branding, #access, .menu, #main, .page-id-20 #content {
	width:100%;
}
#blog-title, #blog-description {
	float:none;
	padding-right:0;
	width:auto;
	text-align:center;
}
#container {
	width:68%;
}
#content {
	width:90%;
	margin:0 auto;
}
.main-aside {
	width:29%;
}
#siteinfo {
	width:auto;
	padding: 22px 15px 44px 15px;
}

}

@media screen and (max-width: 780px) { 

#header-widget-right {
	top:130px;
	right:auto;
}
#container {
	width:auto;
	float:none;
}
.main-aside {
	right:0;
	width:auto;
	float:none;
}
.menu {
	text-align:center;
}
.jquery-responsive-select-menu {
	margin-top:7px;
}

}

@media screen and (max-width: 430px) { 

#endorse {
	top:90px;
	left:auto;
	right:15px;
}
#header-widget-right {
	top:225px;
	right:15px;
}

}
