/*******bootstrap-touch-slider********/



/* SVG wrap */

.bs-slider{



    position: relative;

}

/*.bs-slider:hover {

    cursor: -moz-grab;

    cursor: -webkit-grab;

}

.bs-slider:active {

    cursor: -moz-grabbing;

    cursor: -webkit-grabbing;

}*/

.bs-slider .bs-slider-overlay {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background-color: rgba(0, 0, 0, 0.40);

}

.bs-slider > .carousel-inner > .item > img,

.bs-slider > .carousel-inner > .item > a > img {

    margin: auto;

    width: 100% !important;

}



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

*****Slide effect

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



.fade {

    opacity: 1;

}

.fade .item {

    top: 0;

    z-index: 1;

    opacity: 0;

    width: 100%;

    position: absolute;

    left: 0 !important;

    display: block !important;

    -webkit-transition: opacity ease-in-out 1s;

    -moz-transition: opacity ease-in-out 1s;

    -ms-transition: opacity ease-in-out 1s;

    -o-transition: opacity ease-in-out 1s;

    transition: opacity ease-in-out 1s;

}

.fade .item:first-child {

    top: auto;

    position: relative;

}

.fade .item.active {

    opacity: 1;

    z-index: 2;

    -webkit-transition: opacity ease-in-out 1s;

    -moz-transition: opacity ease-in-out 1s;

    -ms-transition: opacity ease-in-out 1s;

    -o-transition: opacity ease-in-out 1s;

    transition: opacity ease-in-out 1s;

}













/*---------- LEFT/RIGHT ROUND CONTROL ----------*/

.control-round .carousel-control {

    top: 47%;

    opacity: 0;

    z-index: 100;

    color: #ffffff;

    display: block;

    cursor: pointer;

    overflow: hidden;

    text-shadow: none;

    position: absolute;

    background: transparent;

}

.control-round:hover .carousel-control{

    opacity: 1;

}

.control-round .carousel-control.left:hover,

.control-round .carousel-control.right:hover{

    border: 0px transparent;

}

.control-round .carousel-control.left:before{font-family:FontAwesome;content:"\f053";}

.control-round .carousel-control.right:before{font-family:FontAwesome;content:"\f054";}



.control-round .carousel-control {

	margin: 0 20px;

	padding: 15px;

	width: 62px;

	height: 62px;

	border-radius: 40px;

	background: rgba(255,255,255,0.5);

	-webkit-transition: width 0.3s, background-color 0.3s;

	transition: width 0.3s, background-color 0.3s;

}



.carousel-control .icon-wrap {

	position: absolute;

	width: 32px;

}



.carousel-control.left .icon-wrap {

	left: 15px;

}



.carousel-control.right .icon-wrap {

	right: 15px;

}





.carousel-control h3 {

	position: absolute;

	top: 0;

	margin: 0;

	color: #000;

	text-transform: uppercase;

	white-space: nowrap;

	font-size:16px;

	line-height:62px;

	opacity: 0;

	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;

	transition: opacity 0.3s, transform 0.3s;

	color:#1085dc;

}



.carousel-control.left h3 {

	right: 20px;

	-webkit-transform: translateX(100%);

	transform: translateX(100%);

}



.carousel-control.right h3 {

	left: 20px;

	-webkit-transform: translateX(-100%);

	transform: translateX(-100%);

}



.control-round .carousel-control:hover {

	background: #333;

	color:#fff;

}



.carousel-control:hover h3 {

	opacity: 1;

	-webkit-transition-delay: 0.1s;

	transition-delay: 0.1s;

	-webkit-transform: translateX(0);

	transform: translateX(0);

}

/*---------- INDICATORS CONTROL ----------*/

.indicators-line > .carousel-indicators{

    right: 50%;

    bottom: 3%;

    left: auto;

    width: 90%;

    height: 20px;

    font-size: 0;

    overflow-x: auto;

    text-align: right;

    overflow-y: hidden;

    padding-left: 10px;

    padding-right: 10px;

    padding-top: 1px;

    white-space: nowrap;

	margin-right:-50px;

}

