/*========================================================
    Home Page Slider
=========================================================*/

/*--- Slider / Carousel---*/
.fade-carousel {
  position:relative;
  height:500px;  
  margin-bottom:1px;  
}
.fade-carousel .carousel-inner .item {
  height:500px;
}
.fade-carousel .carousel-indicators > li {
  margin:0 2px;
  background-color:#ff0000;
  border-color:#ff0000;	
  opacity:1;
  width:16px;
  height:16px;
}
.fade-carousel .carousel-indicators > li.active {
  width:16px;
  height:16px;
  background-color:#fff;
  opacity:1;
}
.carousel-inner .caption {
  position:absolute;
  top:50%;
  left:50%;
  z-index:3; 
  text-align:center; 
  text-transform:uppercase;
  text-shadow:1px 1px 0 rgba(0,0,0,.75);
  -webkit-transform: translate3d(-50%,-50%,0);
  -moz-transform: translate3d(-50%,-50%,0);
  -ms-transform: translate3d(-50%,-50%,0);
  -o-transform: translate3d(-50%,-50%,0);
  transform: translate3d(-50%,-50%,0);
}
.carousel-inner .caption .title {  
  color:#ffffff; 
  font:96px/90px 'roboto_condensedbold', Arial;  
  margin:0;
  padding:0;    
}
.carousel-inner .caption .subtitle {
  color:#ffffff;
  font:24px/1em 'robotomedium', Arial; 
  margin:15px 0;  
}
.fade-carousel .carousel-inner .item .caption {
  opacity:0;
  -webkit-transition:2s all ease-in-out .1s;
  -moz-transition:2s all ease-in-out .1s; 
  -ms-transition:2s all ease-in-out .1s; 
  -o-transition:2s all ease-in-out .1s; 
  transition:2s all ease-in-out .1s; 
}
.fade-carousel .carousel-inner .item.active .caption {
  opacity:1;
  -webkit-transition:2s all ease-in-out .1s;
  -moz-transition:2s all ease-in-out .1s; 
  -ms-transition:2s all ease-in-out .1s; 
  -o-transition:2s all ease-in-out .1s; 
  transition:2s all ease-in-out .1s;    
}
.overlay {
  position:absolute;
  width:100%;
  height:100%;
  z-index:2;
  background-color:#181818;
  opacity:0.4;  
}
.btn-slider1 {   
  color:#ffffff;
  font:18px/1em 'robotomedium', Arial; 
  background:#ff0000;  
  margin:0 auto 10px; 
  padding:14px 16px; 
  border-radius:5px; 
  border:2px solid #ffffff;  
  box-shadow:0 0 1px #111111;
  -webkit-transform-origin:50% 50%;
  -webkit-transition-duration:0.4s;
  -webkit-transition-timing-function:ease-out;
  -webkit-box-shadow:50px 0px 0 0 #ff0000 inset , -50px 0px 0 #ff0000 inset;   
}  
.btn-slider1:hover,
.btn-slider1:focus  { 
  color:#ffffff;
  background:#336699;  
  -webkit-box-shadow:0px 0px 0 0 #ff0000 inset , 0px 0px 0 #ff0000 inset;
  text-decoration:none;
}
.btn-slider2 {   
  color:#ffffff;
  font:18px/1em 'robotomedium', Arial; 
  background:#336699;  
  margin:0 auto 10px; 
  padding:14px 16px; 
  border-radius:5px;  
  border:2px solid #ffffff; 
  box-shadow:0 0 1px #111111;
  -webkit-transform-origin:50% 50%;
  -webkit-transition-duration:0.4s;
  -webkit-transition-timing-function:ease-out;
  -webkit-box-shadow:50px 0px 0 0 #336699 inset , -50px 0px 0 #336699 inset;   
}  
.btn-slider2:hover,
.btn-slider2:focus  { 
  color:#ffffff;
  background:#ff0000;  
  -webkit-box-shadow:0px 0px 0 0 #336699 inset , 0px 0px 0 #336699 inset;
  text-decoration:none;
}
.fade-carousel .slides .slide-1,
.fade-carousel .slides .slide-2,
.fade-carousel .slides .slide-3,
.fade-carousel .slides .slide-4,
.fade-carousel .slides .slide-5 {
  height:500px;
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}

.fade-carousel .slides .slide-1 {
  background-image:url(../images/slider/slide1-toyota-hilux.jpg); 
}
.fade-carousel .slides .slide-2 {
  background-image:url(../images/slider/slide2-mazda-bt50.jpg); 
}
.fade-carousel .slides .slide-3 {
  background-image:url(../images/slider/slide3-slwb-moving-van-type-g.jpg); 
}
.fade-carousel .slides .slide-4 {
  background-image:url(../images/slider/slide4-people-movers.jpg); 
}
.fade-carousel .slides .slide-5 {
  background-image:url(../images/slider/slide5-trade-equipe-type-d.jpg); 
}




