/*
-------------------------------------------
FONTS
-------------------------------------------
font-family: 'Open Sans', sans-serif;
*/

/*
-------------------------------------------
COLORS
-------------------------------------------
Dark Brown: #0d0a05;
Light Brown: #ae613a;
*/
* {
	margin:0;
	padding:0;
	font-family: 'Open Sans', sans-serif;
	color:#0d0a05;
}
.body_text {
	/*max-width:850px;*/
	margin-top:58px;
}
h1 {
	font-size: 54px;
    letter-spacing: 1px;
    word-spacing: 10px;
    background: url(images/favicon.png) no-repeat left center;
    padding-left: 100px;
    text-transform: uppercase;
}
.body_text h2 {
	color: #ae613a;
    text-transform: uppercase;
    font-size: 38px;
    letter-spacing: 2px;
    /* color: #603735; */
    margin-bottom: 20px;
}
.white {
	color: #ffffff;
}
.right {
	float: right;
}
h3 {
	font-weight:normal;
	font-style:italic;
}

h3 span.inline {
	display: inline-block;
    max-width: 90%;
    max-width: calc(100% - 12px);
    vertical-align: top;
}

.body_text h3 {
	font-size:25px;
	margin-bottom:30px;
	/*max-width:600px;*/
}
.button {
	display:inline-block;
	background:rgb(13 10 5);
	color:white;
	text-decoration:none;
	text-align:center;
	padding:10px 30px;
	font-weight:bold;
	text-transform:uppercase;
	/*width:234px;*/
	transition:ease-in-out all .3s;
	font-size: 18px;
    border-radius: 30px;
    margin: 10px 0px;
}
.button em {
	display:block;
	font-size:14px;
	color:white;
	text-transform:capitalize;
	font-weight:normal;
}
.button:hover {
	opacity:.8;
}
.button:first-of-type {
	margin-right:10px;
}
#bkgd {
	background-image: url("images/bkgd_5.jpg");
    background-repeat: no-repeat;
	background-size:cover;
    height: 100vh;
    position: relative;
	background-position: center bottom -12vh;
}
.container {
    padding: 100px 100px 0 100px;
}
.bottom_bar {
	position:absolute;
	bottom:0;
	width:100%;
	background:rgba(13,10,5, .8);
	background: rgb(39 32 28 / 51%);
}
.bottom_bar .container {
	padding-top:32px;
	padding-bottom:32px;
}
.bottom_bar h2, .bottom_bar h3 {
	color:white;
	/*display:inline-block;*/
}
.bottom_bar h2 {
	text-transform:uppercase;
	padding-right:10px;
	font-size: 28px;
    letter-spacing: 1px;
}
.special {
    position: absolute;
    bottom: 165px;
    font-weight: bold;
    font-size: 25px;
}
/*
-------------------------------------------
MEDIA QUERIES
-------------------------------------------
*/
@media only screen and (max-width:1000px) {
	.container {
		padding: 50px 50px 0 50px;
	}
}
@media only screen and (max-width:750px) {
	#bkgd {
		background-position: 45%;
	}
	h1 {
		font-size: 55px;
		letter-spacing: 4px;
		word-spacing: 0;
		background: url(images/favicon.png) no-repeat left top;
		padding-top: 71px;
		padding-left:0;
	}
	.body_text {
		margin-top: 50px;
	}
	.body_text h2 {
		font-size: 30px;
		letter-spacing: 0;
	}
	.body_text h3 {
		font-size: 19px;
		margin-bottom: 20px;
	}
	.button:first-of-type {
		margin-right: 0;
		margin-bottom: 10px;
	}

	.bottom_bar .container .right {
		float: none;
		display: block;
		margin-top: 4px;
		color: #d6d3cc;
	}
}
@media only screen and (max-width:550px) {
	.container {
		padding: 20px 20px 0 20px;
	}
	.body_text h2 {
		font-size: 23px;
	}
	.bottom_bar .container {
		padding-top: 20px;
		padding-bottom: 20px;
	}

	a.button {
		display: block;
	}

	.bottom_bar h2 {
		text-align: center;
		font-size: 21px;
		padding: 0px;
	}
}
@media only screen and (max-width:420px) {
	h1 {
		font-size: 34px;
		/*text-align:center;*/
		letter-spacing: 0;
		background: none;
		padding-top: 0;
		line-height: 1.2;
	}

	.body_text {
		margin-top:20px;
	}

	.special {
		position: inherit;
		bottom: auto;
		font-weight: bold;
		font-size: 20px;
		display: block;
		margin-top: 10px;
	}

	#bkgd {
		height:100%;
		min-height: 100vh;
	}

	.bottom_bar {
		position: inherit;
		margin-top:10px;
	}

}

@media only screen and (max-device-width:700px) and (orientation: landscape) {
	h1 {
		font-size: 45px;
		text-align:center;
		letter-spacing: 0;
		background: none;
		padding-top: 0;
	}

	#bkgd {
		background-size:cover;
		height:100%;
	}

	.bottom_bar {
		position: inherit;
	}

	.body_text {
		margin-bottom:30px;
	}

	.special {
		position: inherit; 
		margin: 10px 0;
	}
}

@media only screen and (max-width: 420px) and (min-height: 630px) {
	.bottom_bar {
		position: absolute;
		bottom: 0px;
	}
}