/******************************************
Website : www.kapsalonhierensa.nl
CSS : Lautenbag Reclame (Diederik Dijkstra)
E-mail: info@lautenbag.nl
WWW: http://www.lautenbag.nl
---------------------------------------
CSS bestand vrijgegeven onder C.C. licentie:
http://creativecommons.org/licenses/by-sa/2.0/nl/
******************************************/

:-moz-any-link:focus {outline: none;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, del, dfn, font, img, ins, kbd, q, s, samp,
sub, sup, tt, var, dd, dl, dt, li, ol, ul, form, fieldset, input, textarea, label, 
table, legend, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	text-align: left;}

img, a img, :link img, :visited img {border: 0;}
div.clear {clear: both; width: 100%; height: 1px;}
html{height: 100%;}

/*LAYOUT
**************************************************/

body{
	background: #7e6f50 url('img/bg_links.jpg') left top repeat-y;
  }

div#site{
  background: transparent url('img/bg_vrouw.jpg') fixed 710px bottom no-repeat;
	left: 0;
	bottom: 0;
	overflow: none;
	}
	
div#header{
  background: transparent url('img/hd_bg.jpg') left top no-repeat;
  margin: 0;
  height: 111px;
  width: 520px;
  border-bottom: 1px solid #fff;}

div#nav{
  margin: 0 0 20px 0;
  height: 40px;
  width: 520px;
  background: transparent url('img/bg_nav.jpg') left top repeat-x;
  border-bottom: 1px solid #fff;
  float: left;
  display: inline;
  clear: both;}

/*slideshow*/
div#image{
	float: left;
	display: inline;
	width: 520px;
	height: 145px;
	border-bottom: 1px solid #fff;
	position: relative;
}


div#bottom{
	position: fixed;
	z-index: 3;
	width: 170px;
	left: 10px;
	bottom: 10px;}

div#container{
  background: transparent url('img/bg_content.jpg') left 140px no-repeat;
	min-height: 1000px;
	margin: 0 0 0 190px;
	overflow: none;}

div#content{
  clear: both;
	float: left;
	display: inline;
	width: 480px;
	margin: 10px 20px 0;}

div#footer{
	clear: both;
	padding: 0 0 20px 0;
	margin: 0 30px 0 20px;
	width: 480px;
	border-top: 1px solid #ccc;}

div#footer_l{
  float: left;
  display: inline;
  margin: 10px 0 20px 0;
  width: 340px;}

div#footer_r{
  float: left;
  display: inline;
  margin: 10px 0 20px 0;
  width: 140px;
  text-align: right;}

div#bottom img{
	float: left;
	display: inline;
	border: 1px solid #fff;
	margin-top: 15px;
}
div#bottom img:hover{
	border: 1px solid #ab1b63;
}
/*TYPOGRAFIE
**************************************************/

body{
	font: normal 12px/18px Arial, sans-serif;
	color: #999;}

div#fixedtop, div#bottom, div#left, div#right, div#footer{
	font: normal 11px/16px Arial, sans-serif;
	color: #000;}

div#footer{
  color: #333;}

/*PARAGRAPHS*/
p {padding: 0 0 20px;}
div#fixedtop p, div#bottom p, div#left p, div#right p{padding: 0 0 16px;}

/*HEADINGS*/
h2 {font: bold 22px/26px Tahoma, Arial, sans-serif; color: #ab1b63;}
h3 {font: bold 14px/18px Tahoma, Arial, sans-serif; color: #fff;}

div#content h2, div#content h3 {
	margin: 0;
	padding: 3px 0 20px 0;}

div#content h3 {
  padding-bottom: 0;
}

div#fixedtop h2, div#bottom h2, div#left h2, div#right h2 {width: 150px;}
div#fixedtop h3, div#bottom h3, div#left h3, div#right h3 {width: 150px;}

div#content h2 {width: 480px;}

/*LIJSTEN*/
div#content ul{
	list-style-type: disc;
	margin: 0 0 20px;
	padding: 0 0 0 15px;}

div#content ul li{
	padding: 0 0 0 5px;}

div#content ol{
	list-style-type: decimal;
	margin: 0 0 20px;
	padding: 0 0 0 25px;}

div#content ol li{
	padding: 0 0 0 10px;
	margin: 0;}

