﻿/* CSS Document */
BODY {
	font-family: "Raleway", "Lucida Grande", "Lucida Sans Unicode", Sans-Serif;
	font-weight: 200;
	font-size: 16px;
	background: #515153;
	color: #fff;
	margin: 0, auto;
	padding: 80px;
  	line-height: 20px;
  	text-align: justify;
}

.nav-link {
	font-size: 24px;
	float: right;
}

.header-block {
	display: flex;
	margin: 0 auto;
	width: 650px;
	align-items: center;
}

.header-left {
	padding-right: 32px;
}

.header-right {
	width: 350px;
}

.header-right div {
	font-size: 48px;
	text-align: right;
	line-height: initial;
}

.body-section-header {
	padding-top:16px;
	font-size:36px;
	text-align: center;
	line-height: initial;
}

.body-block {
	display: flex;
	margin: 0 auto;
	align-items: center;
}

.body-left {

}

.body-right {
	padding-left: 48px;
}

.change-header {
	font-size:24px;
	padding-bottom: 20px;
}

.change-block {
	margin-left: auto;
    margin-right: auto;
    width: 70%;
	padding-bottom: 40px;
}

.more-spacer {
	padding-top:16px;
	font-size:16px;
	text-align: center;
}

@media (max-width: 650px) {
	BODY {
		padding-top: 40px;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 40px;
	}

	.header-block {
		display: block;
		margin: 0 auto;
		width: 100%;
	}

	.header-left {
		padding-right: 0;
		width: 300px;
		margin: 0 auto;
	}

	.header-right {
		padding-top: 20px;
		width: 300px;
		margin: 0 auto;
	}

	.header-right div {
		font-size: 48px;
		text-align: center;
		line-height: initial;
	}

	.body-block {
		display: block;
		margin: 0 auto;
		width: 100%;
	}

	.body-left {
		text-align: center;
	}

	.body-left img {
		width: 300px;
	}
	
	.body-right {
		padding: 20px;
	}	
}

a {
	color: #e0e0e0;
	font-weight: bold;
	text-decoration: underline;
}
a:link {
	color: #e0e0e0;
}
a:visited {
	color: #e0e0e0;
}
a:hover {
	color: #e0e0e0;
}
a:active {
	color: #e0e0e0;
}

span.story {
  color: #6BC2C4;
  font-weight: 400;
}

span.grinder {
  color: #AAAC18;
  font-weight: 400;
}

.footer {
	padding-top:128px;
	font-size:11px;
	text-align: center;
}
