/*=====================================================================
 *
 * Filename: main.css
 * Website: www.craigschuftan.com
 * Author: Steven Watts - Paste
 * Date Created: 19/10/2010
 * Media: Screen
 *
 * Description
 * -----------
 * Colours:
 * Background 		- #xxxxxx
 * Text				- #1b120e 
 * Color1 (yellow)	- #e3c000
 * Color2 (red) 	- #ed2727
 * Color3 (blue)	- #009ac1
 * Grey1 			- #333 
 * Grey2			- #555  
 * Grey3			- #666
 *
 *=====================================================================*/ 

/* Layout styles
    
	index -> 	
				CSS reset
				default styles
				containers
				
				
*/



/* =css reset     
--------------------- */  
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; }
body { line-height:1; }
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { }
nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after, q:before, q:after {  content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
/* change colours to suit your needs */
ins { background-color:#ff9; color:#000; text-decoration:none; }
/* change colours to suit your needs */
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted inherit; cursor:help; }
table { border-collapse:collapse; border-spacing:0; }
/* change border colour to suit your needs */
hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }
textarea {color:#000; font:normal normal normal 12px/18px; }
/* =default styles
----------------- */

body {font: normal normal normal 11px/17px Helvetica, Arial, Sans-Serif;}  

a { text-decoration:none; color:#797979; background:transparent url('../images/dottedLine.gif') 0 bottom repeat-x;}
a:hover { color:#009ac1; background:transparent url('../images/dottedLineUp.gif') 0 bottom repeat-x; }   

h1 { font: normal normal 600 36px/33px Helvetica, Arial, Sans-Serif; text-transform:uppercase; letter-spacing:-0.05em; color:#fff; padding:0 0 14px 0; margin:0;}
header h1 { float:right; width:860px; height:54px; background:#fff url('../images/sprite.png') 0 0 no-repeat; text-indent:-9999px; margin-left:100px;}
h2 { color:#1b120e; font:bold normal normal 20px/20px helvetica, arial, sans-serif; padding-bottom:16px; } 
h3 { color:#1b120e; font:bold normal normal 20px/20px helvetica, arial, sans-serif; padding-bottom:16px; }
h4 { }
p { display:block; font: normal normal normal 11px/17px Helvetica, Arial, Sans-Serif; margin-bottom:11px; color:#1b120e; }
p a { color:#797979; background:transparent url('../images/dottedLine.gif') 0 bottom repeat-x; }  
p a:hover { color:#009ac1; background:transparent url('../images/dottedLineUp.gif') 0 bottom repeat-x;}

body .wysiwyg ul { padding:0 0 12px 12px;}
body .wysiwyg ul li { background:transparent url('../images/arrow.gif') 0 2px no-repeat; padding:0 0 12px 12px; }
.uppercase { text-transform:uppercase; }
.hidden {display:none;}

/* =layout
----------------- */ 
#mainWrap { width:980px; margin:0 auto; padding:50px 0; overflow:hidden; } 
aside { float:left; width:120px; color:#1b120e; text-align:right; } 
aside a, aside a:hover { background-image:none;}
aside .subnav .category { font: normal normal bold 12px/15px Helvetica, Arial, Sans-serif; letter-spacing:-0.8px; color:#1b120e; display:block; padding:20px 0 4px 0; }  
aside ul { display:block; padding-bottom:0px;}
aside .subnav ul li { display:block; padding-bottom:5px; font: normal normal bold 12px/14px Helvetica, Arial, Sans-serif; letter-spacing:-0.9px; color:#797979; } 
aside .subnav ul li a { color:#797979; }  
aside .subnav ul li a:hover { color:#000; }   
nav { font: normal normal bold 18px/20px Helvetica, Arial, Sans-Serif; letter-spacing:-1px; color:#1b120e; padding-bottom:20px; } 
nav a { color:#5e5e5e; background-image:none;} 
nav { font: normal normal bold 18px/20px Helvetica, Arial, Sans-Serif; letter-spacing:-0.8px; color:#1b120e; } 
nav a:hover { color:#000; }
nav li.mailingList a {background-image:none;}
nav li.mailingList a:hover, nav li.mailingList a.current {}

#grid { float:left; width: 860px; }
#pageGrid{float:left; width: 860px;}

/* =list
--------*/
#List { }
body #mailingList { width:225px; font: normal normal normal 11px/17px helvetica, arial, sans-serif; background: #ed2727; padding: 20px; }/* overlay box*/  
body #mailingList h3 { color:#fff; font:28px/26px; text-transform: uppercase; letter-spacing: 0.18em; margin-bottom: 2px; }
body #mailingList p { color:#fff;}
#mailingList input { width: 200px; margin-bottom: 10px; display: block; border: none; height: 22px; background-color: #fff; color: #707070; padding: 0px 10px 0px 15px; }
#mailingList select.select { width: 200px; margin-bottom: 10px; display: block; background-color: #363636; color: #fff; border: none; height: 25px; padding: 3px 1px 3px 15px; }
body #mailingList .btn, .pp_close { display:block; overflow:hidden; width:100px; height:22px; margin-top: 22px; background: #e3c000; -moz-border-radius:15px 15px 15px 15px; border-radius:15px 15px 15px 15px; color:#fff; font: normal normal normal 11px/22px helvetica, arial, sans-serif; text-align:center; text-transform:uppercase; cursor:pointer; }                                                                                                                
#mailingList .btn:focus, #mailingList .btn:hover { background: #000; }
#mailingList label { display: none; }
.mc_embed_close { display: none; }
#mc-embedded-subscribe-form { margin-top: 20px; }

/* =lightBox 
------------------ */     

.pp_pic_holder { display:none; position:absolute; z-index:10000;}
.pp_pic_holder .pp_top {}
.pp_pic_holder .pp_top .pp_left {display:none;}
.pp_pic_holder .pp_top .pp_middle {display:none;}
.pp_pic_holder .pp_top .pp_right { }
.pp_pic_holder .pp_content_container {}
.pp_pic_holder .pp_content_container .pp_left {}
.pp_pic_holder .pp_content_container .pp_left .pp_right {}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content {}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade {}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade a.pp_expand {display: none !important;}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_details {}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_details .pp_close { overflow: hidden; float: right; position:absolute; }
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_details .pp_close:hover { background: #000; }
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_details .pp_description {}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_details .pp_nav {}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_details .pp_nav .pp_arrow_previous {}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_details .pp_nav .currentTextHolder {}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_details .pp_nav .pp_arrow_next {}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_hoverContainer {}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_hoverContainer .pp_next{}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_hoverContainer .pp_previous{}
.pp_pic_holder .pp_content_container .pp_left .pp_right .pp_content .pp_fade .pp_full_res {}
.pp_pic_holder .pp_bottom {}
.pp_pic_holder .pp_bottom .pp_left {}
.pp_pic_holder .pp_bottom .pp_middle {}
.pp_pic_holder .pp_bottom .pp_right{}
.ppt { color:#fff; display:none !important; font-size:17px; left:0; position:absolute; top:0; z-index:9999;} 
.pp_overlay {width:100%; display:none; position:absolute; left:0; top:0; z-index:9500; background:#009ac1 url() 0 0 repeat scroll; opacity: 0.7 !important; }

/* =homepage summaries
------------------------ */
#grid div.item.color1 { background-color:#e3c000;}
#grid div.item.color2 { background-color:#ed2727;}
#grid div.item.color3 { background-color:#009ac1;}
#grid div.item.color1:hover { background-color:#333;} 
#grid div.item.color2:hover { background-color:#555;}  
#grid div.item.color3:hover { background-color:#666;}
#grid div.item.color1 .time { background:transparent url('../images/sprite.png') 0 -70px no-repeat; }
#grid div.item.color2 .time { background:transparent url('../images/sprite.png') -76px -70px no-repeat; }
#grid div.item.color3 .time { background:transparent url('../images/sprite.png') -154px -70px no-repeat; }
#grid div.item:hover .time { background:transparent url('../images/sprite.png') -232px -70px no-repeat; }

/* =other summaries
------------------------ */
div.item {display:block; position:relative; z-index:50; width:200px; margin:0 0 15px 15px; padding:0; overflow: hidden; top:1000px; left: 1000px; }
div.itemDouble { width:415px; height:339px; }
div.item a { display:block; width:200px; background-image:none;}
div.item h1 a {float:left; padding:14px 14px 8px 14px; margin-bottom:0; width: 172px; color:#fff; }
div.item p { padding:0 14px 10px 14px; margin-bottom:0; color:#fff; }     
div.item p.cats {} 
div.item img { float:left; }
div.item .time{ font: normal normal normal 11px/16px Helvetica, Arial, Sans-Serif; color:#fff;}
div.item .time { display:block; position:absolute; z-index:100; top:70px; left:0; width:65px; height:48px; padding:32px 0 0 5px; }
div.item .time { background:transparent url('../images/sprite.png') -232px -70px no-repeat; }
div.item.color1:hover .time  { background:transparent url('../images/sprite.png') 0 -70px no-repeat; }
div.item.color2:hover .time  { background:transparent url('../images/sprite.png') -76px -70px no-repeat; }
div.item.color3:hover .time  { background:transparent url('../images/sprite.png') -154px -70px no-repeat; }
div.item.color1  { background-color:#333;}
div.item.color2  { background-color:#555;}
div.item.color3  { background-color:#666;}
div.item.color1:hover { background-color:#e3c000;} 
div.item.color2:hover { background-color:#ed2727;}  
div.item.color3:hover { background-color:#009ac1;} 
     
body #loading { position: fixed; bottom: 100px; right:20px; bottom:36px; z-index: 100; padding:3px 8px; background:#efefef; -moz-border-radius:15px 15px 15px 15px; border-radius:15px 15px 15px 15px; border:0; font:normal normal normal 10px/12px helvetica, arial, sans-serif!important; text-transform:uppercase; letter-spacing:-0.02em; color:#000;}

/* =article 
------------------------ */                                                                       
article { float:left; width:415px; margin:0 0 15px 15px; padding:0; background-color:#f6f6f6; }
article img { float:left; }
article section { overflow:hidden; margin:20px 20px 20px 20px; padding-bottom:21px; width:375px; background: transparent url('../images/dash.gif') 0 bottom repeat-x; float:left; }
article h1 { font: bold normal normal 36px/36px helvetica, arial, sans-serif; color:#000; text-transform:none; letter-spacing:-0.07em; padding-bottom:4px;  height: 1%; display:block;}
article section.wysiwyg h1 { padding-bottom:18px;} 
article section.wysiwyg img { margin-bottom:10px;}   
article time { display:block; font:normal normal normal 10px/13px helvetica, arial, sans-serif; text-transform:uppercase; letter-spacing:-0.07; color:#000; padding-bottom:16px;}
article section li { display:block; padding-bottom:15px;} 
article div.soundcloud { margin-bottom:20px;}
article div.media { margin:0; margin-bottom:20px;}

article .tagsNBookmark { overflow: hidden; margin: 0; margin-top: 25px; width: 375px;}
.cats { font: normal normal normal 10px/10px Tahoma, Helvetica, Arial, Sans-Serif; text-transform:uppercase; letter-spacing:0.18em;}
article .cats { float: left; display: block; }
article .cats a { text-decoration: none; }

article .addthis {margin: 0; display: block; float: right; }
article .addthis a {background-image:none;}

/* =comments
------------------------ */
#PageComments li { margin-top: 15px; padding-bottom: 15px; color: #000; }
.infoCommenter {font: normal normal normal 10px/10px Tahoma, Helvetica, Arial, Sans-Serif; text-transform:uppercase; letter-spacing:0.18em;}
#content article #articleComments h3.leaveAComment { background: transparent; margin-top: 20px; margin-bottom: 0px; }  

#PageComments_holder { padding-top: 0px; clear: both; }
#PageComments_holder .hidden { display: none; }
#PageComments_holder label { display: none; }
#PageComments_holder input { border: none; background-color: #e3e3e3; color: #000; display: block; height: 19px; width: 160px; padding:6px 10px; margin-bottom:8px;} 
#PageComments_holder textarea { border: none; background-color: #e3e3e3; color: #000; height: 110px; display: block; width: 375px; padding:6px 10px; position:relative; z-index:100; }
#Name { float: left; margin-right: 15px; width: 180px; } 
#CommenterURL { float: left; width: 180px; }
#Comment { clear: both; width: 375px; }
#PageComments_holder .Actions {{ float: right; padding-left: 0px;} }
#PageComments_holder .Actions input {display:block; overflow:hidden; width:130px; height:22px; background: #e3c000; -moz-border-radius:15px 15px 15px 15px; border-radius:15px 15px 15px 15px; color:#fff; font: normal normal normal 11px/11px helvetica, arial, sans-serif; text-align:center; text-transform:uppercase; cursor:pointer;} 
#PageComments_holder .Actions input:focus, #PageComments_holder .Actions input:hover { background-color:#000; } 

body article .recaptchatable { margin:0 0 10px -4px!important;}
body article .recaptchatable .recaptcha_r1_c1 { background: url('../images/recaptchaSprite.png') -0px -63px no-repeat!important; }
body article .recaptchatable .recaptcha_r2_c1 { background: url('../images/recaptchaSprite.png') -18px -0px no-repeat!important; }
body article .recaptchatable .recaptcha_r2_c2 { background: url('../images/recaptchaSprite.png') -27px -0px no-repeat!important; }
body article .recaptchatable .recaptcha_r3_c1 { background: url('../images/recaptchaSprite.png') -0px -0px no-repeat!important; }
body article .recaptchatable .recaptcha_r3_c2 { background: url('../images/recaptchaSprite.png') -18px -57px no-repeat!important; }
body article .recaptchatable .recaptcha_r3_c3 { background: url('../images/recaptchaSprite.png') -9px -0px no-repeat!important; }
body article .recaptchatable .recaptcha_r4_c1 { background: url('../images/recaptchaSprite.png') -43px -0px no-repeat!important; }
body article .recaptchatable .recaptcha_r4_c2 { background: url('../images/recaptchaSprite.png') -36px -0px no-repeat!important; }
body article .recaptchatable .recaptcha_r4_c4 { background: url('../images/recaptchaSprite.png') -214px -0px no-repeat!important; }
body article .recaptchatable .recaptcha_r7_c1 { background: url('../images/recaptchaSprite.png') -43px -49px no-repeat!important; }
body article .recaptchatable .recaptcha_r8_c1 { background: url('../images/recaptchaSprite.png') -43px -49px no-repeat!important; }
body article #recaptcha_response_field { border:0 solid #6d2f9c!important; background-color:#fff!important; color:#000!important; height:22px!important; }  
/* Remove reCaptcha button images  */
a#recaptcha_reload_btn { display:block; width:25px; height:17px; background: url('../images/recaptchaSprite.png') -311px 0 no-repeat    !important; margin:0!important;} 
a#recaptcha_switch_audio_btn { display:block; width:25px; height:16px; background: url('../images/recaptchaSprite.png') -318px -49px no-repeat    !important; margin:0!important; } 
a#recaptcha_whatsthis_btn { display:block; width:25px; height:16px; background: url('../images/recaptchaSprite.png') -311px -33px no-repeat    !important; margin:0!important; }
img#recaptcha_reload, img#recaptcha_switch_audio, img#recaptcha_whatsthis {  display:none;}

/* =videos page
--------------- */ 
#pageGrid.videoHolder {}   
section.video { margin:0 0 15px 15px;}
.videoHolder .container { padding: 0; }  
.videoHolder .color1 { background-color: #e3c000 ; }
.videoHolder .color2 { background-color: #ed2727 ; }
.videoHolder .color3 { background-color: #009ac1 ; }
.videoHolder .video { width: 271px; display: block; margin-bottom: 15px; }
.videoHolder .videoSize { width: 271px; }
.videoHolder .video.last { margin-right: 0px; }
.videoHolder .video .thumb { height: 186px; overflow: hidden;  cursor:pointer; } 
.videoHolder .color1 .play { }  
.videoHolder .color2 .play { }  
.videoHolder .color3 .play { }
.videoHolder .play { display: block; position: absolute; width: 271px; height: 186px; text-indent: -9999px; overflow: hidden; opacity: 1;}  
.videoHolder .play:hover, .videoHolder .play:focus { opacity:0.6; }   
.videoHolder .color1 .play { background: transparent url('../images/playYellow.png') 0 0 no-repeat;}  
.videoHolder .color2 .play { background: transparent url('../images/playRed.png') 0 0 no-repeat;}  
.videoHolder .color3 .play { background: transparent url('../images/playBlue.png') 0 0 no-repeat;}
.videoHolder .video .thumb img { width: 300px; }
.videoHolder h1 { padding:14px 14px 14px 14px; font: normal normal 600 36px/33px Helvetica, Arial, Sans-Serif; text-transform:uppercase; letter-spacing:-0.05em; color:#fff; }   

/* =video lightBox 
------------------ */
div.light_rounded .pp_content .ppt { color:#000000; }
div.pp_pic_holder { display:none; position:absolute; width:100px; z-index:10000; }
div.pp_overlay { background:none repeat scroll 0 0 #12337f; display:none; left:0; position:absolute; top:0; width:100%; z-index:9500; }
div.ppt { color:#ffffff; display:none !important; font-size:17px; left:0; position:absolute; top:0; z-index:9999;}
a.pp_expand { display: none !important; }
div.light_rounded { max-width: 540px !important; } 
div.pp_inline { background-color: #fff; padding: 10px; font: normal normal 300 11px/16px "museo-sans-1","museo-sans-2",sans-serif,'sans-serif'; letter-spacing: 0.05em; margin-bottom:11px; }

/* =footer
------------------------ */
footer { position:fixed; bottom:0; left:0; width:100%; height:35px; background:#ccc; z-index:10000; }
footer p { float:right; padding:6px 20px 7px 20px; line-height:27px;}    
footer .socialLinks { float: left; }
footer .socialLinks a { float: left; height: 35px; background: transparent url(../images/sprite.png); text-indent: 9999px; overflow: hidden; }
footer .socialLinks a.twitter { background-position: 0px -166px; width: 47px; }
footer .socialLinks a.facebook { background-position: -82px -167px; width: 25px; }
footer .socialLinks a.myspace { background-position: -50px -167px; width: 33px; }
footer .socialLinks a.youtube { background-position: -110px -166px; width: 33px; }
footer .socialLinks a.linkedIn { background-position: -140px -168px; width: 33px; }
footer .socialLinks a.twitter:hover { background-position: 0px -197px; }
footer .socialLinks a.facebook:hover { background-position: -82px -197px; }
footer .socialLinks a.myspace:hover { background-position: -50px -198px; }         
footer .socialLinks a.youtube:hover { background-position: -110px -196px; }
footer .socialLinks a.linkedIn:hover { background-position: -140px -198px; }