/**
 * Custom CSS
 * Use this file to override styles if you feel uncomfortable editing
 * component stylesheets.
 ============================================================================ */

/* colors 

groen #74a200
lichtblauw #2375b0
donkerblauw #172c73
azurblauw: #45b9ff
footerblauw: #dae5ef;
*/

html {
    background-color: #fff !important;
    
}

body {
    color: #000;
	margin: 0;
font-weight: 400;
font-style: normal;
	font-family: 'Trebuchet MS', sans-serif;
	max-width: 100%;
    overflow-x: hidden;
}

h3 {color: #2375b0;
font-weight: lighter;
text-align: center;}

h2 {font-family: 'Trebuchet MS', sans-serif;
font-weight: 900;
font-style: normal;
color: #172c73;}

.spb-popup-main-wrapper {
  position: fixed;
  padding: 5px;
  border: 4px solid #fff;
  border-radius:  10px;
  z-index: 999999;
  background-color: #2375b0;
}

#block-popupofferte p {
    text-align:  center; color:  #fff; font-size:  1em;
  
}

.offertepopup {
width: 214px;
height: 120px;
background-color: #2375b0;
text-align: center;
margin: auto;
}

.offertepopup a {color:  #fff; line-height: 1em; font-size:  2em; font-weight:  bolder;}
.offertepopup a:link {color:  #fff; }
.offertepopup a:active {color:  #fff; }
.offertepopup a:hover {text-decoration:  none; color:  #000;}
.offertepopup a:visited {color:  #fff; }

.spb_close {
  border: 2px solid;
  border-radius: 17px;
  cursor: pointer;
  float: right;
  margin: 3px;
    padding-top: 2px;
    padding-right: 10px;
    padding-bottom: 2px;
    padding-left: 10px;
  color: #fff;
  background: none;
}

/* soc media */

#block-socmed {
    width: 140px;
    right: 0;
    float: right;
    height: 30px;
    z-index:999 !important;
    top: 5px;
    position: relative;
}
/*
.socmed {float: left; margin-left: 5px;}

#mail_button img {width: 26px;
height: 26px;}

#mail_button a:hover {
opacity: 0;
   }

#mail_button {background-image: url(/sites/calvel.dd/files/inline-images/mail-geel.png);
width: 27px;
height: 27px;
background-size: 27px 27px;
}

#facebook_button img {width: 26px;
height: 26px;}

#facebook_button a:hover {
opacity: 0;
   }

#facebook_button {background-image: url(/sites/calvel.dd/files/inline-images/faceb-geel.png);
background-size: 27px 27px;
width: 27px;
height: 27px;}

#bel_button img {width: 26px;
height: 26px;}

#bel_button a:hover {
opacity: 0;
   }

#bel_button {background-image: url(/sites/calvel.dd/files/inline-images/bel-geel.png);
background-size: 27px 27px;
width: 27px;
height: 27px;
}

#instagram_button img {width: 26px;
height: 26px;}

#instagram_button a:hover {
opacity: 0;
   }

#instagram_button {background-image: url(/sites/calvel.dd/files/inline-images/insta-geel.png);
background-size: 27px 27px;
width: 27px;
height: 27px;
}

#site_button img {width: 27px;
height: 27px;}

#site_button a:hover {
opacity: 0;
   }

#site_button {
    background-image: url(/sites/calvel.dd/files/inline-images/rood-web.png);
    background-size: 27px 27px;
    width: 27px;
    height: 27px;
}

#lokatie_button img {width: 27px;
height: 27px;}

#lokatie_button a:hover {
opacity: 0;
   }

#lokatie_button {
    background-image: url(/sites/calvel.dd/files/inline-images/rood-lok.png);
    background-size: 27px 27px;
    width: 27px;
    height: 27px;
}
*/


.l-rw {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    /*width: 80%; */
	padding: 0px;
}

.regions {background: none;

}
.node {
    background: none;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}



.page {background: none;

}

.pr-header {
    color: #000;
    background-color: #fff;
}

.node--id-11 {margin-top: 50px;}


.node__title {font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	text-transform: uppercase;
	font-weight: lighter;
	text-align: left;
    color: #2375b0 !important;
}

p {font-size: 0.9em;
text-align: left;
line-height: 1.2em;
color: #666;
font-family: 'Trebuchet MS', sans-serif;
font-weight: 400;
font-style: normal;}

ul li {font-size: 1em;
text-align: left;
line-height: 1em;}



/* superfish menu */
#block-sertozelfbouwventilatie {text-align: center;
display: block;
width: 650px;
margin-left: auto;
margin-right:auto;
    margin-top: 30px;
}


ul.sf-menu.sf-style-none a, ul.sf-menu.sf-style-none a:visited, ul.sf-menu.sf-style-none span.nolink {
  border: 0 none;
  padding: 0.75em 1em;
  padding: 0.75rem 0.5rem;
}

#block-serto-ventilatie-branding {  }

.l-highlighted { border-bottom-color:#2375b0;
border-bottom-style: solid;
border-bottom-width: medium;
margin-top: -2vh;
}

#superfish-calvel {width: 830px;
margin-left: auto;
margin-right:auto;
  margin-top: 30px;
}

ul.sf-menu.sf-style-white li, ul.sf-menu.sf-style-white.sf-navbar {
background: #fff;
}



ul.sf-menu.sf-style-white a, ul.sf-menu.sf-style-white a:visited, ul.sf-menu.sf-style-white span.nolink {

    border: 0 none;
    color: #2375b0 !important;
    padding: 0.75em 1em; 
    background-color: none;
        border-bottom-color:#fff;
border-bottom-style: solid;
border-bottom-width: thick;
    

}

ul.sf-menu.sf-style-white a:hover {
    border-bottom-color: #2375b0;
border-bottom-style: solid;
border-bottom-width: thick;
background-color:#FFF;
text-decoration: none;
color: #fff;}

.l-leaderboard {background-color: #fff;
width: 100%;}

#leaderboard .l-rw {
    height: 77px;
    
}

.pr-highlighted__rw{height: 50px;}

#leaderboard .l-r {
    float: none;
    width: 100%;
    padding: 0 !important;
    padding-left: 15px;
}


#leaderboard ul.slides li {list-style-type: none !important; }
.slides img {width: 100%;}


/* logoblock */


.site-branding__logo-link {
   position: absolute;
    top: 15px;
    background-color: #fff;
    width: 150px;
    -webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
    z-index: 400;
}

.site-branding__logo-img {
 max-width: 150%;
padding-left: 0;
padding-bottom: 0;
margin-left: 4vw;
}

/* flexslider */

.flexslider {
  margin: 0;
  padding: 0;
  margin-top: 53px;
 /*z-index: -1;*/
  position: relative;
 border: 0;
}

.sliderhome{width: 100%;
    position: absolute;
left: 0;
margin-top: 31px;
z-index: -1;
border: 0;
}


.view-slider-horizontaal {width: 100%;
    margin-top: 0px;
    padding: 0;
    z-index: -1;
}

.view-slider-horizontaal .views-field-body {
    position: absolute;
width: 40vw;
margin-top: 5%;
margin-left: 53vw;
}

.view-slider-horizontaal h1 {
    color: #172c73;
font-family: 'Trebuchet MS', sans-serif;
font-weight: 900;
    font-size: 2.4vw;
}


.view-slider-horizontaal p {
color: #172c73;
font-family: 'Trebuchet MS', sans-serif;
font-weight: 400;
    font-size: 1.5vw;
}

.knopslider {
width: 214px;
height: 43px;
background-color: #2375b0;
text-align: center;
}

.knopslider a {color:  #fff; line-height: 2.5em; }
.knopslider a:link {color:  #fff; }
.knopslider a:active {color:  #fff; }
.knopslider a:hover {text-decoration:  none; color:  #000;}
.knopslider a:visited {color:  #fff; }

#block-opleidingopdewerf {
  position: absolute;
  width: 300px;
  height: auto;
  right: 0;
  margin-top: 54px;
  padding-right: 155px;
  z-index: 400;
}

#block-opleidingopdewerf img {width: 100%; height: auto;}


/* main content */

#user-login-form {max-width: 600px; margin:  auto;}

#system-messages-block {max-width: 997px;
  margin: auto;
    margin-top: auto;
  margin-top: 118px;}

  .webform-submission-form {margin-top: 65px !important;}

/* frontpage */

.node--id-1 .node__title {display: none;}

.systemen img {border-radius: 0px; padding: 5px;  width: 100%; height:  auto;}

.systeem {
   width: 100%;
  margin: 10px auto;
  position: relative;
  text-align:center;
  padding-bottom:  50%;

}

.systemen .systeem {
  height: 419px;
  width: 320px;
  display:inline-block;
  margin: 10px;
    vertical-align: top;
    border-color: #2375b0; border-width: medium; border-style: solid;
    padding:  7px;
    margin-top: 30px;
    
    
}

.systemen {
  text-align: center;
}

.views-field-field-zelfbouwpakket { text-align: left; font-family: 'Trebuchet MS', sans-serif;
font-weight: 700; color: #2375b0; font-size: 1.5em;
padding-left: 5px;
padding-top: 5px;}

.views-field-field-systeem-titel {text-align: left; font-family: 'Trebuchet MS', sans-serif;
font-weight: 700; color: #2375b0; font-size: 1.4em;
padding-left: 5px;
padding-top: 10px;}

.views-field-field-introtekst-systeem-zelfbou p {color:  #000; padding: 5px; padding-top: 10px; height: 115px;}

.views-field-field-promopastille {width: 133px;
height: 200px;}

.views-field-field-promopastille img {width:  100%; height:  auto; margin-top: -777px;}

.views-field-field-meer-link {width:  150px; height:  100px; background-color: #2375b0; margin-top: -150px; }

.views-field-field-meer-link {
  width: 126px;
  height: 47px;
  background-color: #2375b0;
  margin-top: -215px;
  margin-left: 168px;
}

.views-field-field-meer-link a {color:  #fff; line-height: 2.5em; }
.views-field-field-meer-link a:link {color:  #fff; }
.views-field-field-meer-link a:active {color:  #fff; }
.views-field-field-meer-link a:hover {text-decoration:  none; color:  #000;}
.views-field-field-meer-link a:visited {color:  #fff; }

ul.usp {
  margin: auto;
width: 80%;
margin-top: 50px;
display: flex;
align-items: center;
z-index: 400;
position: relative;
max-width: 1300px;
}

ul.usp li {
  margin: 0;
display: flex;
align-items: center;
font-size: 0.8em;
width: 20%;
}

ul.usp li::before {
  content:url(https://sertozelfbouwventilatie.be/serto/sites/default/files/vinkje.png);
  transform: scale(.5); vertical-align: middle; display:  inline-block;
  top: -3px;
position: relative;
left: 7px;
}


ul.usp li:nth-child(3) {
  margin-left: 23px;
}

ul.usp li:nth-child(4) {
  margin-left: -63px;
}

ul.usp2 {
  margin: auto;
width: 100%;
margin-top: 50px;
display: flex;
position: relative;
max-width: 1300px;
padding-left:  0;
}


ul.usp2 li {
  margin: 0;
    margin-left: 0px;
  display: flex;
  align-items: center;
  font-size: 0.8em;
  width: 30%;
}

ul.usp2 li::before {
  content:url(https://sertozelfbouwventilatie.be/serto/sites/default/files/vinkje.png);
  transform: scale(.5); vertical-align: middle; display:  inline-block;
  top: -3px;
position: relative;
left: 7px;
}


ul.usp2 li:nth-child(3) {
  margin-left: 23px;
}

ul.usp2 li:nth-child(4) {
  margin-left: -63px;
}




/* reviews */



.reviews {
  text-align: center;
  margin-top: 50px;
}

#block-views-block-reviews-block-1-title {text-align: center;}

/*#block-views-block-reviews-block-1-title::before 
{content:url(https://sertozelfbouwventilatie.be/serto/sites/default/files/icon-ondersteuning-op-de-werkvloer.png);
      transform: scale(.8); 
      display: block;
    position: relative;
    margin-top: 42px;
    margin-bottom: 24px;
    margin-left: auto;
    margin-right: auto;
}
*/

.review {
   width: 100%;
  margin: 10px auto;
  position: relative;
  text-align:center;
  padding-bottom:  50%;

}

.reviews .review {
  height: 250px;
  width: 320px;
  display:inline-block;
  margin: 10px;
    vertical-align: top;
    padding:  7px;    
}

.reviews .review p {color: #2375b0; font-weight:  lighter; height: 125px;}

#block-views-block-reviews-block-1 {padding-bottom:  10%;}

#block-views-block-reviews-block-1 h6 {font-weight:  lighter; text-align:  left; width: 150px;}

#block-views-block-reviews-block-1 h6::after {
  content:url(https://sertozelfbouwventilatie.be/serto/sites/default/files/sterren-positieve-review.png);
  transform: scale(.5); vertical-align: middle; display:  inline-block;
  top: -25px;
position: relative;
left: 139px;
}

#main-content {}

/*SYSTEEMPAGINA'S DETAILS*/

.node--type-systeem {width:  100%; }
.atl__lr {max-width: 1100px; margin:  auto;}


.node--type-systeem h2  {font-family: 'Trebuchet MS', sans-serif;
font-weight: 900;
font-style: normal;
font-size: 3em;
color: #2375b0;

}
/*
.node--type-systeem h2::before {content:url(https://sertozelfbouwventilatie.be/serto/sites/default/files/systemen-zelfbouwventilatie.png);
  transform: scale(1); vertical-align: middle; display:  inline-block;
  top: -3px;
position: relative;
left: -7px;}
*/

.node--type-systeem h3  {font-family: 'Trebuchet MS', sans-serif;
font-weight: 600;
font-style: normal;
font-size: 2em;
color: #2375b0;
text-align: left;

}

.field-node--field-promopastille {width:  150px; float:  right; margin-top: -64px; }

.field-node--field-zelfbouwpakket-bestaat-uit {background-color: #dae5ef; padding:  20px;}

.field-node--field-minpunten-ventilatiesystee {background-color: #dae5ef; padding:  20px; margin-top: -20px;}

 #wrapper-pluspunten {width:  43%; float:  left;}
 #wrapper-pluspunten h3 {text-align: left; margin-left: 31px;}

#wrapper-minpunten {width:  54%; float:  right}
#wrapper-minpunten h3 {text-align: left; margin-left: 31px;}

 ul.bestaat_uit {
    list-style: none;
    list-style-position: outside;
}

ul.bestaat_uit li {font-size: 0.8em; 
    background-repeat: no-repeat;
    background-image: url(https://sertozelfbouwventilatie.be/serto/sites/default/files/vinkje_pluspunten-klein.png);
background-position-x: left;
background-position-y: top;
padding-left: 33px;
background-size: 20px;
  padding-top: 2px;
  padding-bottom: 3px;
  margin-left: -50px;
  font-size: 1em;
  font-weight: 100;
  line-height: 1.2em;
}


 ul.pluspunten{
    list-style: none;
    list-style-position: outside;
}

ul.pluspunten li {font-size: 0.8em; 
    background-repeat: no-repeat;
    background-image: url(https://sertozelfbouwventilatie.be/serto/sites/default/files/vinkje_pluspunten-klein.png);
background-position: left;
padding-left: 33px;
background-size: 20px;
  padding-top: 2px;
  padding-bottom: 3px;
  margin-left: -50px;
  font-size: 1em;
}

 ul.minpunten{
    list-style: none;
    list-style-position: outside;
}

ul.minpunten li {font-size: 0.8em; 
    background-repeat: no-repeat;
    background-image: url(https://sertozelfbouwventilatie.be/serto/sites/default/files/vinkje_minpunten-klein.png);
background-position: left;
padding-left: 33px;
background-size: 20px;
  padding-top: 2px;
  padding-bottom: 3px;
  margin-left: -50px;
  font-size: 1em;
}

#upgraden h3 {width: 100%; margin-top: 211px;
text-align: left;}


#merkwrapper1 {width: 100%; }

/*#merkwrapper2 {width: 100%; height: 270px; margin-top: 50px; padding-bottom: 30%;}*/

.afbeelding_merk {width:43%; float: left;}

#merktextwrapper {width: 54%; padding-left: 3%; float: right;}
#merktextwrapper h3 {width:100%; text-align: left; color: #2375b0; font-weight: 200;}
#merktextwrapper h4 {width:100%; text-align: left; color: #000; font-weight: bold;}
.tekst_merk  p {color: #000;}

.eindepagina {  min-height: 126px;
  margin-top: 50px;
}

/* uitzetten melding adaptivethemes.com */

.attribution__link {display: none;}

#block-serto-ventilatie-footer {
position: relative;
bottom: 0;
width: 100%;
background-color: #dae5ef;
text-align: center;
height: 90px;
z-index: 400;
font-size:0.8em;
}

#block-serto-ventilatie-footer ul li {
display:  inline-block;
width:  auto;
margin:  10px;
}

#block-serto-ventilatie-footer a:link {color: #000;}
#block-serto-ventilatie-footer a:active {color: #000;}

#block-serto-ventilatie-footer a:hover {color: #172c73; text-decoration: none;}
#block-serto-ventilatie-footer a:visited {color: #000;}

#block-calvel-footer {padding-bottom: 30px;}
#block-loginformpopup-2 {width: 110px;
float: left;
padding-top: 8px;}

#block-loginformpopup-2 a {color: #000;
text-transform: uppercase;}

#block-loginformpopup-2 a:link {color: #000;}
#block-loginformpopup-2 a:active {color: #000;}
#block-loginformpopup-2 a:hover {color: #172c73; text-decoration: none;}
#block-loginformpopup-2 a:visited {color: #000;}




#block-socmedia {
    width: 200px;
    right: 10px;
    position: fixed;
    margin-top: 15px;
	height: 50px;
    z-index: 1000;
}

#facebook_button {

   
    height: 30px;
    opacity: 1;
    width: 30px;
    float: left;
    margin-left: 15px;
}

#instagram_button {
    
    height: 30px;
    opacity: 1;
    width: 30px;
    float: left;
    margin-left: 15px;
}

#mail_button {
   
    height: 30px;
    opacity: 1;
    width: 30px;
    float: left;
    margin-left: 15px;
}

#site_button {
   
    height: 30px;
    opacity: 1;
    width: 30px;
    float: left;
    margin-left: 15px;
}

#site_lokatie {
   
    height: 30px;
    opacity: 1;
    width: 30px;
    float: left;
    margin-left: 15px;
}


.calvel-lid {
  width: 100%;
  margin: 0px auto;
  position: relative;
  text-align:center;
    margin-top: 0px;
    padding-bottom: 15%;
}

.calvel-lid .calvel-leden {
  height: 250px;
  width: 250px;
  display:inline-block;
  margin: 10px;
    vertical-align: top;
}

.calvel-leden .views-field-title  {
    position: absolute;
text-align: center;

color: #FFF;
line-height: 250px;}

.calvel-leden .views-field-title a  { text-transform: uppercase;
    color: #fff;
    display: block;
    width: 250px;
height: 250px;
background-color: rgba(0,0,0,0.62);
}

.calvel-leden .views-field-title a:link  { text-transform: uppercase;
}

.calvel-leden .views-field-title a:visited  { text-transform: uppercase;
    color: #fff;
}

.calvel-leden .views-field-title a:hover  { text-transform: uppercase;
    text-decoration: none;
    color: #fff;
    opacity: 0.2;
}

.calvel-leden .views-field-title a:active  { text-transform: uppercase;
    color: #fff;
}

/* menu responsive */

.menuparent {color: #2375b0;}

div.sf-accordion-toggle.sf-style-white a {
    background: #fff !important;
border: none;
color:
    #000;
    display: inline-block;
    font-weight: bold;
    padding: 1em 10em 1em 1em;
    position: relative;
}

div.sf-accordion-toggle.sf-style-white span {display: none;}

/* verslagen */

.field-node--field-foto {
 width: 100%;
  margin: 10px auto;
  position: relative;
  text-align:left;
}

.field-node--field-foto figure {
  height: 200px;
  width: 200px;
  display:inline-block;
  margin-left: 0px;
  margin-right: 10px;
}

.node--type-verslag h3 {text-align: left;
font-size: 1.5em;
color: #000;}

.verslagen-overzicht {
    max-width: 1200px; margin-left: auto; margin-right: auto;}

.verslag-activiteit {border-top-color: #000;
border-top-style: dotted;
border-top-width: thin;
margin-top: 10px;
max-width: 800px;}

.node--type-verslag .field-node--body {max-width: 800px;}

.field-node--node-author {max-width: 800px;
border-top-color: #000;
border-top-style: dotted;
border-top-width: thin;}

.l-r {
  padding: 0px !important;
    padding-top: 0px !important;
    padding-right: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 0px !important;
}


#block-stappenplan {position:  absolute; background-color: #dae5ef; width: 100%; margin-top: -100px;}

#block-stappenplan h2 {text-align: left; padding-top: 20px; padding-bottom: 20px; line-height:  1.5em;}

#block-stappenplan .block__inner {width: 90%;
max-width: 1000px;
margin: auto;}
.afbeelding_stappenplan {width: 43%; float:  left;}
.tekst_stappenplan {width:54%; float:  right; margin-left:  15px;}

.tekst_stappenplan p {color: #2375b0;}

.tekst_stappenplan ol li {color: #2375b0;
font-size: 0.9em;
margin-left: -39px;
line-height: 1.4em;
padding-top: 5px;
}

.knop {
width: 214px;
height: 43px;
background-color: #2375b0;
text-align: center;
float: right;
}

.knop a {color:  #fff; line-height: 2.5em; }
.knop a:link {color:  #fff; }
.knop a:active {color:  #fff; }
.knop a:hover {text-decoration:  none; color:  #000;}
.knop a:visited {color:  #fff; }


#block-waaromsertozelfbouwventilatie {position:  relative; width: 100%; margin-top: 488px;}
#block-waaromsertozelfbouwventilatie h2 {text-align: left;
padding-top: 20px;
line-height: 1.3em;
padding-bottom: 20px;}

#block-waaromsertozelfbouwventilatie .block__inner {width: 90%;
max-width: 1000px;
margin: auto;}

#block-waaromzelfbouwventilatie2eparagraaf {position:  relative; width: 100%; margin-top:0px; padding-bottom:  5%;}

#block-waaromzelfbouwventilatie2eparagraaf .block__inner {width: 90%;
max-width: 1000px;
margin: auto;}

/* VASTE PAGINA'S */

.node--type-vaste-pagina {max-width: 1100px;
margin: auto;}


.node--type-vaste-pagina h1 {font-family: 'Trebuchet MS', sans-serif;
font-weight: 900;
font-style: normal;
font-size: 2.8em;
color: #172c73;

}

/*
.node--type-vaste-pagina h1::before {content:url(https://sertozelfbouwventilatie.be/serto/sites/default/files/ervaring-zelfbouwventilatie.png);
  transform: scale(1); vertical-align: middle; display:  inline-block;
  top: -3px;
position: relative;
left: -7px;}
*/

#vastepagina_wrapper {width: 100%; }

.vastepagina_afbeelding {width:43%; float: left;}

.vastepagina_textwrapper {width: 54%; padding-left: 3%; float: right;}

#eindeervaring {margin-top: 782px;}



.node--type-vaste-pagina h2 {font-family: 'Trebuchet MS', sans-serif;
font-weight: 400;
font-style: normal;
color: #2375b0;
font-size: 2em;
}

/*
.node--type-vaste-pagina h2::before {content:url(https://sertozelfbouwventilatie.be/serto/sites/default/files/pijl.png);
  transform: scale(.5); vertical-align: middle; display:  inline-block;
  top: -3px;
position: relative;
left: -7px;}
*/

.quote {font-family: 'Trebuchet MS', sans-serif;
font-weight: lighter;
font-style: italic;
color: #2375b0;
font-size: 1em;
padding: 10px;
width: 100%;
border-color: #2375b0;
border-width: thin;
border-style: solid;
text-align: center; 
margin-top: 50px;}



.knopmidden {
width: 258px;
height: 70px;
background-color: #2375b0;
text-align: center;
margin: auto;
line-height: 70px;

}

.knopmidden a {color:  #fff; line-height: 70px;  width: 258px; height: 70px; background-color: #2375b0; display: block;}
.knopmidden a:link {color:  #fff; line-height: 70px;  width: 258px; height: 70px; background-color: #2375b0; display: block;}
.knopmidden a:active {color:  #fff; line-height: 70px;  width: 258px; height: 70px; background-color: #2375b0;  display: block;}
.knopmidden a:hover {text-decoration:  none; color:  #fff; ine-height: 70px;  width: 258px; height: 70px; background-color: #172c73; display: block;}
.knopmidden a:visited {color:  #fff; line-height: 70px;  width: 258px; height: 70px; background-color: #2375b0; display: block; }

#block-serto-ventilatie-page-title {max-width:1000px; margin: auto; width: 95%; margin-top: 15px;}

/*#webform-submission-vraag-je-voorstel-add-form {max-width:1000px; margin: auto; width: 95%;}*/

.webform-submission-form  {max-width:1000px; margin: auto; width: 95%;}

#edit-zelfbouwventilatiesysteem--wrapper-legend {padding-bottom: 10px;}

.nr {
margin-left: 50px;
}

.aanpaknr {font-size: 2em;
  width: 36px;
  height: 36px;
  background-color: #2375b0;
  color: #fff;
  text-align: center;
  font-weight: bolder;
  padding: 6px;
  float: left;}

  .knoplinks {
width: 258px;
height: 70px;
background-color: #2375b0;
text-align: center;
line-height: 70px;

}

.knoplinks a {color:  #fff; line-height: 70px;  width: 258px; height: 70px; background-color: #2375b0; display: block;}
.knoplinks a:link {color:  #fff; line-height: 70px;  width: 258px; height: 70px; background-color: #2375b0; display: block;}
.knoplinks a:active {color:  #fff; line-height: 70px;  width: 258px; height: 70px; background-color: #2375b0;  display: block;}
.knoplinks a:hover {text-decoration:  none; color:  #fff; ine-height: 70px;  width: 258px; height: 70px; background-color: #172c73; display: block;}
.knoplinks a:visited {color:  #fff; line-height: 70px;  width: 258px; height: 70px; background-color: #2375b0; display: block; }

.node--type-vaste-pagina p {max-width:  600px;}


.intro {font-size:  1.2em; color: #2375b0; max-width:  600px }

/* forms */

.webform-button--submit {
width: 214px;
height: 43px;
background-color: #2375b0;
text-align: center;
float: right;
}

.webform-button--submit a {color:  #fff; line-height: 2.5em; }
.webform-button--submit a:link {color:  #fff; }
.webform-button--submit a:active {color:  #fff; }
.webform-button--submit a:hover {text-decoration:  none; color:  #000;}
.webform-button--submit a:visited {color:  #fff; }

.tabs--primary {max-width:1000px; margin: auto; width: 95%;}



#block-serto-ventilatie-page-title h1 {
font-family: 'Trebuchet MS', sans-serif;
font-weight: 900;
font-style: normal;
font-size: 3em;
color: #2375b0;
}

/*
#block-serto-ventilatie-page-title h1::before {
  content: url(https://sertozelfbouwventilatie.be/serto/sites/default/files/systemen-zelfbouwventilatie.png);
  transform: scale(1);
  vertical-align: middle;
  display: inline-block;
  top: -3px;
  position: relative;
  left: -7px;
}
*/
#edit-werfadres h2 {font-weight: 200; }

/* contactpagina */

.introcontact p {width:  100%; text-align:  center; max-width: 1200px;}

.contacttegels {
  width: 100% !important;
  margin: 10px auto !important;
  position: relative;
  text-align:center;
}

.contacttegels .contacttegel {
  height: 118px;
  width: 20vw;
  display: inline-block;
  margin: 10px;
    margin-left: 10px;
  background: #eee;
  margin-left: 0;
  vertical-align: top;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 41px;
  text-align: center;
}   

#contactgegevens {width: 100% !important;
  margin: 10px auto !important;
  position: relative;
  text-align: center;
  max-width: 957px;
  margin-top: 50px !important;
  border-top-color:  #172c73;
  border-top-width: thin;
  border-top-style:  solid;
  padding-top: 30px;
}
.contact_textwrapper {width:50%; float: left;}

.contact_afbeeldingwrapper {width: 50%; padding-left: 3%; float: right;}

#contactinformatie {}

#contactinformatie p {
  margin-top: 15px;
  text-align: center !important;
}

.telcontact {font-weight:  bolder; font-size: 2em; color:#0066cc; }

/* prijsmodule */

.prijsmodules img {border-radius: 0px; padding: 5px;  width: 80%; height:  auto;}

.prijsmodules {
   width: 100%;
  margin: 10px auto;
  position: relative;
  text-align:center;
  padding-bottom:  50%;

}

.prijsmodules .prijsmodule {
  height: 419px;
  width: 320px;
  display:inline-block;
  margin: 10px;
    vertical-align: top;
    padding:  7px;
    margin-top: 30px;
    
    
}

/*
.prijsmodules {
  width: 100% !important;
  margin: 10px auto !important;
  position: relative;
  text-align:center;
}

.prijsmodules .prijsmodule {
  height: 50px;
  width: 10vw;
  display: inline-block;
  margin: 10px;
    margin-left: 10px;
  margin-left: 0;
  vertical-align: top;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 41px;
  text-align: center;
}  

*/

#block-serto-ventilatie-snelofferte p a {text-decoration:  underline;}
.prijsmodules h2 {margin-top:  150px;}

#webform-submission-appartement-systeem-c-add-form .webform-button--submit {
  width: 300px;
  height: 80px;
  background-color: #2375b0;
  text-align: center;
  float: right;
}
.sneloffertes {
  max-width: 1200px;
  margin: auto;
  position: relative;
  text-align: center;
}

.sneloffertes ul {padding-left:  0;}

.sneloffertes .snelofferte {
height: 210px;
  width: 250px;
  display: inline-block;
  margin-left: 20px;
  margin-right: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
  vertical-align: top;
  padding-top: 41px;
  text-align: center;
  background-color: #fff;
  padding: 5px;
} 

.snelofferte p {text-align:  center;}

.node--id-133 h1 {text-align:  center;}

.node--id-133 h2 {text-align:  center; margin-top:  25px;}

.node--id-133 h3 {
  margin-top: 32px;
  font-size: 1.4em;
  font-weight: bold;
  border-color: #2375b0;
  border-width: thin;
  border-style: solid;
  width: 250px;
  height: 61px;
  padding-top: 17px;
}

.node--id-135 h1 {text-align:  center;}

.node--id-135 h2 {text-align:  center; margin-top:  25px;}

.node--id-135 h3 {
  margin-top: 32px;
  font-size: 1.4em;
  font-weight: bold;
  border-color: #2375b0;
  border-width: thin;
  border-style: solid;
  width: 250px;
  height: 61px;
  padding-top: 17px;
}

.node--id-136 h1 {text-align:  center;}

.node--id-136 h2 {text-align:  center; margin-top:  25px;}

.node--id-136 h3 {
  margin-top: 32px;
  font-size: 1.4em;
  font-weight: bold;
  border-color: #2375b0;
  border-width: thin;
  border-style: solid;
  width: 250px;
  height: 61px;
  padding-top: 17px;
}

.node--id-137 h1 {text-align:  center;}

.node--id-137 h2 {text-align:  center; margin-top:  25px;}

.node--id-137 h3 {
  margin-top: 32px;
  font-size: 1.4em;
  font-weight: bold;
  border-color: #2375b0;
  border-width: thin;
  border-style: solid;
  width: 250px;
  height: 61px;
  padding-top: 17px;
}
.snelofferte a:link {color: #2375b0;}
.snelofferte a:visited {color: #2375b0;}
.snelofferte a:hover {color: #000; text-decoration:  none;}


.node--id-134 .node__container {margin:  auto; max-width:  1300px; }
.node--id-134 .node__title {max-width:  600px; margin: auto;}
#dank {max-width:  600px; margin: auto;}

#block-serto-ventilatie-snelofferte {max-width:  500px; margin:  auto; margin-top: -76px;}

#webform-submission-rijwoning-systeem-all-in-one-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}

#webform-submission-appartement-systeem-d-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}

#webform-submission-appartement-systeem-all-in-one-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}

#webform-submission-rijwoning-systeem-c-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}

#webform-submission-rijwoning-systeem-d-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}
#webform-submission-rijwoning-systeem-all-in-one-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}

#webform-submission-half-open-bebouwing-systeem-c-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}
#webform-submission-halfopen-bebouwing-systeem-d-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}
#webform-submission-halfopen-bebouwing-systeem-all-i-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}

#webform-submission-open-bebouwing-systeem-c-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}

#webform-submission-vrijstaande-woning-systeem-d-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}
#webform-submission-vrijstaande-woning-systeem-all-i-add-form .form-actions .button {
  margin-right: 0.25rem;
  width: 280px;
  height:  80px;
}

/* BLOG */
.node--type-blogartikel {max-width: 900px; margin: auto; tekst-align: left;}

.node--type-blogartikel h2 {text-align: left; font-weight: bolder; font-size: 3em;}
.node--type-blogartikel h3 {text-align: left; font-weight: bolder; margin-top: 15px;}

.blog {
  max-width: 1200px;
  margin: auto;
  position: relative;
  text-align: center;
}

.blog .blogpagina {
height: 210px;
  width: 320px;
  display: inline-block;
  margin-left: 20px;
  margin-right: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
  vertical-align: top;
  padding-top: 41px;
  text-align: left;
  background-color: #fff;
  padding: 5px;
} 
.blogpagina .views-field-title {font-weight: bolder;
  margin-top: 15px;
  font-size: 2em;
  min-height: 100px;
  line-height: 1em;
  text-align: center;}
.blogpagina h3 {text-align: left; font-weight: bolder; margin-top: 15px; font-size: 1.2em;}

.pr-footer {
  color: #ffffff;
  background-color: #fff;
  background: none !important;
}


  .cookiesjsr-layer {
    width: 960px;
  }


/* ----------------- MEDIA QUERYS --------------------------- */

@media screen and (max-width: 1355px) 

{ul.usp li:nth-child(3) {
  margin-left: 0px;
} 
}

/*-----------------------------------------*/

@media screen and (max-width: 1119px) { 
 .sf-accordion-toggle span {display: none;}
  .sf-accordion-toggle {
  text-align: left;
  z-index: 999;
  position: absolute;
      left: 0;
}
    
#superfish-calvel-accordion {background-color: #fff;}

#block-opleidingopdewerf {
  position: absolute;
  width: 200px;
  height: auto;
  right: 0;
  margin-top: -46px;
  padding-right: 25px;
}
    
.site-branding__logo-img {
  max-width: 150%;
  padding-left: 0;
  padding-bottom: 0;
  margin-left: 10vw;
}

}


/*-----------------------------------------*/

@media screen and (max-width: 1047px) {

ul.usp {
width: 100%;
max-width: 1300px;
margin-left: -33px;
}

ul.sf-menu.sf-accordion.sf-expanded, ul.sf-menu.sf-accordion li.sf-expanded > ul {
  left: auto !important;
  position: relative;
  top: auto !important;
  margin-top: 37px;
}

.node--type-systeem h2 {
  font-size: 2.0em;
}

#vastepagina_wrapper {width: 100%; }

.vastepagina_afbeelding {width:100%; float: none;}

.vastepagina_textwrapper {width: 100%; padding-left: 0%; float: none; margin-top: 25px;
  }

#eindeervaring {margin-top: 50px;}

}

/*-----------------------------------------*/

@media screen and (max-width: 833px) {
    .afbeelding_merk {
  width: 100%;
  float: none;
}

.knopslider {
  margin-top: -10px;
}

#block-stappenplan { margin-top: -135px;}

#block-waaromsertozelfbouwventilatie {
  margin-top: 471px;
}


#merktextwrapper {
  width: 100%;
  padding-left: 0px;
  float: none;
}

#merkwrapper1 {
  width: 100%;
  height: auto;
  margin-top: 10px;
}

#merktextwrapper h3 {
  padding-top: 10px;
}

#merkwrapper2 { padding-bottom: 70%;}

#upgraden h2 {width: 100%; margin-top: 20px;}
    
#merktextwrapper h4 {
  margin-top: 25px;
} 
.view-slider-horizontaal .views-field-body {
  position: absolute;
  width: 40vw;
  margin-top: 0%;
  margin-left: 53vw;
}

}


/*-----------------------------------------*/

@media screen and (max-width: 740px) {

.contacttegels .contacttegel {
  height: 118px;
  width:300px;
  display: inline-block;
  margin: 10px;
    margin-left: 10px;
  margin-left: 10px;
  background: #eee;
  margin-left: 0;
  vertical-align: top;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 41px;
  text-align: center;
}

.contact_afbeeldingwrapper {
  width: 100%;
  padding-left: 0%;
  float: none;
}

.contact_textwrapper {
  width: 100%;
  float: none;
}

 }

/*-----------------------------------------*/

@media screen and (max-width: 657px) {

    .field-node--field-promopastille {
  margin-top: -190px;
}

    ul.usp {
display:  inline-block;
}

ul.usp li {
  margin: 0;
  display: inline-block;
  font-size: 0.8em;
  width: auto;
  text-align: center;
}

ul.usp li:nth-child(4) {
  margin-left: 0px;
}


ul.usp2 {
display:  inline-block;
}
ul.usp2 li:nth-child(3) {
  margin-left: 0px;
}
ul.usp2 li:nth-child(4) {
  margin-left: 0px;
}

ul.usp2 li {
  width: 100%;
}

.reviews .review {
  height: 150px;
  width: 100%;
  display: inline-block;
  margin: 10px;
  vertical-align: top;
  padding: 7px;
}

.reviews .review p {
  color: #2375b0;
  font-weight: lighter;
  height: auto;
}


.afbeelding_stappenplan {
  width: 100%;
  float: none;
}

.tekst_stapenplan {
  width: 100%;
  float: none;
  margin-left: 0px;
}

.tekst_stapenplan p {color: #2375b0;  }

#block-stappenplan h2 {
  text-align: center;
  padding-top: 10px;
  line-height: 1.5em;
  font-size: 1.5em;
}
/*
#block-waaromsertozelfbouwventilatie {
  position: relative;
  width: 100%;
  margin-top: 822px;
  padding-bottom: 5%;
}
*/

.tekst_stappenplan {
  width: 100%;
  float: right;
  margin-left: 15px;
  margin-top: 20px;
}

#block-waaromsertozelfbouwventilatie {
  position: relative;
  width: 100%;
  margin-top: 880px;
  padding-bottom: 5%;
}

#block-waaromzelfbouwventilatie2eparagraaf {
  position: relative;
  width: 100%;
  margin-top: 0px;
  padding-bottom: 15%;
}

/*SYSTEEMPAGINA'S*/

 #wrapper-pluspunten {width:  100%; float:  none;}
 #wrapper-pluspunten h3 {text-align: left; margin-left: 31px; font-size: 1.5em;}

#wrapper-minpunten {width:  100%; float:  none}
#wrapper-minpunten h3 {text-align: left; margin-left: 31px; font-size: 1.5em;}

.afbeelding_merk {
  width: 100%;
  float: none;
}

#merktextwrapper {
   width: 100%;
  float: none;
  padding-left: 0%;
  margin-top: 30px;
}


    

/* VASTE PAGINA'S */

.node--type-vaste-pagina h2 {
font-family: 'Trebuchet MS', sans-serif;
font-weight: 400;
font-style: normal;
color: #2375b0;
font-size: 1.5em;
}

}

/*-----------------------------------------*/

@media screen and (max-width: 521px) {

.knopslider {
  width: 90%;
  height: 43px;
  background-color: #2375b0;
  text-align: center;
  margin-top: 10px;
}

}

/*-----------------------------------------*/


@media screen and (max-width: 443px) {

#block-serto-ventilatie-snelofferte {max-width:  300px; margin:  auto;
margin-top:  400px;}

    h1 {font-size: 2em !important;}

.site-branding__logo-img {
  max-width: 100%;
  padding-left: 0;
  padding-bottom: 0;
  margin-left: 43px;
} 


#block-opleidingopdewerf {
  position: absolute;
  width: 164px;
  height: auto;
  right: 0;
  margin-top: -46px;
  padding-right: 5px;
}

#block-opleidingopdewerf img {
  width: 70%;
  height: auto;
}

.sf-accordion-toggle {
  position: absolute;

}

ul.sf-menu.sf-accordion.sf-expanded, ul.sf-menu.sf-accordion li.sf-expanded > ul {
  left: auto !important;
  position: relative;
  top: auto !important;
  margin-top: 46px;
}


#block-views-block-slider-horizontaal-block-1-3 {
  margin-top: 0px;
  position: absolute;
}

.pr-highlighted__rw {
  height: 28px;
}
.views-field-field-frontfoto-systeem-zelfbouw  { display:  none;}

.view-slider-horizontaal .views-field-body {
  position: absolute;
  width: 90vw;
  margin-top: 5%;
  margin-left: 10vw;
}

#block-views-block-slider-horizontaal-block-1-3 h1 {
  font-size: 5.5vw;
}



#block-views-block-slider-horizontaal-block-1-3 p {
  font-size: 4vw;
}

#block-views-block-ventilatietypes-block-1 {margin-top:  200px;}
#block-views-block-slider-horizontaal-block-1-3 img {display:  none;}

.systemen {
  margin-top: -200px;
}

.views-field-field-promopastille img {width:  100%; height:  auto; margin-top: -19px;}

.views-field-field-zelfbouwpakket {
  font-size: 0.9em;
width: 116px;
float: left;
}

.views-field-field-systeem-titel {
  font-size: 0.8em;
width: 180px;
float: left;
margin-left: 4px;
margin-top: -5px;
}

.views-field-field-introtekst-systeem-zelfbou p {
  height: 126px;
}


.systemen .systeem {
  height: 165px;
}

ul.usp {
  margin-top: 5px;
}

ul.usp li {
  margin: 0;
  display: inline-block;
  font-size: 0.8em;
  width: auto;
  text-align: center;
  height: 10px;
}


.reviews p {font-size:  0.8em; width: 95%;}
#footer {
  display:  none;

}



.tekst_stapenplan p {
  color: #2375b0;
  font-size: 0.8em;
}

.webform-submission-form {
  margin-top: 91px !important;
}
   
  .node--id-125 h1 {
 
  font-size: 1.5em !important;

} 

#onderhoudmogelijk {margin-top: 10px;}

.prijsmodules h2 {
  margin-top: 150px;
  max-width: 338px;
  text-align: center;
  margin: auto;
}

}

@media screen and (max-width: 358px) {



#block-waaromsertozelfbouwventilatie h2 {
  text-align: left;
  padding-top: 52px;
  line-height: 1.3em;
  padding-bottom: 20px;
}

.form-required label {max-width:  300px; display:  inline-block;}



    }