.indicators-line > .carousel-indicators li{

    padding: 0;

    width: 35px;

    height: 7px;

    text-indent: 0;

    overflow: hidden;

    text-align: left;

    position: relative;

    margin-right: 5px;

    z-index: 10;

    cursor:pointer;

	background:rgba(255,255,255,0.5);

	border:none;

}

.indicators-line > .carousel-indicators li:last-child{

    margin-right: 0;

}

.indicators-line > .carousel-indicators .active{

    margin: 1px 5px 1px 1px;

    background-color: #fff;

    position: relative;

    -webkit-transition: box-shadow 0.3s ease;

    -moz-transition: box-shadow 0.3s ease;

    -o-transition: box-shadow 0.3s ease;

    transition: box-shadow 0.3s ease;

    -webkit-transition: background-color 0.3s ease;

    -moz-transition: background-color 0.3s ease;

    -o-transition: background-color 0.3s ease;

    transition: background-color 0.3s ease;

	border:1px solid #fff;



}

.indicators-line > .carousel-indicators .active:before{

    transform: scale(0.5);

    background-color:rgba(255,255,255,0.5);

    content:"";

    position: absolute;

    left:-1px;

    top:-1px;

    width:23px;

    height: 23px;

    border-radius: 50%;

    -webkit-transition: background-color 0.3s ease;

    -moz-transition: background-color 0.3s ease;

    -o-transition: background-color 0.3s ease;

    transition: background-color 0.3s ease;

}

/*---------- SLIDE CAPTION ----------*/

.slide_style_left {

    text-align: left !important;

}

.slide_style_right {

    text-align: left !important;

}

.slide_style_center {

    text-align: center !important;

}



.slide-text {

    left: 0;

    top:50%;

    right: 0;

    margin: auto;

    position: absolute;

    text-align: left;

    padding: 10px 200px;

	-webkit-transform: translate(0, -50%);

	-moz-transform: translate(0, -50%);

	-ms-transform: translate(0, -50%);

	-o-transform: translate(0, -50%);

	transform: translate(0, -50%);

	-webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}



