/*!
 * Start Bootstrap - Full 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%;}
#mainCarousel.carousel               {height:110%; background-color:#04080e;}
#mainCarousel.carousel .item         {height:100%;}
#mainCarousel.carousel .item .active {height:100%;}
#mainCarousel .carousel-inner        {height:110%; z-index:99;}

.fill {
    width:100%; height:100%;
	position:relative;
	background-attachment:fixed;
    background-position:center;
    -webkit-background-size:cover;
    -moz-background-size:cover;
    background-size:cover;
    -o-background-size:cover;
}
.fill:after {
	content:''; position:absolute; left:0; top:0; bottom:0; right:0;
	background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, 0.5) 0), color-stop(rgba(0, 0, 0, 0.0001) 100%));
  	background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0, rgba(0, 0, 0, 0.0001) 100%);
  	background-repeat: repeat-x;
  	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
}

#mainCarousel .carousel-caption {
    right:0; top:0; left:0; bottom:0; padding:0; color:#000;
	background:url(../images/banner/over-green.html) left top no-repeat;
	background-size:70% 100%; padding-top:10%; text-decoration:none;
}

#mainCarousel .carousel-control    {top:50%; bottom:auto; width:50px; height:50px; background-color:#000; padding-top:14px; z-index:99; border-radius:5px;}
#mainCarousel .carousel-control:hover {color:#f52929;}
#mainCarousel .carousel-control:focus {color:#f52929;}
#mainCarousel .carousel-control.right {background-image:none; right:20px;}
#mainCarousel .carousel-control.left  {background-image:none; left:20px;}

.carousel-fade .carousel-inner .item {
	opacity:0; 
	-webkit-transition-property:opacity;
	-moz-transition-property:opacity;
	-o-transition-property:opacity;
  	transition-property:opacity;
}
.carousel-fade .carousel-inner .active {opacity:1;}
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {left:0; opacity:0; z-index:1;}
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {opacity:1;}
.carousel-fade .carousel-control {z-index:2;}

#mainCarousel .fix-caption {
	position:absolute; left:0; right:0; top:200px; z-index:9999; font-size:22px;
	color:#ffffff; text-shadow:0 1px 2px rgba(0, 0, 0, 0.6); text-align:left;
}
#mainCarousel .fix-caption h1 {font-size:60px; color:#FFF; margin:0; font-weight:800;}
#mainCarousel .fix-caption h2 {font-size:36px; font-weight:500; color:#f52929;}
#mainCarousel .fix-caption .btn-danger {min-width:260px; border-radius:60px;}


    .quick_calculate h3 {
        background-color: #d2000a;
        color: #FFF;
        text-align: center;
        padding: 15px 0;
        margin: 0;
        font-size: 26px;
        font-weight: 700;
    }
    .quick_calculate form {
        padding: 5px 20px 0px 20px;
        text-shadow: none;
        color: #111;
        text-shadow: 0 1px 1px rgba(225,225,225,0.6);
    }
	
@media (min-width:421px){
	 .quick_calculate {
		 background-color:rgba(255,255,255,0.6);
	     margin-right:50px;}
}



@media (max-width:420.98px){ 
  .quick_calculate {
    background-color: rgba(255,255,255,0.6);
    margin-right: 0;
   }
   #mainCarousel.carousel {
    height: 100%;
    background-color: #04080e;
    min-height: 690px;
  }
}


@media (max-width:767px)
{
	#mainCarousel.carousel {
    height: auto;
    background-color: #04080e;
    min-height: 710px;
    }
 
    #mainCarousel .carousel-inner {
    height: 100%;
    z-index: 99;
    min-height: 710px;
    }
	
	
}