/*!

*  - v1.0.2

*/



.slider-pro {

    position: relative;

    margin: 0 auto

}



.sp-slides-container {

    position: relative

}



.sp-mask {

    position: relative;

    overflow: hidden

}



.sp-slides {

    position: relative;

    -webkit-backface-visibility: hidden;

    -webkit-perspective: 1000

}



.sp-slide {

    position: absolute

}



.sp-image-container {

    overflow: hidden

}



.sp-image {

    position: relative;

    display: block;

    border: none

}



.sp-thumbnails-container {

    position: relative;

    overflow: hidden

}



.sp-bottom-thumbnails,

.sp-top-thumbnails {

    left: 0;

    margin: 0 auto

}



.sp-left-thumbnails,

.sp-right-thumbnails,

.sp-top-thumbnails {

    position: absolute;

    top: 0

}



.sp-right-thumbnails {

    right: 0

}



.sp-left-thumbnails {

    left: 0

}



.sp-thumbnails {

    position: relative

}



.sp-thumbnail {

    border: none

}



.sp-thumbnail-container {

    position: relative;

    display: block;

    overflow: hidden;

    float: left;

    -moz-box-sizing: border-box;

    box-sizing: border-box

}



.sp-bottom-thumbnails .sp-thumbnail-container,

.sp-top-thumbnails .sp-thumbnail-container {

    margin-left: 2px;

    margin-right: 2px

}



.sp-bottom-thumbnails .sp-thumbnail-container:first-child,

.sp-top-thumbnails .sp-thumbnail-container:first-child {

    margin-left: 0

}



.sp-bottom-thumbnails .sp-thumbnail-container:last-child,

.sp-top-thumbnails .sp-thumbnail-container:last-child {

    margin-right: 0

}



.sp-left-thumbnails .sp-thumbnail-container,

.sp-right-thumbnails .sp-thumbnail-container {

    margin-top: 2px;

    margin-bottom: 2px

}



.sp-left-thumbnails .sp-thumbnail-container:first-child,

.sp-right-thumbnails .sp-thumbnail-container:first-child {

    margin-top: 0

}



.sp-left-thumbnails .sp-thumbnail-container:last-child,

.sp-right-thumbnails .sp-thumbnail-container:last-child {

    margin-bottom: 0

}



.sp-right-thumbnails.sp-has-pointer {

    margin-left: -13px

}



.sp-right-thumbnails.sp-has-pointer .sp-thumbnail {

    position: absolute;

    left: 18px;

    margin-left: 0!important

}



/* .sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {

    content: '';

    position: absolute;

    height: 100%;

    border-left: 5px solid #557FEB;

    left: 0;

    top: 0;

    margin-left: 13px

}



.sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {

    content: '\25c0';

    position: absolute;

    font-family: Arial;

    font-size: 16px;

    line-height: 1;

    color:#557FEB;

    left: 0;

    top: 50%;

    margin-top: -6px

} */



.ie10 .sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:after,

.ie11 .sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:after,

.ie9 .sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {

    content: '\25bc';

    -ms-transform: rotate(90deg);

    transform: rotate(90deg)

}



.sp-left-thumbnails.sp-has-pointer {

    margin-right: -13px

}



.sp-left-thumbnails.sp-has-pointer .sp-thumbnail {

    position: absolute;

    right: 18px

}



.sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {

    content: '';

    position: absolute;

    height: 100%;

    border-left: 5px solid red;

    right: 0;

    top: 0;

    margin-right: 13px

}



.sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {

    content: '\25ba';

    position: absolute;

    font-family: Arial;

    font-size: 16px;

    line-height: 1;

    color: red;

    right: 0;

    top: 50%;

    margin-top: -6px

}



.ie10 .sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:after,

.ie11 .sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:after,

.ie9 .sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {

    content: '\25b2';

  /*   -ms-transform: rotate(90deg);
  
  transform: rotate(90deg) */

}



.sp-bottom-thumbnails.sp-has-pointer {

    margin-top: -13px

}



.sp-bottom-thumbnails.sp-has-pointer .sp-thumbnail {

    position: absolute;

    top: 18px;

    margin-top: 0!important

}



.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {

    content: '';

    position: absolute;

    width: 100%;

    border-bottom: 5px solid red;

    top: 0;

    margin-top: 13px

}



.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {

    content: '\25b2';

    position: absolute;

    font-family: Arial;

    font-size: 16px;

    line-height: 1;

    color: red;

    left: 50%;

    top: 0;

    margin-left: -9px

}



