/* jssor slider bullet navigator skin 01 css */
/*
        .jssorb01 div           (normal)
        .jssorb01 div:hover     (normal mouseover)
        .jssorb01 .av           (active)
        .jssorb01 .av:hover     (active mouseover)
        .jssorb01 .dn           (mousedown)
        */
#jssor_1 {
    margin-top: 10px !important;
    border-bottom-color: #fff;
    background-color: #fff;
    border-width: 5px;
    border-style: solid;
    max-width: 665px !important;
}

    #jssor_1 > img {
        max-width: 665px !important;
    }

.jssorb01 {
    position: absolute;
    margin-bottom: 10px;
}

    .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av {
        position: absolute;
        /* size of bullet elment */
        width: 12px;
        height: 12px;
        filter: alpha(opacity=70);
        opacity: .7;
        overflow: hidden;
        cursor: pointer;
        border: #000 1px solid;
    }

    .jssorb01 div {
        background-color: #747576;
    }

        .jssorb01 div:hover, .jssorb01 .av:hover {
            background-color: #227db2;
        }

    .jssorb01 .av {
        background-color: #00bbc6;
    }

    .jssorb01 .dn, .jssorb01 .dn:hover {
        background-color: #00ff21;
    }

/* jssor slider arrow navigator skin 05 css */
/*
        .jssora05l                  (normal)
        .jssora05r                  (normal)
        .jssora05l:hover            (normal mouseover)
        .jssora05r:hover            (normal mouseover)
        .jssora05l.jssora05ldn      (mousedown)
        .jssora05r.jssora05rdn      (mousedown)
        */
.jssora05l, .jssora05r {
    /*display: block;
            position: absolute;*/
    /* size of arrow element */
    /*width: 40px;
            height: 40px;
            cursor: pointer;
            background: url('../img/a17.png') no-repeat;
            overflow: hidden;*/
}

.jssora05l {
    background-position: -10px -40px;
}

.jssora05r {
    background-position: -70px -40px;
}

.jssora05l:hover {
    background-position: -130px -40px;
}

.jssora05r:hover {
    background-position: -190px -40px;
}

.jssora05l.jssora05ldn {
    background-position: -250px -40px;
}

.jssora05r.jssora05rdn {
    background-position: -310px -40px;
}

/* jssor slider thumbnail navigator skin 09 css */

.jssort09-600-45 .p {
    position: absolute;
    top: 0;
    left: 0;
    width: 665px;
    height: 45px;
    max-width: 100% !important;
}

.jssort09-600-45 .t {
    font-family: verdana;
    font-weight: normal;
    position: absolute;
    width: 100%;
    max-width: 100% !important;
    height: 100%;
    top: 0;
    left: 0;
    color: #fff;
    line-height: 35px;
    font-size: 20px;
    padding-left: 20px;
}

.slideshow-maindiv {
    position: relative;
    margin: 0 auto;
    top: 0px;
    left: 0px;
    width: 665px;
    height: 435px;
    overflow: hidden;
    visibility: hidden;
    max-height: 435px !important;
    max-width: 100% !important;
    border-bottom-color: #fff;
    border-width: 1.5px;
    border-style: solid;
}

.slideshow-loading {
    position: absolute;
    top: 0px;
    left: 0px;
}

.slideshow-slides {
    cursor: default;
    position: relative;
    top: 0px;
    left: 0px;
    width: 665px;
    height: 435px;
    overflow: hidden;
    max-width: 100% !important;
    max-height: 435px !important;
}

.slideshow-thumbnavigator {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 665px;
    height: 45px;
    max-width: 100% !important;
}

    .slideshow-thumbnavigator .s-t-d1 {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: url('../img/gradient.png');
        background-repeat: repeat-x;
        /* background-color: #000;d-color: #000;*/
        filter: alpha(opacity=60.0);
        opacity: 0.6;
        filter: alpha(opacity=60.0);
        opacity: 0.6;
    }

.caption-div {
    position: absolute;
    left: 0px;
    padding-left: 20px;
    background-color: #fff;
    padding-bottom: 0px;
    padding-top: 5px;
    bottom: 0px;
    width: 100%;
    height: 40px;
    font-size: 20px;
    color: #737576;
    font-weight: bold;
}

.No-pading {
    padding: 0px !important;
}

    .No-pading ul {
        padding-left: 20px !important;
    }

.footer-arrow {
    width: 100%;
    height: 114px !important;
    background-image: url('../img/portfolio/footer.png');
    background-repeat: no-repeat;
    margin-right: 60px;
    text-align: left;
}

.picture-description2 {
    position: absolute;
    /* text-transform: uppercase; */
    /* font-size: 16px; */
    bottom: 0px;
    text-align: left;
    color: #fff;
    line-height: 1;
    /* width: 100%; */
    padding: 0 25px 15px 25px;
    font-weight: 300;
    max-width: 253px;
}

.margin-top-20 {
    margin-top: 20px;
}

.data-p {
    background: #fff;
    margin: -1px;
    padding: -1px;
}
/**/


@media(max-width:768px) {
    /*.slideshow-maindiv{max-height:90%!important;width:}
       .slideshow-loading{max-height:90%!important;}
       .slideshow-thumbnavigator {max-height:100%!important;}
       .data-p{max-width:100%!important;}*/

}

