@font-face {
	font-family: 'Atlas Typewriter Web';
	src: url('fonts/AtlasTypewriter-Regular-Web.eot');
	src: url('fonts/AtlasTypewriter-Regular-Web.eot?#iefix') format('embedded-opentype'),
		url('fonts/AtlasTypewriter-Regular-Web.woff') format('woff'),
		url('fonts/AtlasTypewriter-Regular-Web.ttf') format('truetype'),
		url('fonts/AtlasTypewriter-Regular-Web.svg#Atlas Typewriter Web') format('svg');
	font-weight: 400;
	font-style: normal;
	font-stretch: normal;
}

.AtlasTypewriter-Regular-Web {
	font-family: 'Atlas Typewriter Web';
	font-weight: 400;
	font-style: normal;
	font-stretch: normal;
}


@font-face {
	font-family: 'Atlas Typewriter Web';
	src: url('fonts/AtlasTypewriter-Bold-Web.eot');
	src: url('fonts/AtlasTypewriter-Bold-Web.eot?#iefix') format('embedded-opentype'),
		url('fonts/AtlasTypewriter-Bold-Web.woff') format('woff'),
		url('fonts/AtlasTypewriter-Bold-Web.ttf') format('truetype'),
		url('fonts/AtlasTypewriter-Bold-Web.svg#Atlas Typewriter Web') format('svg');
	font-weight: 700;
	font-style: normal;
	font-stretch: normal;
}

.AtlasTypewriter-Bold-Web {
	font-family: 'Atlas Typewriter Web';
	font-weight: 700;
	font-style: normal;
	font-stretch: normal;
}


@font-face {
	font-family: 'Atlas Typewriter Web';
	src: url('fonts/AtlasTypewriter-Black-Web.eot');
	src: url('fonts/AtlasTypewriter-Black-Web.eot?#iefix') format('embedded-opentype'),
		url('fonts/AtlasTypewriter-Black-Web.woff') format('woff'),
		url('fonts/AtlasTypewriter-Black-Web.ttf') format('truetype'),
		url('fonts/AtlasTypewriter-Black-Web.svg#Atlas Typewriter Web') format('svg');
	font-weight:  900;
	font-style:   normal;
	font-stretch: normal;
}

.AtlasTypewriter-Black-Web {
	font-family: 'Atlas Typewriter Web';
	font-weight: 900;
	font-style: normal;
	font-stretch: normal;
}



body {
	font-family: 'Atlas Typewriter Web';
	font-weight: 400;
	font-style: normal;
	font-stretch: normal;
	background-color: #EEEEEE;
	margin: 120px;
}



h1 {
	font-family: 'Atlas Typewriter Web';
	font-weight: 700;
	font-style: normal;
	font-stretch: normal;
	font-size: 48px;
	text-transform: uppercase;
	text-align: center;
	letter-spacing: 2px;
	line-height: 60px;
}

button.custom {
	position: absolute;
	background: none;
	text-indent:0px;
	display:block;
	color: inherit;
	font-family: 'Atlas Typewriter Web';
	font-weight: 700;
	font-style: normal;
	font-stretch: normal;
	font-size:15px;
	text-transform: uppercase;
	text-decoration:none;
	text-align:center;
	padding: 12px;
	border: 2px solid white;
	bottom: 36px;
	left: 50%;
}

button.custom:hover {

}
button.custom:active {

}

/* This button was generated using CSSButtonGenerator.com */

h2 {
	font-family: 'Atlas Typewriter Web';
	font-weight: 700;
	font-style: normal;
	font-stretch: normal;
	font-size: 72px;
	text-transform: uppercase;
	text-align: center;
	letter-spacing: 12px;
	line-height: 96px;
}

h2 span {
	font-size: 36px;
	letter-spacing: 6px;
}



.bg-super-color-green-blue {
	background-color: #00ab9d;
	color: white;
}
.bg-super-color-red {
	background-color: #e74d57;
	color: white;
}
.bg-super-color-blue {
	background-color: #0070b8;
	color: white;
}
.bg-super-color-pink-orange {
	background-color: #ed7c6b;
	color: white;
}
.bg-super-color-violet {
	background-color: #90137e;
	color: white;
}
.bg-super-color-green {
	background-color: #84c290;
	color: white;
}
.bg-super-color-green-gray {
	background-color: #008089;
	color: white;
}
.bg-super-color-pink {
	background-color: #eb6d83;
	color: white;
}
.bg-super-color-mauve {
	background-color: #7c73af;
	color: white;
}
.bg-super-color-yellow {
	background-color: #ffe500;
	color: black;
}

.bg-super-color-yellow button.custom {
	border-color: black;
}

@media screen and (max-width: 578px) {
	body {
		margin: 24px 24px 0 24px;
	}
	h1 {
		font-size: 16px;
		line-height: 20px;
		letter-spacing: 1px;
	}
	h2 {
		font-size: 24px;
		line-height: 36px;
		letter-spacing: 4px;
	}
	h2 span {
		font-size: 16px;
		line-height: 20px;
		letter-spacing: 1px;
	}
	button.custom {
		bottom: 24px;
	}
}