/*========================================================================*/
@media (max-width: 359px) {
  .fade-carousel .slides .slide-1,
  .fade-carousel .slides .slide-2,
  .fade-carousel .slides .slide-3,
  .fade-carousel .slides .slide-4,
  .fade-carousel .slides .slide-5 {
    height:230px;
  }
  .fade-carousel {
    height:230px;
  }
  .fade-carousel .carousel-inner .item {
    height:230px;
  }
  .carousel-inner .caption .title { 
    font:26px/1em 'roboto_condensedbold', Arial;
  } 
  .carousel-inner .caption .subtitle { 
    font:14px/1em 'robotomedium', Arial;
	margin:5px 0;
  }
  .btn-slider1 {   
    color:#ffffff;
    font:12px/1em 'robotomedium', Arial;
    padding:10px 12px;
  }
  .btn-slider2 {   
    color:#ffffff;
    font:12px/1em 'robotomedium', Arial; 
     padding:10px 12px;
  }.carousel-indicators {
    bottom:0px;
  }
  .fade-carousel .carousel-indicators > li {
    width:8px;
    height:8px;
  }
  .fade-carousel .carousel-indicators > li.active {
    width:8px;
    height:8px;
  }	
	
}
/*========================================================================*/
@media (min-width: 360px) and (max-width: 479px) {
  .fade-carousel .slides .slide-1,
  .fade-carousel .slides .slide-2,
  .fade-carousel .slides .slide-3,
  .fade-carousel .slides .slide-4,
  .fade-carousel .slides .slide-5 {
     height:280px;
  }
  .fade-carousel {
    height:280px;
  }
  .fade-carousel .carousel-inner .item {
    height:280px;
  }
  .carousel-inner .caption .title { 
    font:30px/1em 'roboto_condensedbold', Arial;
  } 
  .carousel-inner .caption .subtitle { 
    font:14px/1em 'robotomedium', Arial;
    margin:10px 0 10px;	
  }
  .btn-slider1 {   
    color:#ffffff;
    font:14px/1em 'robotomedium', Arial;
    padding:12px;  
  }
  .btn-slider2 {   
    color:#ffffff;
    font:14px/1em 'robotomedium', Arial; 
     padding:12px;
  }
  .carousel-indicators {
    bottom:0;
  }
  .fade-carousel .carousel-indicators > li {
    width:12px;
    height:12px;
  }
  .fade-carousel .carousel-indicators > li.active {
  width:12px;
  height:12px;
  }	
	
}
/*========================================================================*/
@media (min-width: 480px) and (max-width: 767px) {
  .fade-carousel .slides .slide-1,
  .fade-carousel .slides .slide-2,
  .fade-carousel .slides .slide-3,
  .fade-carousel .slides .slide-4,
  .fade-carousel .slides .slide-5 {
    height:350px;
  }
  .fade-carousel {
    height:350px;
  }
  .fade-carousel .carousel-inner .item {
    height:350px;
  }
  .carousel-inner .caption .title { 
    font:44px/1em 'roboto_condensedbold', Arial;
  } 
  .carousel-inner .caption .subtitle { 
    font:16px/1em 'robotomedium', Arial;
	margin:10px 0 10px;
  }
  .btn-slider1 {   
    font:14px/1em 'robotomedium', Arial;
    padding:12px; 
  }
  .btn-slider2 {
    font:14px/1em 'robotomedium', Arial; 
    padding:12px;
  }  
  .carousel-indicators {
    bottom:4px;
  }  
  .fade-carousel .carousel-indicators > li {
    width:12px;
    height:12px;
  }
  .fade-carousel .carousel-indicators > li.active {
    width:12px;
    height:12px;
  }

  
 }
/*========================================================================*/
@media (min-width: 768px) and (max-width: 991px) {
 .carousel-inner  .caption .title { 
    font:64px/1em 'roboto_condensedbold', Arial;
  } 
  .carousel-inner   .caption .subtitle { 
    font:16px/1em 'robotomedium', Arial; 
  } 
  
  
}
/*========================================================================*/
@media (min-width: 992px) and (max-width: 1199px) {	
  .carousel-inner  .caption .title { 
    font:80px/70px 'roboto_condensedbold', Arial; 
  }
  .carousel-inner .caption .subtitle {
    font: 24px/1em 'robotomedium', Arial;
  }

	
}