html, body
{
	height:			100%;
	width:			100%;
	font-family:	'Carme', sans-serif;
	color:			#999999;
    text-shadow: 1px 1px #000000;
}

body
{
	background: #0E0301 url( ../images/background-brown.jpg ) repeat;
}

.navbar-brand
{
	font-family:		'Alex Brush', cursive;
	color:				#f5d183 !important;
    text-shadow: 1px 1px #000000;
}

nav.nav-static
{
	margin-top:	-50px;
}

.header-image
{
	background:			url(../images/background.jpg) repeat 50% -3px fixed transparent;
	background-size:	cover;
	height:				100%;
	display:			block;
	width:				100%;
	text-align:			center;
}

#parallax-1,
#parallax-2,
#parallax-3,
#parallax-4,
#parallax-5
{
	background:			url(../images/background001.jpg) repeat 50% -3px fixed transparent;
	height:				60%;
	width:				100%;
	display:			block;
	margin:				50px 0;
	box-shadow:			inset 0px 0px 50px black;
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	filter: url(/assets/svg/grayscale.svg);
	filter: gray;
}

#parallax-2
{
	background:			url(../images/background002.jpg) repeat 50% -3px fixed transparent;
}

#parallax-3
{
	background:			url(../images/background003.jpg) repeat 50% -3px fixed transparent;
}

#parallax-4
{
	background:			url(../images/background004.jpg) repeat 50% -3px fixed transparent;
}

#parallax-5
{
	background:			url(../images/background005.jpg) repeat 50% -3px fixed transparent;
}

.headline
{
	padding: 120px 0;
}

.headline > .container > h1
{
	position:		absolute;
	font-size:		150px;
	font-family:	'Alex Brush', cursive;
	color:			#f5d183;
	text-shadow:	1px 1px 5px #571d45;
	bottom:			250px;
	left:			0;
	width:			100%;
}

.headline > .container > h2
{
	font-size:		40px;
	font-family:	'Raleway', cursive;
	position:		absolute;
	bottom:			200px;
	left:			0;
	width:			100%;
	color:			#f5d183;
	text-shadow:	1px 1px 5px #571d45;
	letter-spacing:	5px;
}

h1, h2, h3, h4
{
	font-family:	'Alex Brush', cursive;
	color:			#f5d183;
    text-shadow: 1px 1px #000000;
}

h1
{
	font-size:		77px;
}

.img-circle
{
	border: solid 2px #f5d183;
}

.featurette-divider
{
	margin: 80px 0;
}
.featurette
{
	overflow: hidden;
}

.featurette-image.pull-left
{
	margin-right: 40px;
}
.featurette-image.pull-right
{
	margin-left: 40px;
}

.featurette-heading
{
	font-size: 50px;
}

footer
{
	margin: 50px 0;
}

/* RESPONSIVE CSS */

@media (max-width: 1200px)
{

	.headline > .container > h1
	{
		font-size: 140px;
	}
	.headline > .container > h2
	{
		font-size: 63px;
	}
	.featurette-divider
	{
		margin: 50px 0;
	}
	.featurette-image.pull-left
	{
		margin-right: 20px;
	}
	.featurette-image.pull-right
	{
		margin-left: 20px;
	}
	.featurette-heading
	{
		font-size: 77px;
	}

}

@media (max-width: 991px)
{

	.headline > .container > h1
	{
		font-size: 105px;
	}
	.headline > .container > h2
	{
		font-size: 50px;
	}
	.featurette-divider
	{
		margin: 40px 0;
	}
	.featurette-image
	{
		max-width: 50%;
	}
	.featurette-image.pull-left
	{
		margin-right: 10px;
	}
	.featurette-image.pull-right
	{
		margin-left: 10px;
	}
	.featurette-heading
	{
		font-size: 30px;
	}

}

@media (max-width: 768px)
{

	.container
	{
		margin: 0 15px;
	}
	.featurette-divider
	{
		margin: 40px 0;
	}
	.featurette-heading
	{
		font-size: 25px;
	}

}

@media (max-width: 668px)
{

	.headline > .container > h1
	{
		font-size: 70px;
	}
	.headline > .container > h2
	{
		font-size: 32px;
	}
	.featurette-divider
	{
		margin: 30px 0;
	}

}

@media (max-width: 640px)
{

	.headline
	{
		padding: 75px 0 25px 0;
	}
	.headline > .container > h1
	{
		font-size: 60px;
	}
	.headline > .container > h2
	{
		font-size: 30px;
	}

}

@media (max-width: 375px)
{

	.featurette-divider
	{
		margin: 10px 0;
	}
	.featurette-image
	{
		max-width: 100%;
	}
	.featurette-image.pull-left
	{
		margin-right: 0;
		margin-bottom: 10px;
	}
	.featurette-image.pull-right
	{
		margin-left: 0;
		margin-bottom: 10px;
	}

}

.carousel.fader .item {-webkit-transition: opacity 3s; -moz-transition: opacity 3s; -ms-transition: opacity 3s; -o-transition: opacity 3s; transition: opacity 3s;}
.carousel.fader .active.left {left:0;opacity:0;z-index:2;}
.carousel.fader .next {left:0;opacity:1;z-index:1;}