.portrait_wrapper {
    margin: 0 auto;
    text-align: center;
    width: 100%;
    max-width: 1000px;
    overflow: auto;
}

@media only screen and (min-width: 205px) {
    .portrait_wrapper {
        max-width: 201px;
    }

    #nova_accessories_logo.portraits {
        max-width: 201px;
        text-align: left;
        padding-left: 10px;
        margin: 0 auto;
    }
}

@media only screen and (min-width: 405px) {
    .portrait_wrapper, #nova_accessories_logo.portraits {
        max-width: 401px;
    }
}

@media only screen and (min-width: 605px) {
    .portrait_wrapper, #nova_accessories_logo.portraits {
        max-width: 601px;
    }
}

@media only screen and (min-width: 805px) {
    .portrait_wrapper, #nova_accessories_logo.portraits {
        max-width: 801px;
    }
}

@media only screen and (min-width: 1005px) {
    .portrait_wrapper {
        max-width: 1001px;
    }

    #nova_accessories_logo.portraits {
        margin: 0;
    }
}

@media only screen and (min-width: 1405px) {
    .portrait_wrapper {
        max-width: 1401px;
    }
}

@media only screen and (min-width: 1605px) {
    .portrait_wrapper {
        max-width: 1601px;
    }
}

@media only screen and (min-width: 1805px) {
    .portrait_wrapper {
        max-width: 1801px;
    }
}

.portrait_container {
    text-align: left;
    overflow: auto;
}

.portrait_container .csc-header {
    display: none;
}

.portrait_box {
    box-sizing: content-box;
    word-spacing: normal;
    position: relative;
    width: 100%;
    max-width: 180px;
    height: 225px;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.6);
    background-color: #fff;
    text-align: center;
    float: left;
    vertical-align: top;
    z-index: 1;
    overflow: hidden;
    margin: 0 10px 1rem;
    padding-bottom: 1.33rem;
}

.portrait_box > a > img {
    display: block;
    height: auto;
    margin: 0 auto;
    max-height: 100%;
    max-width: 100%;
    width: 100%;
}

.portrait_box span.portrait_box_text_translate {
    display: block;
    position: absolute;
    bottom: 0;
    line-height: 1.33rem;
    height: 1.4rem;
    width: 100%;
    background-color: #fff;
}

.portrait_box span.portrait_box_text_translate span.first-line,
.portrait_box span.portrait_box_text_lightbox span.first-line {
    font-family: GalaxiePolaris-Medium, sans-serif;
}

.portrait_box span.portrait_box_text_translate span.first-line a,
.portrait_box:hover span.portrait_box_text_translate span.first-line a {
    color: #000;
    cursor: default;
}

.portrait_box.portrait_box_text_translate img {
    display: block;
    max-height: 100%;
    max-width: 100%;
}

.portrait_box_text_translate .first-line:after {
    content: "\2197";
    font-family: GalaxiePolaris-Book, sans-serif;
    font-size: 1.1rem;
    left: 0.1rem;
    position: relative;
    top: 0.05rem;
}

.no-touch .portrait_box_text_translate .first-line:after {
    content: "";
}

.portrait_box:target span.portrait_box_text_translate {
    height: auto;
    padding-bottom: 0.2rem;
}

.no-js .portrait_box:hover span.portrait_box_text_translate,
.no-touch .portrait_box:hover span.portrait_box_text_translate {
    height: auto;
    padding-bottom: 0.2rem;
}

.portrait_box span.portrait_box_text_lightbox {
    background-color: #fff;
    bottom: 0;
    display: block;
    height: auto;
    line-height: 1.33rem;
    position: absolute;
    width: 100%;
}

.no-js .portrait_box:hover span.portrait_box_text_lightbox,
.no-touch .portrait_box:hover span.portrait_box_text_lightbox {
    color: #4b4b4d;
}

.portrait_wrapper .lightbox .box_content a,
.no-js .portrait_wrapper .lightbox:hover .box_content a,
.no-touch .portrait_wrapper .lightbox:hover .box_content a {
    color: #4b4b4d;
}

