.modal-contentimg {
    border-radius: 0px;
    margin: auto;
    display: block;
    max-width: 690px;
    max-height: 600px;
    margin-top: 40px;
    margin-bottom: 20px;
    background-color: white;
}

.modal-contentimgb {
    border-radius: 0px;
    margin: auto;
    display: block;
    max-width: 450px;
    margin-top: 40px;
    margin-bottom: 20px;
    background-color: white;
}

.mySlides {
    cursor: pointer;
}

@media only screen and (max-width: 500px) {
    .modal-contentimgb {
        max-width: 400px;
    }
}

@media only screen and (max-width: 450px) {
    .modal-contentimgb {
        max-width: 350px;
    }
}

@media only screen and (max-width: 400px) {
    .modal-contentimgb {
        max-width: 300px;
    }
}

@media only screen and (max-width: 360px) {
    .modal-content {
        width: 90%;
    }

    .modal {
        padding-top: 60%;
    }
}

@media only screen and (max-width: 350px) {
    .modal-contentimgb {
        max-width: 250px;
    }
}

@media only screen and (max-width: 310px) {
    .modal-content {
        width: 90%;
    }

    .modal {
        padding-top: 70%;
    }
}

@media only screen and (max-width: 300px) {
    .modal-contentimgb {
        max-width: 200px;
    }
}