/*  
Theme Name: Mujuworld v2
Theme URI: http://www.mujuworld.co.uk/
Description: Custom styles for Mujuworld - version 2.
Version: 1.0
Author: Paul Burgess
Author URI: http://iampaulburgess.co.uk/
*/

/* ----------  Reset */
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td { margin:0; padding:0;}
/* ------------------------------ */

/* Links */

a img{border: 1px solid #CCC;padding:2px;margin:3px;}
a:hover img{border: 2px solid #EF9152;padding:1px;}
a:hover{color: #EF9152;border: 2px ;}
 /* Dummy definition to overcome IE bug */

.shop a img{border:0;padding:0;margin:0;}
.shop a:hover img{border:0;padding:0;}
.shop a:hover{color:inherit;border:0;}
.shop .product a:hover img {opacity: 0.8}


a { color:#3a2200;text-decoration:underline}
a:hover { color:#57B6CC;text-decoration:underline}



div.post h2 a:link { color:#666;text-decoration:none}
div.post h2 a:visited { color:#666;text-decoration:none}
div.post h2 a:hover { color:#57B6CC;text-decoration:none}
div.post h2 a:active { color:#666;text-decoration:none}

#shopcats {margin:10px 0 4px 0;padding-bottom:15px;}
#shopcats a {padding:4px 5px 4px 4px;position:relative;}
#shopcats a:link {color:#333;background-color:transparent}
#shopcats a:visited {color:#333;background-color:transparent}
#shopcats a:hover {color:#FFF;background-color:#57B6CC}
#shopcats a:active {color:#333;background-color:transparent}

/* ------------ General layout */

body{
	background: #CCC;
	text-align: center;
	overflow:hidden;
height:100%;width:100%;
}

#bg {
	position:absolute;
	z-index: -1;
}

#body {position:absolute;
	z-index: 5;			
	overflow:auto; 			
	height:100%;width:100%;	
}

#wrapper {width:960px;margin:0 auto;text-align: left;
background: #FFF;
background: rgba(255,255,255,0.8)}

#header h1 {text-align: center;margin-top:0;}
#header h1 a {
background: url(gfx/v3-logo.png);
 display: block;
 width:241px;
 padding-top: 296px; height: 0 !important;
 height /**/: 296px; overflow: hidden;
 text-indent: -9999px;
 margin:0 auto;
}

#side {width:255px;float:left;padding-left:25px}

#sidebar{margin-bottom:30px;}
#sidebar ul {list-style:none}
#sidebar h2 {font-size:1.4em;}

#sidebar select {display: none}

#content {width:520px;float:left;}
p {line-height:160%;font-size:1.2em}
li {line-height:160%;font-size:1.1em}
p.postmetadata {border-top:1px #CCC dashed;margin-top:10px;padding-top:5px;}

p {margin:5px 0 15px 0;color:#333}

/* -------------- Typography */
body {
font-family:"Lucida Grande", Lucida, Arial, Verdana, sans-serif;
font-size: 62.5%;
} /* 1em = 12 pixels */


h1, h2, h3, h4, h5, h6 {
font-family: "Helvetica", "Century Gothic", "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, sans-serif;
letter-spacing: -1px;
margin: 4px 0 4px 0;
padding: 4px 0 4px 0;
color: #666;
}

h1 {font-size:2.8em}
h2 {font-size:2.6em}
h3 {font-size:2.2em}
h4 {font-size:1.8em}

/* ---------- NAV ---------- */

ul#nav 	{
width: 142px;
height: 188px;
position: relative;
margin-top:40px;
margin-left:0;
padding-bottom:130px;
background: url(gfx/v3-nav-bg.png) center bottom no-repeat;
}

ul#nav li {margin: 0;padding: 0;list-style: none;
position:absolute;}
ul#nav li, ul#nav a	{
height: 35px;
display: block;
}

ul#nav li a {
text-indent: -9999px; 
text-decoration: none;
width: 140px;
background-image: url(gfx/v3-nav.png);
background-repeat:  no-repeat;
-webkit-transition: all 0.15s ease;
-moz-transition: all 0.15s ease;
-o-transition: all 0.15s ease;
transition: all 0.15s ease;

}

#nav1 {top: 0px;}
#nav2 {top: 40px;}
#nav3 {top: 80px;}
#nav4 {top: 120px;}
#nav5 {top: 158px;}

#nav1 a{background-position: 0 0}
#nav2 a{background-position: 0 -40px}
#nav3 a{background-position: 0 -80px}
#nav4 a{background-position: 0 -120px}
#nav5 a{background-position: 0 -158px}



ul#nav li a:hover {position: relative;top:1px;opacity: 0.6}

/*
#nav1 a:hover, body#wallpaper a#wallpapernav {background: transparent url(/wp-content/themes/muju/gfx/nav.png) -80px -0px no-repeat;}
#nav2 a:hover, body#gallery a#gallerynav {background: transparent url(/wp-content/themes/muju/gfx/nav.png) -80px -26px no-repeat;}
#nav3 a:hover, body#music a#musicnav {background: transparent url(/wp-content/themes/muju/gfx/nav.png) -80px -52px no-repeat;}
#nav4 a:hover, body#videos a#videosnav {background: transparent url(/wp-content/themes/muju/gfx/nav.png) -80px -77px no-repeat;}
#nav5 a:hover, body#boards a#boardsnav {background: transparent url(/wp-content/themes/muju/gfx/nav.png) -80px -102px no-repeat;}
*/




/* ------- PAGE NAV */

p.nav a:link, div.wp-pagenavi a:link, .pagenav a:link, a.glow:link { color:#333; text-decoration:none; background:#EEE;padding:4px 6px 4px 6px;}
p.nav a:visited, div.wp-pagenavi a:visited, .pagenav a:visited, a.glow:visited { color:#333; text-decoration:none; background:#EEE;padding:4px 6px 4px 6px;}
p.nav a:hover, div.wp-pagenavi a:hover, .pagenav a:hover, a.glow:hover  { color:#FFF; text-decoration:none; background:#57B6CC;padding:4px 6px 4px 6px;}
p.nav a:active, div.wp-pagenavi a:active, .pagenav a:active, a.glow:active  { color:#333; text-decoration:none; background:#EEE;padding:4px 6px 4px 6px;}

div.pagenav {
padding:15px 0 5px 0;
margin:5px 0 5px 0;
}


div.pagenav p {line-height:260%}

div.pagenav p.note {
margin-top:10px;line-height:100%
}

div.navigation {margin-bottom:5px;padding-bottom:25px;}
/* END NAV */


/* ---------- GALLERY ---------- */

div.gallery #col1 {width:270px;float:left;border-right:1px #CCC solid;padding-right:10px;margin-bottom:20px}
div.gallery #col2 {width:250px;margin-left:275px;padding-left:25px;}
div.gallery h2 {font-size:2.0em}

h3 span{color:#960}

.setlist h3 {margin:0;padding:0;font-size:1.4em}
.setlist img {margin-right:8px;position:relative;bottom:4px;}
div.set {
float:left;	
	padding: 8px 8px 10px 8px;margin: 8px 0 2px 5px;
	background-color:#EEE;
	border-top:1px #CCC solid;
	width:99%;
}

.setlist div.set img {float:left}
p.setTitle {text-align:left;margin-bottom:8px}

#context {text-align:center;width:185px;padding:15px 0 25px 0;margin:10px 0 10px 0;border-top:1px #CCC dashed;border-bottom:1px #CCC dashed;}
#photo p {	line-height:150%;font-size:0.8em;}
img.noimg{padding:4px}

#context p.nav {margin-bottom:15px;margin-top:10px}

div#photo p {font-size:1.2em}

/* ---------- */

/* --------- Shop */

/* Shop */
.shoplist {padding:10px;width:98%;float:left;border-bottom:1px #CCC dashed;margin-bottom:12px}
.shoplist img {float:right;}
.shoptext h3 {margin:0 0 15px 0;padding:0;font-size:2.0em;}	
.shoptext p {margin:0;}
.shoptext {float:left;width:320px;}
.shoplist p.price a {font-weight:normal}

p.view {margin-top:12px}


/* --- */

#footer {
clear:both;
border-top:1px #CCC solid;
padding:20px;
margin-top:15px;
}

#footer ul {list-style: none;margin-bottom: 40px}
#footer ul li {float: left;margin-right:10px}
#footer ul li a {display: block;padding:6px;background:#EEE;color:#666;text-decoration: none}
#footer ul li a:hover {background:#CCC;color:#333}

/* ---------- MISC */

.post {margin-bottom:50px}

.clear {clear:both}

.icon{
list-style:none;
background-repeat: no-repeat;
background-position: left center;
padding:6px 5px 6px 20px;
}

.flickr{background-image: url(/gfx/icon_flickr.png);}
.large {background-image: url(/gfx/icon_big.gif);}

p#me {color:#999;margin-top:25px;}
p#me a {text-decoration:none;color:#666}

.red {color:#C00}

.right, .alignright{float:right}
.left, .alignleft{float:left}


.social {margin:10px 0 20px 0}
.social li {float:left;}
.social li a {display: block;text-indent:-9999px;background-image:url(gfx/v3-social.png);background-repeat: no-repeat;height:32px;width:32px;margin-right:5px}
.social li a.twitter {background-position: 0 0}
.social li a.facebook {background-position: -37px 0}
.social li a.etsy {background-position: -112px 0}
.social li a.tumblr {background-position:-75px 0 }

.social li a:hover {position: relative;top:1px;opacity: 0.6}

.stamp {color:#999;text-decoration: none;font-size:10px}
.stamp span {color:#666}
.stamp:hover {color:#57B6CC;text-decoration: none}


.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.hidden { display: none; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


/* Shop */
.shop #content {width:715px}
.shop #side {width:195px}

#product-details {
float: left;
width: 160px;
margin-left: 15px;
}

.col {float: left;}
#col1 {width:560px}
#col2 {width:145px;}

#products .product-a h3, #products .product-a p {
color:#666;
}

.categories-list {list-style: none}
.categories-list li {font-size:12px;border-bottom:1px #CCC dotted}
.categories-list li a {display: block;padding:5px;text-decoration: none;}
.categories-list li a:hover {background: #EEE;color:#333}

#cart {margin-bottom:35px}
#cart h3 {font-size: 14px}
#cart ul {list-style: none;margin-bottom:15px}
#cart li {float: left;font-size:12px}
#cart li a {display: block;padding:4px;background:#EEE;color:#666;text-decoration: none}
#cart li a:first-child {margin-right:8px}
#cart li a:hover {background:#CCC;color:#333}

.cart-items li {color:#666;font-size:12px}
.cart-items li:first-child {margin-right:8px}

#products {background: none}

#product-images .images-nav {
height:auto;
}


.product a .product-price span {font-size:12px}
.product a:hover .product-price span {color:#333 !important;}

#product-images .images-prev a,
#product-images .images-next a,
.images-list li a {
display: block;
background: #EEE;
color:#666;
font-size:12px;
padding:5px;
width:auto;
height: auto;
text-decoration: none;
}

.images-list li a {display: inline-block;padding:3px 6px}

#product-images {margin-top:20px;margin-right:20px}
#product-images .images-prev a:hover,
#product-images .images-next a:hover,
.images-list li a:hover {
background: #CCC;
color:#333;
}

#product-images .images-list li {border-left:0}

#products .product-a {text-decoration:none}

#product-addtocart,
#cart-footer .checkout-btn {
clear: both;
display: block;
margin-top: 15px;
border: none;
background: #666;
color:#FFF;
cursor: pointer;
padding:6px;
}

#product-addtocart:hover,
#cart-footer .checkout-btn:hover {
background:#111;
}

.cart tr {font-size:12px} 
.cart tr a {text-decoration: none}