.no-js .portrait_wrapper .lightbox a:hover,
.no-touch .portrait_wrapper .lightbox a:hover,
.no-js .portrait_box:hover span.portrait_box_text_lightbox span.first-line,
.no-touch .portrait_box:hover span.portrait_box_text_lightbox span.first-line {
    color: #ec0000;
}

.portrait_wrapper .lightbox section {
    width: 100%;
}

.portrait_wrapper .lightbox section ul {
    list-style-position: outside;
}

.portrait_wrapper .lightbox section li:before {
    color: #ff0000;
    content: "_";
    font-size: 1.15rem;
    margin-left: -0.5rem;
    margin-top: -0.25rem;
    position: absolute;
}

@media all and (min-width: 1000px) {
    .portrait_wrapper .lightbox {
        /** Hide the lightbox */
        display: none;
        /** Apply basic lightbox styling */
        position: fixed;
        z-index: 9999;
        width: 100%;
        height: 100%;
        text-align: center;
        top: 0;
        left: -9999px;
        background: black;
        background: rgba(0, 0, 0, 0.8);
    }

    .portrait_wrapper .lightbox .closebox {
        display: inline-block;
        position: absolute;
        z-index: -1;
        width: 100%;
        height: 100%;
        text-align: center;
        top: 0;
        left: 0;

    }

    .lightbox .previous_arrow,
    .lightbox .next_arrow {
        opacity: 0.5;
        height: 10rem;
        width: 2rem;
        text-align: center;
        left: 50%;
        margin-top: -5rem;
        margin-left: 1rem;
        position: absolute;
        top: 50%;
        -webkit-transform: translateX(-450px);
        -moz-transform: translateX(-450px);
        -o-transform: translateX(-450px);
        -ms-transform: translateX(-450px);
        transform: translateX(-450px);
        vertical-align: middle;
    }

    .no-js .lightbox .previous_arrow:hover,
    .no-touch .lightbox .previous_arrow:hover,
    .no-js .lightbox .next_arrow:hover,
    .no-touch .lightbox .next_arrow:hover {
        opacity: 1;
    }

    .lightbox .next_arrow {
        -webkit-transform: translateX(450px);
        -moz-transform: translateX(450px);
        -o-transform: translateX(450px);
        -ms-transform: translateX(450px);
        transform: translateX(450px);
        margin-left: -3rem;
    }

    .portrait_wrapper .lightbox > div {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        z-index: -1;
    }

    .portrait_wrapper .lightbox.text > div {
        text-align: left;
        max-width: 900px;
        min-height: 10rem;
        max-height: 90%;
        box-sizing: border-box;
    }

    .portrait_wrapper .lightbox.text .box {
        overflow: auto;
    }

}

.portrait_wrapper .lightbox.single_image > div {
    max-width: 50%;
    max-height: 50%;
    height: 100%;
}

.portrait_wrapper .lightbox.single_image img {
    max-width: 100%;
    max-height: 100%;
}

.portrait_wrapper .lightbox .float_image_box {
    width: 30%;
}

.portrait_wrapper .lightbox section {
    max-width: 66%;
    display: inline-block;
}

.portrait_wrapper .lightbox section h3 {
    padding-top: .35rem;
}

#wrapper .portrait_wrapper .lightbox.text ul li:first-of-type {
    padding-top: 0;
}

.no-js .portrait_wrapper .lightbox.text:hover .box h3,
.no-touch .portrait_wrapper .lightbox.text:hover .box h3 {
    color: #000 !important;
}

.portrait_wrapper .lightbox div.left_header_table table th,
.portrait_wrapper .lightbox table.left_header_table th {
    width: 30%;
}

.lightbox:target {
    /** Show lightbox when it is target */
    display: block;

    /** Remove default browser outline style */
    outline: none;
    left: 0;
}

@media all and (max-width: 700px) {
    .portrait_wrapper .lightbox .float_image_box {
        width: 100%;
        max-width: 100%;
    }

    .portrait_wrapper .lightbox section {
        width: 100%;
        max-width: 100%;
    }
}