/* ==========================================================================
   Big Hero
   ========================================================================== */

#big-hero .container {
	padding-top: 100px;
	padding-bottom: 100px;
	text-shadow: 1px 1px rgba(0,0,0,0.25);
}


/* ==========================================================================
   Image Slider
   ========================================================================== */

/* ==========================================
      
	.inverter - reverses color scheme and makes caption text black on white
	.fadeout - slides fade away rather than move right to left
	.bouncy - captions jiggle when they pop into the slide, do not use with animate.css effects
	.leftCaption - left aligns any captions within the container & can be used on entire slider or specific slide 
	.centerCaption - places captions in the center
	.hugeCaption - makes captions much bigger
	.whiteboxedCaption - turns caption text black and adds a white semi-transparent background
	.lesstextShadow - reduces shadow on the text captions

	.arrowControls - standard arrows
   	.chevronControls - bootstrap default parenthesis style
   	.boxedControls - small arrows with a box around them
   	.bigControls - makes the glyphicons larger
   	.shadowlessControls - works with any of the utensils above, simply removing the shadow
   	.nonmobileControls - hides controls under 992px wide
   	.noControls - no controller icon or shadow
   	.leftPagination - moves the pagination circles to the left
   	.rightPagination - moves the pagination circles to the right
   
   
   ========================================== */

#image-slider-wrap {
	text-align: center;
	background-color: #eee;
	background: linear-gradient(to bottom, #fff, #fff, #ddd);
	overflow: hidden;
}

#image-slider, #image-slider .item {
	height: 500px;
	width: 100%;
}

#image-slider .carousel-inner {
	width: 100%;
	height: 500px;
	max-width: 1570px;
	display: block;
	margin: 0 auto;
}

/* ==========================================
   image Slider Captions
   ========================================== */
   
#image-slider .image-slider-caption {
	position: absolute;
	bottom: 12%;
	right: 11%;
	color: #fff;
	text-shadow: 0 0 3px #000, 0 0 10px #000;
	min-width: 30%;
	max-width: 78%;
	padding-bottom: 5px;
	border-radius: 5px;
}

#image-slider .image-slider-caption p {
	margin-bottom: 4px;
}

/* ==========================================
   image Slider Controls
   ========================================== */

#image-slider .carousel-control {
	width: 10%;
}

#image-slider .carousel-control .glyphicons {
	top: 49%;
	position: absolute;
	display: block;
	margin: 0 auto;
	left: 10%;
	right: 10%;
	width: 80%;
	text-align: center;
	color: #fff;
}

#image-slider .carousel-indicators {
	width: 80%;
	right: 10%;
	left: 10%;
	bottom: 2%;
	margin: 0;
	padding: 0;
}

#image-slider .carousel-indicators li {
	height: 8px;
	width: 8px;
	border-radius: 50%;
	box-shadow: 0 0 6px rgba(0,0,0,0.35);
	-moz-transition: 0.2s all ease-in-out;
	-webkit-transition: 0.2s all ease-in-out;
	-o-transition: 0.2s all ease-in-out;
	transition: 0.2s all ease-in-out;
}

#image-slider .carousel-indicators li:hover {
	height: 10px;
	width: 10px;
}

#image-slider .carousel-indicators .active {
	height: 12px !important;
	width: 12px !important;
	background: #fff !important;
	border-color: #fff !important;
}

/* ==========================================
   image Slider Sauces
   ========================================== */

/* ==================
   inverter
   ================== */

.inverter#image-slider-wrap {
	background-color: #222;
	background: linear-gradient(to bottom, #111, #444, #111);
}

.inverter #image-slider .image-slider-caption {
	color: #000;
	text-shadow: 0 0 15px #fff;
}

.inverter #image-slider .carousel-indicators li {
	box-shadow: 0 3px 3px rgba(255,255,255, 0.3) inset, 0 0 6px rgba(255,255,255,0.35);
	color: #000;
	border-color: #000;
}

.inverter #image-slider .carousel-indicators .active {
	background: #000 !important;
	border-color: #000 !important;
}

.inverter #image-slider .carousel-control .glyphicons {
	color: #000;
	text-shadow: 0 0 28px rgba(255,255,255,0.5);
}

/* ==================
   whiteboxedCaption
   ================== */

.whiteboxedCaption #image-slider .image-slider-caption, #image-slider .whiteboxedCaption .image-slider-caption, .whiteboxedCaption#image-slider .image-slider-caption {
	color: #000;
	text-shadow: 0 0 15px #fff;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
	background-color: #fff;
	background: rgba(255,255,255,0.5);
	background: linear-gradient(to right, rgba(255,255,255,0.8), rgba(255,255,255,0.95), rgba(255,255,255,0.95), rgba(255,255,255,0.8));
}

/* ==================
   lesstextShadow
   ================== */

.lesstextShadow #image-slider .image-slider-caption, #image-slider .lesstextShadow .image-slider-caption, .lesstextShadow#image-slider .image-slider-caption {
	text-shadow: 0 0 3px rgba(0,0,0,0.15);
}

/* ==================
   fadeout
   ================== */

