﻿
/*SLIDE-HOME*/
.slider-home {
    margin: 100px 0 0 0;
    height: auto;
    width: 100%;
    display: block;
    opacity: 0;
    overflow: hidden;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
    -ms-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
}

    .slider-home .slide-controls {
        margin: 0px auto;
        position: relative;
        bottom: 0px;
        background-color: #F7F5F4;
        text-align: center;
        padding: 10px 0px;
        box-shadow: -10px 10px 10px rgba(0, 0, 0, 0.06);
    }


.slider-home {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    position: relative;
    z-index: 3;
    text-align: center; /*-ms-touch-action:none;*/
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -ms-user-select: none;
    display: block;
}

.slide-bg {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
}

.bg-home {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

    .bg-home img {
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: auto;
        bottom: 0;
        z-index: -1;
        display: block;
    }

.slide-fade-out {
    -webkit-animation: fadeIn 0.5s both ease;
    -moz-animation: fadeIn 0.5s both ease;
    animation: fadeIn 0.5s both ease;
    z-index: 10;
    -webkit-animation: fadeOut 0.7s both ease;
    -moz-animation: fadeOut 0.7s both ease;
    animation: fadeOut 0.7s both ease;
}

.fade-out {
    -webkit-animation: fadeOut 0.5s both ease;
    -moz-animation: fadeOut 0.5s both ease;
    animation: fadeOut 0.5s both ease;
}

.fade-in {
    -webkit-animation: fadeIn 0.5s both ease;
    -moz-animation: fadeIn 0.5s both ease;
    animation: fadeIn 0.5s both ease;
}

.slide-carousel .slide-wrapper:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.slide-carousel {
    display: none;
    position: relative;
    -ms-touch-action: pan-y;
}

    .slide-carousel .slide-wrapper {
        display: none;
        position: relative;
        -webkit-transform: translate3d(0px, 0px, 0px);
        margin: 0 auto;
        overflow: hidden;
    }

    .slide-carousel .slide-wrapper-outer {
        overflow: hidden;
        position: relative;
        width: 100%;
    }

        .slide-carousel .slide-wrapper-outer.autoheight {
            -webkit-transition: height 500ms ease-in-out;
            -moz-transition: height 500ms ease-in-out;
            -ms-transition: height 500ms ease-in-out;
            -o-transition: height 500ms ease-in-out;
            transition: height 500ms ease-in-out;
        }

    .slide-carousel .slide-item {
        float: left;
        margin-right: 5px;
    }

        .slide-carousel .slide-item .image {
            text-align: center;
            margin: auto;
            background: #fff;
            min-width: 200px;
            height: 130px;
        }

            .slide-carousel .slide-item .image img {
                min-height: 100%;
            }

.slide-controls .slide-page {
    display: inline-block;
    position: relative;
    width: 22px;
    height: 22px;
    border: 1px solid rgba(255,255,255,0);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    margin: 0 2px;
}

.slide-controls .slide-page, .slide-controls .slide-buttons div {
    cursor: pointer;
}

    .slide-controls .slide-page span {
        display: block;
        width: 12px;
        height: 12px;
        margin: 4px;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        -ms-border-radius: 50%;
        -o-border-radius: 50%;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        background-color: rgba(255, 116, 0, 1);
    }

    .slide-controls .slide-page.active span {
        background-color: rgb(255, 78, 0);
    }

    .slide-controls .slide-page.active {
        pointer-events: none;
        border: 1px solid rgba(255, 116, 0, 1);
    }

.slide-controls {
}

.slide-fade-out {
    z-index: 10;
    -webkit-animation: fadeOut 0.7s both ease;
    -moz-animation: fadeOut 0.7s both ease;
    animation: fadeOut 0.7s both ease;
}

.slide-fade-in {
    -webkit-animation: fadeIn 0.7s both ease;
    -moz-animation: fadeIn 0.7s both ease;
    animation: fadeIn 0.7s both ease;
}

.bg-home .content-slide {
    left: 7%;
    position: absolute;
    bottom: 0%;
    opacity: 0;
    max-width: 100%;
    height: 0px;
    text-align: left;
    z-index: 15;
    transform: scale(0.5);
    -webkit-transition: height 0.9s ease-in-out, opacity 0.9s ease-in-out;
    -moz-transition: height 0.9s ease-in-out, opacity 0.9s ease-in-out;
    -o-transition: height 0.9s ease-in-out, opacity 0.9s ease-in-out;
    -ms-transition: height 0.9s ease-in-out, opacity 0.9s ease-in-out;
}

    .bg-home .content-slide.show {
        opacity: 1;
        bottom: 10%;
        height: 150px;
        transform: scale(1);
    }

.content-slide h2 {
    padding-bottom: 7px;
    display: block;
    color: #fff;
    font-size: 35px;
    font-family: Arial;
    font-weight: normal;
    border-bottom: 2px solid rgba(255, 255, 255, 0.3);
    text-transform: uppercase;
    text-shadow: 5px 5px 0 rgba(0,0,0,.2);
}

.content-slide h3 {
    display: block;
    color: #fff;
    font-size: 23.5px;
    margin-top: 5px;
    font-family: Arial;
    text-shadow: 5px 5px 0 rgba(0,0,0,.2);
}


.next-prev {
}

    .next-prev #next {
        background: rgba(255, 255, 255, 0.2) url(../images/next-slide.png) center center no-repeat;
        width: 55px;
        height: 90px;
        float: right;
        text-indent: -9999px;
        font-size: 0px;
        position: absolute;
        top: 50%;
        right: 0px;
        z-index: 2;
        margin-top: -90px;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

        .next-prev #next:hover {
            background-color: rgba(255, 255, 255, 0.3);
            -webkit-transition: all 0.3s ease-in-out;
            -moz-transition: all 0.3s ease-in-out;
            -o-transition: all 0.3s ease-in-out;
            -ms-transition: all 0.3s ease-in-out;
            transition: all 0.3s ease-in-out;
        }

    .next-prev #prev {
        position: absolute;
        top: 50%;
        z-index: 2;
        left: 0px;
        margin-top: -90px;
        background: rgba(255, 255, 255, 0.2) url(../images/prev-slide.png) center center no-repeat;
        width: 55px;
        height: 90px;
        float: left;
        text-indent: -9999px;
        font-size: 0px;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

        .next-prev #prev:hover {
            background-color: rgba(255, 255, 255, 0.3);
            -webkit-transition: all 0.3s ease-in-out;
            -moz-transition: all 0.3s ease-in-out;
            -o-transition: all 0.3s ease-in-out;
            -ms-transition: all 0.3s ease-in-out;
            transition: all 0.3s ease-in-out;
        }

