.about-quote {
    width: 30%;
    margin-top: 200px;
    margin-right: 10%;
    float: right;
}
.about-quote-mobile {
    display: none;
}
.main-content {
    top: 150px;
}
.image-carousel {
    display: flex;
    margin-left: 5%;
}
.about-image-thumb {
    cursor: pointer;
    width: 30%;
    padding: 2px;
    margin: 3px;
    border: #ffffff 1px solid;
}
#about-image-modal {
    position: fixed;
    width: 100%;
    background-image: url('../images/modal-background.png');
    height: 100%;
    z-index: 1;
    cursor: pointer;
    background-repeat: repeat;
    justify-content: center;
    display: none;
}
#about-image {
    padding: 2px;
    margin-left: 24%;
    margin-top: 24px;
    border: #ffffff 1px solid;
    height: 80%;
    z-index: 2;
}
@media (max-width: 1280px) {
    #about-image {
        padding: 2px;
        margin-left: 6%;
        margin-top: 24px;
        border: #ffffff 1px solid;
        height: 70%;
    }
}
@media (max-width: 700px) {
    .about-quote {
        display: none;
    }
    .about-quote-mobile {
        display: block;
        width: 70%;
        margin-left: 15%;
        margin-top: 20px;
    }
    .image-carousel {
        margin-left: 0;
    }
   #about-image {
        padding: 2px;
        margin-left: 6%;
        margin-top: 24px;
        border: #ffffff 1px solid;
        height: 50%;
    }
}

@media (max-height: 438px) and (orientation: landscape) {
    .about-quote-mobile {
        display: block;
        width: 40%;
        margin-left: 55%;
        margin-top: 100px;
    }
    .image-carousel {
        display: none;
    }
    .main-content {
        top: 50px;
    }
    .about-quote {
        display: none;
    }
    .main-content h1 {
        display: none;
    }
}