/* -- Reset -- */
html,
body,
div,
span,
applet,
object,
iframe,
img,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  border: 0;
  font-family: inherit;
  /*font-size: 100%;*/
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}

h1 {margin-top:0px;}
h2 {
color:#415560;
font-weight:bold;
}


h3 {
	font-weight:bold;
}

html {-webkit-text-size-adjust: 100%;scroll-behavior: smooth;padding:0px;margin:0px;}

	body {
	margin:0px auto;
	padding:0px;
	font-family:Poppins, "Open Sans", sans-serif;
	font-weight:normal; 
	/*font-size:18px;*/
	background:#FFFFFF;
	color:#202020;
	hyphens: manual;
}

cta {background-color:#2EA6B4;}

/*
a:link  	{color:#02B1A7;text-decoration:none;}
a:visited	{color:#02B1A7;text-decoration:none;}
a:hover		{color:#02B1A7;text-decoration:none;}
a:active	{color:#02B1A7;text-decoration:none;}
*/
.footer-menu a:link	{color:#DDDDDD;text-decoration:none;}
.footer-menu a:visited	{color:#DDDDDD;text-decoration:none;}
.footer-menu a:hover	{color:#DDDDDD;text-decoration:none;text-decoration:underline;}
.footer-menu a:active	{color:#DDDDDD;text-decoration:none;}

.headericon {color:#02B1A7;text-decoration:none;}
.headericon:hover {color:#415560;text-decoration:none;}

.arrowlink {color:#02B1A7;text-decoration:none;font-size:25px;}

.fpbox {
	position:relative;
	height:100%;
	width:100%;
	background-color:#F4F6F7;
	border:1px solid #ADB5BD;
}

.fpbox:hover {
	box-shadow: 0px 0px 1px 1px #ADB5BD;
	transition: 1.0s ease;
}

.xfpboxoverlay {
  position: absolute;
  bottom: 8px;
  left:41%;
  height:30px;
  color:transparent;
    color:red;
}

.xfpbox:hover .fpboxoverlay {
  display:initial;
    opacity: 1.0;
  transition: 1.0s ease;
  background-color:#1278DE;
  background-color:#02B0A9;
  color:#FFFFFF;
  }



.footer-menu {
  list-style-position: inside;
  list-style-type: square;
  padding-left:0px;
}

.cbgc1 { /* eruit? */
	background-color:#1278DE;
		background-color:red; 
}
	
/* ************************************************************************* */
/* Header                                                                    */
/* ************************************************************************* */

.header {

}

.logo {
	width:300px;
	height:100px;
	background-image:url("../images/logoc2.png");
	background-position:center;
	background-repeat:no-repeat;
}

.bgi {
	width:auto;
	background:#213342;
}

.bgi2 {
	height:386px;
	width:631px;
	border-radius: 15px;
	background-image:url("../images/dashboard2.png");
	background-repeat:no-repeat;
background-size: cover;
 }


.focus {
	animation-duration: 3s; /* the duration of the animation */
	animation-timing-function: ease-out; /* how the animation will behave */
	animation-delay: 0s; /* how long to delay the animation from starting */
	animation-iteration-count: 1; /* how many times the animation will play */
	animation-name: focusText; /* the name of the animation we defined above */
}

/* **************************************************************************/
/* Footer                                                                   */
/* **************************************************************************/


#cookiemsg {
animation:hideCookiemsg 0s ease-in 2s forwards;
}

/* ************************************************************************* */
/* Contact formulier                                                         */
/* ************************************************************************* */

}


.xformfield {
color:#FFFFFF;
font-size:14px;
width:100%;
}

/*
.field {
margin-top:5px;
}

.fieldnd {
display:none;
}
*/

#contactform input[type="text"],
input[type="email"] {
  width: 100%;
  height:30px;
  font-family: Poppins, "Open Sans";
  font-size:1rem;
  box-shadow: none;
  border-radius: none;
  background:#F4F6F7;
  border:none;
  color:#202020;
}

xinput:focus{
    outline: none;
}

textarea {
font-family: Poppins, "Open Sans";
padding:1%;
height:100px;
width:100%;
overflow:hidden;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; 
background-color:#F4F6F7;
border:none;
border-bottom:1px solid #DDDDDD;
font-size:1rem;
resize:none;
}

textarea:focus, input:focus{
    outline: none;
}

.success {
  padding: 1em;
  margin-bottom: 0.75rem;
 /* text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); */
  color: #468847;
  background-color: #dff0d8;
  border: 1px solid #d6e9c6;
}

.error {
  padding: 1em;
  margin-bottom: 0.75rem;
  /* text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); */
  color: #b94a48;
  background-color: #f2dede;
  border: 1px solid rgba(185, 74, 72, 0.3);
}


/* Animatie */

@keyframes rotatePic {
    0% {
          transform: rotate(360deg);
		  filter:blur(5px);
    }
}

@keyframes focusText {
    0% {
 		  filter:blur(10px);
    }
}

@keyframes hideCookiemsg {
    to {
        width:0;
        height:0;
        overflow:hidden;
    }
}

/* **************************************************************************/
/* Media query                                                              */
/* **************************************************************************/
.rectangle {background:#02B1A7;border:0px;margin-left:-5px;color:#FFFFFF;border-radius: 0px 10px 10px 0px;text-align:center;}\
.putcenter {display:flex;justify-content:left;}	
@media only screen and (max-width: 992px) {

}

@media only screen and (max-width: 768px) {
	.putcenter {display:flex;justify-content:center;}	
}

@media only screen and (max-width: 576px) {
	

	
}


@media screen and (min-width:992px) and (max-width:1199px) {
.rectangle {background:#02B1A7;border-radius: 10px 10px 10px 10px;margin-top:5px;text-align:center;}	
}

@media screen and (min-width:200px) and (max-width:499px) {
.rectangle {background:#02B1A7;border-radius: 10px 10px 10px 10px;margin-top:5px;text-align:center;}
.putcenter {display:flex;justify-content:center;}	
}













