/*------------------------------- START RESET -------------------------------*/
* { margin: 0; padding: 0; outline: none !important; }
/*------------------------------- END RESET -------------------------------*/


/*------------------------------- START HTML BODY -------------------------------*/
html,body
{
font-family: Verdana,sans-serif;
font-size: 10px;
color: #666;
text-align: left;
}
/*------------------------------- END HTML BODY -------------------------------*/


/*------------------------------- START WRAPPER -------------------------------*/
#wrapper { width: 865px; margin: 50px auto 0 auto; }
/*------------------------------- END WRAPPER -------------------------------*/


/*------------------------------- START LIST -------------------------------*/
.list
{
clear: both;
margin: 0;
padding: 20px 0 0 25px;
line-height: 14px;
color: #333;
}
.list ul  { padding: 0 0 0 30px; }
.list ul ul { padding: 0 0 0 50px; }
.list  li a:link, .list  li a:visited, .list li a:active { color: #333; text-decoration: none; }
.list  li a:hover { text-decoration: underline; }

.sublist { margin: 10px 0 0 10px; list-style: none; }
.sublist li { float: left; margin: 0 10px 0 0; }
.sublist a:link, .sublist a:visited, .sublist a:active { color: #333; text-decoration: none; cursor: pointer; }
.sublist a:hover { color: #333; text-decoration: underline; cursor: pointer; }
.sublist #active { color: #333; text-decoration: underline; cursor: pointer; }
/*------------------------------- END LIST -------------------------------*/


/*------------------------------- START HEADER -------------------------------*/
#header { width: 865px; height: 68px; margin: 0 auto; }
#header img { float: left; }
/*------------------------------- END HEADER -------------------------------*/


/*------------------------------- START BANNER -------------------------------*/
#banner { float: left; }
/*------------------------------- END BANNER -------------------------------*/


/*------------------------------- START NAVTOP -------------------------------*/
#navtop { float: left; margin: 52px 0 0 4px; list-style-type: none; }
#navtop li { float: left; }
#navtop li a:link, #navtop li a:visited
{
clear: both;
display: block;
width: 67px;
height: 15px;
padding: 5px 1px 0 0; 
background: none;
text-align: center;
text-decoration: none;
font-size: 10px;
color: #333;
}
#navtop li a:hover,#navtop li a:active,#navtop li a#current3
{
background: url(../Buttons/Navtop.jpg) top left no-repeat ;
font-size: 10px;
color: #fff;
text-decoration: none;
}
/*------------------------------- END NAVTOP -------------------------------*/


/*------------------------------- START SWITCH -------------------------------*/
#switch { float: left; margin: 52px 0 0 275px; list-style-type: none; }
#switch li { float: left; }
#switch li a:link, #switch li a:visited 
{ 
clear: both; 
display: block;
width: 44px;
height: 15px;
padding: 5px 0 0 0;
background: none;
text-align: center;
text-decoration: none;
font-size: 10px;
color: #333;
}
#switch li a:hover,#switch li a:active
{
background: url(../Buttons/Switch.jpg) top left no-repeat ;
font-size: 10px;
color: #fff;
text-decoration: none;
}
#switch li a#currentswitch
{
background: url(../Buttons/Switch.jpg) top left no-repeat ;
font-size: 10px;
color: #fff;
text-decoration: none;
}
/*------------------------------- END SWITCH -------------------------------*/


/*------------------------------- START CONTAINER -------------------------------*/
#container
{
width: 865px;
min-width: 865px;
max-width: 865px;
margin: 0 auto;
}
/*------------------------------- END CONTAINER -------------------------------*/


/*------------------------------- START KANTOFF SHOP LEFT -------------------------------*/
#kantoff_shop_left
{
clear: both;
float: left;
height: 226px;
width: 226px;
margin: 0 4px 4px 0;
background: url(../Graphics/Kantoff_shop.jpg) no-repeat top left;
}
/*------------------------------- END KANTOFF SHOP LEFT -------------------------------*/


/*------------------------------- START KANTOFF SHOP RIGHT -------------------------------*/
#kantoff_shop_right
{
float: left;
width: 635px;
height: 226px;
min-height: 226px;
max-height: 226px;
margin: 0 0 4px 0;
}
/*------------------------------- END KANTOFF SHOP RIGHT -------------------------------*/


/*------------------------------- START NAVIGATIEBOX -------------------------------*/
#navigatiebox
{
clear: both;
float: left;
width: 206px;
height: 216px;
margin: 4px 4px 0 0;
padding: 5px 10px 5px 10px;
background: url(../Graphics/Bg_grijs.jpg) repeat-x top left;
}
#navigatiebox ul { margin: 0 0 0 10px; padding: 0; list-style-type: none; }
#navigatiebox ul li { line-height: 30px; background: url(../Graphics/List_divider.jpg) repeat-x bottom center; }
#navigatiebox ul li a:link, #navigatiebox ul li a:visited, #navigatiebox ul li a:hover, #navigatiebox ul li a:active
{
color: #fff;
text-decoration: none;
background-repeat: no-repeat;
background-position: center left;
}
#navigatiebox ul li a:hover, #navigatiebox ul li a#current1 { background-image: url(../Graphics/Pijltje.jpg); padding: 0 0 0 8px; }
#navigatiebox input
{
width: 140px;
height: 16px;
margin: 0 0 0 10px;
padding: 3px 5px 0 5px;
background: url(../Graphics/Input_bg.jpg) repeat-x top left;
border: 1px solid #fff;
font-size: 10px;
color: #333;
}
#navigatiebox ul li#last { background: none; padding: 0; color: #fff; }
/*------------------------------- END NAVIGATIEBOX -------------------------------*/


/*------------------------------- START KANTOFF OFFICE LEFT -------------------------------*/
#sitenaam
{
float: left;
height: 226px;
width: 226px;
margin: 0 4px 0 0;
}
/*------------------------------- END KANTOFF OFFICE LEFT -------------------------------*/


/*------------------------------- START KANTOFF OFFICE RIGHT -------------------------------*/
#contentright
{
float: left;
width: 635px;
height: 226px;
min-height: 226px;
max-height: 226px;
}
#nieuwsbrief
{
float: left;
width: 635px;
height: 226px;
min-height: 226px;
max-height: 226px;
overflow: auto;
}
#contentright p
{
width: 500px;
color: #333;
font-size: 10px;
padding: 5px 0 0 10px;
}
#contentright #leftside { float: left; width: 280px; }
#contentright #rightside { float: left; width: 300px; }
#contentright #rightside p { padding: 3px 0 0 0; margin: 0 0 0 10px }
#contentright form { margin: 10px 0 0 10px; }
#contentright input[type="text"]
{
width: 140px;
height: 16px;
margin: 4px 0 0 10px;
padding: 3px 5px 0 5px;
border: 1px solid #c1c2c2;
background: url(../Graphics/Input_bg.jpg) repeat-x top left;
font-family: Verdana, Arial, sans-serif;
font-size: 10px;
color: #333;
}
#contentright textarea
{
width: 210px;
height: 50px;
margin: 4px 0 0 10px;
padding: 5px;
background: #e9e9e9;
border: 1px solid #c1c2c2;
overflow: auto;
font-family: Verdana, Arial, sans-serif;
font-size: 10px;
color: #333;
}
/*------------------------------- END KANTOFF OFFICE RIGHT -------------------------------*/


/*------------------------------- START PRODUCTEN -------------------------------*/
#producten
{
width: 558px;
height: 100px;
margin: 10px;
padding: 10px;
background: #f6f6f6;
border: solid 1px #e9e9e9;
overflow: hidden;
}
#producten_detail
{
width: 558px;
height: 100px;
padding: 10px;
background: #fff;
overflow: hidden;
}
#producten_detail img { float: left; padding: 3px; border: 1px solid #e9e9e9 !important; }
#producten_detail table { float: left; margin-left: 25px; width: 250px; }
#productentabel { border-collapse: collapse; border: none; }
#productentabel td { padding: 0 5px; }
#productentabel td img{ border: 3px solid transparent; }
#productentabel td img:hover { border:3px solid #ed1c24; }
/*------------------------------- END PRODUCTEN -------------------------------*/


/*------------------------------- START FOOTER -------------------------------*/
#footer { clear: both; width: 226px; height: 40px; }
#footer p { float: left; color: #666; margin:10px 0 0 0; }
#footer p a:link, #footer p a:visited, #footer p a:active { color: #666; text-decoration: none; }
#footer p a:hover { color: #333; text-decoration: underline; }
/*------------------------------- END FOOTER -------------------------------*/


/*------------------------------- START FOOTER2 -------------------------------*/
#footer2
{
margin: 5px 0 0 0;
padding: 5px 0 0 0; 
border-top:1px dotted #999;
text-align:center;
color:#333;
}
#footer2 p a:link, #footer2 p a:visited, #footer2 p a:active { text-decoration: none; color: #333; }
#footer2 p a:hover { text-decoration: underline; color: #ed1c24; }
/*------------------------------- END FOOTER2 -------------------------------*/


/*------------------------------- START NIEUWSITEM -------------------------------*/
.nieuwsitem
{
display: block;
width: 590px;
height: auto;
margin: 10px 0 0 10px;
padding: 0 0 10px 0;
border-bottom:1px dotted #999;
}
.nieuwsitem p { clear: both; margin: 0; padding: 10px 0 0 0 !important; }
.nieuwsitem p a:link, .nieuwsitem p a:visited, .nieuwsitem p a:active { color: #333; text-decoration: underline; }
.nieuwsitem p a:hover { color: #ed1c24; }
.nieuwsitem .titel
{
display: block;
float: left;
color: #333;
font-weight: bold;
}
.nieuwsitem .datum
{
display: block;
float: right;
color: #333;
font-weight: bold;
padding: 0 0 0 240px;
}
#button { margin: 20px 0 0 10px; }
#button a:link, #button a:visited, #button a:active
{
display: block;
min-width: 40px;
max-width: 100px;
height: 20px;
line-height: 20px;
padding: 0 5px;
background: #333;
color: #fff;
text-align: center;
text-decoration: none;
}
#button a:hover  { color: #fff; background: #ed1c24; }

/*------------------------------- END NIEUWSITEM -------------------------------*/


/*------------------------------- START VACATURE -------------------------------*/
.vacature
{
display: block;
width: 590px;
height: auto;
margin: 10px 0 0 10px;
padding: 0 0 10px 0;
}
.vacature p { clear: both; margin: 0; }
.vacature a:link, .vacature a:visited, .vacature a:active { color: #333; text-decoration: underline; }
.vacature .titel
{
display: block;
float: left;
color: #333;
font-weight: bold;
}
.vacature .datum
{
display: block;
float: right;
color: #333;
font-weight: bold;
padding: 0 0 0 240px;
}
.vacature ul
{
clear: both;
margin: 0;
padding: 10px 0 0 15px;
line-height: 14px;
color: #333;
}
.vacature ul li a:link, .vacature ul li a:visited, .vacature ul li a:active { color: #333; text-decoration: none; }
.vacature ul li a:hover { text-decoration: underline; }
/*------------------------------- END VACATURE -------------------------------*/


/*------------------------------- START CLASSES -------------------------------*/
.bold { font-weight: bold; }
.underline{ text-decoration: underline; }
.red { color: #ed1b24; }
/*------------------------------- END CLASSES -------------------------------*/


/*------------------------------- START FORMULIER OPMAAK -------------------------------*/
input.formbutton 
{ 
float: left;
display: block;
min-width: 60px;
max-width: 100px;
height: 20px;
margin: 5px 5px 0 10px;
padding: 0 5px;
background: #333;
border: none;
line-height: 20px;
text-align: center;
text-decoration: none;
font-size: 10px;
color: #fff;
}
input.formbutton:hover  { background: #ed1c24; cursor: pointer; }
input#nieuwsbrief_bt
{
width: 22px;
height: 21px;
margin: 0;
padding: 0;
background: url(../Buttons/Nieuwsbrief_bt.jpg) no-repeat;
border: none !important;
cursor: pointer;
}
/*------------------------------- END FORMULIER OPMAAK -------------------------------*/


/*------------------------------- START TABELLEN OPMAAK -------------------------------*/
tr#categorie { text-align: center; }
tr#categorie a:link, tr#categorie a:visited, tr#categorie a:active { color: #666; text-decoration: none; }
tr#categorie a:hover { color: #333; text-decoration: underline; }
/*------------------------------- EN TABELLEN OPMAAK -------------------------------*/


/*------------------------------- START BREADCRUMB -------------------------------*/
.breadcrumb a:link, .breadcrumb a:visited, .breadcrumb a:active
{
color: #333;
text-decoration: none;
}
.breadcrumb a:hover,.breadcrumb a#current2 { color: #333; text-decoration: underline; }
/*------------------------------- END BREADCRUMB -------------------------------*/


/*------------------------------- START IMG -------------------------------*/
img { border: none; }
/*------------------------------- END IMG -------------------------------*/


/*------------------------------- START ARCHIEFLIJST -------------------------------*/
#archieflijst
{
list-style: none;
margin: 10px 0 0 10px;
padding: 0;
color: #333;
}
#archieflijst li { display: inline; padding: 0; }
#archieflijst li a:link, #archieflijst li a:visited, #archieflijst li a:active
{
float: left;
display: block;
width: 80px;
padding: 4px;
background: #eee;
color: #333;
text-decoration: none;
text-align: center;
border-right: 2px solid #fff;
}
#archieflijst li a:hover { background: #ed1c24; color: #fff; }
#archieflijst #active{
float: left;
display: block;
width: 80px;
padding: 4px;
background: #ed1c24;
color: #fff;
text-decoration: none;
text-align: center;
border-right: 2px solid #fff;
}

/*------------------------------- END ARCHIEFLIJST -------------------------------*/


/*------------------------------- START PRODUCTEN TOOLTIP -------------------------------*/
a.tooltip { position: relative; }
a.tooltip span { display: none; }
a.tooltip:hover span 
{
z-index: 9999;
position: absolute;
display: block;
width:61px;
white-space: wrap;
bottom: 0;
left: 0;
margin: 0;
padding: 4px 2px;
background: #ed1c24;
color: #fff;
text-align: center;
text-decoration: none;
cursor: pointer;
}
/*------------------------------- END PRODUCTEN TOOLTIP -------------------------------*/


/*------------------------------- START REALISATIES -------------------------------*/
.realisaties { margin: 10px; width: 600px; color: #333; }
.realisaties td { padding:0 5px 5px 0; }
.realisaties img { float: left; border: 3px solid #eee; }
.realisaties img:hover { border: 3px solid #ed1c24; cursor: pointer; }
.realisaties .projectnaam { font-weight: bold; }
.realisatie_item 
{
float: left;
display: block;
width: 250px;
height:65px;
margin: 5px;
padding: 5px;
color: #333;
}
.realisatie_item img  {  float:left; display:block; width:65px; height:65px; margin: 0 5px 5px 0; border:3px solid #eee; overflow:hidden; }
.realisatie_item img:hover { border: 3px solid #ed1c24; cursor: pointer; }
/*------------------------------- END REALISATIES -------------------------------*/


/*------------------------------- START VACATURETEKST -------------------------------*/
.vacaturetekst { color: #333; text-decoration: none; }
.vacaturetekst a:link, .vacaturetekst a:visited, .vacaturetekst a:hover, .vacaturetekst a:active { color: #333 !important; text-decoration: underline; }
/*------------------------------- END VACATURETEKST -------------------------------*/


/*------------------------------- START NIEUWSFOTO -------------------------------*/
.nieuwsfoto { list-style: none; }
.nieuwsitem li { display: inline; } 
.nieuwsfoto img { border: 2px solid #ccc; margin: 0 5px 0 0; }
/*------------------------------- END NIEUWSFOTO -------------------------------*/

#adres_link
{
color:#333;
padding-left:10px;
padding-top:5px;
}

#adres_link a:link
{
color:#333;
text-decoration:none;

}

#adres_link a:hover
{
color:#de232a;
text-decoration:underline;
}