/* Elastislide Style */

.elastislide-list {
    list-style-type: none;
    display: none;
}

.no-js .elastislide-list {
    display: block;
}

.elastislide-carousel ul li {
    min-width: 20px; /* minimum width of the image (min width + border) */
}

.elastislide-wrapper nav span {
    position: absolute;
    width: 100%;
    height: 41px;
    text-indent: -9000px;
    cursor: pointer;
    opacity: 0.8;
}

    .elastislide-wrapper.elastislide-loading {
        background-repeat: no-repeat;
        background-position: center center;
    }

.elastislide-horizontal {
    padding: 10px 40px;
}

.elastislide-vertical {
    padding: 40px 10px;
}

.elastislide-carousel {
    overflow: hidden;
    position: relative;
    height: 103% !important;
}

    .elastislide-carousel ul {
        position: relative;
        display: block;
        list-style-type: none;
        height: 37rem !important;
        padding: 0;
        margin: 0;
        -webkit-backface-visibility: hidden;
        -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        -o-transform: translateX(0px);
        transform: translateX(0px);
        transition-property: -webkit-transform;
        transition-property: -moz-transform;
        transition-property: -o-transform;
        transition-property: -ms-transform;
        transition-property: transform;
        transition-duration: 200ms;
        margin-bottom: 52% !important;
    }

.elastislide-horizontal ul {
    white-space: nowrap;
}

.elastislide-carousel ul li {
    margin: 0;
    -webkit-backface-visibility: hidden;
}

.elastislide-horizontal ul li {
    height: 100%;
    display: inline-block;
}

.elastislide-vertical ul li {
    display: block;
}

.elastislide-carousel ul li a {
    display: inline-block;
    width: 100%;
}

    .elastislide-carousel ul li a img {
        display: block;
        border: 2px solid white;
        max-width: 100%;
    }

/* Navigation Arrows */

.elastislide-wrapper nav span {
    width: 100%;
    text-indent: -9000px;
    cursor: pointer;
    opacity: 0.8;
    background-color: #363636 !important;
    color: #fff;
}

.elastislide-prev {
    position: absolute;
    height: 4% !important;
}

.elastislide-next {
    position: absolute;
    height: 4% !important;
}



    .elastislide-wrapper nav span:hover {
        opacity: 1.0
    }

.elastislide-horizontal nav span {
    top: 50%;
    left: 10px;
    margin-top: -11px;
}

.elastislide-vertical nav span {
    top: 10px;
    /* left: 50%;
    margin-left: -11px;*/
    background-position: -17px 5px;
}

.elastislide-horizontal nav span.elastislide-next {
    right: 10px;
    left: auto;
    background-position: 4px -17px;
}

.elastislide-vertical nav span.elastislide-next {
    top: auto;
    background-position: -17px -18px;
}


@media (max-width: 4500px) and (min-width: 1200px) {
    .elastislide-carousel {
        overflow: hidden;
        position: relative;
        height: 103% !important;
    }

    .elastislide-vertical {
        height: 43.5rem !important;
        width: 100% !important;
        padding: 60%;
    }

    .icon-carrousel-up {
        position: absolute;
        top: -42.5rem;
        left: 41%;
        right: auto;
        color: #fff;
        font-size: 150%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: 0rem;
        left: 40%;
        right: auto;
        color: #fff;
        font-size: 150%;
        cursor: pointer;
    }
}


@media (max-width: 1199px) and (min-width: 992px) {
    .elastislide-carousel {
        overflow: hidden;
        position: relative;
        height: 83% !important;
    }

    .elastislide-vertical {
        height: 43.5rem !important;
        width: 100% !important;
        padding: 60%;
    }

    .icon-carrousel-up {
        position: absolute;
        top: -42.6rem;
        left: 37%;
        right: auto;
        color: #fff;
        font-size: 150%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: 7.2rem;
        left: 37%;
        right: auto;
        color: #fff;
        font-size: 150%;
        cursor: pointer;
    }
}


@media (max-width: 991px) and (min-width: 768px) {

    .elastislide-vertical {
        height: 26.5rem !important;
        width: 100% !important;
        padding: 60%;
    }

    .icon-carrousel-up {
        position: absolute;
        top: -25.8rem;
        left: 37%;
        right: auto;
        color: #fff;
        font-size: 104%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: -0.3rem;
        left: 34%;
        right: auto;
        color: #fff;
        font-size: 104%;
        cursor: pointer;
    }
}

@media (max-width: 767px) and (min-width: 570px) {

    .elastislide-vertical {
        height: 26.5rem !important;
        width: 100% !important;
        padding: 50%;
    }

    .elastislide-carousel {
        overflow: hidden;
        position: relative;
        height: 172% !important;
    }

    .icon-carrousel-up {
        position: absolute;
        top: -25.8rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: -14.9rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }
}

@media (max-width: 569px) and (min-width: 500px) {

    .elastislide-vertical {
        height: 26.5rem !important;
        width: 100% !important;
        padding: 50%;
        max-width: 100% !important;
    }

        .elastislide-vertical ul li {
            max-width: 100% !important;
        }

        .elastislide-carousel {
            overflow: hidden;
            position: relative;
            height: 170% !important;
        }

}

@media (max-width: 499px) and (min-width: 430px) {

    .elastislide-vertical {
        height: 26.5rem !important;
        width: 100% !important;
        padding: 50%;
        max-width: 100% !important;
    }

        .elastislide-vertical ul li {
            max-width: 100% !important;
        }

    .elastislide-carousel {
        overflow: hidden;
        position: relative;
        height: 136% !important;
    }
}

@media (max-width: 429px) and (min-width: 330px) {

    .elastislide-vertical {
        height: 26.5rem !important;
        width: 100% !important;
        padding: 50%;
        max-width: 100% !important;
    }

        .elastislide-vertical ul li {
            max-width: 100% !important;
        }

    .elastislide-carousel {
        overflow: hidden;
        position: relative;
        height: 110% !important;
    }

    
}


/*Icons up and down*/
@media (max-width: 569px) and (min-width: 540px) {

    .icon-carrousel-up {
        position: absolute;
        top: -25.8rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: -14.4rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }
}

@media (max-width: 539px) and (min-width: 510px) {

    .icon-carrousel-up {
        position: absolute;
        top: -14.8rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: -14.8rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }
}

@media (max-width: 510px) and (min-width: 500px) {

    .icon-carrousel-up {
        position: absolute;
        top: -25.8rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: -15.1rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }
}

@media (max-width: 499px) and (min-width: 450px) {

    .icon-carrousel-up {
        position: absolute;
        top: -25.8rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: -7.7rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }
}


@media (max-width: 449px) and (min-width: 441px) {

    .icon-carrousel-up {
        position: absolute;
        top: -25.8rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: -7.6rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }
}

@media (max-width: 440px) and (min-width: 430px) {

    .icon-carrousel-up {
        position: absolute;
        top: -25.8rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: -7.9rem;
        left: 36%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }
}

@media (max-width: 429px) and (min-width: 400px) {

    .icon-carrousel-up {
        position: absolute;
        top: -25.8rem;
        left: 44%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: -1.9rem;
        left: 36%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }
}


@media (max-width: 399px) and (min-width: 350px) {

    .icon-carrousel-up {
        position: absolute;
        top: -25.8rem;
        left: 38%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }

    .icon-carrousel-down {
        position: absolute;
        bottom: -2.1rem;
        left: 38%;
        right: auto;
        color: #fff;
        font-size: 110%;
        cursor: pointer;
    }
}