/*/ MAIN /*/

@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato-Regular.ttf');
}
/*bold version*/
@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato-Semibold.ttf');
	font-weight: bold;
}

body { 
      margin: 0px;
      font-family:"Lato", Helvetica, Sans-serif;
      color: black; font-size:12px;
      background-image: url('../img/bgbody.jpg');
      background-repeat:repeat;    
      line-height:15px;  
	    }  
      
/*/ new site feb 2015 /*/
h1 { font-family:"Lato", Helvetica, Sans-serif; color:#0c3644; font-size: 20px; padding:0px; margin:0px; padding-bottom:10px; line-height:24px; }
h2 { font-family:"Lato", Helvetica, Sans-serif; color:#0c3644; font-size: 16px; padding:0px; margin:0px; padding-bottom:8px; }
h3 { font-family:"Lato", Helvetica, Sans-serif; color:#227293; font-size: 14px; padding:0px; margin:0px; padding-bottom:8px; }
h4 { font-family:"Lato", Helvetica, Sans-serif; color:#227293; font-size: 13px; padding:0px; margin:0px; padding-bottom:4px; margin-top:8px; }

p { padding:0px; margin:0px; }
hr { margin-top:12px; margin-bottom:12px; }

/*/ operators and container /*/
.l { float:left; }
.r { float:right;}
.c { clear:both; }

.container {
  width:996px;
  margin:auto;
  background:white;
}
/*/ END operators and container /*/



/* new site html5 / css3 responsiv /*/
/*/ triangle menu down /*/
.menuholder { background:#0c3644; width:100%; }
.menuholder a {
  text-decoration:none;
  font-family:"Lato", Helvetica, Sans-serif;
  font-size:16px;
  color:#eee;
}
.t-down { width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 10px solid #fff; margin:auto; margin-top:4px; }
.t-down-no { width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 10px solid transparant; margin:auto; margin-top:4px; }



ul {
  font-family:"Lato", Helvetica, Sans-serif;
  font-size:18px;
  color:white;
  text-align: left;
  display: inline;
  margin: 0px;
  padding: 0px;
  list-style: none;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
ul li {
  display: inline-block;
  margin-right: -4px;
  position: relative;
  padding: 10px 15px 10px 15px;
  background: #0c3644;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}   
ul li .thm {
  font-family:"Lato", Helvetica, Sans-serif;
  font-size:18px;
  color:white;
}                  
ul li:hover {
  background: #227293;
  color: #fff;
  z-index:1;
}                     
ul li ul {
  padding: 0;
  color: #fff;
  position: absolute;
  top: 35px;
  left: 0;
  width: 150px;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0.55, 0.55);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0.55, 0.55);
  box-shadow: 0px 0 5px rgba(0, 0, 0.55, 0.55);
  display: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -transition: opacity 0.2s;
}
ul li ul li { 
  background: #227293; 
  display: block; 
  color: #fff;
  padding: 5px 5px 5px 10px;
}
ul li ul li:hover { background: #659db4; }
ul li:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}

.fixie {
position:fixed;
width:996px;
z-index:99;
}
.loose {
padding-top:75px; 
}

/* logobar */
.logobar { 
  background-color: #c80000;
  width:100%;
}
.logo { 
  float:left; 
  width:40%;
  padding-top:4px;
}  
.logo img { border:0px; max-width:100%; }

.src { 
  float:right; 
  margin-right:10px;
}
.srchform {
  margin:10px; 
}
.srcbar { 
  border:0px; 
  padding-left:3px;
  vertical-align: middle; 
  margin:0px; 
  width:206px; 
  height:20px; 
  font-family: Verdana; 
  }
.srcbut
  { margin:0px; 
    padding:0px; 
    width:74px; 
    height:26px; 
    vertical-align:middle;
    font-family: Verdana; 
    cursor:pointer;
  }
/* END logobar */

/* in between */
.topbar {
      height:10px;
      background-image: url('../img/bgtopbar.jpg');
      background-repeat: repeat-x;    
  }
/* END in between */


/* navbar */
.navbarcontainer { 
  margin:15px;
  text-align:left;
  background:#efefef;
  border-radius:0px;
  border:1px solid #88acb6;
}
.nav { 
  font-family:"Lato", Helvetica, Sans-serif;
  width:100%;
  color:#000;
  padding:5px;
}
/* END navbar */

/* content */
.contentcontainer { 
  margin:15px;
  text-align:left;
  background:#fff;
}

.ht { width:100%; }
.tat { width:80%; }
.zt { width:60%; }
.vit { width: 50%; }
.vt { width:40%; }
.dt { width:30%; }
.tt { width:20%; }
.v25 { width:25%; }

.spacer-vert { height:15px; }

.block {
  background:#efefef;
  border-radius:0px;
  border:1px solid #88acb6;
  padding:10px 15px 10px 15px; overflow-y:hidden;
}
.b-l { }
.b-m { margin-left:15px;  }
.b-r { margin-left:15px; }

.homeleft { padding:10px 15px 10px 15px; height:420px; overflow-y:hidden; }
.homeright { margin-left:15px; padding:10px 15px 10px 15px; height:420px; overflow-y:hidden; }

/* address cards */
.data, .opinions, .city, .data2, .data3 {
  border:1px solid #88acb6;
  background: #dedede;
  padding:5px;
  margin-bottom:6px;
  font-family:"Lato", Helvetica, Sans-serif;
}
.opinions {
  margin-bottom:10px;
}
.fn         { padding:0px; margin:0px; padding-bottom:2px; margin-top:4px; }
.fn a       { font-size:16px; font-weight:bold; text-decoration:none; color:#227293 }
.fn a:hover { font-size:16px; font-weight:bold; text-decoration:underline; color:#0c3644; }

.adr, .tel, .site, .extrainfo { padding:0px; margin:0px; font-size:13px; line-height:19px; }
.sa { padding:0px; margin:0px;  } /* street address */
.pc { padding:0px; margin:0px;  }
.pc a { font-weight:bold; text-decoration:none; color:#227293; }
.pc a:hover {
  font-weight:bold; text-decoration:underline;
  color:#0c3644;  
}

.opiheader, .cityheader                 { font-size:16px; line-height:25px; }
.opiheader a, .cityheader a             { font-size:16px; font-weight:bold; text-decoration:none; color:#227293 }
.opiheader a:hover, .cityheader a:hover { font-size:16px; font-weight:bold; text-decoration:underline; color:#0c3644; }

.opitext { font-size:14px; line-height:18px; padding-top:6px; padding-bottom:4px; }

/* END address cards */

/* homepage */
.homebrand {
  width:50%;
  float:left; 
  height:60px; 
  margin-bottom:10px;
}
.homebrand-inner {
  height:100%;
  background:#fff;
  border:1px solid #88acb6;
  margin:4px;
  text-align:center;
} 
.homebrand-inner img {
  border:0px;
  vertical-align: middle;
}
.homebrand-inner-helper {
  display: inline-block;
  height:100%;
  vertical-align:middle;
} 
/*/ end homepage /*/

/*/ vermelding /*/
.data2 {  
  background: #efefef;
  padding:10px;
  margin-bottom:15px;
}
.data3 {
  background: #efefef;
  padding:10px;
  margin-bottom:15px;
  margin-left:15px;
}
.compbrand {
  width:20%;
  float:left; 
  height:60px; 
  margin-bottom:10px;
}
.compbrand-inner {
  height:100%;
  background:#fff;
  border:1px solid #88acb6;
  margin:4px;
  text-align:center;
} 
.compbrand-inner-selected {
  height:100%;
  background:#fff;
  border:1px solid #88acb6;
  margin:4px;
  text-align:center;
  -moz-box-shadow: inset #88acb6 0px 0px 0px 3px;
  -webkit-box-shadow: inset #88acb6 0px 0px 0px 3px;
  box-shadow: inset #88acb6 0px 0px 0px 3px;
} 
.compbrand-inner img, .compbrand-inner-selected img {
  border:0px;
  vertical-align: middle;
}
.compbrand-inner-helper {
  display: inline-block;
  height:100%;
  vertical-align:middle;
} 

.contmerkcontainer {
  float:left;
  width:25%;
}

.contmerk {
    height: 70px;
    position: relative;
    background:#fff;
    border:1px solid #88acb6;
    margin:4px;
    text-align:center;
    line-height:60px;
}  
.infoi {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index:10;
}
.infoi a {
  display:block;
  height:100%;
} 
.infoi img {
  vertical-align:middle;
  border:0px;
}
.navi { 
  display:none;
  background:#c80000; 
  color:white;
  font-weight:bold;
  width: 100%;
  height: 15px;
  margin-top:55px;
  line-height:15px;
  position: absolute;
  top: 0; 
  left: 0;
  z-index:-1;
}         
.infoi a:hover + .navi {
  display:block;
}  
.headmerk {
  float:left;
  width:70%;
  padding:5px;
}       

#opiform {
}
#opiform textarea {
  width:90%;
  height:100px;
  border:1px solid #88acb6;
  padding:3px;
  font-family:"Lato", Helvetica, Sans-serif;
  font-size:14px;
  
}
#opiform input[type="text"] {
  width:75%;
  border:1px solid #88acb6;
  padding:3px;
  font-family:"Lato", Helvetica, Sans-serif;
  font-size:14px;
}
#opiform input[type="submit"] {
  margin-top:8px;
  cursor:pointer;
  width:75%;
  border:1px solid #88acb6;
  padding:3px;
  font-family:"Lato", Helvetica, Sans-serif;
  font-size:14px;
  color:#eee;
  background: #227293;
}
#opiform input[type="submit"]:hover {
  color:#fff;
  background:#0c3644;
}
/*/ end vermelding /*/

/*/ paging /*/
.next {
  float:left;
  border:1px solid #88acb6;
  margin-right:3px;
  
}
.prev {
  float:left;
  border:1px solid #88acb6;
  margin-right:3px;
}
.page, .thispage {
  float:left;
  border:1px solid #88acb6;
  margin-right:3px; 
}
.next a, .prev a, .page a, .thispage {
  display:block;
  padding:3px;
  padding-left:6px;
  padding-right:6px;
} 
.next a:hover, .prev a:hover, .page a:hover {
  color:white;
  background:#88acb6;
}      
.thispage {
  font-weight:bold;
}    
.from {
  margin-top:5px;
}    
/*/ end paging /*/

/*/ zoekpagina /*/
.zoekresult {
  background:#fefefe;
  border-radius:0px;
  border:1px solid #88acb6;
  padding:10px 15px 10px 15px; 
  line-height:21px;  
}   

/* footer */    
.footer, .footer a {   
  font-family:"Lato", Helvetica, Sans-serif; 
  font-weight:bold;        
  text-align:center;
  background: #c80000; 
  padding:7px; 
  color:#ccc;
} 
.footer a {
  text-decoration:underline;
}
.footer a:hover {   
  text-decoration:none;
}  
             
/* end footer */

/* thumbs simple */
.thumbcontainer {
width:50%;
float:left;
}
.thumb {
  border:2px solid white;
}
.thumb img {
 max-width:100%;
}
.black_overlay{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.8;
opacity:.80;
filter: alpha(opacity=80);
}
.white_content {
display: none;
position: absolute;
top: 25%;
left: 25%;
padding: 16px;
border: 2px solid #454545;
background-color: white;
z-index:1002;
overflow: auto;
}
/* end lightbox simple */







/* RESPONSIVE *****************************************************************************************/
@media screen and (max-width: 880px){

#nav
    {
        position: relative;
    }
        #nav > a
        {
        }
        #nav:not( :target ) > a:first-of-type,
        #nav:target > a:last-of-type
        {
            display: block;
        }
 
    /* first level */
 
    #nav > ul
    {
        height: auto;
        display: none;
        position: absolute;
        left: 0;
        right: 0;
    }
        #nav:target > ul
        {
            display: block;
        }
        #nav > ul > li
        {
            width: 100%;
            float: none;
        }
 
    /* second level */
 
    #nav li ul
    {
        position: static;
    }

.container {
  width:100%;
  margin:0px;
  padding:0px;
  background:white;
}
.fixie {
  position:relative;
  width:100%;
  margin:0px;
  padding:0px;
}
.loose {
padding:0px; 
margin:0px;
}
/* navbar */
.navbarcontainer { 
  margin:0px;
  text-align:left;
  background:#efefef;
  border-radius:0px;
  border:1px solid #88acb6;
}
.nav { 
  font-family:"Lato", Helvetica, Sans-serif;
  width:100%;
  color:#000;
  padding:0px;
  padding-top:5px;
  padding-top:5px;
}
/* END navbar */

.homeleft, .homeright { margin-bottom:10px; padding:10px 15px 10px 15px; height:400px; overflow-y:hidden; }

.block {
  background:#efefef;
  border-radius:0px;
  border:1px solid #88acb6;
  padding:10px 15px 10px 15px;
  margin:0px;
  margin-top:10px;
  padding-bottom:35px;
}

/* in between */
.topbar {
      height:0px;
  }
/* END in between */
.l { clear:both;}

.ht, .tat, .zt, .vit, .vt, .dt, .tt, .v25 { width:100%; margin:0px; }

.data2 { padding:3px; margin:0px; margin-bottom:10px; }
.data3 { padding:3px; margin:0px; margin-bottom:10px; }

/* koppelingen */
.kop { display:none; }
/* end koppelingen */

}