.gallery_button {
    position: absolute;
    border: 3px solid #d7d7d7;
    width: 17%;
    height: 24.67%;
    box-shadow: 1px 4px 18px rgba(0, 0, 0, .3);
}

.gallery_button p {
    position: absolute;
    top: 35%;
    left: 31%;
    font-family: "Courier New", serif;
    font-size: 100%;
    color: #333333;
    cursor: pointer;
}

.gallery_button1 p:hover {
    top: 30%;
}

.gallery_button1 p:after {
    display: block;
    content: '';
    border-bottom: solid 2px #333333;
    transform: scaleX(0) translateX(30%);
    transition: transform 250ms ease-in-out;
}

.gallery_button1 p:hover:after {
    transform: scaleX(1);
}

.onHoverIn {
    display: block;
    content: '';
    border-bottom: solid 2px #333333;
    transform: scaleX(1) translateY(-30%);
    transition: transform 250ms ease-in-out;
}

#nature_gallery p {
    left: 31%;
}

#ocean_gallery p {
    left: 35%;
}

#flavors_gallery p {
    left: 31%;
}

#emotions_gallery p {
    left: 28%;
}

#geometry_gallery p {
    left: 28%;
}

@media (orientation: landscape) {

    #nature_gallery {
        top: 15%;
        left: 2%;
    }

    #ocean_gallery {
        top: 15%;
        left: 27%;
    }

    #flavors_gallery {
        top: 15%;
        left: 52%;
    }

    #emotions_gallery {
        top: 15%;
        left: 77%;
    }

    #geometry_gallery {
        top: 55%;
        left: 2%;
    }
}

@media (orientation: portrait) {

    .gallery_button p {
        font-size: 3vw;
    }

    #nature_gallery {
        top: 15vw;
        left: 30%;
        width: 40vw;
        height: 40vw;
    }

    #ocean_gallery {
        top: 65vw;
        left: 30%;
        width: 40vw;
        height: 40vw;
    }

    #flavors_gallery {
        top: 115vw;
        left: 30%;
        width: 40vw;
        height: 40vw;
    }

    #emotions_gallery {
        top: 165vw;
        left: 30%;
        width: 40vw;
        height: 40vw;
    }

    #geometry_gallery {
        top: 215vw;
        left: 30%;
        width: 40vw;
        height: 40vw;
    }
}