@charset "UTF-8";
/* CSS Document */

body{
font-family: Arial, Helvetica, sans-serif;
font-size: 75%; /* Resets 1em to 11px 1em equals 16px;*/ 
color:#596a72;
line-height:1.8em;
margin:0px;
padding:0px;
background-color: #d4dcdf;
height:100%; 
 background-repeat: repeat-y;
  background-position: center;
background-image:url(../images/wrapper-background.jpg);

}

p{
margin-top:0px;
padding-top:0px;

}
a{
color:#596a72;
}
h1{
font-size:16px;
padding:0px;
margin:0px 0px 20px 0px;
}
h2{
font-size:12px;
padding:15px 0px 0px 0px;
margin:0px;
}

h3{
font-size:12px;
font-weight:bold;
padding:0px;
margin:0px 0px 10px 0px;
}

ul{
padding: 0px 0px 0px 10px;
margin: 0px;
}

form{
margin:0px;
padding:0px;
}

#wrapper{
position: absolute; 
width: 860px;
left:50%;
margin-left: -477px;
padding-left:47px;
padding-right:47px;
padding-bottom:47px;
background-color: #ffffff;
background-image:url(../images/wrapper-background.jpg);
overflow:auto;
}

#rij1{
position:relative;
float:left;
width:860px;
height:160px;
background-image:url(../images/hotraco_rij1.gif);
background-repeat:no-repeat;
}
#rij1-logo{
    position:absolute;
    left:710px;
    top:20px;
    width:100px;
    height:100px;
}

#rij2_col1{
position:relative;
float:left;
width:660px;
height:180px;
margin-right:10px;
background-color:#CCCCCC;
}

#rij2_col2{
position:relative;
float:left;
width:150px;
height:140px;
padding:20px 20px 20px 20px;
background-repeat:repeat-x;
line-height:1.3em;
font-size:11px;
}

#rij2_col2 H1{
padding:0px;
margin:0px 0px 15px 0px;
}

#rij3_col1{
position:relative;
float:left;
width:620px;
height:30px;
margin-top:10px;
margin-right:10px;
padding-left:20px;
padding-right:20px;
line-height:30px;
background-color:#96D200;
font-size:11px;
color:#ffffff;
}


#rij3_col2{
position:relative;
float:left;
width:168px;
height:28px;
margin-top:10px;
padding-left:20px;
line-height:30px;
border: 1px solid;
/*background-color:#96D200;*/
}

#rij4_nieuws{
position:relative;
float:left;
width:180px;
margin-top:10px;
margin-right:10px;
padding:20px;
background-image:url(../images/hotraco-header-nieuws.jpg);
background-repeat:repeat-x;
background-color:#778890;
color:#FFFFFF;
}

#rij4_nieuws a{
color:#FFFFFF;
}

.rij4_col2_3{
position:relative;
float:left;
width:168px;
margin-top:10px;
margin-right:10px;
padding:20px;
border:1px solid #CFDCE2;
}

#rij4_col4{
position:relative;
float:left;
width:190px;
margin-top:10px;
}

#dubbel_col{
position:relative;
float:right;
width:370px;
height:100px;
margin-top:10px;
padding:30px 20px 20px 20px;
background-image:url(../images/hotraco-dealer-back.gif);
color:#FFFFFF;
}

#rij5_downloads{
position:relative;
float:left;
width:220px;
margin-top:10px;
margin-right:10px;
background-image:url(../images/hotraco-header-contact.jpg);
background-repeat:repeat-x;
background-color:#cfdce2;
}

#smartools{
position:relative;
float:left;
width:190px;
height:70px;
margin-bottom:10px;
background-color:CFDCE2;
}

#contact_bloc{
position:relative;
float:right;
width:150px;
padding:30px 20px 20px 20px;
background-image:url(../images/hotraco-header-contact.jpg);
background-repeat:repeat-x;
background-color:#CFDCE2;
}

#nav_bg_image{
position:absolute;
left:0px;
top:0px;
height:180px;
width:440px;
}

#nav_bg_image_nav1_bg{
position:absolute;
left:220px;
top:0px;
height:180px;
width:220px;
filter:alpha(opacity=50); 
-moz-opacity:0.5; 
opacity:0.5;
}

#nav_bg_image_nav1{
position:absolute;
left:220px;
top:0px;
height:180px;
width:220px;
}

#nav_bg_image_nav2{
position:absolute;
left:440px;
top:0px;
height:180px;
width:220px;
}

#detailpage{
position:relative;
float:left;
width:638px;
margin-top:10px;
margin-right:10px;
padding:10px;
border: solid 1px #b3c0c8;
}

#detailpage_rij1_col1{
position:relative;
float:left;
width:409px;
padding-left:10px;
margin-right:10px;
}

#detailpage_rij2_col1{
position:relative;
float:left;
width:369px;
padding:30px 10px 10px 40px;
margin-right:10px;
}

#detailpage_col2{
position:relative;
float:left;
width:179px;
padding:20px 10px 10px 20px;
background-color:#eaf6cc;
}
#detailpage_col2 p{
margin: 0px;
padding: 0px;
line-height:1.3em;
font-size:11px;
}
#detailpage_col2 h2{
margin: 10px 0px 10px 0px;
padding: 0px;
}

.meer{
text-align:right;
line-height:1.3em;
font-size:11px;
}

.meer_leftalign{
text-align:left;
line-height:1.3em;
font-size:11px;
margin-bottom:10px;
}

