/*========================
Service Slider
========================*/


#service-slider { /*padding:2%;*/ }
#service-slider .service-slider-wrap { background: #d5dae0; padding:2.5%; border-radius:8px; float: left; width: 100%; }
#service-slider .wrap {}
#service-slider .section-header a { background:#FFF; color: #2c85c6;   border-radius:8px; font-size: 18px; float: right; padding:10px 20px; margin-top: 0px; }
#service-slider .section-header a:hover { background: #c7cace; }
body #service-slider .section-header h2 { border:none; width:auto; }


#service-slider .service-carousel { float: left; width: 100%; }
#service-slider ul li { padding:3%; }
#service-slider ul li a { float: left; width: 100%; background: #FFF; border-radius:8px; }
#service-slider ul li a img { border-top-right-radius: 8px; border-top-left-radius: 8px; }
#service-slider ul li .service-title { float: left; width: 100%; padding-left: 15px; color: #FFF; font-size:16px; font-family: din_next; }
#service-slider ul li .service-title i { float: left; padding:3px 10px 0 0; }
#service-slider ul li .service-title img { width: 10px; float: right; margin-right:20px; margin-top: 1px; }
#service-slider .service-carousel .owl-wrapper .owl-item:nth-child(1) .service-title { background-image: url("../images/blue-background.jpg"); background-size: cover; }
#service-slider .service-carousel .owl-wrapper .owl-item:nth-child(2) .service-title { background-image: url("../images/turq-background.jpg"); background-size: cover;}
#service-slider .service-carousel .owl-wrapper .owl-item:nth-child(3) .service-title { background-image: url("../images/purple-background.jpg"); background-size: cover;}
#service-slider .service-carousel .owl-wrapper .owl-item:nth-child(4) .service-title { background-image: url("../images/red-background.jpg"); background-size: cover;}
#service-slider .service-carousel .owl-wrapper .owl-item:nth-child(5) .service-title { background-image: url("../images/blue-background.jpg"); background-size: cover; }
/*#service-slider .service-carousel li:nth-child(2) .service-title {  }*/
#service-slider ul li a .service-text { padding:15px; font-size: 15px; }
#service-slider ul li a .dumby-button { margin-left: 15px; float: left; margin-bottom: 15px; padding:10px 20px; font-size: 15px; line-height: 22px; }
#service-slider ul li a .dumby-button img { width: 10px; float: left; margin-right: 10px; }



#service-slider .owl-buttons div { height: 40px; width: 40px; line-height: 45px; opacity: 1; background: none; padding:0;  }
#service-slider .owl-buttons div img { width: 100%; line-height: 55px; position: relative; opacity: 1; }
#service-slider .owl-buttons .owl-prev {}
#service-slider .owl-buttons .owl-next {}

#service-slider .owl-buttons div:hover img { opacity: 0.5; }

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

#service-slider {margin-bottom: 20px;}

/* =======================================
 @ 500
======================================= */
@media only screen and (min-width: 500px) {

#service-slider ul li .service-title { font-size: 19px; }


}


/* =======================================
 @ 1200
======================================= */
@media only screen and (min-width: 1200px) {

#service-slider { padding:2% 0; }
#service-slider ul li .service-title { font-size: 22px; }


}


/* =======================================
 @ 1300
======================================= */
@media only screen and (min-width: 1300px) {


#service-slider .owl-buttons div { position: absolute; }
#service-slider .owl-buttons .owl-prev { left: -100px; top: 45%; }
#service-slider .owl-buttons .owl-next { right: -100px; top: 45%; }

}