/*!
 * Start Bootstrap - Half Slider HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

html,
body {
    height: 100%;
}

/* You can change the height of the carousel by changing the height in the class below. It is set to 50% by default, but can be any height! */
@media(min-width:481px){
.carousel {
    height: 65%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
@media(min-width:395px) and (max-width:480px)and (min-height:901px) {
.carousel {
    height: 65%;
}	
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
@media(max-width:394px) and (min-height:901px) {
.carousel {
    height: 60%;
}	
.item,
.active,
.carousel-inner {
    height: 100%;
}
}


/* Background images are set within the HTML using inline CSS, not here */

.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
@media(min-width:371px) and (max-width:480px)and (min-height:700px) and (max-height:800px) {
.carousel {
    height: 76%;
}
.item,
.active,
.carousel-inner {
    height: 110%;
}	
}
@media(max-width:370px)and (min-height:700px) and (max-height:800px)  {
.carousel {
    height: 70%;
}	
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
@media(min-width:430px) and (max-width:480px)and (min-height:800px) {
.carousel {
    height: 76%;
}
.item,
.active,
.carousel-inner {
    height: 110%;
}	
}
@media (min-width:400px)and (max-width:429px)and (min-height:700px) and (max-height:800px) {
.carousel {
    height: 60%;
}	
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
@media (min-width:400px)and (max-width:429px)and (min-height:700px) and (max-height:800px) {
.carousel {
    height: 67%;
}	
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
@media(max-width:480px)and (min-height:615px) and (max-height:699px){
.carousel {
    height: 75%;
}	
.item,
.active,
.carousel-inner {
    height: 110%;
}	
}
@media(min-width:430px) and (max-width:480px)and (min-height:0px) and (max-height:615px){
.carousel {
    height: 100%;
}	
.item,
.active,
.carousel-inner {
    height: 110%;
}	
}
@media(max-width:429px)and (min-height:0px) and (max-height:615px){
.carousel {
    height: 85%;
}	
.item,
.active,
.carousel-inner {
    height: 110%;
}	
}
@media(min-width:481px) and (max-width:550px){
.carousel {
    height: 65%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
@media(min-width:481px){
.carousel {
    height: 65%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
  /* 
@media(min-width:661px) and (max-width:800px) and (min-height:700px) and (max-height:900px){
.carousel {
    height: 150%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}*/
/*@media(min-width:551px) and (max-width:660px) and (min-height:700px) and (max-height:900px){
.carousel {
    height: 115%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}*/
/*
@media(min-width:481px) and (max-width:550px) and (min-height:700px) and (max-height:900px){
.carousel {
    height: 100%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}*/
@media(min-width:551px) and (max-width:800px) and (min-height:661px) and (max-height:700px){
.carousel {
    height: 170%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
@media(min-width:551px) and (max-width:800px) and (min-height:551px) and (max-height:660px){
.carousel {
    height: 150%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
@media(min-width:481px)and(max-width:550px)and (min-height:551px) and (max-height:660px){
.carousel {
    height: 125%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
@media(min-width:661px) and (max-width:800px) and (min-height:901px){
.carousel {
    height: 125%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
@media(min-width:531px) and (max-width:660px) and (min-height:901px){
.carousel {
    height: 100%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}
@media(max-width:530px) and (min-height:901px){
.carousel {
    height: 85%;
}
.item,
.active,
.carousel-inner {
    height: 100%;
}
}