/* QB additional styles */
* {  
	/*...*/
}


/* om eenvoudig te kunnen uitlijnen en centreren bij medium of small */
@media screen and (max-width: 63.9375em) {
	.center-for-medium-small{ text-align:center;}
	.left-for-medium-small{ text-align: left;}
	.right-for-medium-small{ text-align: right;}
}


body { 
	margin-top: 15px;
	background-color: #FFF; 
	/* Google font: Open Sans */
	font-family: 'Open Sans', Verdana, sans-serif;
	font-size: 16px; 	
	color: #6a747c;	

	/* volgende regel uit foundation.css eventueel overrulen
	line-height: 1.5; -> bijv 1.2
	*/
}

a:link,a:visited {
	text-decoration: none;
	color: #01a9d1; /*logoblauw */
	/*#eee; /*bijna wit*/
	
}
a:hover {
	text-decoration: underline;
	color: #0099cc; /* blauwtint */
}
a:active {
	text-decoration: none;
	color: #000; /* zwart */
}

/* nakijken of zinvol is */
p,td {color:#6a747c;}

h1 { 
	font-family: 'Open Sans', Verdana, sans-serif;
	font-size:24px; 
	font-weight: bold;
}
h2 { 
	font-family: 'Open Sans', Verdana, sans-serif;
	font-size:19px; 
	font-weight: bold;
}
h3 { 
	font-family: 'Open Sans', Verdana, sans-serif;
	font-size:17px; 
	font-weight: bold;
}
/* invulform afspraak */
input.error {
	border: 2px solid #FF0000;
}

/*overrules Foundation */
button{ color: #FFF} 

table.unstriped tbody {
    background-color:#fefefe;}
		
    table.unstriped tbody tr {
      border-bottom: 0;
      border-bottom: 1px solid #f1f1f1;
      background-color: #e5f7fb; /*#fefefe;*/ }

/* ---------- CLASSES EN DIV ---------- */

/* algemeen */

.container-max-breedte{ 
	margin: 0 auto;	/* is centreren */
	/* OPTIONEEL overrulen van de .row waarde van Foundation*/ 
	/* maximale breedte instellen voor rijen welke niet over de volle breedte van het scherm gaan*/
	/* Foundation hanteert een relatieve default bij '.row' van 75rem */
	max-width: 1200px;
	
}

.kleur-logoblauw { color:#01a9d1;}
.kleur-wit {color:#fff;}
.kleur-masja-aantekening {color:#ea018c; }

.kleur-achtergrond-lichtblauw{ background-color:#e5f7fb; }
.kleur-achtergrond-donkerder-blauw {background-color:#00add3;}

.font24{ font-size:24px;}
.font22{ font-size:22px;}
.font20{ font-size:20px;}
.font18{ font-size:18px;}
.font17{ font-size:17px;}
.font15{ font-size:15px;}
.font14{ font-size:14px;}
.font13{ font-size:13px;}
.font12{ font-size:12px;}
.font11{ font-size:11px;}
.font10{ font-size:10px;}

.paginaheader{ padding: 20px 0 50px 0;}
.pagina-subheader{ padding: 0 0 20px 0; /*font-weight:bold;*/}
.alineaheader{ font-weight:bold; color:#01a9d1;}

.rechtsuitlijnen{ text-align:right;}
.centreren{ text-align:center;}
.list-zonder-bullets {
	/* bij responsive design en centreren worden bullets niet fijn weergegeven - daarom onderdrukken en inspring marges weghalen */
	list-style-type: none;
  margin: 0;
  padding: 0;
	
} 

/* top menu desktop hyperlinks */
.topmenu a:link,.topmenu a:visited {
	text-decoration: none;
	color: #01a9d1; /*logoblauw */
}
.topmenu a:hover {
	text-decoration: underline;
	color: #0099cc; /* blauwtint */
}



/* links in de bodem sectie */
.bodemlinks a:link, .bodemlinks a:visited {
	/*font-size: 12px;*/
	/*letter-spacing: 1px;*/
	color: #6a747c; /* grijstint */; 
	/*word-spacing: 12px;*/
	/*font-weight: bold; */
}
.bodemlinks a:hover {
	text-decoration: none;
	color: #0099cc; /* blauwtint */
}

.bodemlinks a:active {
	/*font-size: 12px;
	letter-spacing: 1px;
	word-spacing: 15px;
	font-weight: bold;*/
	text-decoration: none;
	color: #6a727a; /* grijstint */;
}

/* bijv. div of andere elementen via PHP coded mv classes verbergen  */
.verberg-deze-div{ display:none;}

input.error {
	border: 2px solid #FF0000;
}

/* overruled foundation TEST*/
.menu-icon {
  /*
	position: relative;
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
  width: 20px;
  height: 16px; */}
	
  .menu-icon::after {
    /*content: '';
    position: absolute;
    display: block;
    width: 100%;
    height: 2px;
    */
		background: #01a9d1; /* #fefefe; */
    /*
		top: 0;
    left: 0;
    */
		box-shadow: 0 7px 0 #01a9d1, 0 14px 0 #01a9d1; }
  .menu-icon:hover::after {
    background:  #06F; /*#cacaca;*/
    box-shadow: 0 7px 0  #06F, 0 14px 0  #06F; }

 .top-bar ul {
    background-color: #FFF; /* #e6e6e6;*/ }


/* button MAAK UW AFSPRAAK */
.letterspatiering3{ letter-spacing:3px;}
.regelhoogte2{ line-height:2em;}
.regelhoogte1-5{ line-height:1.5em;}
.regelhoogte0-5{ line-height:0.5em;}
.geenopmaak{ text-decoration:none;}

.ruimte30{ padding:0 30px 0 30px;}
.ronde-hoeken10 {border-radius: 10px;}

/* tekst in topbanners */
.topbannertekst{font-size:36px;}

/* ivm foutmeldingen formulier*/ 
.attentie{ color:#F00;}

.blauwelijn { 
	max-width: 98%; /* overrules Foundation 75 rem */
	border: none; 
	border-top: 2px solid #009cdf;
  margin: 0.25rem auto;	/* overruling foundation hr css 1.25rem auto */
}
.tegel-bodemruimte {padding-bottom:10px;}

.button.sophie {
    background-color: #01a9d1;
    color: #fefefe; }
    .button.sophie:hover, .button.sophie:focus {
      background-color: #126195;
      color: #fefefe; }

/* overruled foundation css voor ontwikkelomgeving */
.callout.primary {
	background-color: #c6cde6 ;
} 

<!-- DIV -->
/*------------------------------------------------- algemeen --------------------------*/

#paginacontainer { 
	margin: 0 auto;	/* is centreren */
	
	width:100%; 
	/* breedte fixeren
	/* min-width:960px;*/
	
	/* breedte fluid maken*/
	/* max-width:960px; */

	height:auto;  
	
	/*background-image: url(../../afbeeldingen/sophie-stramien-nieuw-v10.png);*/
}

/*------------------------------------------------- einde algemeen ---------------------*/


/*------------------------------------------------- topsectie --------------------------*/
#topsectie{	padding:0px 0px 50px 0px; position:relative;}
#top-telnr{		/* let op: parent moet eigenschap 'positie: relative' hebben */
		position: absolute;
    right: 16px;
    top: 2px;
}
#top-menu{}
#top-menu-mobiel{}
#example-menu{ background-color: #CCC; } /* TODO menu mobiel */ 

#top-logo-midden{ padding-top:194px; /*144px;*/}
#top-logo-rechts{ padding-top:104px; /*54px;*/ text-align:right;}


#topbanner-home{ 
	margin:0px 0px;  
	padding:0px 0px 0px 0px;
	background-color:#333;

	/*dd 27-1-2017 nieuwe methode om te schalen */	  
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-position:center;
}

#topbanner-behandelingen{ 
	padding:0px 0px 0px 0px;
	background-color:#333;
	/*color:#aaa;*/
	
	background-image: url(../afbeeldingen/180818MSteenbergen_MG_0563.jpg); 	
	background-repeat:no-repeat;
  /*background-size: contain;*/ /* zorgt voor meeschalen van image */

	/*dd 27-1-2017 nieuwe methode om te schalen - in de div zelf zijn een paar witregels opgenomen om de juiste hoogte te verkrijgen */	  
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-position:center;
}

#topbanner-mond-gezondheid{ 
	padding:0px 0px 0px 0px;
	background-color:#333;
	/*color:#aaa;*/
	
	background-image: url(../afbeeldingen/180818MSteenbergen_MG_0534.jpg); 	
	background-repeat:no-repeat;
  /*background-size: contain;*/ /* zorgt voor meeschalen van image */

	/*dd 27-1-2017 nieuwe methode om te schalen - in de div zelf zijn een paar witregels opgenomen om de juiste hoogte te verkrijgen */	  
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-position:center;
}

#topbanner-kinderen-mondhygiene{ 
	padding:0px 0px 0px 0px;
	background-color:#333;
	/*color:#01a9d1;*/
	
	background-image: url(../afbeeldingen/20181105MSteenbergen_MG_2211.jpg); 	
	background-repeat:no-repeat;
  /*background-size: contain;*/ /* zorgt voor meeschalen van image */

	/*dd 27-1-2017 nieuwe methode om te schalen - in de div zelf zijn een paar witregels opgenomen om de juiste hoogte te verkrijgen */	  
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-position:center;
}


#topbanner-contact{ 
	padding:0px 0px 0px 0px;
	background-color:#333;
	/*color:#aaa;*/
	
	background-image: url(../afbeeldingen/180818MSteenbergen_MG_0607.jpg); 	
	background-repeat:no-repeat;
  /*background-size: contain;*/ /* zorgt voor meeschalen van image */

	/*dd 27-1-2017 nieuwe methode om te schalen - in de div zelf zijn een paar witregels opgenomen om de juiste hoogte te verkrijgen */	  
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-position:center;
}

#topbanner-tarieven{ 
	padding:0px 0px 0px 0px;
	background-color:#333;
	/*color:#aaa;*/
	
	background-image: url(../afbeeldingen/20181105MSteenbergen_MG_2421.jpg); 	
	background-repeat:no-repeat;
  /*background-size: contain;*/ /* zorgt voor meeschalen van image */

	/*dd 27-1-2017 nieuwe methode om te schalen - in de div zelf zijn een paar witregels opgenomen om de juiste hoogte te verkrijgen */	  
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-position:center;
}
#topbanner-praktijk{ 
	padding:0px 0px 0px 0px;
	background-color:#333;
	/*color:#aaa;*/
	
	background-image: url(../afbeeldingen/180818MSteenbergen_MG_0575.jpg); 	
	background-repeat:no-repeat;
  /*background-size: contain;*/ /* zorgt voor meeschalen van image */

	/*dd 27-1-2017 nieuwe methode om te schalen - in de div zelf zijn een paar witregels opgenomen om de juiste hoogte te verkrijgen */	  
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-position:center;
}
#topbanner-nieuwe-patient{ 
	padding:0px 0px 0px 0px;
	background-color:#333;
	/*color:#aaa;*/
	
	background-image: url(../afbeeldingen/180818MSteenbergen_MG_0538.jpg);
	background-repeat:no-repeat;
  /*background-size: contain;*/ /* zorgt voor meeschalen van image */

	/*dd 27-1-2017 nieuwe methode om te schalen - in de div zelf zijn een paar witregels opgenomen om de juiste hoogte te verkrijgen */	  
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-position:center;
}
#topbanner-vacature{ 
	padding:0px 0px 0px 0px;
	background-color:#333;
	/*color:#aaa;*/
	
	background-image: url(../afbeeldingen/20181105MSteenbergen_MG_2433.jpg); 	
	background-repeat:no-repeat;
  /*background-size: contain;*/ /* zorgt voor meeschalen van image */

	/*dd 27-1-2017 nieuwe methode om te schalen - in de div zelf zijn een paar witregels opgenomen om de juiste hoogte te verkrijgen */	  
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-position:center;
}

/* optioneel */
/*
#top-banner-mobiel{
	display:none;
}
*/

/* -- media queries topsectie -- */
@media screen and (min-width: 40em) {
	#top-menu{display:inline;}
	#top-menu-mobiel {display:none;}

}
@media screen and (max-width: 39.9375em) {
	#topsectie{	padding:0px 0px 0px 0px;}
	#top-menu{display:none;}
	#top-menu-mobiel {display:inline;}

	#top-logo-midden{ padding-top:10px;}
	#top-logo-rechts {display:none;}

}

@media screen and (max-width: 63.9375em) {
	/*#menutop {display:inline}*/
	#top-logo-midden{ padding-top:8px; /*padding-bottom: 10px;*/}
	#top-logo-rechts {display:none;}
	/*#top-logo-rechts{ padding-top:0px; padding-bottom: 10px; text-align:right;}*/

	#topbanner-home{display:none;}
	#topbanner-mond-gezondheid{display:none;}
	#topbanner-behandelingen{display:none;}
	#topbanner-kinderen-mondhygiene{display:none}	
	#topbanner-contact{display:none;}
	#topbanner-tarieven{display:none;}
	#topbanner-praktijk{display:none;}
	#topbanner-nieuwe-patient{display:none;}
	#topbanner-vacature{display:none;}
}

/*------------------------------------------------- einde topsectie --------------------------*/

/*------------------------------------------------- middensectie -----------------------------*/

#content-enkele-sectie{	padding:50px 0px 80px 0px;}
#content-eerste-sectie{	padding:50px 0px 0px 0px;}
#content-overige-sectie{ padding:50px 0px 0px 0px;}
#content-laatste-sectie{ padding:50px 0px 80px 0px;}

#content-volle-breedte{	margin-top:50px; padding-bottom: 30px;}

/*
#content-behandelingen, #content-praktijk, #content-tarieven {
	background-color:#e5f7fb; background-image: url(../afbeeldingen/00-licht-blauwe-punt.png); background-repeat:repeat-x;	
}	
*/

#praktijk-teamleden { padding-bottom:50px;}


#home-video-nvm{}

#video-nvm-video{ float:left; width:600px; padding:20px; }
#video-nvm-tekst{ float:right; width:200px; padding: 20px; }


#berichtenbord {
	width: auto;
	margin: 10px 0px 10px 0px; 
	padding: 10px;
	border: 1px solid #ccc;
	display: block;	
}


#nog-onbekend{}

/* -- media queries contentsecties -- */

@media screen and (max-width: 63.9375em) {
	#content-enkele-sectie{	padding:10px 0px 50px 0px;}
	#content-eerste-sectie{	padding:10px 0px 10px 0px;}
	#content-overige-sectie{ padding:10px 0px 0px 0px;}
	#content-laatste-sectie{ padding:10px 0px 50px 0px;}
	
	#content-behandelingen,#content-praktijk,#content-tarieven{ /*padding:10px 0px 0px 0px;*/}


}

/*------------------------------------------------- einde middensectie -----------------------*/

/*------------------------------------------------- footersectie -----------------------------*/



#footer{
	padding:60px 0px 60px 0px;
	background-color:#e5f7fb; background-image: url(../afbeeldingen/00-licht-blauwe-punt.png); background-repeat:repeat-x;	
}	
#footer-linkersectie{}
#footer-middensectie{}
#footer-rechtersectie{}

/* -- media queries contentsecties -- */

@media screen and (max-width: 63.9375em) {
	#footer{ text-align:center;}

}

/*------------------------------------------------- einde footersectie -----------------------*/


/*------------------------------------------------- copyrightsectie -----------------------------*/

#copyright-sectie{
	padding:10px 0px 10px 0px;
	text-align:center;
	font-size:12px;
}	
/*------------------------------------------------- einde copyright -----------------------*/