.slide-text > h4 a{color:#ffff3f;margin-bottom:20px;font-family: 'oswald';display:inline-block; text-transform:uppercase; font-size:36px; max-width:775px;line-height:45px;}

.slide-text > h4 a:hover{text-decoration:none;}

.slide-text .p{font-family: 'raleway_m';display:inline-block; font-size:18px; color:#ff3335;background:#ffffff;padding:12px 30px;text-transform:uppercase;}

.slide-text .more{}

.slide-text .more a{background:#ff3334;padding:10px 20px;color:#fff;font-size:14px;display:inline-block;text-transform:uppercase;margin-top:30px;}

.slide-text .more a:hover{background:#ffff3f;color:#333;text-decoration:none;}

/*------------------------------------------------------*/

/* RESPONSIVE

/*------------------------------------------------------*/

@media (max-width:1200px) {

	.slide-text{ padding:10px 30px;}

	.slide-text > h4 a{font-size:28px;}

	.slide-text .p{font-size:16px;padding:8px 25px;}

}

@media (max-width:768px) {

	.slide-text{ text-align:center !important; width:100%;}

	.slide-text > h4{margin:0;}

	.slide-text > h4 a{font-size:20px;margin-bottom:10px;}

	.slide-text .p{font-size:14px;padding:5px 15px;}

	.slide-text .more a{display:none;}

}

@media (max-width:560px) {

	.slide-text{ text-align:center !important; width:100%;padding:0 15px;}

	.slide-text > h4 a{margin:0;}

	.indicators-line > .carousel-indicators{bottom:0;margin-bottom:0;}

	.control-round .carousel-control{width:30px;height:30px;padding:2px;font-size:16px;}

	.slide-text > h4 a{font-size:16px;font-family: 'raleway_b';line-height:20px;}

	.slide-text .p{display:none;}

}



/*******Slider********/

/* Slider */

.slick-slider{ position: relative; display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent;}



.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }

.slick-list:focus { outline: none; }

.slick-list.dragging { cursor: pointer; cursor: hand;}



.slick-slider .slick-list, .slick-track, .slick-slide, .slick-slide img { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }



.slick-track { position: relative; left: 0; top: 0; display: block; zoom: 1; }

.slick-track:before, .slick-track:after { content: ""; display: table; }

.slick-track:after { clear: both; }

.slick-loading .slick-track { visibility: hidden; }



.slick-slide { float: left; height: 100%; min-height: 1px; display: none; }

.slick-slide img { display: block; margin:0 auto;}

.slick-slide.slick-loading img { display: none; }

.slick-slide.dragging img { pointer-events: none; }

.slick-initialized .slick-slide { display: block; }

.slick-loading .slick-slide { visibility: hidden; }

.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }



/* Arrows */

.slick-prev, .slick-next { position: absolute; display: block; height: 20px; width: 20px; line-height: 0; font-size: 0; cursor: pointer; background: transparent; color: transparent; margin-top: -10px; padding: 0; border: none; outline: none; }

.slick-prev:focus, .slick-next:focus { outline: none; }

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; }

/* Dots */

.slick-dots { position: absolute;  list-style: none; display: block; text-align: center; padding: 0px; width: 100%; z-index:999; left:0; margin-top:34px;}

.slick-dots li { position: relative; display: inline-block; height: 5px; width:52px; margin: 0px 5px; padding: 0px; cursor: pointer; }

.slick-dots li button { border: 0; background: transparent; display: block; height: 5px; width:52px; outline: none; line-height: 0; font-size: 0; cursor: pointer; outline: none; background:#eeeeee;}

.slick-dots li button:focus { outline: none;}

.slick-dots li.slick-active button{background:#0db26d;}



/* Arrows */

.slick-prev, .slick-next { position: absolute; display: block; height: 20px; width: 20px; line-height: 0; font-size: 0; cursor: pointer; background: transparent; color: transparent; margin-top: -10px; padding: 0; border: none; outline: none; }

.slick-prev:focus, .slick-next:focus { outline: none; }

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; }

/* Dots */

.slick-dots { position: absolute; bottom: -35px; list-style: none; display: block; text-align: center; padding: 0px; width: 100%; z-index:999;display:none !important;}

.slick-dots li { position: relative; display: inline-block; height: 5px; width: 35px; margin: 0px 5px; padding: 0px; cursor: pointer; }

.slick-dots li button { border: 0; background: transparent; display: block; height: 5px; width: 35px; outline: none; line-height: 0; font-size: 0; cursor: pointer; outline: none; background:rgba(255,255,255,0.6);}

.slick-dots li button:focus { outline: none;}

.slick-dots li.slick-active button{background:#fff;}



.slick-prev{width:40px;height:40px;position:absolute; left:-40px; top:45%; vertical-align: middle;filter:alpha(opacity=20);-moz-opacity:0.2;opacity:0.2;background:url(../images/prev-b.png) no-repeat center center;-webkit-transition:all var(--transition-time,800ms);

	-o-transition:all var(--transition-time,800ms);

	transition:all var(--transition-time,800ms);}

.slick-next{width:40px;height:40px;position:absolute; right:-40px; top:45%; vertical-align: middle;filter:alpha(opacity=20);-moz-opacity:0.2;opacity:0.2;background:url(../images/next-b.png) no-repeat center center;-webkit-transition:all var(--transition-time,800ms);

	-o-transition:all var(--transition-time,800ms);

	transition:all var(--transition-time,800ms);}

.slick-next:hover,.hot_pro .slick-prev:hover{filter:alpha(opacity=60);-moz-opacity:0.6;opacity:0.6;}



@media only screen and (max-width: 840px) {

	.slick-prev{left:0;}

	.slick-next{right:0;}

}



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

	.slick-prev{left:-15px;filter:alpha(opacity=40);-moz-opacity:0.4;opacity:0.4;top:40%;}

	.slick-next{right:-15px;filter:alpha(opacity=40);-moz-opacity:0.4;opacity:0.4;top:40%;}

}





/*******features-tab********/

/* clearfix */

.owl-carousel .owl-wrapper:after {

	content: ".";

	display: block;

	clear: both;

	visibility: hidden;

	line-height: 0;

	height: 0;

}

/* display none until init */

.owl-carousel{

	display: none;

	position: relative;

	width: 100%;

	-ms-touch-action: pan-y;

}

.owl-carousel .owl-wrapper{display: none;position: relative;-webkit-transform: translate3d(0px, 0px, 0px);}

.owl-carousel .owl-wrapper-outer{

	overflow: hidden;

	position: relative;

	width: 100%;

	padding-top:20px;

}

.owl-carousel .owl-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;

}

	

.owl-carousel .owl-item{

	float: left;

}

.owl-controls .owl-page,

.owl-controls .owl-buttons div{

	cursor: pointer;

}

.owl-controls {

	-webkit-user-select: none;

	-khtml-user-select: none;

	-moz-user-select: none;

	-ms-user-select: none;

	user-select: none;

	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);

}



