﻿.carousel-caption h3{
	color:#efefef;
}


/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
  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;
}
.navbar-wrapper .navbar .container {
  width: auto;
}


/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
   background-color:#0a3e6e;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
	font-family:'Segoe', Arial, Helvetica, sans-serif;
	color:#f2f2ed;
	bottom:20px;
	padding: 0px 10px 10px 0;
	text-align:left;
	background-color:#032240;
	opacity: 0.87;
	height:35%;
	width:80% !important;
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
   background-color: #777;
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  
}

/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 768px) {

  /* Navbar positioning foo */
  .navbar-wrapper {
    margin-top: 0px;
  }
  .navbar-wrapper .container {
    padding-right: 15px;
    padding-left: 15px;
  }
  .navbar-wrapper .navbar {
    padding-right: 0;
    padding-left: 0;
  }

  /* The navbar becomes detached from the top, so we round the corners */
  .navbar-wrapper .navbar {
    border-radius: 0px;
  }

  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 20px;
    font-size: 21px;
    line-height: 1.4;
  }

}

.img-responsive, .thumbnail>img, .thumbnail a>img, .carousel-inner>.item>img, .carousel-inner>.item>a>img {
	display: block;
	max-width: 100%;
	height: auto
}

@media (min-width:768px) {
.lead {
	font-size: 21px
}
}


.btn-primary {
	padding: 8px 14px;
	font-size: 12px;
	border-radius: 4px;
	color: #428bca;
	background-color: #f2f2ed;
}
a.btn-primary {
	color: #428bca;
	background-color: #f2f2ed;
}
.btn-primary:hover {
	color: #f2f2ed;
	background-color: #428bca;
	text-decoration: none;
}


@font-face {
	font-family: 'Glyphicons Halflings';
	src: url('../fonts/glyphicons-halflings-regular.eot');
	src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg')
}
.glyphicon {
	position: relative;
	top: 1px;
	display: inline-block;
	font-family: 'Glyphicons Halflings';
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}
.glyphicon-chevron-left:before {
	content: "\e079"
}
.glyphicon-chevron-right:before {
	content: "\e080"
}




/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
}
/* 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: 400px;
  width: 900px;
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  width: 900px;
}


/* 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: 5px;

}
.marketing h2 {
  font-weight: normal;
}
.marketing .col-lg-4 p {
  margin-right: 10px;
  margin-left: 10px;
}
.space {
  margin-right: 10px;
  width: 115px;
  height: 79px;
}

/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 768px) {

  /* Remove the edge padding needed for mobile */
  .marketing {
    padding-right: 0;
    padding-left: 0;
  }

  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 15px;
    font-size: 19px;
    line-height: 1.4;
  }



.carousel {
	position: relative;
}
.carousel-inner {
    width:900px;
    margin: 0 auto;
    background-size: contain;
	overflow: hidden;
	position:relative;
}
.carousel-inner>.item {
	display: none;
	position: relative;
	-ms-transition: left 4s ease-in-out;
	-moz-transition: left 4s ease-in-out;
	-webkit-transition: left 4s ease-in-out;
	transition: left 4s ease-in-out;
}
.carousel-inner>.item>img, .carousel-inner>.item>a>img {
	line-height: 1
}
.carousel-inner>.active, .carousel-inner>.next, .carousel-inner>.prev {
	display: block;
}

.carousel-inner>.next, .carousel-inner>.prev {
	position: absolute;
	top: 0;
	width: 900px
}

.carousel-inner>.active {
	left: 0
}

.carousel-inner>.next {
	left: 100%
}
.carousel-inner>.prev {
	left: -100%
}
.carousel-inner>.next.left, .carousel-inner>.prev.right {
	left: 0
}
.carousel-inner>.active.left {
	left: -100%
}
.carousel-inner>.active.right {
	left: 100%
}

