/* Sohne Breit : https://klim.co.nz/retail-fonts/soehne-breit */
@font-face {font-family:'Sohne';font-style:normal;font-weight:500;font-display:swap;src:url('./fonts/sohne/SohneBreit-Kraftig.woff2') format('woff2');}
@font-face {font-family:'Sohne';font-style:normal;font-weight:600;font-display:swap;src:url('./fonts/sohne/SohneBreit-Halbfett.woff2') format('woff2');}
@font-face {font-family:'Sohne';font-style:normal;font-weight:700;font-display:swap;src:url('./fonts/sohne/SohneBreit-Dreiviertelfett.woff2') format('woff2');}
@font-face {font-family:'Sohne';font-style:normal;font-weight:800;font-display:swap;src:url('./fonts/sohne/SohneBreit-Fett.woff2') format('woff2');}

/* Montserrat (Latin) : https://fonts.google.com/specimen/Montserrat?query=montserrat */
@font-face {font-family:'Montserrat';font-style:normal;font-weight:100;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-100.eot');src:url('./fonts/montserrat-v23-latin/montserrat-100.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-100.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-100.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-100.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-100.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:normal;font-weight:200;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-200.eot');src:url('./fonts/montserrat-v23-latin/montserrat-200.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-200.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-200.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-200.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-200.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:normal;font-weight:300;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-300.eot');src:url('./fonts/montserrat-v23-latin/montserrat-300.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-300.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-300.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-300.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-300.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:normal;font-weight:400;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-400.eot');src:url('./fonts/montserrat-v23-latin/montserrat-400.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-400.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-400.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-400.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-400.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:normal;font-weight:500;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-500.eot');src:url('./fonts/montserrat-v23-latin/montserrat-500.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-500.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-500.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-500.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-500.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:normal;font-weight:600;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-600.eot');src:url('./fonts/montserrat-v23-latin/montserrat-600.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-600.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-600.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-600.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-600.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-700.eot');src:url('./fonts/montserrat-v23-latin/montserrat-700.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-700.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-700.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-700.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-700.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:normal;font-weight:800;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-800.eot');src:url('./fonts/montserrat-v23-latin/montserrat-800.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-800.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-800.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-800.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-800.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:normal;font-weight:900;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-900.eot');src:url('./fonts/montserrat-v23-latin/montserrat-900.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-900.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-900.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-900.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-900.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:italic;font-weight:100;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-100-italic.eot');src:url('./fonts/montserrat-v23-latin/montserrat-100-italic.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-100-italic.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-100-italic.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-100-italic.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-100-italic.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:italic;font-weight:200;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-200-italic.eot');src:url('./fonts/montserrat-v23-latin/montserrat-200-italic.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-200-italic.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-200-italic.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-200-italic.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-200-italic.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:italic;font-weight:300;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-300-italic.eot');src:url('./fonts/montserrat-v23-latin/montserrat-300-italic.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-300-italic.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-300-italic.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-300-italic.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-300-italic.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:italic;font-weight:400;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-400-italic.eot');src:url('./fonts/montserrat-v23-latin/montserrat-400-italic.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-400-italic.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-400-italic.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-400-italic.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-400-italic.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:italic;font-weight:500;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-500-italic.eot');src:url('./fonts/montserrat-v23-latin/montserrat-500-italic.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-500-italic.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-500-italic.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-500-italic.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-500-italic.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:italic;font-weight:600;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-600-italic.eot');src:url('./fonts/montserrat-v23-latin/montserrat-600-italic.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-600-italic.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-600-italic.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-600-italic.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-600-italic.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:italic;font-weight:700;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-700-italic.eot');src:url('./fonts/montserrat-v23-latin/montserrat-700-italic.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-700-italic.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-700-italic.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-700-italic.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-700-italic.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:italic;font-weight:800;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-800-italic.eot');src:url('./fonts/montserrat-v23-latin/montserrat-800-italic.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-800-italic.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-800-italic.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-800-italic.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-800-italic.svg#Montserrat') format('svg');}
@font-face {font-family:'Montserrat';font-style:italic;font-weight:900;font-display:swap;src:url('./fonts/montserrat-v23-latin/montserrat-900-italic.eot');src:url('./fonts/montserrat-v23-latin/montserrat-900-italic.eot?#iefix') format('embedded-opentype'),url('./fonts/montserrat-v23-latin/montserrat-900-italic.woff2') format('woff2'),url('./fonts/montserrat-v23-latin/montserrat-900-italic.woff') format('woff'),url('./fonts/montserrat-v23-latin/montserrat-900-italic.ttf') format('truetype'),url('./fonts/montserrat-v23-latin/montserrat-900-italic.svg#Montserrat') format('svg');}

:root {
    --bw-purple: #5334c4;
    --bw-purple-light: #917fff;
    --bw-purple-dark: #090615;
    --bw-blue: #2e80f6;
    --bw-white: #ffffff;
    --bw-grey : #f6f6f6;
    --bw-grey-dark : #ededed;
    --bw-black: #000000;
    --bw-green: #68e07b;
    --bw-orange: #fd9e04;
    --bw-red: #fd0505;
    --bw-red-error: #b94a48;
    --system-fonts: Calibri,'Helvetica Neue',Helvetica,Arial,sans-serif;
    --bw-fonts-text: 'Montserrat',var(--system-fonts);
    --bw-fonts-title: 'Sohne',var(--bw-fonts-text);
    --bw-lin-gra-1: linear-gradient(340deg,rgba(83, 52, 196, 1) 40%, rgba(9, 5, 20, 1) 90%);
}

/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
body {line-height:1;}
ol, ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none;}
table {border-collapse:collapse;border-spacing:0;}
body {font-family:'Montserrat',Calibri,'Helvetica Neue',Helvetica,Arial,sans-serif;min-width: 380px;}
sup {font-size:11px;}

