/* ============================================================	*/
/* ========	HTML STANDAARDEN  	===============================	*/
/* ============================================================	*/

html {height:100%; width:100%; overflow: -moz-scrollbars-vertical;}
body {margin:0 0 0 0; width:100%; height:100%; text-align:center; background-color:#000000;}
	
img, div{ behavior: url(css/iepngfix.htc);}
img {border:0px solid #000000;}
	
body, table, th, td, p, input, textarea, select {font-family:Arial, Verdana, Helvetica, Sans-serif; font-size:12px;}
h1, h2, h3, h4, h5, h6 {margin:0 0 10px 0;}
	
a:focus {outline:none;}
a:hover {}
h1 {font-size:17px; font-weight:bold;}

p {}
	
ul {margin:0 0 0 0; padding:0 0 0 0; list-style:none; display:block;}
li {margin:0 0 0 0; padding:0 0 0 10px; display:block;  background:transparent url(../gfx/li.gif) 0 8px no-repeat;}

/* ============================================================	*/
/* ========	LAYOUT BLOCKEN  	===============================	*/
/* ============================================================	*/

#container {position:relative; margin:0 auto 0 auto; width:917px; text-align:left;}

/* ============================================================	*/
/* ========	HEADER				===============================	*/
/* ============================================================	*/

div.header {height:102px;}
div.header .contact {position:absolute; top:20px; right:0px; color:#FFFFFF; text-align:right; width:350px;}
div.header .contact div {text-align:right; line-height:29px; background:transparent url(../gfx/contact-back.gif) top right repeat-y; height:29px; color:#FFFFFF; padding:0 10px 0 0;}
div.header .contact div a {line-height:29px; color:#FFFFFF; text-decoration:none;}
div.header .contact div a:hover {text-decoration:underline;}
div.header .logo {position:relative; position:absolute; top:20px; left:0px;}

div.header div.keuze {width:182px; position:absolute; top:20px; left:366px;}
div.header div.keuze a {display:block; line-height:29px; border-bottom:2px solid #000000; font-size:17px; text-indent:-200px ;color:#FFFFFF; text-decoration:none; overflow:hidden;}
div.header div.keuze .haarwerken {background:#EF5922 url(../gfx/nav-haarwerken.gif) center center no-repeat;}
div.header div.keuze .makeup {background:#D83C96 url(../gfx/nav-makeup.gif) center center no-repeat;}
div.header div.keuze .kappers {background:#525356 url(../gfx/nav-kappers.gif) center center no-repeat;}

/* ============================================================	*/
/* ========	NAVIGATIE			===============================	*/
/* ============================================================	*/

div.navigatie {height:182px; overflow:hidden; background-position:right top; background-repeat:no-repeat; position:relative;}
div.navigatie div.menu {width:180px; _width:182px; border-right:2px solid #000000; height:180px; float:left;}
div.navigatie div.menu a {display:block; line-height:25px; height:25px; text-transform:uppercase; color:#FFFFFF; text-decoration:none; text-indent:-500px; overflow:hidden; position:relative; margin-bottom:1px;}
div.navigatie div.menu a:hover {color:#000000;}
div.navigatie div.menu a img {position:absolute; top:0px; left:-3px;}
div.navigatie div.menu a:hover img, div.navigatie div.menu a.selected img {left:-503px;}
div.navigatie div.sub {background-color:#CBCCCE; width:182px; height:182px; float:left; padding:5px 0 0 0; line-height:15px;}
div.navigatie div.sub a {display:block; color:#5E6063; text-decoration:none; font-size:12px; font-weight:bold; padding:2px 0 2px 12px;}
div.navigatie div.visual {float:left; border-left:2px solid #000000;}
div.navigatie div.slogan {position:absolute; bottom:8px; left:559px; font-size:17px; text-transform:uppercase; line-height:18px;}
div.navigatie div.slogan strong {font-size:19px;}

body.haarwerken div.navigatie div.slogan strong {font-size:17px;}

div.navigatie div.menu a.haarwerken,
div.navigatie div.menu a.makeup,
div.navigatie div.menu a.kappers {display:block; line-height:29px; border-bottom:2px solid #000000; font-size:17px; text-indent:-200px ;color:#FFFFFF; text-decoration:none; overflow:hidden;}
div.navigatie div.menu .haarwerken {background:#EF5922 url(../gfx/nav-haarwerken.gif) center center no-repeat; margin:0 0 0 0;}
div.navigatie div.menu .makeup {background:#D83C96 url(../gfx/nav-makeup.gif) center center no-repeat; margin:0 0 0 0;}
div.navigatie div.menu .kappers {background:#525356 url(../gfx/nav-kappers.gif) center center no-repeat; margin:0 0 0 0;}

/*KAPPERS*/
body.kappers div.navigatie {background-image:url(../gfx/nav-back-light-grijs.gif)}
body.kappers div.navigatie div.sub {background-color:#CBCCCE;}
body.kappers div.navigatie div.sub a {color:#5E6063;}
body.kappers div.navigatie div.sub a:hover,
body.kappers div.navigatie div.sub a.selected {background-color:#B2B2B5;}
body.kappers div.mainContent h1 {color:#5E6063;}

/*MAKE-UP*/
body.makeup div.navigatie {background-image:url(../gfx/nav-back-roze.gif); color:#FFFFFF;}
body.makeup div.navigatie div.sub {background-color:#D83C96;}
body.haarwerken div.navigatie div.sub a {color:#FFFFFF;}
body.haarwerken div.navigatie div.sub a:hover,
body.haarwerken div.navigatie div.sub a.selected {background-color:#BD3483;}
body.makeup div.mainContent h1 {color:#D83C96;}

/*HAARWERKEN*/
body.haarwerken div.navigatie {background-image:url(../gfx/nav-back-oranje.gif); color:#FFFFFF;}
body.haarwerken div.navigatie div.sub {background-color:#EF5922;}
body.haarwerken div.navigatie div.sub a {color:#FFFFFF;}
body.haarwerken div.navigatie div.sub a:hover,
body.haarwerken div.navigatie div.sub a.selected {background-color:#D14E1E;}
body.haarwerken div.mainContent h1 {color:#EF5922;}

/*CONTACT*/
body.contact div.navigatie {background-image:url(../gfx/nav-back-grijs.gif); color:#C1C1C1;}
body.contact div.navigatie div.sub {background-color:#4A4C4C; padding:0 0 0 0;}


/* ============================================================	*/
/* ========	CONTENTBLOCK		===============================	*/
/* ============================================================	*/

div.contentBlock {border-top:2px solid #000000;}

div.mainContent {background-color:#FFFFFF; color:#5E6063; margin:0 185px 0 182px; _margin:0 0 0 0; _width:552px; _float:left; _border-left:2px solid #000000; padding:17px; _height:1px; min-height:334px; _height:367px; line-height:16px;}
div.mainContent a {color:#5E6063;}

div.sidebar {float:left; background-color:#cacbcd; color:#5c5c5c; width:180px;}
div.sidebar table {margin:17px 15px 0px 15px;}
div.sidebar table th {font-size:10px; padding:0 0 5px 0;}
div.sidebar table td {font-size:10px; padding:0 8px 0 0;}
div.sidebar p {margin:5px 15px 10px 15px; font-size:9px;}

div.visual {float:right; width:183px;}
	
/* ============================================================	*/
/* ========	TEMPLATES			===============================	*/
/* ============================================================	*/

/*HOME*/
body.home div.header div.keuze,
body.home div.navigatie,
body.home div.visual,
body.home div.sidebar,
body.home div.mainContent {display:none;}
span.openingstijden {display:block; margin:12px 15px 0px 15px;color:#ffffff;}
span.openingstijden table th {font-size:10px; padding:0 0 5px 0;}
span.openingstijden table td {font-size:10px; padding:0 8px 0 0;}
span.openingstijden p {font-size:9px;}