.fadeout .carousel .carousel-inner > .item {
  position: absolute;
  left: 0 !important;
  opacity: 0;
  -moz-transition: .75s ease-in-out opacity;
  -webkit-transition: .75s ease-in-out opacity;
  -o-transition: .75s ease-in-out opacity;
  transition: .75s ease-in-out opacity;
}

.fadeout .carousel .carousel-inner > .active, .fadeout .carousel .carousel-inner > .next.left {
    opacity: 1;
}

.fadeout .carousel .carousel-inner > .next, .fadeout .carousel .carousel-inner > .active.left {
    opacity: 0;
}

/* ==================
   bouncy
   ================== */

.bouncy #image-slider .image-slider-caption {
  	bottom: -50%;
  	opacity: 0;
}

.bouncy #image-slider .active .image-slider-caption {
  	bottom: 12%;
  	opacity: 1;
  	-webkit-animation: bouncy 0.75s ease-in-out;
	-moz-animation: bouncy 0.75s ease-in-out;
	-o-animation: bouncy 0.75s ease-in-out;
	animation: bouncy 0.75s ease-in-out;
}

	@-webkit-keyframes bouncy {
		0% { bottom: -50%; opacity: 0; }
		82% { bottom: 13.5%; }
		92% { bottom: 9.5%; }
		100% { bottom: 12%; opacity: 1; }
	}
	
   	@-moz-keyframes bouncy {
		0% { bottom: -50%; opacity: 0; }
		82% { bottom: 13.5%; }
		92% { bottom: 9.5%; }
		100% { bottom: 12%; opacity: 1; }
	}
   	
	@-o-keyframes bouncy {
		0% { bottom: -50%; opacity: 0; }
		82% { bottom: 13.5%; }
		92% { bottom: 9.5%; }
		100% { bottom: 12%; opacity: 1; }
	}
   	
	@keyframes bouncy {
		0% { bottom: -50%; opacity: 0; }
		82% { bottom: 13.5%; }
		92% { bottom: 9.5%; }
		100% { bottom: 12%; opacity: 1; }
	}

/* ==================
   leftCaption
   ================== */

#image-slider.leftCaption .image-slider-caption, .leftCaption #image-slider .image-slider-caption, #image-slider .leftCaption .image-slider-caption, #image-slider .leftCaption.image-slider-caption {
  	left: 11%;
  	right: auto;
}

/* ==================
   centerCaption
   ================== */

#image-slider.centerCaption .image-slider-caption, .centerCaption #image-slider .image-slider-caption, #image-slider .centerCaption .image-slider-caption, #image-slider .centerCaption.image-slider-caption {
  	left: 11%;
  	width: 78%;
}

/* ==================
   hugeCaption
   ================== */

#image-slider.hugeCaption .image-slider-caption, .hugeCaption #image-slider .image-slider-caption, #image-slider .hugeCaption .image-slider-caption, #image-slider .hugeCaption.image-slider-caption {
  	font-size: 300%;
}

/* ==================
   whitefadedsides
   ================== */  
   
#image-slider.whitefadedsides .carousel-control.left, .whitefadedsides #image-slider .carousel-control.left, #image-slider .whitefadedsides .carousel-control.left, #image-slider .whitefadedsides.carousel-control.left {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000',endColorstr='#00000000',GradientType=1);
    background-image: -webkit-gradient(linear,0 top,100% top,from(rgba(255,255,255,0.5)),to(rgba(255,255,255,0.0001)));
    background-image: -webkit-linear-gradient(left,color-stop(rgba(255,255,255,0.5) 0),color-stop(rgba(255,255,255,0.0001) 100%));
    background-image: -moz-linear-gradient(left,rgba(255,255,255,0.5) 0,rgba(255,255,255,0.0001) 100%);
    background-image: linear-gradient(to right,rgba(255,255,255,0.5) 0,rgba(255,255,255,0.0001) 100%);
    background-repeat: repeat-x;
}

#image-slider.whitefadedsides .carousel-control.right, .whitefadedsides #image-slider .carousel-control.right, #image-slider .whitefadedsides .carousel-control.right, #image-slider .whitefadedsides.carousel-control.right {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000',endColorstr='#80000000',GradientType=1);
    background-image: -webkit-gradient(linear,0 top,100% top,from(rgba(255,255,255,0.0001)),to(rgba(255,255,255,0.5)));
    background-image: -webkit-linear-gradient(left,color-stop(rgba(255,255,255,0.0001) 0),color-stop(rgba(255,255,255,0.5) 100%));
    background-image: -moz-linear-gradient(left,rgba(255,255,255,0.0001) 0,rgba(255,255,255,0.5) 100%);
    background-image: linear-gradient(to right,rgba(255,255,255,0.0001) 0,rgba(255,255,255,0.5) 100%);
    background-repeat: repeat-x;
}

/* ==========================================
   image Slider Utensils
   ========================================== */

/* ==================
   arrowControls
   ================== */  

#image-slider.arrowControls .carousel-control.left .glyphicons:before, .arrowControls #image-slider .carousel-control.left .glyphicons:before, #image-slider .arrowControls .carousel-control.left .glyphicons:before {
    content: "\E211";
}