/* mouse grab icon */

.grabbing { 

    cursor:url(grabbing.png) 8 8, move;

}



/* fix */

.owl-carousel  .owl-wrapper,

.owl-carousel  .owl-item{

	-webkit-backface-visibility: hidden;

	-moz-backface-visibility:    hidden;

	-ms-backface-visibility:     hidden;

  -webkit-transform: translate3d(0,0,0);

  -moz-transform: translate3d(0,0,0);

  -ms-transform: translate3d(0,0,0);

}

.indicator-style.owl-theme .owl-controls .owl-buttons div {

    background: inherit;

    width:40px;

	height:40px;

	filter:alpha(opacity=10);

	-moz-opacity:0.1;

	opacity:0.1;

	padding: 0;

    position: absolute;

    right: 5px;

    top: 40%;

	text-indent:-9999px;

	overflow:hidden;

}

.indicator-style.owl-theme .owl-controls .owl-buttons div.owl-prev {left:-50px;background:url(../images/prev-b.png) no-repeat center center;}

.indicator-style.owl-theme .owl-controls .owl-buttons div.owl-next {right:-50px;background:url(../images/next-b.png) no-repeat center center;}

.indicator-style.owl-theme .owl-controls .owl-buttons div:hover {filter:alpha(opacity=60);-moz-opacity:0.6;opacity:0.6;}



.main-about .indicator-style.owl-theme .owl-controls .owl-buttons div.owl-prev{left:-25px;}

.main-about .indicator-style.owl-theme .owl-controls .owl-buttons div.owl-next{right:-25px;}



@media only screen and (max-width: 1320px) {

	.indicator-style.owl-theme .owl-controls .owl-buttons div.owl-prev{left:0;}

	.indicator-style.owl-theme .owl-controls .owl-buttons div.owl-next{right:0;}

}

@media only screen and (max-width: 1200px) {

	.owl-carousel .owl-wrapper{padding-top:0;}

	.indicator-style.owl-theme .owl-controls .owl-buttons div{top:55%;}

}



@media only screen and (max-width: 992px) {

	.indicator-style.owl-theme .owl-controls .owl-buttons div{top:58%;}

	.indicator-style.owl-theme .owl-controls .owl-buttons div.owl-prev{left:-40px;}

	.indicator-style.owl-theme .owl-controls .owl-buttons div.owl-next{right:-40px;}

}



@media only screen and (max-width: 992px) {

	.indicator-style.owl-theme .owl-controls .owl-buttons div.owl-prev{left:0;}

	.indicator-style.owl-theme .owl-controls .owl-buttons div.owl-next{right:0;}

}



@media only screen and (max-width: 850px) {

	.main-about .indicator-style.owl-theme .owl-controls .owl-buttons div.owl-prev{left:0;}

	.main-about .indicator-style.owl-theme .owl-controls .owl-buttons div.owl-next{right:0;}

}



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

	.main-about .indicator-style.owl-theme .owl-controls .owl-buttons div{top:50%;}

	.main-about .indicator-style.owl-theme .owl-controls .owl-buttons div.owl-prev{left:-10px;}

	.main-about .indicator-style.owl-theme .owl-controls .owl-buttons div.owl-next{right:-10px;}

}





/*******certificate-thumbs********/

/* ------ venobox.css --------*/

.vbox-overlay *, .vbox-overlay *:before, .vbox-overlay *:after{

    -webkit-backface-visibility: hidden;

    -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}

