html, body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

html {
	height: 100%;
	background: #000;
}

body {
	min-height: 100%;
	font-family: $font-family-sans-serif;
	font-size: $em-base;
	color: black;
	background-color: transparent;
}

#wrapper {
	@media(min-width: $screen-md-min) {
		width: 100%;
		height: 100%;
		overflow: hidden;
		position: absolute;
	}
}

h1 {
	text-transform: uppercase;
	font-weight: bold;
	font-size: em(23px);

	@media(min-width: $screen-sm-min) {
		font-size: em(30px);
	}

	@media(min-width: $screen-md-min) {
		font-size: em(40px);
	}

	@media(min-width: $screen-lg-min) {
		font-size: em(49px);
	}

	@media(min-width: $screen-xl-min) {
		font-size: em(56px);
	}
}

h2 {
	font-weight: 200;
	font-size: em(20px);
	color: #101010;

	@media(min-width: $screen-sm-min) {
		font-size: em(22px);
	}

	@media(min-width: $screen-md-min) {
		font-size: em(24px);
	}

	@media(min-width: $screen-xl-min) {
		font-size: em(28px);
	}

	span {
		font-weight: bold;
		text-transform: uppercase;
	}
}

p {
	font-size: em(14px);

	@media(min-width: $screen-md-min) {
		font-size: em(16px);
	}

	@media(min-width: $screen-xl-min) {
		font-size: em(18px);
	}
}

.break {
	width: 90px;
	height: 3px;
	border-top: solid $red 3px;
	margin-top: 20px;
	margin-bottom: 20px;

	@media(max-width: $screen-sm-max) {
		margin-left: auto;
		margin-right: auto;
	}

	@media(min-width: $screen-lg-min) {
		margin-top: 30px;
		margin-bottom: 30px;
	}

	@media(min-width: $screen-xl-min) {
		margin-top: 40px;
		margin-bottom: 40px;
	}
}

.btn {
	display: inline-block;
	background-color: transparent;
	border-radius: 10px;
	padding: 12px 35px;
	border: #fff solid 1px;
	color: #fff;
	font-weight: 900;
	text-transform: uppercase;
	margin: 25px 10px 25px 0;
	font-size: em(14px);
	@include transition(all 0.25s ease-out);

	@media(min-width: $screen-md-min) {
		margin: 0 10px 0 0;
	}

	@media(min-width: $screen-lg-min) {
		margin: 10px 10px 0 0;
		padding: 12px 25px;
		font-size: em(16px);
	}

	@media(min-width: $screen-xl-min) {
		margin: 25px 10px 0 0;
		padding: 12px 25px;
	}

	&:hover,
	&:focus {
		text-decoration: none;
		background-color: rgba(255, 255, 255, 0.2);
	}
}

.btn-primary {
	@include background(linear-gradient(#d34935 0%, #a93929 25%) top no-repeat);
	background-size: 9999em 200%;
	background-position: 0 0;
	border: none;
	@include box-shadow(0 0 15px -2px rgba(0, 0, 0, 0.3));
	@include transition(all 0.25s ease-out);

	&:hover,
	&:focus {
		background-position: 0 100%;
	}
}

.arrow {
	margin-left: 10px;
	position: relative;

	img {
		margin-top: -5px;
		@include transform(rotate(0deg));
	}
}

.no-padding {
	padding: 0;
}

.clearfix {
	@include clearfix();
}

@media(max-width: $screen-md-max) {
	.container {
		width: 100%;
	}
}

.form-control-label {
	padding: .375rem .75rem;
	margin-bottom: 0;
}

.modal-backdrop.in {
	@include opacity(0.8);
}

.copyright {
	@media(max-width: $screen-sm-max) {
		text-align: center;
		padding: 30px 0;
		font-size: em(12px);

		a {
			color: #fff;
		}
	}

	@media(min-width: $screen-md-min) {
		position: fixed;
		bottom: 15px;
		right: 15px;
		z-index: 998;

		a {
			width: auto;
			color: #fff;
			float: left;
			padding: 8px 12px;
			background: rgba(0, 0, 0, 0.8);
			border-radius: 5px;
			text-decoration: none;
			font-size: em(12px);
			cursor: pointer;
			@include transition(all 0.15s ease-out);

			&:hover,
			&:active {
				background: $brand-primary;
			}
		}
	}
}