/* --- Layout Basics --- */
.row > .column {
    padding: 0 8px;
}

.row::after {
    content: "";
    display: table;
    clear: both;
}

.column {
    float: left;
    width: 25%;
}

/* --- Modal --- */
.sm {
    z-index: 5000 !important;
}

.modal {
    display: grid;
    position:absolute;
    justify-content:center;
    align-content:center;
    overflow:hidden;
    z-index: 7000;
    width: 100vw;
    height: 100vh;
    max-width: 75%;
    max-height: 75%;
    background-color: transparent;
}

/* --- Slides --- */
.mySlides {
    display: block;
    position: fixed;
    padding:4vh 1.75vw 3vh 1.75vw;
    border-radius: 35px;
    background-color: white;
    margin:auto;
    width:fit-content;
    height:fit-content;
    max-width:90%;
    max-height:90%;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}

/* --- Click on Image Heading */
.gallery-click-on-image {
    padding-bottom: 10px;
    display:initial !important;
    visibility: visible !important;
    height: initial !important;
}

/* --- Close Buttons --- */
.close {
    color: black;
    font-size: 24px;
    font-weight: bold;
    width: fit-content;
    z-index: 7780;
}

    .close:hover {
        color: #999;
        cursor: pointer;
    }

.close-top {
    position: absolute;
    top: 0vh;
    right: 4vw;
    background-color: transparent;
    opacity: .6;
}

.close-bottom {
    display: inline-block;
    position: relative;
    bottom: 0px;
    right: 2vw;
    top:0.8vh;
    background-color: transparent;
    color:black;
    opacity: 0.8 !important;
    font-size: small;
}

/* --- Prev / Next Buttons --- */
.prev, .next {
    cursor: pointer;
    display: block;
    position: absolute;
    top: 0px;
    bottom: 0px;
    width: 5vw;
    padding: 0px;
    color: black;
    background-color:transparent;
    opacity: 0.185;
    font-weight: bold;
    font-size: large;
    text-align: center;
    vertical-align: middle;
    writing-mode: vertical-lr;
    text-orientation: upright;
    transition: .6s ease;
    user-select: none;
    border: none;
    z-index: 7770;
}

.prev {
    left: 0vw !important;
}

.next {
    right: 0vw !important;
    padding-left:3.5vw !important;
}

    .prev:hover, .next:hover {
        color: white !important;
        background: rgba(0,0,0,.8) !important;
        text-decoration: none !important;
    }


/* --- Titles & Numbers --- */
.SlideTitleDiv {
    display: inline-block;
    position: absolute;
    top: 6px;
    width: 100%;
    text-align: center;
    z-index: 7780;
}

.SlideTitle {
    display: inline-block;
    position: relative;
    padding: 0px;
    background: white;
    opacity: .6;
    font-weight: bold;
    font-size: large; /* vw = viewport width - will auto scale for different sized windows */
}

.SlideNumberDiv {
    position: absolute;
    left: 2vw;
    top: 0.9vh;
    width: fit-content;
    opacity: .6;
    font-size: smaller;
    background: transparent;
}

/* --- Captions --- */
.caption {
    margin: 6px 0 2px;
}

.footer-container {
    background-color:transparent;
    color:black;
    display: block;
    position: absolute;
    left: 1vw;
    right: 1vw;
    bottom: 0.2vh;
    height: 2.5vh;
    font-size: small;
    z-index: 7780;
}

.caption-container {
    display: inline-block;
    position: relative;
    width: fit-content;
    background-color: transparent;
    color:black;
    opacity: 0.8;
    font-size: small;
    font-style: italic;
    padding-left: 2vw;
    top:-0.2vh;
    bottom: 0vh;
} 

/* --- Thumbnails --- */
.thumbnail_outer {
    margin-bottom: 17px;
}

.thumbnail_text {
    text-align: center;
    padding-top: 10px;
}

.demo {
    opacity: .6;
}

    .demo:hover, .active {
        opacity: 1;
    }

.hover-shadow {
    transition: .3s;
}

    .hover-shadow:hover {
        box-shadow: 0 45px 25px rgba(0,0,0,.2), 0 6px 20px rgba(0,0,0,.19);
    }