.sp-top-thumbnails.sp-has-pointer {

    margin-bottom: -13px

}



.sp-top-thumbnails.sp-has-pointer .sp-thumbnail {

    position: absolute;

    bottom: 18px

}



.sp-top-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {

    content: '';

    position: absolute;

    width: 100%;

    border-bottom: 5px solid red;

    bottom: 0;

    margin-bottom: 13px

}



.sp-top-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {

    content: '\25bc';

    position: absolute;

    font-family: Arial;

    font-size: 16px;

    line-height: 1;

    color: red;

    left: 50%;

    bottom: 0;

    margin-left: -9px

}



.sp-layer {

    position: absolute;

    margin: 0;

    box-sizing: border-box;

    -moz-box-sizing: border-box;

    -webkit-box-sizing: border-box;

    -webkit-font-smoothing: subpixel-antialiased;

    -webkit-backface-visibility: hidden

}



.sp-black {

    color: #FFF;

    background: #000;

    background: rgba(0, 0, 0, .7)

}



.sp-white {

    color: #000;

    background: #fff;

    background: rgba(255, 255, 255, .7)

}



.sp-rounded {

    border-radius: 10px

}



.sp-padding {

    padding: 10px

}



/* .sp-grab {

    cursor: url(images/openhand.cur), move

}



.sp-grabbing {

    cursor: url(images/closedhand.cur), move

}

 */

.sp-selectable {

    cursor: default

}



.sp-caption-container {

    text-align: left;

    position: absolute;

    bottom: 0;

    left: 0;

    background-color:rgba(71,71,72,0.8);

    font-size: 18px;

    color:#fff;

    padding:0 115px 0 13px;

    line-height: 36px;



}



.sp-full-screen {

    margin: 0!important;

    background-color: #000

}



.sp-full-screen-button {

    position: absolute;

    top: 5px;

    right: 10px;

    font-size: 30px;

    line-height: 1;

    cursor: pointer;

    -webkit-transform: rotate(45deg);

    -ms-transform: rotate(45deg);

    transform: rotate(45deg)

}



.sp-full-screen-button:before {

    content: '\2195'

}



.sp-fade-full-screen {

    opacity: 0;

    -webkit-transition: opacity .5s;

    transition: opacity .5s

}



.slider-pro:hover .sp-fade-full-screen {

    opacity: 1

}



.sp-buttons {

    position: relative;

    width: 100%;

    text-align: center;

    padding-top: 10px

}



.sp-button {

    width: 10px;

    height: 10px;

    border: 2px solid #000;

    border-radius: 50%;

    margin: 4px;

    display: inline-block;

    -moz-box-sizing: border-box;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    cursor: pointer

}



.sp-selected-button {

    background-color: #000

}



@media only screen and (min-width:768px) and (max-width:1024px) {

    .sp-button {

        width: 14px;

        height: 14px

    }

    .sp-has-buttons {

        margin-bottom: 36px

    }

}



@media only screen and (min-width:568px) and (max-width:768px) {

    .sp-button {

        width: 16px;

        height: 16px

    }

    .sp-has-buttons {

        margin-bottom: 38px

    }

}



@media only screen and (min-width:320px) and (max-width:568px) {

    .sp-button {

        width: 18px;

        height: 18px

    }

    .sp-has-buttons {

        margin-bottom: 40px

    }

}



.sp-fade-arrows {

    opacity: 0;

    -webkit-transition: opacity .5s;

    transition: opacity .5s

}



.sp-slides-container:hover .sp-fade-arrows {

    opacity: 1

}



.sp-arrow {
    width: 30px;
    height: 15px;
    position: absolute;
    color: #fff;

    text-shadow: 1px 1px 1px #666;

    cursor: pointer

}



.sp-vertical .sp-arrow {

/*     -webkit-transform: rotate(90deg);

-ms-transform: rotate(90deg);

transform: rotate(90deg) */

}



.sp-horizontal .sp-arrow {

    top: 50%;

    margin-top: -20px

}



.sp-vertical .sp-arrow {

    left: 90%;

    margin-left: -10px

}



.sp-previous-arrow:before {

  /*   content: '\276e' */

}

.sp-previous-arrow{background: url(../images/arrow-p.png) no-repeat;}
.sp-next-arrow{background: url(../images/arrow-n.png) no-repeat top;}

.ie7 .sp-previous-arrow:before,

.ie8 .sp-previous-arrow:before,

.ie9 .sp-previous-arrow:before,

