@font-face {
    font-family: Poppins;
    src: url(../font/Poppins-Medium.ttf);
}

:root {
    --brown-color: #6b432f;
    --brown-color-dark: #533425;
    
    --body-font: Helvetica, sans-serif;
    --title-font: 'Poppins', sans-serif;
}

.body {
    font-family: var(--body-font);
}

.disc__title,
.calendar__title,
.contact__title {
    font-family: var(--title-font);
}

.change-box-shadow:focus {
    border-color: var(--brown-color);
    box-shadow: 0 0 0 0.25rem rgba(107,67,47,.25);
}

.bio {
    background-image: url(../img/background1.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.bio__box {
    background-color: rgba(28, 28, 28);
    opacity: .9;
}

.bio__title {
    display: inline-block;
}

.disc__box {
    background-color: rgba(0, 0, 0, .5);
    transition: opacity .4s;
    
}

.disc__box:hover {
    opacity: 0;
}

.calendar {
    background-image: url(../img/background2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.btn-custom-outline {
    color: var(--brown-color);
    border-color: var(--brown-color);
}

.btn-custom-outline:hover {
    background-color: var(--brown-color);
}

.btn-custom {
    background-color: var(--brown-color);
}

.btn-custom:hover {
    background-color: var(--brown-color-dark);
}

.contact__email {
    text-decoration: none;
    color: var(--brown-color);
}

.contact__email:hover {
    text-decoration: underline;
}

.footer__link:hover {
    color: var(--brown-color-dark);
}

@media screen and (max-width: 992px) {
    .disc__cards {
        flex-wrap: wrap;
    }
}