#detailpage_dealer{
position:relative;
float:left;
width:150px;
height:140px;
padding:30px 20px 20px 20px;
color:#FFFFFF;
font-size:11px;
line-height:1.3em;
margin-bottom:10px;
background-image:url(../images/hotraco-dealerdetailpage-back.jpg)
}

#detailpage_contact_bloc{
position:relative;
float:left;
width:148px;
padding:20px;
margin-bottom:10px;
border:solid 1px #b3c0c8;
background-color: #ffffff;
}

#detailpage_actueel_bloc{
position:relative;
float:right;
width:150px;
padding:30px 20px 20px 20px;
margin-bottom:10px;
background-image:url(../images/hotraco-header-contact.jpg);
background-repeat:repeat-x;
background-color:#CFDCE2;
}

#detailpage_contact_bloc H1{
padding:0px;
margin:0px 0px 10px 0px;
}

#quicknav{
position:relative;
float:left;
padding-top:35px;
width:440px;
height:12px;
line-height:12px;
font-size:12px;
color:#95A4AD;
}

#quicknav a{
color:#95A4AD;
text-decoration:none;
}

#quicknav a:hover{
text-decoration:underline;
}

#groepkiezer{
position:relative;
float:left;
width:660px;
padding-right:200px;
padding-top:55px;
height:98px;
}

#groepkiezer ul{
padding:0px;
margin:0px;
}

#groepkiezer li{
padding-left:20px;
list-style-type:none;
width:200px;
height:68px;
font-size:20px;
float:left;
line-height:30px;
}

#groepkiezer a{
text-decoration:none;
line-height:30px;
}

.nav1{
padding:0px;
margin:0px;
}

.nav1 li{
list-style-type:none;
}

.nav1 a{
color:#FFFFFF;
display:block;
height:20px;
width:180px;
font-weight:bold;
padding:5px 20px;
line-height:20px;
text-decoration:none;
overflow:hidden
}

.nav2{
padding:0px;
margin:0px;
}

.nav2 li{
list-style-type:none;
}

.nav2 a{
color:#FFFFFF;
display:block;
height:20px;
width:180px;
padding:5px 20px;
line-height:20px;
text-decoration:none;
overflow:hidden;
font-size:11px
}

.hide{
visibility:hidden;
position:absolute; 
z-index:99; 
}

#detailpage_rij2_col1_image{
position:relative;
margin-left:-30px;
margin-top:-30px;
margin-bottom:20px;
}
#detailpage_rij2_col1_image img{
    border:none;

}
.form_items{
border: solid 1px #b3c0c8;
width: 148px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
}

.form_buttons{
border: solid 1px #b3c0c8;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
}

#home_wrapper{
position: absolute; 
width: 990px;
left:50%;
margin-left: -477px;
overflow:auto;
}

#home_topnavigation{
position: relative; 
float: left;
width: 970px;
padding-right: 20px;
background-color: #d3dcdf;
text-align: right;
}

#home_content{
position: relative;
float: left;
width:990px;
text-align: center;
background-color: #ffffff;
}

#home_logos{
position: relative;
float: left;
width:990px;
height: 100px;
line-height:100px;
text-align: center;
padding-top: 20px;
}

.homepagenav a{
float:right;
text-align:right;
margin: 8px;
text-decoration:none;
color: #596a72;
}

.zoek{
background: transparent !important;
border-width:0px;
border-style:hidden;
height:14px;
width:137px;
float:left;
line-height:14px;
padding: 7px 0px;
font-size:11px;
}

.col{
position:relative;
float:left;
}

#knop{
height:30px;
width:170px;
position:absolute;
bottom:0px;
left:0px;
text-align:right;
line-height:30px;
padding:0px 10px;
display:block;
color: #FFFFFF;
}

#knop a{
color: #FFFFFF;
font-size:12px;
}

#knop2{
height:30px;
width:370px;
position:absolute;
bottom:0px;
left:0px;
text-align:right;
line-height:30px;
display:block;
color: #FFFFFF;
padding:0px 10px;
}

#knop2 a{
color: #FFFFFF;
font-size:12px;
}

#quicknav2{
position:relative;
float:left;
margin-top:22px;
text-align:right;
height:25px;
line-height:25px;
font-size:12px;
color:#95A4AD;
background-repeat: no-repeat;
margin-right:20px;
padding-left:10px;
width:90px;
}

#quicknav2 a{
color:#FFFFFF;
text-decoration:none;
display: block;
height: 25px;
width: 90px;
text-align: left;
}

#quicknav2 a:hover{
text-decoration:none;
}

#footer
{
margin-top:10px;
width:100%;
text-align:center;
height:12px;
line-height:12px;
font-size:12px;
color:#95A4AD;
float:left;
position:relative;
}

#footer_factif{
margin-top:10px;
width:100%;
text-align:center;
height:12px;
font-size:12px;
color:#95A4AD;
float:left;
position:relative;
}

#footer a{
color:#95A4AD;
text-decoration:none;
}

#footer a:hover{
text-decoration:underline;
}

.input_300{
width:300px;
height:20px;
border:1px solid #CCCCCC;
}

.input_300_box{
width:300px;
height:100px;
border:1px solid #CCCCCC;

}
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; 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: 10; }
#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;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }
#imageData #caption{ font-weight: bold;	}
#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: 90; width: 100%; height: 500px; background-color: #000; }
.logolink a{ text-decoration:none}
a .logolinkLink{text-transform:uppercase;margin-top:20px}
#detailpage_contact_bloc{font-size:95%}
