@font-face {
    font-family: 'Kiona Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Kiona Regular'), url('/fonts/Kiona-Regular.woff') format('woff');
}

@font-face {
    font-family: 'Kiona Itallic';
    font-style: normal;
    font-weight: normal;
    src: local('Kiona Itallic'), url('/fonts/Kiona-Itallic.woff') format('woff');
}

body {
    font-family: 'Kiona Regular', arial, sans-serif;
    font-weight: normal;
    background-color: var(--wit);
}

.btn-primary {
    background-color: var(--bruin);
    --bs-btn-border-color: var(--taupe);
    --bs-btn-color: var(--taupe);
}

.btn-primary:hover {
    background-color: var(--wit);
    color: var(--taupe);
    border-color: var(--bruin);
}

a {
    color: var(--bruin);
}

.parallax-header {
    background-image: url('/images/patient.jpg');
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100vh;
    /*min-height: 400px;*/
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--wit);
    text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.7);
    text-align: center;
}

.parallax {
    background-image: url('/images/patient.jpg');
    height: 50vh; /* Full screen height */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

section {
    font-family: Arial, sans-serif;
    padding: 40px 20px;
    text-align: left;
    width: 60%;
    margin: 0 auto;
}

section h2 {
    font-family: "Kiona Regular", sans-serif;
}

.top-bar a {
    z-index: 11; /* higher than navbar (default is 1030) */
    /*z-index: 1031; !* higher than navbar (default is 1030) *!*/
    height: 32px;
    font-size: 0.875rem;
    color: var(--wit);
}

.mt-topbar {
    top: 29px; /* match height of top-bar */
}

.nav-item {
    padding-left: 50px;
}

footer.bg-light {
    background-color: var(--taupe) !important;
    text-align: center;
    padding: 10px;
    color: var(--wit);
}

/* Overrides for screens up to medium */
@media (max-width: 768px) {
    /* Stop parallax effect on screens smaller then medium */
    .parallax-header {
        background-attachment: scroll;
    }

    .parallax {
        height: 60vh;
        background-attachment: scroll;
    }

    .nav-item {
        padding-left: 0px;
    }

    section {
        width: 90%;
    }
}

.accordion-button {
    border-radius: 0.5rem !important; /* Adjust the radius for the button */
    background-color: var(--wit) !important;
}

.accordion-item {
    background-color: var(--wit);
    border-radius: 0.5rem !important; /* Adjust the radius for the item */
    overflow: hidden; /* Ensure the content stays inside the rounded corners */
}

.accordion-item:not(:last-child) {
    margin-bottom: 5px; /* Optional: adds space between accordion items */
}

.accordion-button:not(.collapsed) {
    background-color: var(--wit) !important;
    box-shadow: none !important;
    border-color: inherit !important;
}

.accordion-button:focus {
    box-shadow: none !important;
    border-color: inherit !important;
}

:root {
    --taupe: #c6b79b;
    /*--mintgroen: #c4e3d2;*/
    --mintgroen: #f8fff8;
    --rose: #e9cfcb;
    --text: #3d3d3d;
    --wit: #fdfbf8;
    --bruin: #553502;

    /*--bs-body-bg: var(--mintgroen);*/
}

section:nth-child(odd) {
    background-color: var(--wit);
}

section:nth-child(even) {
    background-color: var(--wit);
}

.navbar {
    background-color: var(--wit) !important;
}

.navbar .nav-link:hover {
    color: var(--bruin) !important;
    font-weight: bold;
}

.card {
    height: 100%;
    background-color: var(--mintgroen)
}