#image-slider.arrowControls .carousel-control.right .glyphicons:before, .arrowControls #image-slider .carousel-control.right .glyphicons:before, #image-slider .arrowControls .carousel-control.right .glyphicons:before {
	content: "\E212";
}

/* ==================
   chevronControls
   ================== */  

#image-slider.chevronControls .carousel-control.left .glyphicons:before, .chevronControls #image-slider .carousel-control.left .glyphicons:before, #image-slider .chevronControls .carousel-control.left .glyphicons:before {
    content: "\E225";
}

#image-slider.chevronControls .carousel-control.right .glyphicons:before, .chevronControls #image-slider .carousel-control.right .glyphicons:before, #image-slider .chevronControls .carousel-control.right .glyphicons:before {
	content: "\E224";
}

/* ==================
   boxedControls
   ================== */  

#image-slider.boxedControls .carousel-control.left .glyphicons, .boxedControls #image-slider .carousel-control.left .glyphicons, #image-slider .boxedControls .carousel-control.left .glyphicons {
	-moz-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
	filter: FlipH;
	-ms-filter: "FlipH";
}

#image-slider.boxedControls .carousel-control.left .glyphicons:before, .boxedControls #image-slider .carousel-control.left .glyphicons:before, #image-slider .boxedControls .carousel-control.left .glyphicons:before {
    content: "\E369";
}

#image-slider.boxedControls .carousel-control.right .glyphicons:before, .boxedControls #image-slider .carousel-control.right .glyphicons:before, #image-slider .boxedControls .carousel-control.right .glyphicons:before {
	content: "\E369";
}

/* ==================
   shadowlessControls
   ================== */  

#image-slider.shadowlessControls .carousel-control span, #image-slider.shadowlessControls .carousel-control.right, #image-slider.shadowlessControls .carousel-control.left, .shadowlessControls #image-slider .carousel-control span, .shadowlessControls #image-slider .carousel-control.right, .shadowlessControls #image-slider .carousel-control.left, #image-slider .shadowlessControls .carousel-control span, #image-slider .shadowlessControls .carousel-control.right, #image-slider .shadowlessControls .carousel-control.left {
	background-image: none;
}

/* ==================
   bigControls
   ================== */  

#image-slider.bigControls .carousel-control, .bigControls #image-slider .carousel-control, #image-slider .bigControls .carousel-control {
	font-size: 200%;
}

/* ==================
   leftPagination
   ================== */  

#image-slider.leftPagination .carousel-indicators, .leftPagination #image-slider .carousel-indicators, #image-slider .leftPagination .carousel-indicators {
	text-align: left;
}

/* ==================
   rightPagination
   ================== */  

#image-slider.rightPagination .carousel-indicators, .rightPagination #image-slider .carousel-indicators, #image-slider .rightPagination .carousel-indicators {
	text-align: right;
}

/* ==========================================================================
   Media Queries
   ========================================================================== */


@media (min-width: 1500px) {
	#image-slider .carousel-indicators {
		max-width: 1400px;
	}
}

@media (max-width: 1499px) {

	#image-slider, #image-slider .item, #image-slider .carousel-inner {
		height: 450px;
	}

}

@media (min-width: 1200px) { 

}

@media (max-width: 1199px) {

	#image-slider, #image-slider .item, #image-slider .carousel-inner {
		height: 400px;
	}

	#image-slider.hugeCaption .image-slider-caption, .hugeCaption #image-slider .image-slider-caption, #image-slider .hugeCaption .image-slider-caption, #image-slider .hugeCaption.image-slider-caption {
		font-size: 250%;
	}

}

@media (min-width: 992px) { 

	#big-hero .container {
		padding-top: 200px;
		padding-bottom: 200px;
		font-size: 150%;
	}

}

@media (max-width: 991px) {

	#image-slider, #image-slider .item, #image-slider .carousel-inner {
		height: 350px;
	}

	#image-slider.hugeCaption .image-slider-caption, .hugeCaption #image-slider .image-slider-caption, #image-slider .hugeCaption .image-slider-caption, #image-slider .hugeCaption.image-slider-caption {
		font-size: 200%;
	}
	
	#image-slider.nonmobileControls .carousel-control, .nonmobileControls #image-slider .carousel-control, #image-slider .nonmobileControls .carousel-control {
		display: none;
	}

}

@media (min-width: 768px) {

	#image-slider.hugeCaption .image-slider-caption .btn, .hugeCaption #image-slider .image-slider-caption .btn, #image-slider .hugeCaption .image-slider-caption .btn, #image-slider .hugeCaption.image-slider-caption .btn {
		font-size: 150%;
		padding: 10px 16px;
		font-size: 18px;
		line-height: 1.33;
		border-radius: 6px;
	}

}

@media (max-width: 767px) {

	#image-slider, #image-slider .item, #image-slider .carousel-inner {
		height: 250px;
	}

	#image-slider.hugeCaption .image-slider-caption, .hugeCaption #image-slider .image-slider-caption, #image-slider .hugeCaption .image-slider-caption, #image-slider .hugeCaption.image-slider-caption {
		font-size: 100%;
	}
}