/*Presented - a These Days production - Q1 2008 -  revised september 2008
www.these-days.nl*/

/*
 GLOBAL
 */
body {
	padding: 0;margin:0;
	font-family: "Lucida Sans Unicode", Arial, "Trebuchet MS", sans-serif;
	font-size:62.5%;
	background-color: #646567;
	background-image: url('../images/bg.gif');
	background-attachment: fixed;
}
.clearer { clear: both; }
a img {border:none;}

/*
COLORS
*/
yellow {color: #F0B925; }
grey {color: #58595B; }

/*
 TYPOGRAPHY
 */
h1 {
	font-size: 3em;
	font-style: italic;
	text-transform: uppercase;
	font-weight: bold;
	color: #58595b;
	text-indent: -3000px;
	margin:0;padding:0;
	background-repeat: no-repeat;
}
h2 {
	color:#58595b;
	font-size:2.2em;
	font-style: italic;
	font-family: "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
	margin: 8px 0 0 10px;
	font-style:italic;
	background-repeat: no-repeat;
	text-indent: -3000px;
}
h5 { 
	font-size: 2em;
	margin:10px 0;
	text-align:right;
}
p {
	font-size: 1.2em;line-height:1.3;
	padding: 2px;
}
a {color:black; font-weight:bold;}
li { font-size: 1.2em; }

/*
 LAYOUT 
 */
#wrapper {
	width: 840px;
	background-repeat: no-repeat;
	margin-left: 90px;
}
#masthead {
	height:125px;
	background-image: url(../images/header.png);
	background-repeat: no-repeat;
	}
/*Direct Contact*/
#dcontact {
	padding: 24px 24px 20px 24px;
	color: white;
	position: absolute;
	left:700px;
	top: 0;
	width: 130px;
	background-image: url(../images/bgcontact.png);
	background-position: bottom;
}
#dcontact p { padding: 0; margin-top:0;line-height:1.1;}
#dcontact a { color: #fcc647;text-decoration:none;font-size:2.2em;font-style:italic; }
#dcontact a:hover { color: white; }

#maincontent {
	margin:10px;
	overflow:hidden;
	background-image: url(../images/bgcontent.png);
	background-repeat: repeat-y;
	padding-bottom: 20px;
}
#maincontent a {text-decoration:none;border-bottom:1px dotted black;}

#maincontent a:hover {text-decoration:none;border-bottom:1px solid black;}
.left, .right { width: 390px; float:left;margin:10px; }

/* 
NAVIGATION
 */
#menu {
	margin-left:10px;
	padding-top:86px;
	width:830px;
	height:42px;
}
#menu ul { padding:0; margin:0; list-style-type:none; }
#menu li { float: left; }
#menu li.home {background:transparent url(../images/menu-home.png) no-repeat;}
#menu li.services {background:transparent url(../images/menu-svcs.png) no-repeat;}
#menu li.events {background:transparent url(../images/menu-evts.png) no-repeat;}
/* Step 6 - General link styling */
#menu a {display:block; /*width:83px;*/ height:0; padding-top:43px; color:#000; overflow:hidden;}
/* hack for older versions of IE with incorrect box model */* html #menu a:link, * html #menu a:visited {height:42px; he\ight:0;}
/* Step 8 - Adding the background images to the link tags */
#menu a#item1 {background:transparent url(../images/menu-home.png) -120px -86px no-repeat;width:120px;}
#menu a#item2 {background:transparent url(../images/menu-svcs.png) -120px -86px no-repeat;width:120px;}
#menu a#item3 {background:transparent url(../images/menu-evts.png) -120px -86px no-repeat;width:115px;}
/* hover styles */
#menu a#item1:hover {background-position:0 -43px; z-index:50;}
#menu a#item2:hover {background-position:0 -43px; z-index:50;}
#menu a#item3:hover {background-position:0 -43px; z-index:50;}
* html #menu a:hover {height:43px; he\ight:0;}
/*Highlighting*/
#home li.home, #services li.services, #events li.events {background-position: 0 -43px;}

/*
FORMS
*/
form { font-size: 1em; }
label { float: left; text-align: right; width:80px; font-size: 1.1em; }
input, select,textarea {
	float: left;
	margin-left: 16px;
	margin-bottom: 2px;padding:2px;
	background-color: #58595b;
	color:white;
	border:1px solid #58595b;
}
.btn {	background-color: #fcc647}
input:focus, select:focus, textarea:focus { background-color:black; }
br { clear: both; }

/*Content*/
#maincontent ul {
	margin:0 2em;
	padding:0;
}
.date {	font-size:.5em;font-weight:normal;clear:both;display:block;}
#quicksell ul {margin:0;}
#quicksell li {
	background-position:center top;
	background-repeat:no-repeat;
	/*border-right:1px solid #58595B;*/
	float:left;
	height:220px;
	margin:0;
	overflow:hidden;
	width:130px;
	list-style: none;
	}
#quicksell a, #quicksell a:hover {border: none;}


/*Services*/
#maincontent ul.services { 
	margin: 0; 
	padding: 0; 
	overflow:hidden;
	height:1%;/*the holly hack*/
	}
ul.services li {
	width: 136px;
	height: 220px;
	float: left;
	border-right: 1px solid #58595b;
	overflow: hidden;
	padding: 8px;
	margin:6px 0;
	background-position:center top;
	background-repeat: no-repeat;
}
ul.services li p { margin: 100px 0;font-size:1em;line-height:1.05; }

#bedrijfspres {width:100%;}
#eventman {width:100%;}
#fundraise {width:100%;}
#hospit {width:100%;}
#hostes {width:100%;}


/*Event Archive*/
.archive ul li  {
background-repeat:no-repeat;
background-position: center top;
border-right: 1px solid #58595B;
height: 80px; 
margin: 0; 
color: white; 
float: left; 
width: 136px; 
margin: 6px 0; 
padding: 8px;
list-style: none;
}
.archive ul li p {display: none;}
#bespoke {
	float:left;
	width: 320px;
	clear: right;
}
#soon {
	float:left;
	width:480px;
}
#tickets {clear:both;}
#summary {overflow:hidden;margin-bottom:2em;clear:both;}
.service {
	width: 30%;
	float: left;
	overflow: hidden;
	border-top: 1px solid #58595b;
	padding-bottom: 2em;
}
.youtube { margin-top:10px;margin-right:0; }

/*Skills*/
#arena ul.skills {padding:0; list-style: none; }
ul.skills li { 
	list-style: none; 
	float:left; 
	width: 18%; 
	border-right:1px solid silver; 
	height: 160px; 
	margin:.25%; 
	padding: 0 .5%;
	}
ul.skills a { display: block; }

/*Reserveringen*/
.option { float: left; width: 360px; border-bottom: 1px solid #58595b;margin-left:20px; }
.option ul { margin-left: 20px; list-style: outside; }
.option li { margin-left: 20px; }

/*Arena*/
#arena {	
	width:840px;
	background-color:black;
	color:white; 
	padding-bottom: 10px; 
	overflow: hidden;
	}
#arena a {	color:silver;}
#arena a:hover {	color:white;}

/*Development*/
.comment {	background-color:yellow;color:red;font-style: italic;}