/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body									{ color: #5a5a5a; }



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

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper							{ /*position: absolute; */ position: relative; top: 0; right: 0; left: 0; z-index: 20;}

/* Flip around the padding for proper display in narrow viewports */
.navbar-wrapper .container				{ padding-right: 0; padding-left: 0; }
.navbar-wrapper .navbar					{ padding-right: 15px; padding-left: 15px; }


/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  height: 500px;
  margin-bottom: 60px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item															{ height: 500px; background-color: #FFF; }
.carousel-inner > .item > img											{ position: absolute; top: 0; left: 0; min-width: 100%; height: 500px; }

.carousel .carousel-control												{ visibility: hidden; background: none; }
.carousel:hover .carousel-control { visibility: visible; }


.feature-shadow															{ box-shadow: 0px 3px 3px #CCCCCC; }
.feature-shadow-rev														{ box-shadow: 0px 0px 3px #CCCCCC; }

/* MARKETING CONTENT
-------------------------------------------------- */

/* Pad the edges of the mobile views a bit */
.marketing {
  padding-right: 15px;
  padding-left: 15px;
}

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 20px;
  text-align: center;
}
.marketing h2 {
  font-weight: normal;
}
.marketing .col-lg-4 p {
  margin-right: 10px;
  margin-left: 10px;
}


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 20px 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  letter-spacing: -1px;
}


/* FADE-IN INTRO */

/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
 
.fade-in-quick {
    opacity:0;
	-webkit-animation:fadeIn ease-in 1; 
    -moz-animation:fadeIn ease-in 1;
    animation:fadeIn ease-in 1;
 
    -webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
 
    -webkit-animation-duration:0.1s;
    -moz-animation-duration:0.1s;
    animation-duration:0.1s;
}

.fade-in {
    opacity:0;
	-webkit-animation:fadeIn ease-in 1; 
    -moz-animation:fadeIn ease-in 1;
    animation:fadeIn ease-in 1;
 
    -webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
 
    -webkit-animation-duration:0.55s;
    -moz-animation-duration:0.55s;
    animation-duration:0.55s;
}
 
.fade-in.one {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
animation-delay: 0.7s;
}
 
.fade-in.two {
-webkit-animation-delay: 1.7s;
-moz-animation-delay: 1.7s;
animation-delay: 1.7s;
}

.fade-in.three {
-webkit-animation-delay: 3.1s;
-moz-animation-delay: 3.1s;
animation-delay: 3.1s;
}

.fade-in.beta {
-webkit-animation-delay: 4.1s;
-moz-animation-delay: 4.1s;
animation-delay: 4.1s;
}

.fade-in.dot {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
animation-delay: 0.7s;
}
 

}

/* FADE IN INTRO END */