﻿.zoomHeader {
    max-width: 100vw;
    max-height: 93vh;
}
@media (min-width: 576px) {
    .zoomHeader {min-width: 50vw;}
}
@media (min-width: 768px) {
    .zoomHeader {max-width: 100vw;min-width: 50vw;}
}
@media (min-width: 992px) {
    .zoomHeader {max-width: 100vw;min-width: 50vw;}
}
@media (min-width: 1200px) {
    .zoomHeader {max-width: 100vw;min-width: 50vw;}
}
@media (min-width: 1400px) {
    .zoomHeader {min-width: 25vw;max-height: 93vh;}
}

.zoomDetail {
    width: 100%;
    height: 93vh;
}

.zoom {
    width: 100%;
    height: 93vh;
    overflow: hidden;
}

    .zoom .phototxt {
        display: none;
        position: relative;
        z-index: 2;
        right: 0;
        bottom: 5.5em;
        left: 3px;
        font-family: 'Roboto Slab', serif;
        cursor: default;
    }

    .zoom:hover .phototxt {
        display: inherit;
    }

.photo {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: transform .5s ease-out;
    cursor:zoom-in;
}