@font-face {
  font-family: "montserratbold";
  src: url("/resources/fonts/montserrat-bold-webfont.woff2")
      format("woff2"),
    url("/resources/fonts/montserrat-bold-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "montserratlight";
  src: url("/resources/fonts/montserrat-light-webfont.woff2")
      format("woff2"),
    url("/resources/fonts/montserrat-light-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "montserratregular";
  src: url("/resources/fonts/montserrat-regular-webfont.woff2")
      format("woff2"),
    url("/resources/fonts/montserrat-regular-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "montserratsemibold";
  src: url("/resources/fonts/montserrat-semibold-webfont.woff2")
      format("woff2"),
    url("/resources/fonts/montserrat-semibold-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

body {
  background-color: #FFF9F9;
  font-family: "montserratregular", Helvetica, Arial, sans-serif;
}

/* All horizontal lines */
hr.mb-4 {
  display: none;
}

/* Titel */
h1 {
  position: relative;
  display: block;
  font-size: 1.875rem;
  line-height: 1.875rem;
  margin-top: 2rem;
  font-family: "montserratbold", Helvetica, Arial, sans-serif;
  font-weight: 700;
  color: #602167; 
}

h2 {
  position: relative;
  display: inline-block;
  font-size: 2.5rem;
  margin-top: 2rem;
  font-family: "montserratbold", Helvetica, Arial, sans-serif;
  font-weight: 700;
  color: #602167; 
}

/* Opt-ins en nieuwsbrieven */
h4.mb-3 {
  color: #111111;
  margin-top: 2rem;
  font-family: "montserratbold", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 1rem !important;
}

/* Links */
a {
  font-family: "montserratsemibold", Helvetica, Arial, sans-serif;
  color: #602167;
  font-weight: 500;
}

a:hover {
  color: #602167;
}

/* Logo/Afbeelding */
.mx-auto {
  width: 100vw;
  height: auto;
}

/* Header balk */
#container-header .col-lg-8.offset-lg-2.mb-3 {
  margin: 0;
  width: 100vw;
  padding: 0;
}

#container-header .col-lg-8 {
  padding: 0;
}

#container-header a {
  background-image: url("/resources/images/boulevard_new22.svg"),
  url("/resources/images/2024_08_02_PLEIN__KarinJonkers019 (2).jpg");
  background-size:300px, cover;
  background-repeat: no-repeat, no-repeat;
  background-position: 10% 10%, center bottom;
  margin: 0;
  width: 100vw;
  padding: 22vh 0;
}

#container-header {
  width: 100vw;
  max-width: 100vw;
  margin: 0;
}

/* 'Container' binnen header-balk */
#container-header a {
  display: block;
  margin: 0 auto;
}

#container-header .row {
  display: block;
  width: 100vw;
}

#container-content {
  padding-bottom: 4rem;
}

#container-footer {
  background: none;
}

@media (min-width: 992px) {
  #container-header .col-lg-8 {
    max-width: 100vw;
  }
}

.mx-auto {
  margin-left: 0 !important;
}

/* Buttons */
.btn-success,
.btn-primary {
  margin-top: 2rem;
  display: inline-block;
  padding: 18px 40px;
  color: #ffffff;
  background-color: #602167;
  border: 0;
  position: relative;
  font-family: "montserratsemibold", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 3px;
  border-radius: 0;
  width: auto !important;
  display: inline-block;
}

.btn-success:not(:disabled):not(.disabled):active,
.btn-success:focus,
.btn-success:hover,
.btn-primary:hover {
   background-color: #3b0d40;
}

.btn-primary:not(:disabled):not(.disabled):active, 
.btn-primary:not(:disabled):not(.disabled).active {
   background-color: #3b0d40;
   border-color: #3b0d40;
}

/* Form label */
label {
  font-family: "montserratsemibold", Helvetica, Arial, sans-serif;
}

.custom-control-label {
  font-family: "montserratregular", Helvetica, Arial, sans-serif;
}
/* Inputs */
.form-control {
  border-radius: 0;
  border-color: rgb(0, 0, 0, 0);
  min-width: 260px;
  padding: 11px 15px;
  font-size: 16px;
  line-height: 24px;
  height: 50px;
  font-family: "montserratregular", Helvetica, Arial, sans-serif;
  color: #111;
  background-color: #FFFFFF;
}

.form-control:focus {
  background: #FFFFFF;
  border-color: #FFFFFF;
  outline: none;
  box-shadow: none;
}

.lead {
  /*display: none;*/
}

/* Input e-mail */
.email-address {
  background-color: #FFFFFF;
  padding: 11px 15px;
  line-height: 24px;
  height: 50px;
  color: #111111;
}

input#emailAddress {
  margin-top: -10px;
  margin-left: -15px;
  width: calc(100% + 30px);
}

/* Checkbox */
.custom-control-input ~ .custom-control-label::before {
  border-radius: 5px;
}

.custom-control-input:checked ~ .custom-control-label::before {
  color: #ffffff;
  border-color: #602167;
  background-color: #602167;
  border-radius: 0px;
}

.custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
  border-color: #602167;
  border-radius: 0;
}

.custom-control-label::after {
  background-size: 10px;
}

/* Balk met tekst */
.alert.alert-danger,
.alert.alert-primary {
  border-radius: 0;
  border: 0;
  color: #111111;
  border-color: #feeaeb;
  background: #feeaeb;
  font-family: "montserratsemibold", Helvetica, Arial, sans-serif;
}