/* Remove MDB styling */
/* Blue'ish: #5BC0DE (rgb(91,192,222) = 0.3/0.4, 0.7/0.8, 0.9) ===> #40869B */
.navbar { box-shadow: none !important; } .btn { box-shadow: none !important; }

html { min-height:100%;min-width:100%;overflow-y:scroll;scroll-behavior: smooth; }
body { margin-bottom: 128px;font-family:Arial,Helvetica,sans-serif;opacity:0;transition:0.5s; }
div { color:dimgray; }
div p { color:dimgray; }
form#registreren h1, form#registreren h2, form#login h2 { color:dimgray; }
form.form-as-text input, form.form-as-text select { border:none;margin:0px; }
a.shaded { color:white;text-decoration:underline; }
a.shaded_blue { color:blue;text-decoration:underline; }

/* Navigation */
#top-navigation-bar { z-index:100;position:fixed;top:0px;height:64px;min-height:48px;transition:0.2s; }
#top-navigation-bar img { max-height:100%;margin:4px;transition: 0.2s; }
#navbar-toggler { position:fixed;top:8px;right:8px;margin:0px; }
@media (min-width: 1000px) { 
	#top-navigation-bar { height:128px; }
	#top-navigation-bar img { margin:16px; }
}
@media (max-width: 768px) { #navbarMain { position:fixed;left:0px;top:0px;padding-left:32px;width:100%;background: white;border-bottom:4px solid #40869B; } }

.nav-link { font-weight:bold;color:#40869B;transition:0.5s;padding-left:16px !important;padding-right:16px !important; }
.nav-link:hover { color:red; }
.nav-link.active { color:red; }

/* Page-banner */
#front-page-banner { margin-top:128px;transition: 0.2s;z-index:0 !important; }
#banner-bar { height:16px;width:100%;background-color:#40869B; }
@media (min-width: 1200px) { #banner-bar { width:95%; } }
@media (min-width: 1400px) { #banner-bar { width:90%; } }
@media (min-width: 1600px) { #banner-bar { width:85%; } }

.big-box { padding:12px;padding-left:16px;padding-right:8px;background-color:#eee; }
.blue-bar-container { margin-top:8px !important;margin-bottom:8px !important;padding-right:32px !important; }
.blue-bar { height:4px;width:100%;background-color:#40869B; }
.white-bar-container { margin-top:8px !important;margin-bottom:8px !important;padding-right:32px !important; }
.white-bar { height:4px;width:100%;background-color:#eee; }
.big-box-button-container { margin-top:32px; }
.big-box-button-container button { padding:16px !important; }
.big-box-button .col-3 { background-color:#40869B;color:white;height:40px;transition:0.4s; }
.big-box-button .col-3:hover { background-color:red; }
.big-box-button .col-9 { background-color:red;color:white;height:40px;transition:0.4s; }
.big-box-button .col-9:hover { background-color:#40869B; }
.big-box h1 { font-size:1.2em;font-weight:bold; }
@media (min-width: 576px) { padding:24px;padding-left:32px;padding-right:32px; }
@media (min-width: 768px) { 
	.big-box h1 { font-size:2em; }
	.big-box { padding:48px;padding-left:64px;padding-right:64px;}
}
@media (min-width: 1000px) { .big-box h1 { font-size:3em; } }
@media (min-width: 1200px) { .big-box h1 { font-size:4em; } }

#intro-box { position:relative;margin-top:-152px;z-index:90 !important;opacity:0; }
#in-banner { position:relative;margin-top:-152px;margin-bottom:64px; }
#left-to-intro-box { opacity:0;transition:2s;margin-top:16px; }
@media (min-width: 576px) { 
	#intro-box { margin-left:35%;width:60%; }
	#left-to-intro-box { position:relative;width:30%;margin-top:-152px;opacity:0;transition:2s; }
}

.blue-container { padding:24px;padding-left:32px;padding-right:32px;background-color:#40869B;color:white; }
.blue-container h1 { font-size:1.2em; }
.blue-container p { color: white; }
@media (min-width: 768px) { 
	.blue-container h1 { font-size:2em; }
	.blue-container { padding:48px;padding-left:64px;padding-right:64px;}
}

#carouselVoordelen { background-color:#eee; }
a.carousel-control { color:white;font-weight:bold;font-size:2em; }
.carousel-item { text-align:center;padding-left:5%;padding-right:5%; }
.carousel-item h2 { font-size:1.2em; }
@media (min-width: 576px) { 
	.carousel-item { padding-left:25%;padding-right:25%; }
	.carousel-item h2 { font-size:1.6em; } 
}

.graybox { background-color:#eee;padding:16px;box-shadow:8px 8px #ddd;height:100%; }
.graybox h2 { font-size:1em; font-weight:bold; }
.gray-box-button .col-3 { background-color:#40869B;color:white;height:40px;transition:0.4s; }
.gray-box-button .col-3:hover { background-color:red; }
.gray-box-button .col-9 { background-color:red;color:white;height:40px;transition:0.4s; }
.gray-box-button .col-9:hover { background-color:#40869B; }

#registratie-box { padding-left:16%;padding-right:16%; }

#contact-form label, #contact-form div, #contact-form a { color:white; }
#contact-form input, #contact-form textarea { background-color:transparent;border:none !important;border-bottom:1px solid white !important;border-radius:0;color:white; }
#contact-form input:focus, #contact-form textarea:focus { border:1px solid white !important; }

#registration_information label { font-weight:bold; }
#registration_information span { color:#40869B; }

.border-2 { border-width:2px !important; }
.border-4 { border-width:4px !important; }
.border-8 { border-width:4px !important; }

.outline-white-1 { text-shadow:1px 1px 1px white, 1px 0px 1px white, 1px -1px 1px white, 0px 1px 1px white, 0px -1px 1px white, -1px 1px 1px white, -1px 0px 1px white, -1px -1px 1px white; }
.outline-white-2 { text-shadow:2px 2px 1px white, 2px 0px 1px white, 2px -2px 1px white, 0px 2px 1px white, 0px -2px 1px white, -2px 2px 1px white, -2px 0px 1px white, -2px -2px 1px white; }

#full-footer { position:fixed; bottom:0; width: 100%; height:60px; }
#navbar-footer { background-color: #40869B;border-top:8px solid white;  }
#navbar-footer .nav-item, #navbar-footer a { font-size:0.9em;color:white !important;}

/* Password validator classes */
#password_alert { display: none; }
.password_requirements { list-style-type: none; }
.wrong .fa-check { display: none;color: green; }
.good .fa-times { display: none;color: red; }

.language-change { cursor:pointer; }