@charset "UTF-8";
/* CSS Document */
html, body {height: 100%;width: 100%;}
body {
	margin: 0;
	font-family: 'Lato', sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 32px;
	color: #003a54;
	text-decoration: none;
	text-align: left;
}
h1, h2, h3, h4, h5, h6	{
	font-family: 'Roboto Condensed', sans-serif;
	font-style: normal;
	font-weight: 400;
	margin: 0;
	line-height: 32px;
	letter-spacing: 1px;
}
h1 {font-size:36px;font-family: 'Lato', sans-serif; }
h2 {font-size:24px;}
h3 {font-size:18px; }
h4 {font-size:18px; }
h5 {font-size:18px; }
h6 {font-size:18px; }
p {margin: 0;}
ul {margin: 0; margin-left: 15px; padding: 0;}
li {list-style-position: outside;list-style-type: disc;}
img {max-width:100%; margin:0; padding:0;}
.imageFull {width: 100%;object-fit: cover;resize: both;}
.block {display:block}
hr {border:none;border-top:1px solid #4c6675;height:1px; margin:0}
.lineOrange {border:none;border-top:1px solid #f4850c;height:1px; margin:0}
.lineBlue {border:none;border-top:1px solid #67b7db;height:1px; margin:0}
.lineGreen {border:none;border-top:1px solid #4eba6f;height:1px; margin:0}
.lineRed {border:none;border-top:1px solid #e75280;height:1px; margin:0}
.lineYellow {border:none;border-top:1px solid #f0c419;height:1px; margin:0}
.center {text-align: center;}
.right {text-align: right;}
.Roboto {font-family: 'Roboto Condensed', sans-serif;}
.C12 { font-size:12px}
.C14 { font-size:14px}
.iconp {
	height: 32px;
	width: 32px;
	padding: 10px 10px 10px 0;
	vertical-align: middle;
	display: inline
}
/* ---------- links ----------*/
a, a:visited {color: #6591ae;text-decoration: none;}
a:hover, a:visited:hover, a:active {color: #82acc7;text-decoration: none;}
.kw a {color:#3d95c7; text-decoration:none}
.kw a:hover {color:#67b7db; text-decoration:none}
.na a {color:#34a056; text-decoration:none}
.na a:hover {color:#4eba6f; text-decoration:none}
.hi a {color:#e75280; text-decoration:none}
.hi a:hover {color:#ba4267 ; text-decoration:none}
.we a {color:#d9ad00; text-decoration:none}
.we a:hover {color:#f0c419; text-decoration:none}
/* ---------- header ----------*/
header { position:relative; height:80px;margin-top:20px;width:880px;background-color:#FFF; margin:0 auto;}
#webje-logo{ position:absolute; left:0; top:15px;height:45px;width:204px;}		
#vierkeerwijzer{position:absolute; right:0; top:20px; height:50px;width:70px;}
#daanaagje{position:absolute;left:220px;height:70px;width:118px; top:10px }
/* ---------- basis elementen ----------*/	
.content {width: 880px;margin: 0 auto;padding: 0;}
.article {width:100%; }
.outer{max-width:100%; margin: 0 auto;}
.outerLine{max-width:100%; margin: 0 auto;border-bottom:solid 2px #fff;}	
.outerLineB{max-width:100%; margin: 0 auto;border-bottom:#004f74 solid 20px;}
.outerLineG{max-width:100%; margin: 0 auto;border-bottom:#064c1c solid 20px;}
.outerLineR{max-width:100%; margin: 0 auto;border-bottom:#88092f solid 20px;}
.outerLineY{max-width:100%; margin: 0 auto;border-bottom:#8a5900 solid 20px;}
#wrapper {width: 100%;margin: 0 auto;}
#wrap-content {margin: 0 auto;max-width: 100%;padding: 0; min-height:600px;  }
#wrap-contentGrey {margin: 0 auto;max-width: 100%;padding: 0; min-height:600px; background-color:#dde7f8 }
/* ---------- footer ----------*/
footer {
    padding: 0;
    bottom: 0;
	height:auto;
	width: 100%;
}
.4xwijzerlogo{height:50px;width:70px; margin-right:30px}
.stiptweb { font-size:9px; text-align:right; padding-bottom:20px;}
.stiptweb a {color:#6591ae; }
.stiptweb a:hover{ color:#82acc7}
/* ---------- colors ----------*/
.wit {color: #FFFFFF}
.grey {color:#6E8396}
.grey-light {color:#B3C4E0}
.grey-dark {color:#4c6675}
.grey-black {color:#003a54}
.grey-blue {color:#6591ae}
.blue {color:#0594e6}
.blue-light {color:#5897ff}
.blue-dark {color:#0044ab}
.orange {color:#f19300}
.orange-light {color:#f4c283}
.orange-dark {color:#f4850c}
.red {color:#cd0c1d}
.red-light {color:#da6770}
.red-dark {color:#b30b19}
.bg-grey-dark {background-color:#4c6675}
.bg-grey {background-color:#6e8396}
.bg-grey-light {background-color:#b3c4e0}
.bg-grey-soft {background-color:#dde7f8}
.bg-grey-supersoft {background-color:#f0f6ff}
.bg-4xw-dark {background-color:#003a54}
.bg-4xw {background-color:#6591ae}
.bg-4xw-light {background-color:#82acc7}
.bg-4xw-soft {background-color:#cae0f2}
.bg-orange-dark {background-color:#f4850c}
.bg-orange {background-color:#f19300}
.bg-orange-light {background-color:#f4c283}
.bg-orange-soft {background-color:#f8e6d0}
.bg-orange-supersoft {background-color:#FFFCF7}
.bg-orange-black {background-color:#A42C13}
.bg-blue-dark {background-color:#0044ab}
.bg-blue {background-color:#0594e6}
.bg-blue-light {background-color:#5897ff}
.bg-blue-soft {background-color:#9ac8ff}
.bg-blue-supersoft {background-color:#DEEDFF}
.bg-wit {background-color:#fff}
/* ---------- thema colors ----------*/
.blauw {color: #67b7db}	
.blauw-dark {color: #3d95c7}
.blauw-darker {color: #004f74}	
.rood {color: #e75280}	
.rood-dark {color:#ba4267}
.rood-darker{color:#88092f}
.geel {color: #f0c419}
.geel-dark {color: #d9ad00}
.geel-darker {color: #8a5900}
.groen {color: #4eba6f}
.groen-dark {color: #34a056}
.groen-darker {color: #064C1C}
.bg-blauw {background-color:#67b7db}
.bg-blauw-dark {background-color:#3d95c7}
.bg-blauw-darker {background-color:#004f74}
.bg-blauw-light {background-color:#b5e5fa}
.bg-blauw-soft {background-color:#dcf1ff}
.bg-blauw-black {background-color:#002130}
.bg-rood {background-color:#e75280}
.bg-rood-dark {background-color:#ba4267}
.bg-rood-light {background-color:#ffbdcf}
.bg-rood-soft {background-color:#ffe6f0}
.bg-rood-darker{background-color:#88092f}
.bg-rood-black{background-color:#3D0415}
.bg-geel {background-color:#f0c419}
.bg-geel-dark {background-color:#d9ad00}
.bg-geel-darker {background-color:#8a5900}
.bg-geel-light {background-color:#f0db89}
.bg-geel-soft {background-color:#f0ecd7}
.bg-geel-black {background-color:#3B2600}
.bg-groen {background-color:#4eba6f}
.bg-groen-dark {background-color:#34a056}
.bg-groen-darker {background-color:#064c1c}
.bg-groen-light {background-color:#82D99D}
.bg-groen-soft {background-color:#C9F5D5}
.bg-groen-black {background-color:#00290D}

.themakop {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 50px;
	font-style: normal;
	font-weight:700;
	line-height:50px;
	color:#6591ae;
	height:50px;
	}
/* ---------- navigatie balk top ----------	*/	
.beleid {margin:0 auto; z-index:600; position:fixed; width:100%; top:0;}
nav {
	width:880px;
	height:80px;
	margin:0 auto;
	position:relative;
}
#navbar {
	max-width:100%; 
	margin: 0 auto;
	border-bottom:solid 2px #fff;
	background-color:#003a54;
	z-index:600;
}
.sticky {position: fixed;top: 0;width: 100%;}
#navHomeMobiel a{ 
	width:77px;
	height:80px;
	background-color:#003a54;
	position:absolute;
	border-right:solid 1px #fff;
	border-left:solid 2px #fff;
	background-image:url(../basics/icons/thema-icon.png);
	background-size:contain;
	background-repeat:no-repeat;
	}
#navHomeMobiel a:hover{ background-color:#1d1d1d;}
#navHomeLong a{ 
	width:440px;
	height:80px;
	background-color:#003a54;
	position:absolute;
	left:0;
	font-family: 'Roboto Condensed', sans-serif;
	font-size:24px;
	line-height:80px;
	color:#6e8396;
	border-right:solid 1px #fff;
	border-left:solid 2px #fff;
	background-image:url(../basics/icons/thema-icon.png);
	background-size:80px 80px;
	background-repeat:no-repeat;
	padding-left: 117px;
	z-index:500;
}
#navHomeLong a:hover{ background-color:#1d1d1d;color:#fff;}
#navKieswijzer a{
	width: 78px;
	height: 80px;
	background-color: #3d95c7;
	position: absolute;
	right: 240px;
	top: 0px;
	border-right:solid 1px #fff;
	border-left:solid 1px #fff;
	background-image:url(../basics/icons/kieswijzer-icon.png);
	background-size:contain;
}
#navKieswijzer a:hover{ background-color:#67b7db;}
#navHistorie a  { 
	width:78px;
	height:80px;
	background-color:#ba4267;
	position: absolute;
	right: 160px;
	top: 0px;
	border-right:solid 1px #fff;
	border-left:solid 1px #fff;
	background-image:url(../basics/icons/historie-icon.png);
	background-size:contain;
}
#navHistorie a:hover{ background-color:#e75280;}
#navWereld a{ 
	width:78px;
	height:80px;
	background-color:#d9ad00;
	position: absolute;
	right: 80px;
	top: 0px;
	border-right:solid 1px #fff;
	border-left:solid 1px #fff;
	background-image:url(../basics/icons/wereld-icon.png);
	background-size:contain;
}
#navWereld a:hover{ background-color:#f0c419;}
#navNatuur a{ 
	width:77px;
	height:80px;
	background-color:#34a056;
	position: absolute;
	right: 0px;
	top: 0px;
	border-right:solid 2px #fff;
	border-left:solid 1px #fff;
	background-image:url(../basics/icons/natuur-icon.png);
	background-size:contain;
}
#navNatuur a:hover{ background-color:#4eba6f;}	
/* ---------- navigatie balken themas ----------*/
.balk {
	display: block;
	font-family: 'Roboto Condensed', sans-serif;
	font-style: normal;
	font-weight:400;
	font-size: 24px;
	line-height: 38px;
	color: #fff;
	vertical-align: middle;
	padding: 10px 0;
	height: 40px;
	width:100%;
	border-bottom:solid 2px #fff;
}
.balkKW a {
	display: block;
	font-family: 'Roboto Condensed', sans-serif;
	font-style: normal;
	font-weight:400;
	font-size: 24px;
	line-height: 38px;
	color: #fff;
	vertical-align: middle;
	padding: 10px 0;
	height: 40px;
	width:100%;
	background-color:#3d95c7;
	border-bottom:solid 2px #fff;
}
.balkKW a:hover { background-color:#67b7db;color: #fff;}
.balkNA a {
	display: block;
	font-family: 'Roboto Condensed', sans-serif;
	font-style: normal;
	font-weight:400;
	font-size: 24px;
	line-height: 38px;
	color: #fff;
	vertical-align: middle;
	padding: 10px 0;
	height: 40px;
	width:100%;
	background-color:#34a056;
	border-bottom:solid 2px #fff;
}
.balkNA a:hover { background-color:#4eba6f;color: #fff;}
.balkHI a {
	display: block;
	font-family: 'Roboto Condensed', sans-serif;
	font-style: normal;
	font-weight:400;
	font-size: 24px;
	line-height: 38px;
	color: #fff;
	vertical-align: middle;
	padding: 10px 0;
	height: 40px;
	width:100%;
	background-color:#ba4267;
	border-bottom:solid 2px #fff;
}
.balkHI a:hover { background-color:#e75280;color: #fff;}
.balkWE a {
	display: block;
	font-family: 'Roboto Condensed', sans-serif;
	font-style: normal;
	font-weight:400;
	font-size: 24px;
	line-height: 38px;
	color: #fff;
	vertical-align: middle;
	padding: 10px 0;
	height: 40px;
	width:100%;
	background-color:#d9ad00;
	border-bottom:solid 2px #fff;
}
.balkWE a:hover { background-color:#f0c419;color: #fff;}
.balkLK a{
	display: block;
	font-family: 'Roboto Condensed', sans-serif;
	font-style: normal;
	font-weight:400;
	font-size: 24px;
	line-height: 38px;
	color: #fff;
	vertical-align: middle;
	padding: 10px 0;
	height: 40px;
	width:100%;
	background-color:#f19300;
	border-bottom:solid 2px #fff;
	border-top:solid 2px #fff;
}
.balkLK a:hover {background-color:#f4850c;}
.balkLL a{
	display: block;
	font-family: 'Roboto Condensed', sans-serif;
	font-style: normal;
	font-weight:400;
	font-size: 24px;
	line-height: 38px;
	color: #fff;
	vertical-align: middle;
	padding: 10px 0;
	height: 40px;
	width:100%;
	background-color:#0594e6;
	border-bottom:solid 2px #fff;
	border-top:solid 2px #fff;
}
.balkLL a:hover {background-color:#0044ab;}
/* ---------- thema blokken ----------*/
.themaicon {height:120px; width:120px; padding:10px ; vertical-align:middle; display:inline}
.themafoto {border-radius:5px; border:#fff solid 2px; }
.themafotoNA {border-radius:5px; border:#fff solid 2px; margin:20px 0; }
.buttonGroen a:hover .themafoto{ opacity:1 }
.buttonGroen a .themafoto{ opacity:0.7 }
.themabuttons {width: 400px;margin: 0 auto; position:relative; z-index:10}
.buttonBlauw a{
	margin: 20px;
	padding: 30px 0 30px 0;
	display: block;
	float:left;
	font-size: 24px;
	width:266px;
	height:200px;
    color:#fff;
    text-align: center;
    text-decoration: none;
	background-color: #67b7db;
	border-radius:5px;
	border-bottom:#67b7db solid 20px;
}
.buttonBlauw a:hover {color:#fff; background-color: #3d95c7;border-bottom:#004f74 solid 20px; }
.buttonRood a{
	margin: 20px;
	padding: 30px 0 30px 0;
	display: block;
	float:left;
	font-size: 24px;
	width:266px;
	height:200px;
    color:#fff;
    text-align: center;
    text-decoration: none;
	background-color: #e75280;
	border-radius:5px;
	border-bottom:#e75280 solid 20px;
}
.buttonRood a:hover {color:#fff; background-color: #ba4267;border-bottom:#88092f solid 20px;}
.buttonGroen a{
	margin: 20px;
	padding: 30px 0 30px 0;
	display: block;
	float:left;
	font-size: 24px;
	width:266px;
	height:200px;
    color:#fff;
    text-align: center;
    text-decoration: none;
	background-color: #4eba6f;
	border-radius:5px;
	border-bottom:#4eba6f solid 20px;
}
.buttonGroen a:hover {color:#fff; background-color: #34a056;border-bottom:#064c1c solid 20px;}
.buttonGeel a{
	margin: 20px;
	padding: 30px 0 30px 0;
	display: block;
	float:left;
	font-size: 24px;
	width:266px;
	height:200px;
    color:#fff;
    text-align: center;
    text-decoration: none;
	background-color: #f0c419;
	border-radius:5px;
	border-bottom:#f0c419 solid 20px;
}
.buttonGeel a:hover {color:#fff; background-color: #d9ad00;border-bottom:#8a5900 solid 20px;}
/* ----------- box opmaak  ----------- */
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix{zoom: 1;}
.box-inner-container{max-width: 100%;margin: 0 auto; height:auto }
.box-container{
	width: 920px;
	margin: 0 auto;
	padding: 0;
	height: auto;
}
.thema-container{
	width: 920px;
	margin: 0 auto;
	padding: 0;
	height: auto;
}
.box{
	height: auto;
	width: 205px;
	float: left;
	display: inline;
	margin-left: 20px;
	margin-bottom: 20px;
	padding: 0px;
	text-align: center;
}
.box2{
	height: auto;
	width: 420px;
	float: left;
	display: inline;
	margin-left: 20px;
	padding: 0px;
	text-align: left;
}
.boxLog{
	height: 30px;
	width: 205px;
	float: left;
	display: inline;
	margin-left: 20px;
	margin-bottom: 20px;
	padding: 0px;
	text-align: center;
}
.box.bg-blauw{border-bottom:#67b7db solid 10px;}
.box.bg-blauw:hover{background-color:#3d95c7; border-bottom:#004f74 solid 10px;}
.box.bg-rood{border-bottom:#e75280 solid 10px;}
.box.bg-rood:hover{background-color: #ba4267;border-bottom:#88092f solid 10px;}
.box.bg-geel{border-bottom:#f0c419 solid 10px;}
.box.bg-geel:hover{background-color:#d9ad00;border-bottom:#8a5900 solid 10px;}
.box.bg-groen{border-bottom:#4eba6f solid 10px;}
.box.bg-groen:hover{background-color:#34a056;border-bottom:#064c1c solid 10px;}
/* ------- inlog box  --------- */
.box.bg-grey-soft a {display:block}
.box.bg-grey-soft a:hover { background-color:#FFF}
/* ------- form login --------- */
#wrapperGrey {
	width: 100%;
	margin: 0 auto;
	background-color:#dde7f8;
	height:100%;
	}
fieldset {
	border: none;
	margin: 0;
	padding: 0;
}
.wrapLogin {
	width: 320px;
	margin: 0 auto;
	padding: 0;
}
.buttonLogin {
	display: inline-block;
	background-color:#003a54;
	text-decoration: none;
	border: none;
	color: #fff;
	line-height: 24px;
	height: 40px;
	font-size: 14px;
	padding: 0px;
	width: 40px;
	margin:0;
	margin-left: -5px;
	letter-spacing: 2px;
	text-align: center;	
	-ms-box-sizing:content-box;
	-moz-box-sizing:content-box;
	-webkit-box-sizing:content-box; 
	box-sizing:content-box;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	}
.buttonLogin:hover{
	background-color: #000;
	color: #fff;
	border: none;
	transition: all linear 0.7s;
	}
.inputLogin {
	display: inline-block;
	background-color: #fff;
	text-decoration: none;
	border: none;
	color: #000;
	line-height: 24px;
	height: 40px;
	font-size: 14px;
	padding: 0 0 0 20px;
	width: 260px;
	margin: 0;
	letter-spacing: 2px;
	text-align: left;
	-ms-box-sizing: content-box;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.inputLogin:focus {color:#09F; border:none;}
.buttonLogOut a:link, .buttonLogOut a:visited {
	display:block;
	background-color: #6591ae;
	text-decoration: none;
	border: none;
	color: #fff;
	line-height: 24px;
	height: 30px;
	font-size: 12px;
	padding: 0 10px;
	width: 140px;
	margin-right: 0;
	margin-left:auto;
	letter-spacing: 2px;
	text-align: center;
	-ms-box-sizing: content-box;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	}
.buttonLogOut a:link:hover, .buttonLogOut a:visited:hover{
	background-color:#003a54;
	color: #fff;
	border: none;
	}
.LogOut {
	display: block;
	background-color: #6591ae;
	text-decoration: none;
	border: none;
	color: #fff;
	font-size: 24px;
	padding: 40px 0;
	margin: 0 auto;
	width:300px;
	letter-spacing: 2px;
	text-align: center;
	vertical-align:middle;
	-ms-box-sizing: content-box;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	}
.LogOut a:link, .LogOut a:visited{color: #fff;}	
.LogOut:hover, .LogOut:visited:hover {background-color:#003a54;}
/* ------- IMAGES GRID ---------img276 */		
.photo-container { width:920px; height:auto; margin: 0 auto;padding: 0;}
.photo-container img{
	max-width:420px;
	float:left;
	display:block;
	margin:20px;
	border-radius:5px;
	cursor:default;
}
.photo-container img:hover{
	-webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
	transition:transform 0.3s ease;
}
/* ------VIDEO responsive------- */ 	
.article iframe{
	max-width:100%;
	max-height:100%;
	border-radius:5px;
	border:#000 solid 2px;
}	
/* --- FORMULIER    */
fieldset {
	border: none;
	margin: 0;
	padding: 0;
}
#vraagform {max-width:600px;}
.input {
	font-family: 'Lato', sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 32px;
	background-color: #cfe3ff;
	text-decoration: none;
	border: solid #0594e6 1px;
	border-radius: 5px;
	color: #0594e6;
	height: 42px;
	padding: 2px 5px 2px 20px;
	width: 100%;
	box-shadow:none;
	text-align:left;
	letter-spacing:1px;
	margin-top:5px;
  
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
}
.inputvraag {
	font-family: 'Lato', sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 32px;
	background-color: #fff;
	text-decoration: none;
	border: solid #0594e6 1px;
	border-radius: 5px;
	color: #0594e6;
	height: 128px;
	padding: 2px 5px 2px 20px;
	width: 100%;
	box-shadow:none;
	text-align:left;
	letter-spacing:1px;
  
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
}
textarea {
	font-family: 'Lato', sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 32px;
	width: 100%;
}
textarea:focus, input:focus {
	background-color: #FFFFFF;
	border: solid #000 1px;
	color:#000;
}
.verzend {
	font-family: 'Roboto Condensed', sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	line-height: 16px;
	width: 100%;
	text-align: center;
	background-color: #0044ab;
	color: #fff;
	height: 42px;
	border: solid #0044ab 1px;
	padding: 2px 5px 2px 5px;
	border-radius: 5px;
	letter-spacing:2px;
	margin-top:20px;
}
.verzend:hover{
	background-color: #000;
	color: #FFFFFF;
	border: solid #000 1px;
}	
/* ------------------ DESK-------------------- */   
@media only screen and (min-width: 1000px) {	
#navHomeMobiel{ display:none}
}
/* ------------------ TABLET------------------ */   
@media screen and (max-width: 999px) and (min-width: 640px) {
header {width:600px;}	
nav{width:600px;}
#navHomeMobiel{ display:none}
#navHomeLong a{ width:160px; }
.content {width: 600px;}
.box-container{width: 640px;}
.thema-container{width: 640px;}
.photo-container { width:640px;}
.photo-container img{max-width:280px;}
.box{width: 290px;}
.box2{width: 290px;}
.boxLog{width: 600px;text-align:left}
}
/* ------------------ SMART-------------------- */   
@media screen and (max-width: 639px) and (min-width: 480px) {
header {width:400px;}
#daanaagje{ display:none}
nav{width:400px;}
#navHomeLong{ display:none}
.content {width: 400px;}
.themabuttons {width: 300px;}
.box-container{width: 440px;}
.thema-container{width: 320px;}
.photo-container { width:440px;}
.photo-container img{max-width:400px;}
.box{width: 400px;}
.box2{width: 400px;}
.boxLog{width: 400px;text-align:left}
}
/* ------------------ Mobiel-------------------- */   
@media screen and (max-width: 479px)  {	
header {width:300px;}
#daanaagje{ display:none  }
nav{width:300px; height:60px;}
#navHomeLong{ display:none}
#navHomeMobiel a{ width:57px;height:60px;}
#navKieswijzer a{ width:58px;height:60px;right: 180px;}
#navHistorie a{ width:58px;height:60px;right: 120px;}
#navWereld a{ width:58px;height:60px;right: 60px;}	
#navNatuur a{ width:57px;height:60px;}
.content {width: 300px;}
.themabuttons {width: 300px;}
.box-container{width: 320px;}
.thema-container{width: 320px;}
.photo-container { width:320px;}
.photo-container img{max-width:300px;margin:10px;}
.photo-container img:hover{-webkit-transform: none;-ms-transform: none;transform: none;}
.box{width: 300px;margin-left: 10px; margin-bottom: 10px;}
.box2{width: 300px;margin-left: 10px; margin-bottom: 10px;}
.boxLog{width: 300px;margin-left: 10px; text-align:left}
footer h3 { font-size:12px;}
}