@charset "UTF-8";
/* CSS Document - Author: Adrie Mooi, e-mail: contact@adriemooi.nl */

/* main */
*{margin:0px; padding:0px;}
:focus {outline: 0;}
body{background:#e2e2e2; font-family:Trebuchet MS, Verdana, Arial; font-size:11px; color:#777;}
#contentwrapper{width:900px; background:#FFF; margin:10px auto 30px auto;  padding:15px 40px;}

/* text */
h1{float:left; height:110px; width:103px; background:url(images/adriemooi-logo.png) no-repeat top left; text-indent: -1000px;}
h2{font-size:15px; margin:0 0 5px 0; color:#333; font-weight:normal;}
p{}
.subscript{color:#666; font-size:9px; font-style:italic;}
.bold{font-weight:bold;}
.centerline{text-decoration:line-through;}
.red{color:#fb3737;}

/* links */
a{color:#333; text-decoration:none;}
a:hover{color:#000; text-decoration:none;}

/* header */
#header{height:120px;}
#header img{float:left;}

/* photos */
.photocolumn{width:210px; height:210px; float:left; position:relative; margin:0 0 20px 0; background:url(images/loader.gif) no-repeat center #e2e2e2;}
.photo{position:absolute; z-index:1000; visibility:hidden;}
.photohover{position:absolute; z-index:2000; display:none;}
.columnspacer{width:20px; float:left; margin:15px 0 0 0;}

/* portfolio */
.portfolioitem{margin:10px 0 30px 0;}

/* column */
.column{width:286px; float:left; margin:10px 0 20px 0;}
.column p{line-height:19px; margin:0 0 10px 0}
.column ul{margin:0 0 10px 0;}
.column li{list-style-type:none; background:url(images/bullet.png) no-repeat center left; padding-left:15px; line-height:20px;}
.fullcolumn{width:900px;}

/* control */
.controls{width:900px; height:29px; margin:0 0 10px 0; text-align:center; float:left;}

/* contact */
.contact-column{width:286px; height:551px; margin:0 0 20px 0; float:left; background:url(images/contact-bg.jpg) no-repeat top left;}
.masker{width:238px; height:335px; margin:87px 0 0 25px; overflow:hidden;}
.contact-container{width:952px; height:335; color:#333; position:relative;}
.formulier, .contact-boodschap{width:218px; padding:10px; float:left;}
.contact-boodschap p{margin:0 0 10px 0; line-height:19px;}
.contactitem-label{width:218px; margin:0 0 5px 0;}
.contactitem input{width:208px; padding:5px; margin:0 0 5px 0; border:0;}
.contactitem input:focus{background:#FCFAE0;}
.contactitem textarea{width:208px; height:100px; padding:5px; margin:0 0 10px 0; border:0; font:inherit;}
.contactitem textarea:focus{background:#FCFAE0;}

/* various */
.clear{clear:both;}
.button{height:23px; float:left; margin:0 0 10px 0; color:#FFF; font-size:11px; font-weight:bold; letter-spacing:0.03em;}
.button:hover{color:#777;}
.button-links{height:inherit; width:11px; background:url(images/button-links.png) no-repeat top left; float:left;}
.button-rechts{height:19px; padding:4px 25px 0 0; background:url(images/button-rechts.png) no-repeat top right; float:left;}
.button-terug-links{height:19px; padding:4px 0 0 25px; background:url(images/button-terug-links.png) no-repeat top left; float:left;}
.button-terug-rechts{height:inherit; width:11px; background:url(images/button-terug-rechts.png) no-repeat top left; float:left;}

/* lightbox */
#lightbox{position:absolute; left:0; width:100%; z-index:4000; text-align:center; line-height:0;}
#lightbox img{width:auto; height:auto;}
#lightbox a img{border:none;}
#caption a{color:#e2e2e2;}
#outerImageContainer{position:relative; background-color:#000; width:250px; height:250px; margin:0 auto;}
#imageContainer{padding:10px;}
#loading{position:absolute; top:40%; left:0%; height:25%; width:100%; text-align:center; line-height:0;}
#hoverNav{position:absolute; top:0; left:0; height:100%; width:100%; z-index:5000; pointer:pointer;}
#imageContainer>#hoverNav{left:0;}
#hoverNav a{outline:none;}
#prevLink, #nextLink{width:49%; height:100%; background-image:url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display:block; }
#prevLink {left:0; float:left; background:url(images/vorige-label.png) left 15% no-repeat;}
#nextLink {right:0; float:right; background:url(images/volgende-label.png) right 15% no-repeat;}
#imageDataContainer{font-family:Trebuchet MS, Verdana, Arial; font-size:11px; background:#000; margin:0 auto; line-height: 22px; overflow:auto; width:100%;}
#imageData{padding:0 10px; color:#666;}
#imageData #imageDetails{width:70%; float:left; text-align:left;}	
#imageData #caption{font-weight:normal;}
#imageData #numberDisplay{display:block; clear:left; padding-bottom:1.0em;}			
#imageData #bottomNavClose{width:66px; float:right; padding-bottom:0.7em; outline:none;}	 	
#overlay{position:absolute; top:0; left:0; z-index:3000; width:100%; height:500px; background-color:#000;}

/* bandspage */
.bandheader{margin: 0 0 10px 0;}
.columnvisual{width:592px; float:left; margin:10px 0 20px 0;}
.columnvisual01{height:300px ;width:592px; float:left; margin:10px 0 0 0; background: url(bands/images/visual01.jpg) no-repeat top right;}
.columnvisual01 .column{width:286px; float:left; margin:0;}

/* webshop */
.splashpage{height:600px; margin:0 0 20px 0; background:url(webshop/images/webshop-mainvisual01.jpg) no-repeat top left;}
.splashbutton{height:23px; float:left; margin:275px 0 0 85px; color:#FFF; font-size:11px; font-weight:bold; letter-spacing:0.03em;}
.splashbutton:hover, .orderbutton:hover{color:#777;}

.splashbutton, .orderbutton{height:23px; float:left; color:#FFF; font-size:11px; font-weight:bold; letter-spacing:0.03em;}
.splashbutton{margin:275px 0 0 85px;}
.orderbutton{margin:10px 0 0 0;}

.photocolumn-galerie{width:210px; float:left; margin:0 0 10px 0;}
.photocolumn-galerie ul{margin:5px 0 0 0;}
.photocolumn-galerie li{list-style-type:none; background:url(images/bullet.png) no-repeat center left; padding-left:12px; line-height:20px;}