.ios .sp-previous-arrow:before {

    content: '\25c0'

}



.ie7.sp-vertical .sp-previous-arrow:before,

.ie8.sp-vertical .sp-previous-arrow:before {

    content: '\25b2'

}



.sp-next-arrow:before {

  /*   content: '\276f' */

}



.ie7 .sp-next-arrow:before,

.ie8 .sp-next-arrow:before,

.ie9 .sp-next-arrow:before,

.ios .sp-next-arrow:before {

    content: '\25b6'

}



.ie7.sp-vertical .sp-next-arrow:before,

.ie8.sp-vertical .sp-next-arrow:before {

    content: '\25bc'

}



.sp-horizontal .sp-previous-arrow {

    left: 20px

}



.sp-horizontal .sp-next-arrow {

    right: 20px

}



.sp-vertical .sp-previous-arrow {

    top: 20px

}



.sp-vertical .sp-next-arrow {

    bottom: 20px

}



.sp-thumbnail-arrows {

    position: absolute

}



.sp-fade-thumbnail-arrows {

    opacity: 0;

    -webkit-transition: opacity .5s;

    transition: opacity .5s

}



.sp-thumbnails-container:hover .sp-fade-thumbnail-arrows {

    opacity: 1

}



.sp-bottom-thumbnails .sp-thumbnail-arrows,

.sp-top-thumbnails .sp-thumbnail-arrows {

    width: 100%;

    top: 50%;

    left: 0;

    margin-top: -10px

}



.sp-left-thumbnails .sp-thumbnail-arrows,

.sp-right-thumbnails .sp-thumbnail-arrows {

    height: 100%;

    top: 0;

    left: 50%;

    margin-left: -5px

}



.sp-thumbnail-arrow {

    position: absolute;

    font-size: 20px;

    color: #FFF;

    text-shadow: 1px 1px 1px #666;

    cursor: pointer

}



.sp-left-thumbnails .sp-thumbnail-arrows .sp-thumbnail-arrow,

.sp-right-thumbnails .sp-thumbnail-arrows .sp-thumbnail-arrow {

    -ms-transform: rotate(90deg);

    -webkit-transform: rotate(90deg);

    transform: rotate(90deg)

}



.sp-previous-thumbnail-arrow:before {

    content: '\276e'

}



.ie7 .sp-previous-thumbnail-arrow:before,

.ie8 .sp-previous-thumbnail-arrow:before,

.ie9 .sp-previous-thumbnail-arrow:before,

.ios .sp-previous-thumbnail-arrow:before {

    content: '\25c0'

}



.ie7.sp-vertical .sp-previous-thumbnail-arrow:before,

.ie8.sp-vertical .sp-previous-thumbnail-arrow:before {

    content: '\25b2'

}



.sp-next-thumbnail-arrow:before {

    content: '\276f'

}



.ie7 .sp-next-thumbnail-arrow:before,

.ie8 .sp-next-thumbnail-arrow:before,

.ie9 .sp-next-thumbnail-arrow:before,

.ios .sp-next-thumbnail-arrow:before {

    content: '\25b6'

}



.ie7.sp-vertical .sp-next-thumbnail-arrow:before,

.ie8.sp-vertical .sp-next-thumbnail-arrow:before {

    content: '\25bc'

}



.sp-bottom-thumbnails .sp-previous-thumbnail-arrow,

.sp-top-thumbnails .sp-previous-thumbnail-arrow {

    left: 0

}



.sp-bottom-thumbnails .sp-next-thumbnail-arrow,

.sp-top-thumbnails .sp-next-thumbnail-arrow {

    right: 0

}



.sp-left-thumbnails .sp-previous-thumbnail-arrow,

.sp-right-thumbnails .sp-previous-thumbnail-arrow {

    top: 0

}



.sp-left-thumbnails .sp-next-thumbnail-arrow,

.sp-right-thumbnails .sp-next-thumbnail-arrow {

    bottom: 0

}



a.sp-video {

    text-decoration: none

}



a.sp-video img {

    -webkit-backface-visibility: hidden;

    border: none

}



a.sp-video:after {

    content: '\25B6';

    position: absolute;

    width: 45px;

    padding-left: 5px;

    height: 50px;

    border: 2px solid #FFF;

    text-align: center;

    font-size: 30px;

    border-radius: 30px;

    top: 0;

    color: #FFF;

    bottom: 0;

    left: 0;

    right: 0;

    background-color: rgba(0, 0, 0, .2);

    margin: auto;

    line-height: 52px

}