/*TABEL*/
table {
	margin: 10px 0 20px;
	font-size: 12px;
  width: 100%;
	border: 0;
	border-right: 1px solid #111;
	border-bottom: 1px solid #111;}

thead td, tr th {
	font-size: 14px;
	background-color: #ab1b63;
	font-weight: bold;
	padding: 2px 5px;
	color: #fff;
	border-left: 1px solid #111;
	border-top: 1px solid #111;}

tr td {
	padding: 2px 5px;
	border-left: 1px solid #111;
	border-top: 1px solid #111;
	background-color: #333}

th a {         text-decoration: underline; font-weight: bold;}
th a:link {    color: #fff; }
th a:visited { color: #fff; }
th a:hover {   color: #fff; text-decoration: none; }
th a:active {  color: #fff; }

/*LINKS*/
a {         text-decoration: underline; font-weight: bold;}
a:link {    color: #fff; }
a:visited { color: #fff; }
a:hover {   color: #fff; text-decoration: none;}
a:active {  color: #fff; }

h1 a {         text-decoration: none;}
h1 a:link {    color: #ab1b63; }
h1 a:visited { color: #ab1b63; }
h1 a:hover {   color: #fff;}
h1 a:active {  color: #fff;}

h2 a {         text-decoration: none;}
h2 a:link {    color: #ab1b63; }
h2 a:visited { color: #ab1b63; }
h2 a:hover {   color: #fff;}
h2 a:active {  color: #fff;}

div#bottom a {         text-decoration: none; font-weight: bold;}
div#bottom a:link {    color: #000; }
div#bottom a:visited { color: #000; }
div#bottom a:hover {   color: #000; text-decoration: underline;}
div#bottom a:active {  color: #000; }

div#footer_r a {         text-decoration: none; font-weight: bold; margin-left: 10px;}
div#footer_r a:link {    color: #333; }
div#footer_r a:visited { color: #333; }
div#footer_r a:hover {   color: #666; text-decoration: underline;}
div#footer_r a:active {  color: #666; }


/*GALLERY
**************************************************/

div#gallery{
  float: left;
  display: inline;
  width: 480px;
  margin: 0 0 20px;}

div#gallery a img.thumb{
  float: left;
  display: inline;
  width: 160px;
  height: 200px;}

div#gallery a:link img.thumb{
  float: left;
  display: inline;
  width: 160px;
  height: 200px;}

div#gallery a:visited img.thumb{
  float: left;
  display: inline;
  width: 160px;
  height: 200px;}

div#gallery a:hover img.thumb{
  float: left;
  display: inline;
  width: 150px;
  height: 190px;
  background-color: #fff;
  padding: 5px 5px 5px 5px;
  filter:alpha(opacity=50);
  -moz-opacity:.50;
  opacity:.50;}

div#gallery a:active img.thumb{
  float: left;
  display: inline;
  width: 150px;
  height: 190px;
  background-color: #fff;
  padding: 5px 5px 5px 5px;
  filter:alpha(opacity=50);
  -moz-opacity:.50;
  opacity:.50;}

/*FOTOS MENU
******************************************/

ul#fotos{
	list-style-type:none;
	margin: 0;
	padding: 0;
	border:0 ;
  width: 170px;}

ul#fotos li{
	list-style-type:none;
  margin: 0;
  padding: 0;
  border: 0;}

ul#fotos li a{
	width: 145px;
	margin: 0;
	padding: 8px 0 3px 25px;
	line-height: 15px;
	display: block;
	font-size: 11px;
	font-weight: normal;
	text-decoration: none;
	color: #000;
	background: transparent url("img/camera.jpg") left -4px no-repeat;
	text-align: left;}

ul#fotos li a:link,
ul#fotos ul li a:visited{
	color: #000;
	background: transparent url("img/camera.jpg") left -4px no-repeat;}

ul#fotos li a:hover{
	display: block;
	text-decoration: none;
	font-weight: bold;
	color: #fff;
	background-position: -171px -4px;}

ul#fotos li a:active{
	color: #000;
	background: transparent url("img/camera.jpg") left -4px no-repeat;}

ul#fotoso li a strong{
  font-weight: bold;}

 
/*MENU
******************************************/
     
div#nav ul{
	width: auto; 
	width: 485px;
	margin: 0 0 0 35px;
	padding: 0;
	line-height: 40px;
	list-style: none;}
   
div#nav li{
	float: left;
  display: inline;
  list-style: none;
  margin: 0;
  padding: 0; 
  line-height: 40px;
  height: 40px;}
        
div#nav a,
div#nav a:link,
div#nav a:active,
div#nav a:visited{
	display: inline-block;
  /* hide from ie/mac \*/
  display: block;
  /* end hide */
  font-weight: bold;
  text-decoration: none;
  padding: 0;
  margin: 0;
  height: 40px;}

div#nav a:hover{
	text-decoration: none;
  margin: 0;
  height: 40px;}
    
div#nav strong{
	display: inline-block;
  /* hide from ie/mac \*/
  display: block;
  /* end hide */
  color: white;}   

/*HOME*/
div#nav li.home a,
div#nav li.home a:link,
div#nav li.home a:active,
div#nav li.home a:visited,
div#nav li.home a:hover{
	background:url('img/btn_home.jpg');
  width: 73px;}

div#nav li.home a:hover{
	background-position:0 -80px;}

div#nav li.home strong a,
div#nav li.home strong a:link,
div#nav li.home strong a:active,
div#nav li.home strong a:visited,
div#nav li.home strong a:hover{
	background:url('img/btn_home.jpg'); 
	background-position:0 -40px;}

