img {
border: none;
max-width:100%;
height:auto;
}

h1 {
font-family: 'Hind', sans-serif;
font-size: 55px;
font-weight: 900;
margin-bottom:10px;
color:#223b81;
}

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

h1 {
font-size:42px;	
}	
	
}

h2 {
font-family: 'Hind', sans-serif;
color:#053635;
font-size: 42px;
font-weight: 900;
margin-bottom:20px;
}

h3 {
font-family: 'Hind', sans-serif;
font-size: 21px;
font-weight: 900;
}

* {
margin: 0px;
padding: 0px;
}

a {
color:#223b81;	
}

strong {
font-weight:600;
}


html, body{
text-align:center;
font-family: 'Hind', sans-serif;
font-size: 20px;
background-color: #ffffff;
text-align:center;
color:#877f7f;
background-image:url(images/achtergrond.jpg);
background-size:cover;
background-repeat:no-repeat;
background-position:center center;
}

html,body {
height:100%;	
}

.popup {
position:absolute;
background-color:white;
left:50%;
top:50%;
transform:translate(-50%,-50%);
opacity:0;
margin-top:40px;
padding:20px 30px;
box-shadow: 0 10px 20px rgba(0,0,0,.05),0 6px 6px rgba(0,0,0,.08);
animation-name:appear;
animation-duration:2s;
animation-fill-mode:forwards;
width:96%;
max-width:450px;
box-sizing:border-box;
}

@-webkit-keyframes appear {
  0%   { opacity: 0; margin-top:40px; }
  100% { opacity: 1; margin-top:0; }
}
@-moz-keyframes appear {
  0%   { opacity: 0; margin-top:40px; }
  100% { opacity: 1; margin-top:0; }
}
@-o-keyframes appear {
  0%   { opacity: 0; margin-top:40px; }
  100% { opacity: 1; margin-top:0; }
}
@keyframes appear {
  0%   { opacity: 0; margin-top:40px; }
  100% { opacity: 1; margin-top:0; }
}