/* --- Gallery Images (shared) --- */
.gallery_image-div {
    display: block;
    position: relative;
    margin-left: -3vh;
    margin-right: -3vh;
    margin-top: -6vh;
    margin-bottom: -1px;
    padding: 0px;
}

.gallery_image {
    margin: auto;
    padding: 0px;
    border-radius: 20px;
    box-shadow: 11px 11px 5px lightgray;
    border-color:white;
    border-style:solid;
}

/*
[class^="gallery_image_"] {
    width: 90% !important;
    height: auto !important;
    max-width: 90% !important;
}
*/

/* --- Desktop Styles 769 --- */
/*@media (min-width: 2px) {*/

    .block_outer {
        float: left;
        padding: 0 15px 12px 0;
    }

    .thumb-inner {
        float: left;
    }

    .thumb_text {
        float: left;
        height: 30px;
    }

    .thumb_image {
        width: 225px !important;
        height: 150px !important;
    }

    .thumb_image_r,
    .gallery_image_r {
        transform: rotate(90deg) translate(0,-100%);
        transform-origin: 0 0;
        max-height: 190px !important;
    }

    .thumb_image_n, .gallery_image_n {
        height: 250px !important;
    }

    .gallery_image_t {
        width: auto !important;
        max-width: unset !important;
        height: 100% !important;
        max-height: 75vh !important;
    }

    gallery_image_t,
    gallery_image_t350,
    gallery_image_t400 {
        width: auto !important;
        height: 100% !important;
        max-height: 75vh !important;
        max-width:unset !important;
    }



    /* Wide images */
/*    .gallery_image_x {
        width: auto !important;
        max-width:none !important;
        height: 75vh !important;
        max-height: 75vh !important;
    }
*/

    .gallery_image_w,
    .gallery_image_x,
    .gallery_image_w425,
    .gallery_image_w400,
    .gallery_image_w375,
    .gallery_image_w355,
    .gallery_image_w350,
    .gallery_image_w345,
    .gallery_image_w340,
    .gallery_image_w300,
    .gallery_image_w274,
    .gallery_image_w240 {
        width: 55vw !important;
        max-width: 80vw !important;
        height: auto !important;
        max-height: unset !important;
    }


   

    .gallery_image_w425 {
        width: 850px !important;
    }

    .gallery_image_w400 {
        width: 800px !important;
    }

    .gallery_image_w375 {
        width: 750px !important;
    }

    .gallery_image_w355 {
        width: 710px !important;
    }

    .gallery_image_w350 {
        width: 700px !important;
    }

    .gallery_image_w345 {
        width: 690px !important;
    }

    .gallery_image_w340 {
        width: 680px !important;
    }

    .gallery_image_w300 {
        width: 600px !important;
    }

    .gallery_image_w275 {
        width: 550px !important;
    }

    .gallery_image_w240 {
        width: 480px !important;
    }

/*}*/

/* --- Mobile Styles --- 768 */
@media (max-width: 500px) {
    #myModal{
        display:none !important;
        visibility:hidden !important;
    }

    .gallery-click-on-image {
        display:none !important;
        visibility: hidden !important;
        height: 0px !important;
    }

}


/* --- Mobile Styles --- 768 */
/*@media (max-width: 1px) {

    .block_outer {
        width: 100%;
        padding-bottom: 12px;
        margin: auto;
    }

    .thumb_text {
        width: 100%;
        text-align: center;
    }

    .thumb_image,
    .thumb_image_r,
    .thumb_image_n,
    .thumb_image_t {
        margin: auto !important;
    }

    .thumb_image {
        height: 150px !important;
    }

    .thumb_image_n {
        height: 250px !important;
    }

    .gallery_image_w,
    .gallery_image_w425,
    .gallery_image_w400,
    .gallery_image_w375,
    .gallery_image_w355,
    .gallery_image_w350,
    .gallery_image_w345,
    .gallery_image_w340,
    .gallery_image_w300,
    .gallery_image_w274,
    .gallery_image_w240 {
        width: 90% !important;
        max-width: 400px !important;
    }

    .modal {
        width: 100%;
    }

}
*/