:root {
/* rotate gradient */
 --bs-gradient: linear-gradient(-45deg, var(--bs-primary) 0%, var(--bs-primary-dark) 100%); /* var(--bs-gradient); */
}

.header {
     background-image: url(../img/landingspage-header.jpg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: 100% auto;
     object-fit: cover !important;
 }

 @media (max-width: 410px) {
     .header {
         background-position: center center;
         background-size: auto 100%;
         object-fit: cover !important;
     }
 }

 /* topbar */
 .top-bar {
     font-size: 9px;
     text-align: center;
     position: relative;
     z-index: 999 !important;
     padding: 6px;
 }

 .top-bar img {
     max-height: 20px;
     opacity: 0.7;
 }

 @media (max-width: 575px) {
     .top-bar img {
         max-height: 14px;
         opacity: 0.7;
     }
 }

 .bg-grey {
     background-color:var(--bs-primary-lighten);
 }

 .bg-green {
    /* background: #009488;
     background: linear-gradient(-45deg, rgba(0, 148, 136, 1) 0%, rgba(0, 76, 76, 1) 100%); */
    background: var(--bs-primary);
    background: var(--bs-gradient) !important;
 }

 .cont-m {
     max-width: 1800px;
     overflow-x: hidden;
 }

 .cont-s {
     padding-left: 10%;
 }

 .cont-e {
     padding-right: 10%;
 }

 @media (max-width: 1800px) {
     .cont-s {
         padding-left: 8%;
     }

     .cont-e {
         padding-right: 8%;
     }
 }

 @media (max-width: 1600px) {
     .cont-s {
         padding-left: 6%;
     }

     .cont-e {
         padding-right: 6%;
     }
 }

 @media (max-width: 1300px) {
     .cont-s {
         padding-left: 4%;
     }

     .cont-e {
         padding-right: 4%;
     }
 }

 @media (max-width: 1200px) {
     .cont-s {
         padding-left: calc(var(--bs-gutter-x) * .5);
     }

     .cont-e {
         padding-right: calc(var(--bs-gutter-x) * .5);
     }
 }

 @media (max-width: 767px) {
     .cont-s {
         margin-top: 0px;
     }
 }

 .card {
     border-radius: 12px !important;
 }


 .card.bg-green ul.list-group li.list-group-item,
 .card.bg-green ul.list-group li.list-group-item .accordion-item,
 .accordion-button {
     background-color: unset !important;
     color: #fff;
     border: 0px;
 }

 /* Verwijder standaard chevron */
 .accordion-button::after {
     display: none;
 }

 /* Nieuw symbool vooraan */
 .accordion-button::before {
     content: "+";
     /* standaard plus */
     font-weight: bold;
     margin-right: 10px;
     transition: transform 0.2s;
     color:var(--text);
     display: inline-block;
     border-radius: 20px;
     background-color: unset;
     width: 20px;
     height: 20px;
     text-align: center;
 }

 /* Wanneer geopend -> vervang door min */
 .accordion-button:not(.collapsed)::before {
     content: "–";
     background-color: #fff;
 }

 .accordion-button:not(.collapsed) {
     background-color: rgba(255, 255, 255, 0.1) !important;
     box-shadow: unset !important;
     color: #fff;
 }

 .accordion-collapse {
     background-color: rgba(255, 255, 255, 0.1) !important;
 }

 /* Form radi btn */
 .btn-check:checked + .btn-outline-primary{
    background-color:var(--bs-primary);
    border-color: var(--bs-primary);;
 }

 #faqAccordion .accordion-item {
     border: none;
     margin-bottom: 16px;
     border-radius: 12px;
     overflow: hidden;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
     transition: all 0.3s ease;
 }

 #faqAccordion .accordion-item:hover {
     transform: translateY(-2px);
     box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
 }

 #faqAccordion .accordion-button {
     padding: 20px 25px;
     font-weight: 600;
     color: var(--text);
     background-color: #ffffff;
     transition: all 0.3s ease;
 }

 #faqAccordion .accordion-button:not(.collapsed) {
     color: #ffffff;
    background: var(--bs-primary);
    background: var(--bs-gradient) !important;
 }

 #faqAccordion .accordion-button:focus {
     box-shadow: none;
     border-color: rgba(0, 0, 0, .125);
 }

 #faqAccordion .accordion-button::after {
     background-size: 20px;
     transition: all 0.3s ease;
 }

 #faqAccordion .accordion-button:not(.collapsed)::after {
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
 }

 #faqAccordion .accordion-body {
     padding: 25px;
     background-color: #ffffff;
 }

 .scroll-top-wrapper {
  width: unset !important;
}

footer .nav-link:hover {
  color:var(--bs-primary);
}

.dropdown:has(.form-check-input:checked) > .dropdown-toggle {
  background-color:var(--bs-primary);   /* bijvoorbeeld Bootstrap primary */
  color: white;
  border-color:var(--bs-primary);
}

 .message i.fa-sun {
  top: -10px;
  right: -18px;
  -webkit-animation: spin 4s linear infinite;
  -moz-animation: spin 4s linear infinite;
  animation: spin 4s linear infinite;
}

.message i{
position: relative;
}

 .message i.fa-sun {
top:-10px; right: -18px;
-webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:spin 4s linear infinite;
}

@-moz-keyframes spin { 
    100% { -moz-transform: rotate(360deg); } 
}
@-webkit-keyframes spin { 
    100% { -webkit-transform: rotate(360deg); } 
}
@keyframes spin { 
    100% { 
        -webkit-transform: rotate(360deg); 
        transform:rotate(360deg); 
    } 
}

/* Form validation */
* {
    scroll-margin-top: 120px; /* past voor scrollIntoView */
}

form .error, form .form-control.error:focus{
    background: #f8dbda;
    border:1px solid #e67a74;
}