div#nav li.home strong a:hover{
	background:url('img/btn_home.jpg'); 
	background-position:0 -80px;}

/*WERK*/
div#nav li.werk a,
div#nav li.werk a:link,
div#nav li.werk a:active,
div#nav li.werk a:visited,
div#nav li.werk a:hover{
	background:url('img/btn_werk.jpg');
  width: 71px;}

div#nav li.werk a:hover{
	background-position:0 -80px;}

div#nav li.werk strong a,
div#nav li.werk strong a:link,
div#nav li.werk strong a:active,
div#nav li.werk strong a:visited,
div#nav li.werk strong a:hover{
	background:url('img/btn_werk.jpg'); 
	background-position:0 -40px;}

div#nav li.werk strong a:hover{
	background:url('img/btn_werk.jpg'); 
	background-position:0 -80px;}

/*PRODUCTEN*/
div#nav li.producten a,
div#nav li.producten a:link,
div#nav li.producten a:active,
div#nav li.producten a:visited,
div#nav li.producten a:hover{
	background:url('img/btn_producten.jpg');
  width: 118px;}

div#nav li.producten a:hover{
	background-position:0 -80px;}

div#nav li.producten strong a,
div#nav li.producten strong a:link,
div#nav li.producten strong a:active,
div#nav li.producten strong a:visited,
div#nav li.producten strong a:hover{
	background:url('img/btn_producten.jpg'); 
	background-position:0 -40px;}

div#nav li.producten strong a:hover{
	background:url('img/btn_producten.jpg'); 
	background-position:0 -80px;}

/*PRIJZEN*/
div#nav li.prijzen a,
div#nav li.prijzen a:link,
div#nav li.prijzen a:active,
div#nav li.prijzen a:visited,
div#nav li.prijzen a:hover{
	background:url('img/btn_prijzen.jpg');
  width: 86px;}

div#nav li.prijzen a:hover{
	background-position:0 -80px;}

div#nav li.prijzen strong a,
div#nav li.prijzen strong a:link,
div#nav li.prijzen strong a:active,
div#nav li.prijzen strong a:visited,
div#nav li.prijzen strong a:hover{
	background:url('img/btn_prijzen.jpg'); 
	background-position:0 -40px;}

div#nav li.prijzen strong a:hover{
	background:url('img/btn_prijzen.jpg'); 
	background-position:0 -80px;}

/*CONTACT*/
div#nav li.contact a,
div#nav li.contact a:link,
div#nav li.contact a:active,
div#nav li.contact a:visited,
div#nav li.contact a:hover{
	background:url('img/btn_contact.jpg');
  width: 95px;}

div#nav li.contact a:hover{
	background-position:0 -80px;}

div#nav li.contact strong a,
div#nav li.contact strong a:link,
div#nav li.contact strong a:active,
div#nav li.contact strong a:visited,
div#nav li.contact strong a:hover{
	background:url('img/btn_contact.jpg'); 
	background-position:0 -40px;}

div#nav li.contact strong a:hover{
	background:url('img/btn_contact.jpg'); 
	background-position:0 -80px;}

/*FORMULIER
*****************************************/
table#tabelFormulier{
	background: transparent;
	text-align: left;
	width: 100%;
	font-size: 11px;
	margin: 0 0 20px;
	padding: 0;}          

table#tabelFormulier tr th h3{
  color: #fff;
  margin: 0;
  padding: 3px 0 5px;}

table#tabelFormulier input,
table#tabelFormulier textarea{
	font: 12px arial,sans-serif;
	color: #000;}
	
table#tabelFormulier .button{
	background-color: #ab1b63;
	border: 1px solid #ccc;
	color: #FFF;
	margin: 10px 0 10px 0;
	padding: 3px;
	text-align: center}

label.veld-voornaam,
label.veld-achternaam,
label.veld-Adres,
label.veld-Postcode,
label.veld-Woonplaats,
label.veld-Telefoon,
label.veld-Fax,
label.veld-E-mail,
label.veld-Bericht {
	line-height: 20px }

input.veld-voornaam,
input.veld-achternaam,
input.veld-Postcode,
input.veld-Woonplaats,
input.veld-Telefoon,
input.veld-Fax{
	width: 96%;
	padding: 3px 2px;
	margin: 0 0 10px 0;
	border: 1px solid #ccc;
	background-color: #fff;}

input.veld-Adres,
input.veld-E-mail{
	width: 98%;
	padding: 3px 2px;
	margin: 0 0 10px 0;
	border: 1px solid #ccc;
	background-color: #fff;}

input.veld-Mailinglist{
	border: 0;
	margin: 0 10px 0 0;}

table#tabelFormulier textarea{
	width: 98%;
	padding: 3px 2px;
	margin: 0 0 5px 0;
	height: 100px;
	border: 1px solid #ccc;
	background-color: #fff;}