/*   
Theme Name: PiE&MASH
Theme URI: pieandmashlondon.co.uk
Description: the main css for PiE
Author: Jon Mark Deane
Author URI: enemyradar.net
.
All Rights Reserved.
.
*/
* { zoom: 1.0; padding: 0; margin: 0; list-style: none; }
html, body { height:100%; }
body { font: 12px Georgia, serif; color: #FFF; background: #FFF url(images/hide.png); position: relative; }
p { margin-bottom: 10px; }
a { color: #FFF; border: 0; }
img { border: 0; }
p.last { margin-bottom: 0px; }
a:hover { color: #F00; }
a:visited { color: #FFF; }
.block{ display: block; }
.hidden{ display: none; }
.boxy { width: 245px; float: right; display: inline; }
.biggy { }
.clear { clear: both; width: 100%; height: 0px; }
.endcap { height: 10px; margin-right: -10px; margin-left: -10px; background: #666; clear: both; }
.horizontalhead { height: 18px; width: 191px; text-indent: -3000px; padding-bottom: 9px; }
.verticalhead { width: 30px; height: 250px; float: left; display: inline; overflow: hidden; margin: 0px 10px 0px 0px; padding: 0px; text-indent: -2000px; }
.rounded { padding-top: 10px; padding-right: 10px; padding-left: 10px; }
.date { font-size: 9px; font-weight: normal; }
/*PaRappa*/
#ultimatewrapper { width: 880px; background: url(images/wrapper_bg.png) no-repeat; margin-right: auto; margin-left: auto; padding: 35px 60px; }
#wrapper { width: 880px; }
/*Giving Head*/
#header { width: 250px; margin-right: 5px; float: left; display: inline; }
#logo { height: 620px; width: 250px; background: url(images/main_logo.png); text-indent: -2000px; }
#follow { background: url(images/social_bg.png); margin-top: 10px; }
#followhead { background: url(images/header_followus.png) no-repeat; }
ul#followoptions { display: inline; }
ul#followoptions li { float: left; height: 50px; width: 50px; margin-right: 10px; }
ul#followoptions li a { float: left; height: 50px; width: 50px; display: inline; text-indent: -3000px;}
ul#followoptions li.last { margin-right: 0px; }
ul#followoptions li a.facebook { background-image: url(images/facebook.png); }
ul#followoptions li a.twitter { background-image: url(images/twitter.png); }
ul#followoptions li a.flickricon { background-image: url(images/flickr.png); }
ul#followoptions li a.rss { background-image: url(images/rss.png); }
#followendcap { height: 10px; background: url(images/social_bg.png) bottom; }
#mailing { background: url(images/mailing_bg.png); margin-top: 10px; }
#mailinghead { background: url(images/header_mailing.png) no-repeat; }
#listForm { overflow: hidden; }
#mailing input.text { height: 24px; width: 224px; background: url(images/formbg.png) no-repeat; border-style: none; color: #87894B; padding: 3px; font: bold 14px Georgia, serif; margin-bottom: 10px; }
#header #mailing form input.button { background: url(images/mailingformbutton.png) no-repeat; height: 20px; width: 110px; color: #FFF; border-style: none; margin-right: 10px; display: block; float: left; white-space: nowrap; overflow: hidden; cursor: pointer; }
#header #mailing form input.button.last { margin-right: 0px; }
#mailingendcap { background: url(images/mailing_bg.png) bottom; height: 10px; }
#headerbottom { height: 200px; width: 250px; background: url(images/headerend.png) no-repeat; margin-top: 10px; }
#contentwrapper { width: 620px; margin-left: 5px; float: right; display: inline; margin-bottom: 10px; overflow: hidden; }
/*Where it's at, yo*/
#topboxes { background: url(images/topboxes_bg.png); }
#infobox { float: left; display: inline; width: 285px; margin-right: 5px; font-size: 14px; overflow: hidden; }
#infohead { background: url(images/header_info.png) no-repeat; }
#mapbox { float: right; display: inline; width: 285px; margin-left: 5px; font-size: 12px; text-align: center; }
#maphead { background: url(images/header_map.png) no-repeat; }
#mapbox iframe { padding: 2px; background: #FFF; }
#mapbox p { margin-top: 10px; }
#topboxesendcap { clear: both; background: url(images/topboxes_bg.png) bottom; height: 10px; margin-bottom: 10px; }
/*THIS IS THE NEWS, HAPPY NOW?*/
#comingup { clear: both; float: left; display: inline; width: 600px; background: url(images/main_bg.png); }
#cominguptext { width: 360px; float: left; display: inline; padding-right: 5px; }
#mainside { width: 180px; float: right; display: inline; }
#cominguphead { background: url(images/header_comingup.png) no-repeat; height: 300px; }
#cominguptext h3 { font-weight: bold; font-size: 15px; }
#cominguptext h3.flyerdate { margin-bottom: 10px; }
#flyerbox { background: #FFF; padding: 2px; text-align: center; margin-bottom: 10px; width: 180px; height: 270px; overflow: hidden; }
#flyerthumb { width: 180px; border: none; }
#flyerbox a, #flyerbox a:visited { color: #000; border: none; }
#spotify { background: url(images/spotify_bg.png) no-repeat; height: 150px; width: 159px; margin: 2px; position: relative; padding: 10px; }
#spotifyhead { background: url(images/header_spotify.png) no-repeat; display: block; width: 140px; overflow: hidden; height: 20px; }
#spotify h2 { padding-bottom: 5px; margin-bottom: 0px; }
#spotify p { }
#comingupendcap { height: 10px; background: url(images/main_bg.png) bottom; clear: both; margin-bottom: 10px; }
/*Ah, those were the days*/
#bottomboxes { background: url(images/bottomboxes_bg.png); }
#flickrbox { width: 285px; float: left; margin-right: 5px; display: inline; overflow: hidden; position: relative; }
#flickrbox ul { display: block; float: right; margin: 0; padding: 0;}
#flickrhead { background: url(images/header_flickr.png) no-repeat; }
#flickrbox a img { display: inline; float:left; margin:0 0px 2px 2px; border: 2px solid #033; width:75px; height:75px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
#flickrbox .flickr { margin: 0; padding: 0; float: right; width: 245px; height: 245px; overflow: hidden; display: inline; }
#playlistsbox { width: 285px; margin-left: 5px; float: right; overflow: hidden; display: inline; }
#playlistshead { background: url(images/header_playlists.png) no-repeat; overflow: hidden; }
#bottomboxesendcap { height: 10px; background: url(images/bottomboxes_bg.png) bottom; }
/*Arse Bung*/
#footer { width: 860px; height: 30px; clear: both; background: url(images/copy_bg.png) no-repeat; padding: 10px; text-align: center; }
#footer p { margin: 0px; }
/*Scrollywollylollyplaylists*/
.jcarousel-container { position: relative; }
.jcarousel-clip { z-index: 2; padding: 0; margin: 0; position: relative; overflow: hidden; }
.jcarousel-list { z-index: 1; overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0; }
.jcarousel-list li, .jcarousel-item { float: left; display: inline; list-style: none; /* We set the width/height explicitly. No width/height causes infinite loops. */ width: 245px; height: 25px; padding: 0px; font-weight: bold; }
.jcarousel-next { z-index: 3; display: none; }
.jcarousel-prev { z-index: 3; display: none; }
.jcarousel-skin-pie .jcarousel-container { }
.jcarousel-skin-pie .jcarousel-container-vertical { width: 245px; height: 200px; padding-top: 25px; padding-bottom: 25px; }
.jcarousel-skin-pie .jcarousel-clip-vertical { width: 245px; height: 200px; }
.jcarousel-skin-pie .jcarousel-item { width: 245px; height: 26px; background: #366; -moz-border-radius: 5px; -webkit-border-radius: 5px; overflow: hidden; position: relative; }
.jcarousel-skin-pie .jcarousel-item-vertical { margin-bottom: 4px; }
.jcarousel-skin-pie .jcarousel-item a { text-decoration: none; }
.jcarousel-skin-pie .jcarousel-item a span.truncate { display: block; z-index: 10; position: absolute; left: 5px; top: 5px; }
.jcarousel-skin-pie .jcarousel-item a span.date { display: block; right: 0px; top: -5px; z-index: 9; color: #033; font-size: 25px; position: absolute; font-weight: bold; }
.jcarousel-skin-pie .jcarousel-item-placeholder { background: #fff; color: #000; }
.jcarousel-skin-pie .jcarousel-next-vertical { position: absolute; bottom: 0px; left: 0px; width: 245px; height: 20px; cursor: pointer; background: transparent url(images/nextsprite.png) no-repeat 0 0; }
.jcarousel-skin-pie .jcarousel-next-vertical:hover { background-position: 0 -20px; }
.jcarousel-skin-pie .jcarousel-next-vertical:active {  }
.jcarousel-skin-pie .jcarousel-next-disabled-vertical, .jcarousel-skin-pie .jcarousel-next-disabled-vertical:hover, .jcarousel-skin-pie .jcarousel-next-disabled-vertical:active { cursor: default; background-position: 0 -40px; }
.jcarousel-skin-pie .jcarousel-prev-vertical { position: absolute; top: 0px; left: 0px; width: 245px; height: 20px; cursor: pointer; background: transparent url(images/prevsprite.png) no-repeat 0 0; }
.jcarousel-skin-pie .jcarousel-prev-vertical:hover { background-position: 0 -20px; }
.jcarousel-skin-pie .jcarousel-prev-vertical:active { }
.jcarousel-skin-pie .jcarousel-prev-disabled-vertical, .jcarousel-skin-pie .jcarousel-prev-disabled-vertical:hover, .jcarousel-skin-pie .jcarousel-prev-disabled-vertical:active { cursor: default; background-position: 0 -40px; }
/*CeeBox*/
#cee_closeBtn { background-image: url(images/cee-close-btn.png); }
#cee_next { background-image: url(images/cee-next-btn.png); }
#cee_prev { background-image: url(images/cee-prev-btn.png); }
* html #cee_next { background-image: url(images/cee-next-btn.gif); } /* IE6 hack */
* html #cee_prev { background-image: url(images/cee-prev-btn.gif); } /* IE6 hack */
#cee_load { background-image: url(images/loader.gif); }
/* ceebox border width controled as option in jquery.ceebox.js */
/* colors for ceebox background and border can also be set as option in jquery.ceebox.js  */
#cee_box { background-color: #fff; border-color:#525252; border-style: solid; -moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; }
/* ceebox specific link and font settings */
#cee_box { font: 12px Arial, Helvetica, sans-serif; color: #333333; background-color: #fff; }
#cee_count { font: 10px Arial, Helvetica, sans-serif; -moz-opacity: 0.8; opacity: 0.8;/* opacity used to reduce contrast of font color so that any main color will work */ clear:left; float:left; padding: 2px 0 4px; }
.cee_html #cee_title h2 { float:left; display: inline; }
.cee_html #cee_count { clear:none; padding-left:5px; }
* html #cee_count { /* ie6 hack */ zoom:1; padding-bottom:6px; }
#cee_next, #cee_prev { height:100%; width: 49%; text-indent:-10000px; text-decoration:none; visibility:visible; background-repeat:no-repeat; }
#cee_box a { border:0; outline:none }
#cee_box a:link { color: #666; }
#cee_box a:visited { color: #666; }
#cee_box a:hover { color: #000; }
#cee_box a:active { color: #666; }
#cee_box a:focus { color: #666; }
#cee_closeBtn { background-repeat: no-repeat; display:box; width:24px; height:23px; position:absolute; text-indent:-10000px; }
/* Next up a bunch of ugly ass css hacks to fix the fact that IE cuts off the close button when it floats negative. 
Yeah "thou shalt not hack the css" ...so sue me it's better than handling it in the javascript */ 
#cee_closeBtn { top:-3px; right:-3px; } /* base value only here for IE8 */
#cee_closeBtn, #ie8#hack { top:-10px; right:-10px; } /* All browsers except IE8 see this; IE8 keeps using the */
*:first-child+html #cee_closeBtn { top:-3px; right:-3px; } /* only IE7 sees this*/
* html #cee_closeBtn { top:-3px; right:-3px; } /*only IE 6 sees this*/
#cee_closeBtn:hover { background-position: 0px -23px; }
.cee_close { cursor:pointer }
/* ceebox settings */
#cee_box { text-align:left; color:#000; }
#cee_box img#cee_img, #cee_vid, #cee_iframeContent, #cee_ajax { display:block; margin: 15px 15px 0; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; border-top: 1px solid #666; border-left: 1px solid #666; }
#cee_title { padding:7px 15px 5px 15px; overflow:hidden; }
.cee_html #cee_title { background-color:#e8e8e8; height:18px; -moz-border-radius: 7px 7px 0 0; -webkit-border-radius: 7px 7px 0 0; border-radius: 7px 7px 0 0; }
#cee_title h2 { font-size:1em; font-weight:400; margin:0 0 1px; }
#cee_ajax { clear:both; padding:2px 15px 15px 15px; overflow:auto; text-align:left; line-height:1.4em; background: url(images/popup_bg.png); }
#cee_load { display:none; height:50px; width:50px; margin: -25px 0 0 -25px; /* -height/2 0 0 -width/2 */ background-position: center center; background-repeat:no-repeat; }
#cee_HideSelect { z-index:99; position:fixed; top: 0; left: 0; background-color:#fff; border:none; filter:alpha(opacity=0); -moz-opacity: 0; opacity: 0; height:100%; width:100%; }
* html #cee_HideSelect { /* ie6 hack */ position: absolute;  height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#cee_iframe { clear:both; border:none; margin-bottom:-1px; margin-top:1px; }
/*PLLLLaaaaaayyylist*/
.playpopupdiv { padding: 10px; font-family: Georgia, serif; color: #FFF; }
.playpopupdiv h2 { margin-bottom: 10px; line-height: 30px; }
.playpopupdiv ul { list-style: disc outside; margin-bottom: 10px; padding-left: 20px; }
.playpopupdiv li { list-style: disc outside; }