/* CSS Document */

/*  
Name: greyisgood nov 2010
URL: http://greyisgood.eu/style.css
Description: greyisgood
Version: 3
Author: mjc
Author URI: http://greyisgood.eu
*/

@font-face{font-family:'MisoLight';src:url('fontface/miso/miso-light-webfont.eot');src:local('?'), url('fontface/miso/miso-light-webfont.woff') format('woff'), url('fontface/miso/miso-light-webfont.ttf') format('truetype'), url('fontface/miso/miso-light-webfont.svg#webfontF29MFFwu') format('svg');font-weight:normal;font-style:normal;}
@font-face{font-family:'MisoRegular';src:url('fontface/miso/miso-webfont.eot');src:local('?'), url('fontface/miso/miso-webfont.woff') format('woff'), url('fontface/miso/miso-webfont.ttf') format('truetype'), url('fontface/miso/miso-webfont.svg#webfontA4ZOCCxS') format('svg');font-weight:normal;font-style:normal;}
@font-face{font-family:'MisoBold';src:url('fontface/miso/miso-bold-webfont.eot');src:local('?'), url('fontface/miso/miso-bold-webfont.woff') format('woff'), url('fontface/miso/miso-bold-webfont.ttf') format('truetype'), url('fontface/miso/miso-bold-webfont.svg#webfontWPKh07R7') format('svg');font-weight:normal;font-style:normal;}

body{background-color:#eee;color:#777;background-image:url(http://greyisgood.eu/img/bk2013.png);background-repeat:repeat;background-attachment:fixed;font-size:1.2em;letter-spacing:0.08em;line-height:1.2em;font-family:'MisoLight', 'MisoRegular', Arial, sans-serif;text-decoration:none;margin:30px;}

#wrap{width:100%;margin:0;padding:0;}
#content{background:transparent;float:left;width:100%;margin:0 auto;padding:0;}
#line{clear:both;height:0px;width:95%;}
#header{float:left;width:100%;margin:0;padding:0 30px 0 0;clear:both;z-index: 1;}

h1{color:#000;font-family:'MisoLight', Arial, sans-serif;letter-spacing:0;font-size:1.6em;line-height:1.1em;font-weight:normal;}
h2,h3,#shows h2,#notes h2{font-weight:normal;font-size:1.2em;letter-spacing:0.08em;line-height:1.2em;}
p,#notes p{margin:0;padding:2px 0 8px 0;}
.grey,#notespage p{color:#777;}
img {max-width:100%;border:0;}
#cap {    position:absolute;left:0;top:0;}
#captext{z-index:100;position:absolute; color:black;font-size:24px;right:5px;bottom:5px;}

a,a:link,a:active,a:visited{font-family:'MisoRegular', arial;color:#000;text-decoration:none;background-color:none;}
a:hover,#pages a:hover,#header a:hover,#pages a:hover,#notes a:hover,#shows a:hover{font-family:'MisoRegular', arial;text-decoration:none;color:#000;background-color:none;border-bottom:#000 2px solid;}
#foot a,#foot a:link,#foot a:active,#foot a:visited{font-family:'MisoLight', arial;color:#000;text-decoration:none;background-color:none;}
#foot a:hover{font-family:'MisoLight', arial;text-decoration:none;color:#000;background-color:none;border-bottom:#000 2px solid;}
#boxmainpic a:hover,#boxextrapic a:hover{text-decoration:none;background-color:none;border-bottom:0;border:0;}


#pages,#shows,#notes,#foot{padding:0;height:auto;width:100%;left:0;float:left;margin:220px 4px 22px 0;}
#box, #notespage, #cv{padding:0px;height:auto;width:900px;max-width:100%;float:left;background-color:none;margin:60px 0;clear:both;color:#000;}

#boxtxt {padding:0px;height:auto;width:900px;max-width:100%;float:left;background-color:none;margin:60px 0;clear:both;color:#000;line-height: 1.6em;}
#boxmax {padding:0px;height:auto;max-width:100%;float:left;background-color:none;margin:60px 0;clear:both;color:#000;}

#boxmainpic{padding:0px;height:auto;width:auto;float:left;background-color:none;margin:22px 0 1px 0;clear:both;max-width:900px;}

#boxmainpic{ position: relative; }
#boxmainpic h2{position: absolute; bottom: -10px; left: 0; width: 100%;color:#FFFFFF;font-size:1em;letter-spacing:0.08em;line-height:1em;font-family:'MisoLight', 'MisoRegular', Arial, sans-serif;text-decoration:none;padding:5px;}
#boxmainpic h2 span{background-color: rgba(0, 0, 0, 0.4); }

#boxextrapic{padding:0px;height:auto;width:auto;max-width:900px;float:left;background-color:none;margin:0 0 12px 0;clear:both;}


#notespage ul,#notes ul,#pages ul,#shows ul,#cv ul{list-style-type:none;margin:0;padding:0;}
#notespage ul li,#notes ul li,#pages ul li,#shows ul li,#cv ul li{list-style-type:none;margin:0;padding:2px 0;}
#notespage ul li ul,#notes ul li ul,#pages ul li ul,#shows ul li ul,#cv ul li ul{list-style-type:square;margin:0;padding:0;}
#notespage ul li ul li,#notes ul li ul li,#pages ul li ul li,#shows ul li ul li,#cv ul li ul li{list-style-type:none;border:0;margin:0;padding:0;}


 

/* mailchimp */
#mc_embed_signup{ clear:left;margin:-25px;padding:0; }



input#s{color:#5188d2;width:120px;background:#fcfcfc;}

#error{color:#ff0000;font-size:56px;font-weight:normal;padding:0;font-family:garamond, "garamond BE", "garamond premier pro", georgia, "times new roman", times, serif;margin:0 0 50px 0;}
#error h2{color:#ff0000;font-size:19px;font-weight:normal;padding:0;font-family:garamond, "garamond BE", "garamond premier pro", georgia, "times new roman", times, serif;margin:0 0 50px 0;}

/* for sonofyou jplayer */
#player_container{border:0px solid #eee;padding:0;}
#player_container p{line-height:36px;}
#player_container .black{color:#000;}
#player_container .grey{color:#bbb;}
#player_progress_ctrl_bar,
#player_progress_play_bar,
#player_progress_load_bar{font-size:0.8em;height:1.2em;}



/* STRUCTURE */


#header{position:fixed;}

#left {
	width: 33%;
	float: left;
	margin-bottom:15px;
}

#middle {
	width: 33%; 
	float: left;
	margin-bottom:15px;
}

#right {
	width: 33%;
	margin-bottom:15px;
	float: left;
}


/************************************************************************************
MEDIA QUERIES
*************************************************************************************/
/* for 980px or less */
@media screen and (max-width: 980px) {
	
	#wrap {
		width: 94%;
	}
	
	#left {
		width: 50%;
		margin-bottom:15px;
	}
	#middle {
		width: 50%;
		margin-bottom:15px;
		float: right;
	}
	
	#right {
		clear: both;
		margin-bottom:15px;
		width: auto;
		float: none;
	}

	#header{position:fixed;}
}

/* for 700px or less */
@media screen and (max-width: 600px) {

	#left {
		width: auto;
		float: none;
	}
	
	#middle {
		width: auto;
		float: none;
		margin-left: 0px;
	}
	
	#right {
		width: auto;
		float: none;
	}
	
	#header{position:relative;}
	
	 #notes,#boxextrapic,#notespage{
		display: none;
	}

}

/* for 480px or less */
@media screen and (max-width: 480px) {

	#header{position:relative;}

	#right, #notes,#boxextrapic,#notespage{
		display: none;
	}

}