.section {padding:0px;}
.container {width:100%;max-width:1280px;}

h1, h2, h3 {color:#5334c4;font-weight:bold;font-family: var(--bw-fonts-title);}
h1 {font-size:40px;line-height:40px;margin:180px 0px 80px 0px;color:white;font-weight:900;}
h2 {font-size:24px;line-height:24px;margin-top:0px;margin-bottom:20px;font-weight: 400;}
h3 {font-size:18px;margin-top:36px;margin-bottom:10px;}

ul.purple-list {list-style:none;padding-left:0;}
ul.purple-list li {padding-left:2em;margin-bottom:18px;position:relative;}
ul.purple-list li::before {content:'\2022';color:#5334c4;font-weight:bold;display:inline-block;width:2em;margin-left:-2em;}

.btn-arrow, .btn-arrow::before, .btn-arrow::after {height: 1px;}
.btn-arrow, .btn-arrow::before, .btn-arrow::after {height: 1px;background-color: white;}
.btn-arrow {position: relative;width: 60px;display: inline-block;margin-left: 20px;margin-bottom: 6px;}
.btn-arrow::before, .btn-arrow::after {content: "";position: absolute;right: 0;width: 5px;display: inline-block;}
.btn-arrow::before {top: -2px;transform: rotate(45deg);}
.btn-arrow::after {top: 2px;transform: rotate(-45deg);}
.big-btn {border-radius: 30px;min-height: 60px;padding: 18px 120px 18px 120px !important;height: 60px;font-size: 18px;line-height: 24px;font-weight: bold;background-color: #5334c4;color:#ffffff;}

.btn:focus {background-color: #5334c4;}
.btn:hover {background-color: #674acf;}

.flex-container {display:flex;margin-bottom:20px;}
.flex-container:last-of-type {margin-bottom:0px;}
.flex-container div:first-of-type {min-width:40px;display:inline-block;}
.flex-container div:last-of-type {flex-grow:1;}

header {width:100%;text-align:center;padding-bottom:0px;overflow:hidden;}
header .afm {background: url(../img/afm.svg) no-repeat center center;text-indent:-99999px;background-size:380px;height:100px;width:100%;}
header #top {background: var(--bw-lin-gra-1);color:white;position:relative;height:480px;}
header #top h1 {margin-bottom:30px;}
header #top .container {text-align:left;display:inline-block;}
header #top .container span {display:inline-block;max-width:50%;font-size:16px;line-height:24px;}
header #top #bwlogo {position:absolute;top:30px;left:65px;height:60px;}
header #top #top-img {position:absolute;right:25%;bottom:0px;margin-right:-310px;}

#error {padding-top:60px;padding-bottom:0px;background-color: var(--bw-grey);}
#error .container {text-align:left;background-color:#f2dede;padding:30px;color:#b94a48;box-sizing:border-box;}

#sim-container {margin-top:30px;margin-bottom:40px;}
#sim {width:100%;display:inline-block;padding-top:10px;}
#sim .left {width:50%;float:left;text-align:left;box-sizing:border-box;}
#sim .right {width:50%;float:left;box-sizing: border-box;text-align:center;}
#sim label {color:black;}
#sim input[type=text]:not(.browser-default) {padding: 10px 30px;margin-top:5px;width:100%;box-sizing:border-box;font-family:Arial;font-size:13px;line-height:13px;background-color: white !important;border-radius:10px !important;border:3px solid var(--bw-purple);}
#sim input[type=text]:not(.browser-default)::placeholder {color:#999;font-style: italic;}

#result {display:none;text-align:center;padding-top:40px;}
#result .rememb {font-size:13px;line-height:1.2em;}
#result .mens {color:#5334c4;font-size:28px;line-height:1.2em;}
#result .infos {display:inline-block;width:250px;}
#result .infos .line {width:100%;float:left;padding-bottom:5px;}
#result .infos .line .left {float:left;width:60%;text-align:left;}
#result .infos .line .right {float:left;width:40%;text-align:center;}

#alert-container {float:left;width:100%;}
.alert{display:none;margin-top:10px;box-sizing:border-box;padding:8px 35px 8px 14px;text-shadow:0 1px 0 rgba(255, 255, 255, 0.5);background-color:#f2dede;border:1px solid #eed3d7;-webkit-border-radius:0px;-moz-border-radius:0px;border-radius:0px;}
.alert,.alert h4{color:#b94a48;}
.alert h4{margin:0;}
.error_text {margin-top:20px;padding:30px;background-color:#f2dede;color:#b94a48;}

#werk {background-color: var(--bw-purple-light);padding-top:100px;padding-bottom:100px;}
#werk .container {display:flex;}
#werk .container div.flex-wrapper {width:50%;}
#werk .container div.flex-wrapper:first-of-type img {max-width:90%;border-radius:20px;}

#vraag {padding-top:80px;padding-bottom:40px;position:relative;overflow:hidden;}
#vraag .container {position:relative;z-index:999;}
#vraag h2 {color:black;font-size:20px;line-height:26px;font-weight:900;margin-bottom:10px;}
#tarification {display:inline-block;width:100%;}
#tarification > div {width:50%;float:left;}
#tarification ul {border:2px solid var(--bw-grey);background-color: var(--bw-grey);padding:30px;box-sizing:border-box;border-radius:10px;cursor: pointer;transition: background-color 300ms linear, border-color 300ms ease;}
#tarification ul.error {border:2px solid #b94a48;}
#tarification ul:hover {border:2px solid #5334c4;}
#tarification div:first-of-type ul {margin-right:10px;}
#tarification div:last-of-type ul {margin-left:10px;}
#tarification li {display:flex;justify-content:space-between;font-size:15px;margin-bottom:12px;}
#tarification li:first-of-type {font-weight:bold;font-size:16px;margin-bottom:20px;}
#tarification li:first-of-type div {color:var(--bw-purple);font-family: var(--bw-fonts-title);font-size:20px !important;line-height:20px !important;font-weight:400 !important;}
#tarification li div:last-of-type {display:inline-flex;font-weight:bold;}
#tarification ul.active {border: 2px solid #5334c4;background-color: #5334c4;color:#ffffff;}
#tarification ul.active li:first-of-type div {color:#ffffff;}
#tarification ul.active a  {color:white;font-weight:bold;}

#vraag .big-btn {padding:18px 30px 18px 30px !important;width:100%;max-width:580px;height:auto;line-height:24px;}

#secciLink {font-size:14px;line-height:18px;font-weight:400;display:inline-block;margin-top:10px;color:var(--bw-purple);}
#secciLink:hover{text-decoration:underline;}

#simulation .bg-shape, #vraag .bg-shape {position:absolute;height:1400px;z-index:998;left:50%;margin-left:470px;}
#simulation .bg-shape {bottom:-980px;}
#vraag .bg-shape {top:-420px;}

#kopen {background-color: var(--bw-grey);padding-top:80px;padding-bottom:100px;}
#kopen .flex-container {display:flex;}
#kopen .flex-container .flex-wrapper:first-of-type {width:55%;display:inline-block;padding-right:20px;}
#kopen .flex-container .flex-wrapper:last-of-type {width:45%;overflow:hidden;border-radius:20px;}

#legal-informations {padding:50px 0px;background-color:var(--bw-grey-dark);}
#legal-informations .wrapper {text-align:left;}

#simulation .bg-shape, #vraag .bg-shape {position:absolute;height:1400px;z-index:998;left:50%;margin-left:470px;}

@media only screen and (max-width: 1600px) {header #top #top-img {margin-right:-340px;}}

@media only screen and (max-width: 1410px) {
    #simulation .bg-shape, #vraag .bg-shape {left:auto;right:-700px;margin-left:0px;}
    header #top #bwlogo {left:30px}
}

@media only screen and (max-width: 1320px) {.container {padding-left:30px;padding-right: 30px;}}
@media only screen and (max-width: 1170px) {header #top #top-img {margin-right:-400px;}}

@media screen and (max-width: 1090px){
    #legal-informations {padding-left:20px;padding-right:20px;box-sizing:border-box;}
    #legal-informations .wrapper {width:100%;}
}

@media screen and (max-width: 1058px){
    header .wrapper {width:100%;height:auto !important;}
    header #top #top-img {margin-right:-420px;}
}

@media screen and (max-width: 940px){
    header #top #top-img {display:none;}
    header #top .container span {max-width:100%;margin-bottom:60px;}
    header #top {height:auto;min-height:480px;}
    #werk .container {flex-direction: column;}
    #werk .container div.flex-wrapper {width:100%;}
    #werk .container div.flex-wrapper:first-of-type {order:1;text-align:center;}
    #werk .container div.flex-wrapper:last-of-type {order:0;}
    #werk .container div.flex-wrapper:first-of-type img {max-width:600px;width:100%;margin-top:60px;}
}

@media screen and (max-width: 920px){
    #tarification > div {width:100%;}
    #tarification div:first-of-type ul {margin-right:0px;margin-bottom:10px;}
    #tarification div:last-of-type ul {margin-left:0px;}
    #kopen .flex-container {flex-direction: column;}
    #kopen .flex-container .flex-wrapper {width:100% !important;padding-right:0px !important;}
    #kopen .flex-container .flex-wrapper:last-of-type {margin-top:20px;}
}

@media screen and (max-width: 600px){
    #sim .left, #sim .right {width:100%;}
    #sim .right {padding-top:10px;}
    #sim #submit-sim {width:100%;}
    #simulation .big-btn {padding:18px 0px 18px 0px !important}
    #vraag h2 {font-size:30px;line-height:30px;}
    #vraag h2 img {height:25px;}
}

@media screen and (max-width: 490px){
    h1 {font-size:32px;}
    #vraag .container {padding-left:10px;padding-right:10px;}
    #tarification ul {padding:30px 20px;}
    #tarification li {font-size:13px;}
}

@media screen and (max-width: 470px){#vraag .big-btn .btn-arrow {display: none;}}
@media screen and (max-width: 420px){h1 {font-size:30px;}}
@media screen and (max-width: 390px){h1 {font-size:28px;}}