body{

    -webkit-overflow-scrolling:touch;

}

/* ------- overlay: change here background color and opacity ----- */

.vbox-overlay{

    background: rgba(0,0,0,0.85); 

    width: 100%;

    height: auto;

    position: absolute;

    top: 0;

    left: 0;

    z-index: 999;

    overflow: hidden;

    opacity: 0;

    transition: opacity .25s ease-in-out;

    -moz-transition: opacity .25s ease-in-out;

    -webkit-transition: opacity .25s ease-in-out;

}

.relativo{

    float: left;

    width: 100%;

    height: 100%;

    display: block;

    position: relative;

}

/* ----- preloader ----- */

.vbox-preloader{

    position:fixed; 

    width:36px; 

    height:36px;

    left:50%; 

    top:50%; 

    margin-left:-18px; 

    margin-top:-18px;

    background: url(preload.gif) center center no-repeat;

    text-indent: -100px;

    overflow: hidden;

}



/* ----- navigation ----- */

.vbox-close{

    cursor: pointer;

    position: fixed;

    top: -1px;

    right: 0;

    width: 46px;

    height: 40px;

    padding: 10px 20px 10px 0;

    display: block;

    background:url(../images/close.gif) no-repeat #161617;

    background-position:10px center;

    color: #fff;

    text-indent: -100px;

    overflow: hidden;

}

.vbox-next, .vbox-prev{

    cursor: pointer;

    position: fixed;

    top: 50%;

    color: #fff;

    width: 30px;

    height: 30px;

    margin-top: -15px;

    text-indent: -100px;

    overflow: hidden;

}

.vbox-prev{

    left: 10px;

    background:url(../images/prev.gif) center center no-repeat;

}

.vbox-next{

    right: 10px;

    background:url(../images/next.gif) center center no-repeat;

}



.vbox-title{

    width: 100%;

    height: 40px;

    float: left;

    text-align: center;

    line-height: 28px;

    font-size: 12px;

    color: #fff;

    padding: 6px 40px;

    overflow: hidden;

    background: #161617;

    position: fixed;

    display: none;

    top: -1px;

    left: 0;



}

.vbox-num{

    cursor: pointer;

    position: fixed;

    top: -1px;

    left: 0;

    height: 40px;

    display: block;

    color: #fff;

    overflow: hidden;

    line-height: 28px;

    font-size: 12px;

    padding: 6px 10px;

    background: #161617;

    display: none;

}

/* ------- inline window ------ */

.vbox-inline{

    width: 420px;

    height: 315px;

    padding: 10px;

    background: #fff;

    text-align: left;

    margin: 0 auto;

    overflow: scroll;

}



/* ------- Video & iFrames window ------ */

.venoframe{

    border: none;

    width: 960px;

    height: 720px;

    overflow: scroll;

}

@media (max-width: 992px) {

    .venoframe{

        width: 640px;

        height: 480px;

    }

}

@media (max-width: 767px) {

    .venoframe{

        width: 420px;

        height: 315px;

    }

}

@media (max-width: 460px) {

    .vbox-inline{

        width: 100%;

    }



    .venoframe{

        width: 100%;

        height: 260px;

    }

}



/* ------- PLease do NOT edit this! (or do it at your own risk) ------ */

.vbox-container{

    position: relative;

    background: #000;

    width: 98%;

    max-width: 1024px;

    margin: 0 auto;

}

.vbox-content{

    text-align: center;

    float: left;

    width: 100%;

    position: relative;

    overflow: hidden;

}

.vbox-container img{

    max-width: 100%;

    height: auto;

}

.vwrap{

    opacity: 1;

    transition: opacity .25s ease-in-out;

    -moz-transition: opacity .25s ease-in-out;

    -webkit-transition: opacity .25s ease-in-out;

    width: 100%;

    float: left;

    position: relative;

    margin: 0;

    padding: 0;

    left: 0;

    height: auto;

    overflow: hidden;

    z-index: 1;

}





/*******product-detail********/

/* CSS for the loading div */



.sp-loading {

	text-align: center;

	max-width: 100%;

	padding: 15px;

	border: 5px solid #eee;

	border-radius: 3px;

	font-size: 12px;

	color: #888;

}



