.image_viewer.container
{
    opacity: 0;
/*    transition: opacity 1s ease-in-out;*/
/*    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;*/
    background-color: #000;
}

.image_viewer.container.active
{
    opacity: 1;
}

.image_viewer.image_wrapper
{
    display: inline-block;
    vertical-align: top;
}

.image_viewer.image
{
    width: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.image_viewer.title
{
    padding-top: .5em;
    font-size: 18px;
}

.image_viewer.nav
{
    position: absolute;
/*    padding: 1%;
    opacity: 0;
    transition: opacity 1s ease-in-out;
    background-repeat: no-repeat;
    background-origin: content-box;
    background-size: 10%;*/
}

.image_viewer.nav:hover
{
    opacity: 0.5;
}

.image_viewer.nav.left
{
    left: 0;
    right: 90%;
    top: 10%;
    bottom: 10%;
/*  background-image: url("images/nav-left.svg");
    background-position: left center;*/
}

.image_viewer.nav.right
{
    left: 90%;
    right: 0;
    top: 10%;
    bottom: 10%;
/*  background-image: url("images/nav-right.svg");
    background-position: right center;*/
}

.image_viewer.nav.up
{
    left: 10%;
    right: 10%;
    top: 0;
    bottom: 90%;
/*  background-image: url("images/nav-up.svg");
    background-position: center top;*/
}

.image_viewer.nav.down
{
    left: 10%;
    right: 10%;
    top: 90%;
    bottom: 0;
/*  background-image: url("images/nav-down.svg");
    background-position: center bottom;*/
}