/*  @media(max-height:580px){

 .slideshow-maindiv, .slideshow-slides{height:300px!important;   max-width:476px!important;}
.slideshow-maindiv, .slideshow-slides, slideshow-maindiv > div, div.slideshow-maindiv > img, div.slideshow-slides, div.slideshow-slides > div, div.slideshow-slides > img
{
    max-height:300px!important;
    max-width:476px!important;
}

#jssor_1{ max-height:291px!important; margin-top:50px;   max-width:476px!important;}

  #deliver .wrapper{margin-top:50px;margin-bottom:50px;}

 }
*/
.float-left {
    float: left !important;
}

.float-right {
    float: right !important;
}

@media(max-height:768px) {
    #deliver .wrapper {
        margin-top: 70px;
        margin-bottom: 70px;
    }
}

@media(max-height:435px) {
    #jssor_1 {
        max-height: 320px !important;
    }
    /*
 .slideshow-maindiv, .slideshow-slides{height:100%!important;}  */
    .slideshow-maindiv, .slideshow-slides, slideshow-maindiv > div, div.slideshow-maindiv > img, div.slideshow-slides, div.slideshow-slides > div, div.slideshow-slides > img {
        max-height: 100% !important;
        max-width: 100%; /**/
    }

    #deliver .wrapper {
        margin-top: 50px;
        margin-bottom: 50px;
    }
}

@media(max-height:435px)and (max-width:773px) {

    #jssor_1 {
        margin-top: 20px !important;
    }
}

/*////////////////////////////////////////////////////////////////////////////////*/


@media(max-width:773px) and (min-height:435px) {
    #jssor_1 {
        margin-top: 5px !important;
        max-width: 350px !important;
        max-height: 233px !important;
    }

    .slideshow-maindiv, .slideshow-slides, slideshow-maindiv > div, div.slideshow-maindiv > img, div.slideshow-slides, div.slideshow-slides > div, div.slideshow-slides > img {
        max-height: 100% !important;
        max-width: 100%;
    }

    .jssort09-600-45 .t {
        font-family: verdana;
        font-weight: normal;
        position: absolute;
        width: 100%;
        max-width: 100% !important;
        height: 100%;
        top: 0;
        left: 0;
        color: #fff;
        line-height: 35px;
        font-size: 12px;
        padding-left: 10px;
    }

    .jssorb01 {
        position: absolute;
        margin-bottom: 10px;
        margin-right: 15px;
    }
}

@media(max-width:525px) and (min-height:732px) {
    #jssor_1 {
        margin-top: 5px !important;
        max-width: 450px !important;
        max-height: 300px !important;
    }

    .slideshow-maindiv, .slideshow-slides, slideshow-maindiv > div, div.slideshow-maindiv > img, div.slideshow-slides, div.slideshow-slides > div, div.slideshow-slides > img {
        max-height: 100% !important;
        max-width: 100%;
    }

    .jssort09-600-45 .t {
        font-family: verdana;
        font-weight: normal;
        position: absolute;
        width: 100%;
        max-width: 100% !important;
        height: 100%;
        top: 0;
        left: 0;
        color: #fff;
        line-height: 35px;
        font-size: 12px;
        padding-left: 10px;
    }

    .jssorb01 {
        position: absolute;
        margin-bottom: 10px;
        margin-right: 15px;
    }
}

/*////////////////////////////////////////////////////////////////////////////////*/
@media(max-width:1024px) /*768 : ipad*/
{
}

@media(max-width:768px) {
    div.span1.float-left {
        width: 0px !important;
        height: 0px !important;
    }

    .change-float {
        float: left !important;
    }
}

@media(max-width:773px) /*435 : Nexus 6P*/
{
    #jssor_1 {
        margin-top: 100px !important;
        max-width: 450px !important;
        max-height: 300px !important;
    }

    .slideshow-maindiv, .slideshow-slides, slideshow-maindiv > div, div.slideshow-maindiv > img, div.slideshow-slides, div.slideshow-slides > div, div.slideshow-slides > img {
        max-height: 100% !important;
        max-width: 100%;
    }

    .jssort09-600-45 .t {
        font-family: verdana;
        font-weight: normal;
        position: absolute;
        width: 100%;
        max-width: 100% !important;
        height: 100%;
        top: 0;
        left: 0;
        color: #fff;
        line-height: 25px;
        font-size: 18px;
        padding-left: 10px;
    }

    .jssorb01 {
        position: absolute;
        margin-bottom: 13px;
        margin-right: 20px;
    }

    #deliver {
        /*  min-height: 1030px !important;*/
        min-height: 100vh !important;
    }
}

@media(max-width:736px) /*414 : iphone 6 Plus*/
{
    #jssor_1 {
        margin-top: 10px !important;
        max-width: 650px !important;
        max-height: 435px !important;
    }

    .slideshow-maindiv, .slideshow-slides, slideshow-maindiv > div, div.slideshow-maindiv > img, div.slideshow-slides, div.slideshow-slides > div, div.slideshow-slides > img {
        max-height: 100% !important;
        max-width: 100%;
    }

    .jssort09-600-45 .t {
        font-family: verdana;
        font-weight: normal;
        position: absolute;
        width: 100%;
        max-width: 100% !important;
        height: 100%;
        top: 0;
        left: 0;
        color: #fff;
        line-height: 25px;
        font-size: 18px;
        padding-left: 25px;
    }

    .jssorb01 {
        position: absolute;
        margin-bottom: 13px;
        margin-right: 20px;
    }
}

@media(max-width:731px) /*411 : Nexus 5x*/
{
}

@media(max-width:640px) /*360 : Galexy s5*/
{
}

@media(max-width:667px) /*375 : iphone 6*/
{
}


@media(max-width:568px) /*320 : iphone 5*/
{
}