/* Element wrapper */



.sp-wrap {

	display: none;

	line-height: 0;

	font-size: 0;

	border-radius: 3px;

	position: relative;

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

	  Set max-width to your thumbnail width

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

	text-align:center;

	max-width: 100%;

	width:100%;

}



/* Thumbnails */



.sp-thumbs {

	margin-top:10px;

	text-align: left;

	display: block;

}

.sp-thumbs a{position:relative;border:1px solid #f7f7f7;}

.sp-thumbs a:after{transition:all .5s;transform:scaleX(0);content:"\f00c";font-family:FontAwesome;display:inline-block;font-size:16px;color:#bd1e2e;position:absolute;left:50%;top:50%;margin-left:-8px;}

.sp-thumbs a:hover:after{transform:scaleX(1);visibility:visible;}

.sp-thumbs img {

	min-height: 56px;

	min-width: 56px;

	max-width: 56px;

}

.sp-thumbs a:link, .sp-thumbs a:visited {

	width: 70px;

	height: 47px;

	overflow: hidden;

	filter:alpha(opacity=50);

	-moz-opacity:0.5;

	opacity:0.5;

	display: inline-block;

	background-size: cover;

	background-position: center;

	-webkit-transition: all .2s ease-out;

	-moz-transition: all .2s ease-out;

	-ms-transition: all .2s ease-out;

	-o-transition: all .2s ease-out;

	transition: all .2s ease-out;

	margin:0 3px;

}

.sp-thumbs a:hover {

	opacity: 1;

	border:1px solid #bd1e2e;

}



/* Styles for the currently selected thumbnail */



.sp-thumbs a:active, .sp-current {

	opacity: 1!important;

	position: relative;

	border:1px solid #ffce25 !important;

}



.sp-thumbs a.sp-current:after{transform:scaleX(1);visibility:visible;}



/* Image currently being viewed */



.sp-large {

	position: relative;

	overflow: hidden;

	top: 0;

	left: 0;

	width:100%;

	border:1px solid #f2f2f2;

	border-radius:2px;

}

.sp-large a img {

	max-width: 100%;

	height: auto;

	width:100%;

}

.sp-large a {

	display: block;

}



/* Panning Zoomed Image */



.sp-zoom {

	position: absolute;

	left: -50%;

	top: -50%;

	cursor: -webkit-zoom-in;

	cursor: -moz-zoom-in;

	cursor: zoom-in;

	display: none;

}

/* Lightbox */



.sp-lightbox {

	position: fixed;

	top: 0;

	left: 0;

	height: 100%;

	width: 100%;

	background: rgb(0, 0, 0);

	background: rgba(0, 0, 0, .9);

	z-index: 999999;

	display: none;

	cursor: pointer;

}

.sp-lightbox img {

	position: absolute;

	margin: auto;

	top: 0;

	bottom: 0;

	left: 0;

	right: 0;

	max-width: 90%;

	max-height: 90%;

	border: 2px solid #fff;

}

#sp-prev, #sp-next {

	position: absolute;

	top: 50%;

	margin-top: -25px;

	z-index: 501;

	color: #fff;

	padding: 14px;

	text-decoration: none;

	background: #000;

	border-radius: 25px;

	border: 2px solid #fff;

	width: 50px;

	height: 50px;

	box-sizing: border-box;

	transition: .2s;

}

#sp-prev {

	left: 14%;

}

#sp-prev:before {

	content: '';

	border: 7px solid transparent;

	border-right: 15px solid #fff;

	position: absolute;

	top: 16px;

	left: 7px;

}

#sp-next {

	right: 14%;

}

#sp-next:before {

	content: '';

	border: 7px solid transparent;

	border-left: 15px solid white;

	position: absolute;

	top: 16px;

	left: 18px;

}

#sp-prev:hover, #sp-next:hover {

	background: #444;

}



/* Tweak styles for small viewports */



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

	#sp-prev {left:10px;}

	#sp-next {right:10px;}

}



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

	.sp-wrap {

		margin: 0 0 15px 0;

	}

	#sp-prev, #sp-next {

		top: auto;

		margin-top: 0;

		bottom: 25px;

	}

}