@charset "utf-8";
/* CSS Document */
html{
	height:100%;	
}

body{
  padding-top: 85px; /* 60px to make the container go all the way to the bottom of the topbar */
	height:100%;
	font-family: Montserrat;
}
	  
/* Gradient transparent - color - transparent */
hr.hr-style {
    border: 0;
    border-bottom: 1px dashed #ccc;
    background: #999;
}

.text-cream{
  color: #fffff0;
}

.btn-extend-width{
  padding: 10px 30px 10px 30px;
}

/* TYPOGRAPHY STYLIN
----------------------------------------*/
  
  .span12,.span11,.span10,.span9,.span8 p{
    line-height: 1.8;
  }

  .span6,.span5,.span4 p{
    line-height: 1.6;
  }
  .span3,.span2,.span1 p{
    line-height: 1.4;
  }

 /* CUSTOMIZE THE NAVBAR
    -------------------------------------------------- */

    /* Remove border and change up box shadow for more contrast */
    .navbar .navbar-inner {
      border: 0;
      -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.25);
      -moz-box-shadow: 0 2px 10px rgba(0,0,0,.25);
      box-shadow: 0 2px 10px rgba(0,0,0,.25);
    }
  	
  	.nav{
  		padding-top:16px;
  	}
  	
  	.logo img{
  		max-width: 30%;
  		min-height: 48px;
  		min-width: 182px;
  		float:left;
  		margin: auto;
  	}

      /* Offset the responsive button for proper vertical alignment */
      .navbar .btn-navbar {
        margin-top: 10px;
      }
  	
  	/* Styles for Footer */
  	footer{
  		/*font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;*/
  		font-size: 0.75em;
  		font-weight: normal;
  		line-height: 1.6;
  		color: #333333;
  	}

    .product-display{
    	padding-bottom: 10px;
    	line-height: 1;
    }

    .product-display .description{
    	padding:10px;
    }

    .product-display .more-info a{
    	margin-top:15px;
    }
	
/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */
    /* Carousel base class */
    .carousel {
      margin-bottom: 10px;
      margin-top: -10px;
      -webkit-box-shadow: 0 2px 10px rgba(0,0,0,0.45);
         -moz-box-shadow: 0 2px 10px rgba(0,0,0,0.45);
              box-shadow: 0 2px 10px rgba(0,0,0,0.45);
    }

    .carousel .container {
      position: relative;
      z-index: 9;
    }

    .carousel-control {
      height: 30px;
      margin-top: 0;
      font-size: 80px;
      text-shadow: 0 1px 1px rgba(0,0,0,0.4);
      background-color: transparent;
      border: 0;
      z-index: 10;
    }

    .carousel .item {
      width: auto;
      height:  200px;
    }
    
    .carousel img {
      position: absolute;
      left: 0;
      min-width:100%;
    }

    .carousel-caption {
    	background-color: transparent; /*rgba(255,255,255,0.2);*/
      float:left;
    	max-width: 350px;
    	padding: 0 65px;
      margin-bottom: 40px;
    }

    .carousel-caption h2,
    .carousel-caption .lead {
      margin: 0;
      line-height: 1.1;
      color: #fff;
      text-shadow: 0 2px 2px rgba(0,0,0,0.4);
      /* padding-left: 1em; 16*1.5 = 24*/
    }
    .carousel-caption a:hover {
      text-decoration: none;
      color: #2F96B4;
    }

    /*Site Banner Styles*/
    .site-banner{
      display: block;
      position:relative;
      margin-top: 20px;
      margin-bottom: 20px;
      width:100%;
      height:200px;
      overflow:hidden;
      background-color:#fffff0;
    }

    .site-banner-text{
      display: block;
      position: relative;
      float: left;
      max-width: 20%;
      min-width: 90px;
      margin-left: 10px;
    }

    .site-banner-text p{
      font-size: 18px;
      text-transform: capitalize;
      font-family: Montserrat;
      color: #333);
    }

    .site-banner img{
      max-width:75%;
      height: inherit;
    }
    /*End*/

/* CSS TRANSITIONS */

.fade {
  opacity: 0.7;
  transition: opacity .25s ease-in-out;
  -moz-transition: opacity .25s ease-in-out;
  -webkit-transition: opacity .25s ease-in-out;
}


/* RESPONSIVE CSS
    -------------------------------------------------- */
  @media (max-width: 1200px){
        p.showcase-wrapper{
          font-size: 1em;
        }
        .carousel img {
          height: inherit;
        }

        .site-banner img{
          float:left;
          max-width: 70%;
        }

        .site-banner-text p{
           font-size: 18px;
         }
      }
    @media (max-width: 979px) {
      .carousel .item {
        height: 200px;
      }
      .carousel img {
        width: auto;
        height: inherit;
      }

      .carousel-caption h2 {
        font-size: 1.6em;
      }

      p.showcase-wrapper{
        font-size: 16;
        line-height: 1.6;
      }
      .site-banner img{
        max-width: 65%;
      }

      .site-banner-text{
        max-width:10%;
      }

      .site-banner-text p{
         font-size: 16px;
       }
    }


    @media (max-width: 767px) {
      .carousel {
        margin-left: -20px;
        margin-right: -20px;
      }

      .carousel .item {
        height: 150px
      }
      .carousel-caption h2 {
        font-size: 2em;
      }
      .carousel-caption .lead
      .carousel-caption .btn {
        font-size: 1em;
      }

      .site-banner img{
        float:left;
        max-width: 75%;
      }

      .site-banner-text p{
         font-size: 20px;
       }

    }

    /*@media (max-width: 1000px){
      .carousel .item {
        height: 26em;
      }
      .carousel-caption h1 {
        font-size: 2em;
      }
      .carousel-caption {
        width: 65%;
        padding: 0 70px;
        margin-top: 120px;
      }
    }*/

   @media (max-width: 480px){
   	body{
   		padding-top: 0;
   	}

    p.showcase-wrapper{
        font-size: 1em;
      }

    .fade {
      opacity: 1;
    }

    .carousel .item {
      height: 180px;
      overflow: hidden;
    }
    
    .carousel-caption h2 {
      font-size: 1.2em;
      position:relative;
    }
    
    .carousel-control {
      height: 30px;
      margin-top: 0;
      font-size: 40px;
      text-shadow: 0 1px 1px rgba(0,0,0,0.4);
      background-color: transparent;
      border: 0;
      z-index: 10;
    }

    .span12,.span11,.span10,.span9,.span8 p{
      line-height: 1.35;
    }

    .span6,.span5,.span4 p{
      line-height: 1.35;
    }
    .span3,.span2,.span1 p{
      line-height: 1.35;
    }

      .site-banner img{
        max-width:70%;
        height:100%;
        float:left;
        overflow:hidden;
      }
      .site-banner-text{
        max-width: 15%;
      }

      .site-banner-text p{
         font-size: 16px;
       }
  }