body {
	margin: 0;
	padding: 0;
	font-family: sans-serif;
	background-color: #FFFFFF;
}
html {}

/* ------------------------------------------------*/
/*   			 	SECTION STYLES     			   */
/*             	PRETTY BASIC STUFF HERE            */
/* ------------------------------------------------*/
.black-bg {
	color: #FFFFFF;
	background-color: #232323;
}
.white-bg {
	color: #232323;
}

.yellow {
	color: #FFFC2B !important;
}
.red {
	color: #F55D3E;
}
a {
	text-decoration: none;
	color: #FFFC2B;
}

.white-bg a {
	text-decoration: underline;
	color: #000000;
}

a:hover {
	font-family: 'Affogato-Bold' !important;
}

.white-bg a:hover {
	font-family: 'Affogato-Regular' !important;
}

.container {
	margin: 0 auto;
	width: 70%;
	padding-bottom: 100px;
}
section {
	width: 100%;
}

/* Button Style */
.button {
	padding: 10px 36px;
	color: #232323;
	background-color: #FFFC2B;
	border: 1px solid rgba(35, 35, 35, 0.0);
	cursor: pointer;
}
.button:hover {
	outline: 1px solid #FFFC2B;
	background-color: #232323;
	color: #FFFC2B;
	font-family: 'Affogato-Regular' !important;
}

/* Intro Section */
#intro {
	padding-top: 7%;
	position: relative;
}
.intro-line {
	border-top: 1px solid #FFFFFF;
	max-width: 800px;
	position: relative;
		top: 124px;
	z-index: 0;
	margin: 0 auto;
}
.intro-title {
	background-color: #232323;
	position: relative;
		top: 100px;
	z-index: 100;
	width: 240px;
	margin: 0 auto;
	letter-spacing: .06em;
}
.string {
	padding-top: 160px;
	max-width: 800px;
	margin: 0 auto;
	list-style-type: none;
}
.string li{
	display:inline-block;
	margin-right: 4%;
}
.string .fix {
	margin-left: -1.2vw;
}
.caption {
	line-height: 32px;
	margin-top: 19%;
}
#download.button {
	position: fixed;
		top: 5%;
		right: 5%;
	z-index: 99999;
}
.hint {
	width: 210px;
	padding: 12px;
	color: #232323;
	text-align: center;
	position: absolute;
	bottom: -20px;
	left: 8vw;
	transform: rotate(-4.5deg);
	background-color: rgba(254, 252, 68, .90);
}

/* Glyphs Section */
#glyphs{
	padding-top: 7%;
}
#glyphs p{
	margin-top: 80px;
	line-height: 1.8em;
	text-align: justify;
	letter-spacing: .16em;
}

/* Angles Section */
#angles {
	margin-top: -4%;
}
.angles-line {
	transform: rotate(-4deg);
	background: #FFFC2B;
	border-radius: 1px;
	width: 80%;
	height: 51px;
	margin: 0 auto;
	position: relative;
		top: 190px;
		left:-15px;
	z-index: 100;
}
#angles .string {
	z-index: 300;
	position: relative;
	padding: 0 !important;
	max-width: 100% !important;
/* 	margin-right: 1vw; */
}
#angles .string li{
	margin-right: -1vw !important;
}
#angles .string.light{
	margin-top: -30px;
}
#angles .string.light li {
	margin-right: 0vw !important;
}

/* Weights Section */
#weights {
	margin-top: 4%;
}
.weight {
	display: inline-block;
}
.left {
	float: left;
}
.right {
	float: right;
}
.description {
	width: 70%;
	margin-top: 10px;
	margin-bottom: 60px;
/* 	height: 116px; */
	overflow: hidden;
}
.label {
	width: 30%;
}

/* Qs Section */
#qs {
	margin-top: -20vh;
	margin-bottom: 10%;
}
#qs .string {
	max-width: none;
	margin-left: -2vw;
}
#qs .string li {
	margin-right: 1vw !important;
}

/* Words Section */
#words {}
#words ul{
	padding: 0;
	margin-right: -14% !important;
}
#words .container {
	padding-top: 10%;
	padding-bottom: 80px !important;
}
.sample {
	margin-bottom: 55px;
	display: inline-block;
	min-width: 49%;
}
.sample-label {
	padding-left: 3px;
	margin-bottom: -6px !important;
	width: 100%;
	display: inline-block;
}
.word {}

/* Story Section */
#story {
	/*pointer-events: none;*/
}
#story p {
	max-width: 75%;
/* 	min-width: 650px; */
}
#story .container {
	position:relative;
	margin-top: -400px;
}
.quote {
	padding-left: 5%;
}
#story p.quote {
	max-width: 75% !important;
}
.vertical {
/*
	width: 20%;
	position: relative;
	top: 81vh;
	left:16%;
*/
	width: 760px;
	height: 90px;
	margin-top: 400px;
	margin-left: 2%;
	transform: rotate(-90deg);
		-webkit-transform: rotate(-90deg);
		-moz-transform: rotate(-90deg);
		-ms-transform: rotate(-90deg);
		-o-transform: rotate(-90deg);
}
.story-shift {
	margin-left: 24%;
}
.story-title {
	margin-bottom: 20px;
}

/* Footer Section */
#footer {
	display: inline-block;
	padding: 4% 0 4% 0;
	margin-top: 10%;
}

#footer .center {
	width: 100%;
}

/* EULA Specific Styles */
#eula {
	padding-top: 5%;
	font-size: 10pt;
	line-height: 12pt;
}
.justify {
	text-align: justify;
}
.indent {
	margin-left: 4%;
	width: 96%;
}
.dub-indent {
	margin-left:30px;
}
.underline {
	text-decoration: underline;
}