@font-face {
    font-family: 'BrandonGrotesque';
    src: url('../assets/fonts/BrandonGrotesque-Bold.otf');
    font-weight: bold;
}

@font-face {
    font-family: 'MinionPro';
    src: url('../assets/fonts/MinionPro-Regular.otf');
    font-weight: normal;
}

@font-face {
    font-family: 'MinionProBold';
    src: url('../assets/fonts/MinionPro-Bold.otf');
    font-weight: bold;
}

body {
    font-family: 'MinionPro';
    font-size: 1.2rem;
    background-color: #f9fafb;
    text-align: justify;
}

h3 {
    font-family: 'MinionProBold';
    margin-bottom: 2rem;
}

.p-bold {
    font-family: 'MinionProBold';
}

@media screen and (max-width: 600px) {
    body {
        font-size: 1rem;
    }
}

@media screen and (max-width: 990px) {
    .watikmijwens-over-de-auteur-content {
        padding-top: 5%;
    }
}

@media screen and (min-width: 1400px) {
    .watikmijwens-titel-pagina-img {
        max-width: 500px;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .watikmijwens-bedankt-pagina-img {
        max-width: 400px;
        display: block;
        margin-left: auto;
        margin-right: auto;

    }

    .watikmijwens-over-de-auteur-img {
        max-width: 400px;
    }
}

.navbar {
    background-color: #ebb80f;
}

.navbar-nav .nav-link.active {
}

.watikmijwens-titel-pagina {
    background-image: linear-gradient(#ebb80f, #f9fafb);
}

.watikmijwens-bedankt-pagina {
    background-image: linear-gradient(#ebb80f, #f9fafb);
}

.watikmijwens-bedankt {
    text-align: center;
    padding: 5% 0% 25%;
}

.watikmijwens-over-het-boek {
    padding: 5% 0%;
}

.watikmijwens-fragment {
    padding: 5% 0%;
}

.watikmijwens-over-de-auteur {
    padding: 5% 0%;
}

.watikmijwens-over-de-auteur-img {
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 10px;
}

.watikmijwens-over-de-auteur-content {
    /*padding-top: 30px;*/
}

.watikmijwens-bestellen {
    padding: 5% 0%;
}

.watikmijwens-bestellen input {
    background-color: #ebb80f40;
}

.watikmijwens-bestellen textarea {
    background-color: #ebb80f40;
    height: 150px;
}

.watikmijwens-contact {
    padding: 5% 0%;
}

.watikmijwens-contact textarea {
    height: 200px;
}

.watikmijwens-footer {
    background-color: #ebb80f;
    height: 80px;

}

.watikmijwens-footer-content {
    text-align: left;
    justify-content: center;
    padding: 25px 12px;
}

.watikmijwens-footer-content p {
    margin-bottom: 0px;
}


.watikmijwens-footer-links {
    text-align: right;
    padding: 20px 12px;
}

.watikmijwens-footer-links img {
    margin-left: 4px;
}

.watikmijwens-hr {
}

.watikmijwens-reacties {
    padding: 5% 0%;
    /*padding-bottom: 5%;*/
}

.watikmijwens-reacties-content {
    /*width: 80%;*/
    /*margin: auto;*/
    background-color: #ebb80f;
    border-radius: 10px;
}

.carousel-item {
    /*background-color: #ebb80f;*/
    /*border-radius: 10px;*/
    height: 16rem;
    text-align: center;

    webkit-transition: 1.5s ease;
    -o-transition: 1.5s ease;
    transition: 1.5s ease;
}

.carousel-inner {

}

.carousel {
}

.watikmijwens-mogelijk-gemaakt-door {
    padding: 5% 0%;
}



@media screen and (max-width: 400px) {
    .carousel-item {
        padding: 4rem 20% 0rem;
    }
}

@media screen and (min-width: 400px) {
    .carousel-item {
        padding: 4rem 25% 0rem;
    }
}


@media screen and (min-width: 990px) {
    .carousel-item {
        padding: 4rem 17.5% 0rem;
    }
}

@media screen and (min-width: 1600px) {
    .carousel-item {
        padding: 4rem 20% 0rem;
    }
}

@media screen and (min-width: 1800px) {
    .carousel-item {
        padding: 4rem 25% 0rem;
    }
}

@media screen and (min-width: 2500px) {
    .carousel-item {
        padding: 4rem 15% 0rem;
        height: 14rem;
    }
}

.btn-watikmijwens, .btn-watikmijwens:hover, .btn-watikmijwens:active, .btn-watikmijwens:visited {
    background-color: #ebb80f;
    width: 150px;
    font-size: 2rem;
    /*margin-top: 15px;*/
}

@media screen and (max-width: 600px) {
    .btn-watikmijwens, .btn-watikmijwens:hover, .btn-watikmijwens:active, .btn-watikmijwens:visited {
        font-size: 1.5rem;
    }
}