html, body {
	height:100%;
}

.carousel,
.item,
.active {
	height:100%;
}

.carousel-inner {
	height:100%;
}

.fill {
	width:100%;
	height:100%;
	background-position: center;
	background-size: cover;
}

.section {
	margin: 50px 0;
}

footer {
	margin: 50px 0;
}

.carousel {
	/* keeps this behind all content */ 
	z-index: -99;
}

.carousel .item {
	position: fixed; 
	opacity: 0;
	left:0 !important;
	width: 100%; height: 100%;
	-webkit-transition: opacity 3s;
	-moz-transition: opacity 3s;
	-ms-transition: opacity 3s;
	-o-transition: opacity 3s;
	transition: opacity 3s;
}

.carousel .active {
	opacity: 1 !important;
	-webkit-transition: opacity 3s  !important;
	-moz-transition: opacity 3s  !important;
	-ms-transition: opacity 3s  !important;
	-o-transition: opacity 3s  !important;
	transition: opacity 3s  !important;
}

.carousel .item.active.left {
	opacity: 0 !important;
	-webkit-transition: opacity 5s  !important;
	-moz-transition: opacity 5s  !important;
	-ms-transition: opacity 5s  !important;
	-o-transition: opacity 5s  !important;
	transition: opacity 5s  !important;
}

.carousel .item.next.left {
	opacity: 1 !important;
	-webkit-transition: opacity 3s  !important;
	-moz-transition: opacity 3s  !important;
	-ms-transition: opacity 3s  !important;
	-o-transition: opacity 3s  !important;
	transition: opacity 3s  !important;
}