.carousel-control {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 20%;
	opacity: .5;
	filter: alpha(opacity=50);
	font-size: 20px;
	color: #fff;
	text-align: center;
	text-shadow: 0 1px 2px rgba(0,0,0,0.6)
}
.carousel-control.left {
	color: #fff;
	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)
}
.carousel-control.right {
	left: auto;
	color: #fff;
	right: 0;
	background-image: -webkit-linear-gradient(left, color-stop(rgba(0,0,0,0.0001) 0), color-stop(rgba(0,0,0,0.5) 100%));
	background-image: linear-gradient(to right, rgba(0,0,0,0.0001) 0, rgba(0,0,0,0.5) 100%);
	background-repeat: repeat-x;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1)
}
.carousel-control:hover, .carousel-control:focus {
	outline: none;
	color: #fff;
	text-decoration: none;
	opacity: .9;
	filter: alpha(opacity=90)
}
.carousel-control .icon-prev, .carousel-control .icon-next, .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right {
	position: absolute;
	top: 50%;
	z-index: 5;
	display: inline-block
}
.carousel-control .icon-prev, .carousel-control .glyphicon-chevron-left {
	left: 50%
}
.carousel-control .icon-next, .carousel-control .glyphicon-chevron-right {
	right: 50%
}
.carousel-control .icon-prev, .carousel-control .icon-next {
	width: 20px;
	height: 20px;
	margin-top: -10px;
	margin-left: -10px;
	font-family: serif
}
.carousel-control .icon-prev:before {
	content: '\2039'
}
.carousel-control .icon-next:before {
	content: '\203a'
}
.carousel-indicators {
	position: absolute;
	bottom: 10px;
	left: 50%;
	z-index: 15;
	width: 60%;
	margin-left: -30%;
    padding-right: 10px;
	list-style: none;
	text-align: right
}
.carousel-indicators li {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 1px;
	text-indent: -999px;
	border: 1px solid #f2f2ed;
	border-radius: 10px;
	cursor: pointer;
	background-color: #000 \9;
	background-color: rgba(0,0,0,0)
}
.carousel-indicators .active {
	margin: 0;
	width: 14px;
	height: 14px;
	background-color: #f2f2ed;
}
.carousel-caption {
	font-family: Arial, Helvetica, sans-serif;
	color: #f2f2ed;
	position: absolute;
	bottom: 20px;
	padding-left: 10px;
	padding-bottom: 10px;
	text-align: left;
	background-color: #032240;
	-khtml-opacity:.87; 
    -moz-opacity:.87; 
    -webkit-opacity: .87;
    -ms-filter:â€alpha(opacity=87)â€;
    filter:alpha(opacity=87);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.87);
    opacity:.87;
	height: 35%;
	width: 80%;
}
@media screen and (min-width:768px) {
.carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-prev, .carousel-control .icon-next {
	width: 20px;
	height: 20px;
	margin-top: -15px;
	margin-left: -15px;
	font-size: 30px
}
.carousel-caption {
	left: 20%;
	right: 20%;
	width:720px;
}
.carousel-indicators {
	bottom: 20px
}
}
@-ms-viewport {
width:device-width
}
.visible-xs, .visible-sm, .visible-md, .visible-lg {
	display: none !important
}
@media (max-width:767px) {
.visible-xs {
	display: block !important
}
table.visible-xs {
	display: table
}
tr.visible-xs {
	display: table-row !important
}
th.visible-xs, td.visible-xs {
	display: table-cell !important
}
}
@media (min-width:768px) and (max-width:991px) {
.visible-sm {
	display: block !important
}
table.visible-sm {
	display: table
}
tr.visible-sm {
	display: table-row !important
}
th.visible-sm, td.visible-sm {
	display: table-cell !important
}
}
@media (min-width:992px) and (max-width:1199px) {
.visible-md {
	display: block !important
}
table.visible-md {
	display: table
}
tr.visible-md {
	display: table-row !important
}
th.visible-md, td.visible-md {
	display: table-cell !important
}
}
@media (min-width:1200px) {
.visible-lg {
	display: block !important
}
table.visible-lg {
	display: table
}
tr.visible-lg {
	display: table-row !important
}
th.visible-lg, td.visible-lg {
	display: table-cell !important
}
}
@media (max-width:767px) {
.hidden-xs {
	display: none !important
}
}
@media (min-width:768px) and (max-width:991px) {
.hidden-sm {
	display: none !important
}
}
@media (min-width:992px) and (max-width:1199px) {
.hidden-md {
	display: none !important
}
}
@media (min-width:1200px) {
.hidden-lg {
	display: none !important
}
}
.visible-print {
	display: none !important
}
@media print {
.visible-print {
	display: block !important
}
table.visible-print {
	display: table
}
tr.visible-print {
	display: table-row !important
}
th.visible-print, td.visible-print {
	display: table-cell !important
}
}
@media print {
.hidden-print {
	display: none !important
}
}
