
.carousel-caption {

  height: 100vh;
  overflow: hidden;
  max-width: 1140px;
  padding:0;
  margin: 0 auto;
  bottom:3vh;
  right: 0;
  left: 0;

}

.caption_box {
  max-width: 45vw;
  margin: 0 auto;
  overflow: hidden;         
  position: absolute;
  bottom: 1vh;
  right: 0;
  left: 0;

}


.title_promo {

  height: 8vh;
  text-align:center;
 }
 
.title_promo h2 {
  font-size:1.9vw;
  line-height: 8vh;
 }


.image_promo {
	height: 58vh;
	line-height: 56vh;
  	text-align:center;
}

.image_promo img{
	height: 100%;
	border: 0px solid #303030;
}


.button_carousel {
  width: 100%; 
  height: 6vh;
  line-height: 10vh;
}

.button_carousel:focus {
outline-style:none !important;
}
  
  .button_carousel h2 {
  border: 2px white solid;
  font-size: 16px;
  font-weight: 500;
  padding: 3px 9px;
  }
    
.button_img_carousel img{
	width:35vw;
}


.button_img_carousel {
  width:100%;
  height: 12vh;
  line-height: 12vh;
    }

.display-4 {
	display:inline;
}


/* ==== mobil phones portrait ==== */
@media only screen 
and (max-device-width : 667px)
and (min-device-width : 320px) 
and (orientation : portrait) { 

	.title_promo h2 {
		font-size: 5.5vw;
	}

	.caption_box {
		max-width: 95vw;
	}
	.image_promo img {
		height: auto;
	}
  .button_img_carousel img {
	  width: 95vw;
  }
  }

@media only screen 
and (max-device-width : 812px)
and (min-device-width : 320px) 
and (orientation : landscape) {
	.button_carousel {
	display:none;
	}
   .carousel-caption {
     bottom:9vh;
   }
}


/* ==== tablets portrait ==== */

@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px)  
  and (-webkit-min-device-pixel-ratio: 2) {
	.button_carousel {
		display:none;
	}    
    }
    
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {
	.caption_box {
		max-width: 85vw;
	}
.title_promo h2 {
    
    font-size: 4.6vw;
    }     
    }

  @media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {
	.caption_box {
		max-width: 85vw;
	}    
    }
    
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
	.caption_box {
		max-width: 48vw;
	}
		.title_promo h2 {
    font-size: 2.6vw;
    } 
	}
	    
@media only screen 
  and (min-device-width: 1336px) 
  and (max-device-width: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
	.caption_box {
		max-width: 48vw;
	}
		.title_promo h2 {
    font-size: 2.6vw;
    } 
	}

    
    
    
    