.number-nav {
    height: 40px;
    text-align: center;
}

    .number-nav ul {
        line-height: 65px;
        height: 65px;
        margin-top: 32px;
    }

.number-slide-home li {
    display: inline-block;
    /* padding: 0px 7px; */
    border: 1px solid rgba(161, 156, 141, 0.19);
    border-radius: 50%;
    padding: 3px;
    margin: 0px 5px;
}

    .number-slide-home li a {
        background-color: #D7D7D7;
        display: inline-block;
        width: 10px;
        height: 10px;
        -ms-border-radius: 50%;
        -o-border-radius: 50%;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        text-indent: -9999px;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        /* border: 1px solid #ADADAD; */
    }

.activeSlide a {
    background-color: rgb(251, 127, 8) !important;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
/*HOME*/


/*SOLUTION*/
.box-solutions {
    width: 31%;
    height: 350px;
    display: inline-block;
    vertical-align: top;
    margin-bottom: 30px;
    margin-right: 20px;
    box-shadow: 10px 10px 0 rgba(0,0,0,0.1);
    padding: 10px;
    background-color: #fff;
    position: relative;
    overflow: hidden;
    margin-left: 1px;
}

.center-solutions {
    height: 100%;
    width: 100%;
    position: absolute;
    overflow: hidden;
}

.info-solutions {
    height: 40%;
    width: 100%;
    text-align: left;
}

    .info-solutions h2 {
        font-size: 20px;
        /* text-transform: uppercase; */
        /* font-weight: 600; */
        font-family: Arial;
        color: #ffc31c;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        padding-bottom: 15px;
    }

    .info-solutions h3 {
        font-size: 16px;
        font-weight: normal;
        color: rgba(0,0,0,0.6);
        font-family: Arial;
        text-align: left;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        max-height: 46px;
        overflow: hidden;
        line-height: 25px;
        text-align: left;
    }

.box-solutions:hover h3 {
    color: rgba(0,0,0,1);
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.box-solutions:hover h2 {
    color: #333;
}

.pic-solutions {
    width: 100%;
    overflow: hidden;
    margin-bottom: 15px;
    position: relative;
    min-height: 60%;
}

    .pic-solutions img {
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        min-height: 100%;
        width: 100%;
        min-width: 100%;
    }

    .pic-solutions .view-detail {
        position: absolute;
        top: 50%;
        left: 0px;
        z-index: 2;
        font-family: Arial;
        font-size: 16px;
        background-color: rgba(255, 255, 255, 0.52);
        height: 50px;
        line-height: 50px;
        padding: 0px 15px;
        color: #fff;
        text-transform: uppercase;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        opacity: 0;
        color: #000;
    }

        .pic-solutions .view-detail:hover {
            background-color: #f15a22;
        }

.view-detail a {
    color: #fff;
    display: block;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.view-detail:hover a {
    color: #fff;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.pic-solutions:hover .view-detail {
    opacity: 1;
}

.pic-solutions:hover .mask {
    opacity: 1;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.pic-solutions .mask {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    overflow: hidden;
    z-index: 1;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    background-color: rgba(0, 0, 0, 0.3);
    opacity: 0;
}

/*SLIDE-SOLUTIONS*/
.solutions-list .slide-controls {
    position: relative;
    height: auto;
    margin-top: 70px;
}

.slide-pagination {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: -80px;
}

.slide-controls {
    text-align: center;
    width: 100%;
    position: absolute;
    height: 40px;
}

.slide-controls {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -ms-user-select: none;
}

    .slide-controls .slide-page {
        display: inline-block;
        position: relative;
        width: 22px;
        height: 22px;
        border: 1px solid rgba(255,255,255,0);
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        -ms-border-radius: 50%;
        -o-border-radius: 50%;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        margin: 0 2px;
    }

        .slide-controls .slide-page span {
            display: block;
            width: 12px;
            height: 12px;
            margin: 4px;
            -webkit-transition: all 0.3s ease-in-out;
            -moz-transition: all 0.3s ease-in-out;
            -o-transition: all 0.3s ease-in-out;
            -ms-transition: all 0.3s ease-in-out;
            -ms-border-radius: 50%;
            -o-border-radius: 50%;
            -webkit-border-radius: 50%;
            border-radius: 50%;
            background-color: #f15a22;
        }

.solutions-list .slide-buttons {
    width: 100%;
    position: absolute;
    height: auto;
    margin-top: -32%;
    z-index: 200;
}

.solutions-list .slide-controls .slide-page span {
    background-color: #D2D2D2;
}

.solutions-list .slide-controls .slide-page {
    border: 1px solid rgba(0, 0, 0, 0);
}

    .solutions-list .slide-controls .slide-page.active {
        pointer-events: none;
        border: 1px solid #D2D2D2 !important;
    }

.slide-controls .slide-page, .slide-controls .slide-buttons div {
    cursor: pointer;
}

.solutions-list .slide-buttons .slide-prev {
    position: absolute;
    height: 54px;
    width: 54px;
    left: -55px;
    top: -40px;
    background: url(../images/previous4.png) no-repeat center center;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    opacity: 0.5;
    z-index: 100;
    display: block;
}

.solutions-list .slide-buttons .slide-next {
    position: absolute;
    height: 54px;
    width: 54px;
    right: -30px;
    top: -40px;
    background: url(../images/next4.png) no-repeat center center;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    opacity: 0.5;
    z-index: 100;
    display: block;
}

.solutions-list .slide-buttons .slide-prev:hover, .pic-content .slide-buttons .slide-next:hover {
    opacity: 1;
}

.slide-next {
    position: absolute;
    height: 54px;
    width: 54px;
    right: -65px;
    top: 0;
    background: url(../images/next4.png) no-repeat center center;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    opacity: 0.5;
    z-index: 100;
    display: block;
    text-indent: -9999px;
}

.slide-prev {
    position: absolute;
    height: 54px;
    width: 54px;
    left: -65px;
    top: 0;
    background: url(../images/previous4.png) no-repeat center center;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    opacity: 0.5;
    z-index: 100;
    display: block;
    text-indent: -9999px;
}

/*SOLUTION*/
.box-service {
    width: 31%;
    height: 430px;
    display: inline-block;
    vertical-align: top;
    margin-right: 10px;
}

.info-service {
    height: 40%;
    width: 100%;
    text-align: center;
}

    .info-service h2 {
        font-size: 18px;
        text-transform: uppercase;
        font-weight: bold;
        font-family: Arial;
        color: #ffc31c;
        text-align: center;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    .info-service h3 {
        font-size: 16px;
        font-weight: normal;
        color: rgba(0,0,0,0.6);
        font-family: Arial;
        text-align: center;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

.box-service:hover h3 {
    color: rgba(0,0,0,1);
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    text-align: center;
}

.box-service:hover h2 {
    color: #333;
}

.pic-service {
    width: 100%;
    /* overflow: hidden; */
    margin-bottom: 15px;
    height: 70%;
}

    .pic-service img {
        height: 100%;
        width: auto;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
    }

    .pic-service .center-service {
        text-align: center;
    }

    .pic-service .center-service {
        width: 286px;
        height: 286px;
        text-align: center;
        margin: auto;
        overflow: hidden;
        -webkit-border-radius: 50%;
        -o-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
        border: 3px solid rgba(255, 255, 255, 0.00);
        -webkit-transition: border 0.3s ease-in-out;
        -moz-transition: border 0.3s ease-in-out;
        -o-transition: border 0.3s ease-in-out;
        -ms-transition: border 0.3s ease-in-out;
        border: 0 solid #006966;
    }

.box-service:hover a {
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.3);
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}


/*SLIDE - HOME*/
/* The Nivo Slider styles */
.nivoSlider {
    position: relative;
    width: 100%;
    height: auto;
    overflow: hidden;
}

    .nivoSlider img, .nivoSlider .bg-home {
        position: absolute;
        top: 0px;
        left: 0px;
        max-width: none;
    }

.nivo-main-image {
    display: block !important;
    position: relative !important;
    width: 100% !important;
}

/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    border: 0;
    padding: 0;
    margin: 0;
    z-index: 6;
    display: none;
    background: white;
    filter: alpha(opacity=0);
    opacity: 0;
}
/* The slices and boxes in the Slider */
.nivo-slice {
    display: block;
    position: absolute;
    z-index: 5;
    height: 100%;
    top: 0;
}

.nivo-box {
    display: block;
    position: absolute;
    z-index: 5;
    overflow: hidden;
}

    .nivo-box img {
        display: block;
    }

/* Caption styles */
.nivo-caption {
    position: absolute;
    left: 0px;
    bottom: 0px;
    background: #000;
    color: #fff;
    width: 100%;
    z-index: 8;
    padding: 5px 10px;
    opacity: 0.8;
    overflow: hidden;
    display: none;
    -moz-opacity: 0.8;
    filter: alpha(opacity=8);
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}

    .nivo-caption p {
        padding: 5px;
        margin: 0;
    }

    .nivo-caption a {
        display: inline !important;
    }

.nivo-html-caption {
    display: none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
    cursor: pointer;
}

.nivo-directionNav {
    position: absolute;
    bottom: 18%;
    right: 7%;
    z-index: 9;
}

.nivo-nextNav {
    background: rgba(255, 255, 255, 0.2) url(../images/next-slide.png) center center no-repeat;
    width: 55px;
    height: 55px;
    float: right;
    text-indent: -9999px;
    font-size: 0px;
    z-index: 2;
    margin-top: -2px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    border-radius: 50%;
    border: 1px solid #fff;
}

    .nivo-nextNav:hover {
        background-color: rgba(255, 255, 255, 0.3);
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

.nivo-prevNav {
    margin-right: 10px;
    background: rgba(255, 255, 255, 0.2) url(../images/prev-slide.png) center center no-repeat;
    width: 55px;
    height: 55px;
    float: left;
    text-indent: -9999px;
    font-size: 0px;
    z-index: 2;
    margin-top: -2px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    border-radius: 50%;
    border: 1px solid #fff;
}

    .nivo-prevNav:hover {
        background-color: rgba(255, 255, 255, 0.3);
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav {
    display: none;
    text-align: center;
    padding: 20px 0;
    background: #FFFFFF;
    box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.25);
}

    .nivo-controlNav a {
        cursor: pointer;
        background-color: #F44817;
        border-radius: 50%;
        width: 18px;
        height: 18px;
        display: block;
        /* float: left; */
        margin-left: 8px;
        margin: auto;
        display: inline-block;
        margin-right: 6px;
        text-indent: -9999px;
        /* border: 1px solid #E7E7E7; */
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

        .nivo-controlNav a.active, .nivo-controlNav a:hover {
            font-weight: bold;
            background-color: #F7F7F7;
            -webkit-transition: all 0.3s ease-in-out;
            -moz-transition: all 0.3s ease-in-out;
            -o-transition: all 0.3s ease-in-out;
            -ms-transition: all 0.3s ease-in-out;
            transition: all 0.3s ease-in-out;
        }
/*ZOOM IMAGE*/

/* This is the moving lens square underneath the mouse pointer. */
.cloud-zoom-lens {
    border: 4px solid #888;
    margin: -4px; /* Set this to minus the border thickness. */
    background-color: #fff;
    cursor: move;
}

/* This is for the title text. */
.cloud-zoom-title {
    font-family: Arial, Helvetica, sans-serif;
    position: absolute !important;
    background-color: #000;
    color: #fff;
    padding: 3px;
    width: 100%;
    text-align: center;
    font-weight: bold;
    font-size: 10px;
    top: 0px;
}

/* This is the zoom window. */
.cloud-zoom-big {
    border: 4px solid #ccc;
    overflow: hidden;
    display: block !Important;
    background-color: #fff;
    left: 0px !important;
    height: 355px !important;
    width: 100% !important;
}

/* This is the loading message. */
.cloud-zoom-loading {
    color: white;
    background: #222;
    padding: 3px;
    border: 1px solid #000;
}

.scrollA {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    overflow: hidden;
}
