.contact {
    display: flex;
    flex-direction: column;
    position: relative;
    background-color: #4c0a20;
    width: 100%;
    height: auto;
    align-items: center;
}

.contact .contact-container {
    display: flex;
    flex-direction: row;
    width: 100%;
    max-width: 1000px;
    justify-content: center;
    /* background-color: blue; */
}

.contact .contact-container .contact-card {
    display: flex;
    flex-direction: row;
    /* background-color: red; */
    width: 100%;
    border-style: solid;
    border-radius: 30px 30px 0px 30px;
    border-color: #FAF6F4;
    border-width: 0.3vw;
    margin-top: 30px;
    margin-bottom: 30px;
}


.contact .contact-container .contact-card .contact-description-container {
    display: flex;
    flex-direction: column;
    width: 60%;
    /* background-color: aqua; */
    justify-content: center;
    padding: 30px;
}


.contact .contact-container .contact-card .contact-description-container h1 {
    font-size: 25px;
    color: #4c0a20;
    background-color: #FAF6F4;
    padding: 10px;
    border-radius: 30px;
}


.contact .contact-container .contact-card .contact-description-container h3 {
    font-size: 25px;
    color: #FAF6F4;
    background-color: #C02736;
    padding: 10px;
    border-radius: 30px;
    text-align: center;
    cursor: pointer;
    --fa-animation-duration: 3s;
    --fa-beat-scale: 1.05;
}

.contact .contact-container .contact-card .contact-description-container p {
    font-size: 20px;
    color: #FAF6F4;
}


.contact .contact-container .contact-card .contact-photo-container {
    display: flex;
    flex-direction: row;
    width: 40%;
    margin-top: 10px;
    /* background-color: yellowgreen; */
}


.contact .contact-container .contact-card .contact-photo-container img {
    width: 100%;
}

@media only screen and (orientation: portrait) {

    .contact .contact-container .contact-card {
        width: 90%;
        border-width: 0.5vh;
    }

    .contact .contact-container .contact-card .contact-description-container {
        width: 100%;
    }

    .contact .contact-container .contact-card .contact-description-container h1 {
        font-size: 20px;
        align-self: center;
    }

    .contact .contact-container .contact-card .contact-description-container p {
        font-size: 15px;
    }


    .contact .contact-container .contact-card .contact-description-container h3 {
        font-size: 15px;
    }

    .contact .contact-container .contact-card .contact-photo-container {
        display: none;
    }

}