public/styles/components/_viewer.scss

.viewers {
    text-align: center;
}

.viewer {

    margin: 20px;
    vertical-align: top;

    border-radius: 20px;
    border-style: solid;
    border-color: #F0F0F0;

    &.is-mobile-portrait {
        border-width: 30px 20px 60px 20px;
        width: 335px;
        height: 568px;
    }

    &.is-mobile-landscape {
        border-width: 20px 60px 30px 30px;
        width: 568px;
        height: 320px;
    }

    &.is-social-share {
        width: 1024px;
        height: 768px;
        border-radius: 0px;
        border-width: 0px;
    }

    &.is-desktop,
    &.is-reader {
        position: fixed;
        top: 51px;
        left: 0;

        width:100%;
        min-width: 800px;
        height: calc(100% - 51px);

        margin: 0;
        border-width: 0;
        border-radius: 0;

    }

    &.is-animated {
        transition: 0.5s all;
    }

}