* {
	box-sizing: border-box;
}

body		{
	padding: 0;
	margin: 0;
	font-family: radiotrek, Arial, sans-serif;
	font-size:  1.3em;
	color: #fff;
	line-height: 150%;
	text-align: center;
	box-sizing: border-box;
	background: #663300;
}

input: focus {
	outline-width: 0;
}

.viewport {
	overflow: hidden;
	width: 100%;
}

h1 {
	font-weight: normal;
	display: block;
	font-size: 6em;
	text-align: center;
	color: #C78442;
	line-height: 110%;
	margin-top: 100px;
	font-family: "Times New Roman",Georgia ;
	font-style: italic;
	position: absolute;
	margin: 30px auto;
	z-index: 9;
	width: 100%;
	text-align: center;
}

.pagesection {
}

.button {
	font-weight: bold;
	display: inline-block;
	margin: 0 20px;
	padding: 15px 40px;
	border: 4px solid #fff;
	text-decoration: none;
	color: #FFF;
	border-radius: 8px;
	-moz-border-radius: 8px;
	text-transform: uppercase;
	text-align: center;
	min-width: 140px;
	transition: .3s;
	letter-spacing: 1px;
}

.button:hover {
	transform: scale(1.1);
	background: #fff;
	color: #663300;
}

.dynacontent {
	position: absolute;
	width: 800px;
	margin: 0 auto;
	left: 50%;
	margin-left: -400px;
	z-index: 10;
}

h2 {
	font-size: 1.8em;
	margin-top: 20px;
	color: #FFF;
	font-weight: 100;
	margin-bottom: 40px;
	line-height: 140%;
}

h3 {
	font-size: 1.8em;
	line-height: 100%;
	font-weight: 900;
	margin-bottom: 20px;
	color: #000;
}

h2,
h3 {
	text-shadow: #000 0 0 5px;
}

.clean, .devider	{
	content: " ";
	display: block;
	clear: both;
	font-size: 0;
	line-height: 0;
	height: 0;
	overflow: hidden;
	margin: 0 !important;
	float: none !important;
}

.spacer,.spacer2	{
	display: block;
	padding-top: 60px;
	clear: both;
}
.spacer2: before {
	content: " ";
	clear: both;
	display: inline-block;
	margin-top: 50px;
}
.spinner	{
	background: #000;
}

.loading-indicator {
	background:  #FFFFFF;
	height:  100%;
	position:  absolute;
	width:  100%;
	z-index:  150;
}

header.main {
	width: 100%;
	height: 100px;
	text-align: left;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10;
	background: #FFF;
}


header.main section {
	max-width: 1200px;
	margin: 0 auto;
}

.logo {
	display: block;
	width: 500px;
	float: left;
}

.moodystuff {

}

.moodystuff img, .moodystuff div {
	position: fixed;
}
.moodystuff div.frame {
	width: 100%;
	height: 100%;
	overflow: hidden;
	transition: 2s;
	left: 0;
}

.gradfader {
	display: block;
	width: 100%;
	height: 200px;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 2;
}

#fframe2		{
	margin-left: 0;
	z-index: 1;
}

#fframe1		{
	margin-left: 0;
	z-index: 2;
}

.slidefader		{
	display: none;
}

#bgslider {
	position: absolute;
	margin-left: -160px;
	z-index: 2;
	bottom: 30px;
	left: 50%;
	width: 320px;
	display: none;
}

#bgslider	a	{
	display: inline-block;
	font-size:  0px;
	height:  10px;
	margin-right:  20px;
	padding:  0px;
	text-align:  center;
	width:  10px;
	border: 3px solid #FFF;
	border-radius: 30px;
	transition: .3s;
}


#bgslider a.active, #bgslider a:hover	{
	width: 16px;
	height: 16px;
	margin: -3px 17px -3px -3px;
}


.wrong,
.right {
	font-size: 1.3em;
}


.wrong:before,
.right:before {
	display: block;
	text-align: center;
	width: 100%;
	font-size: 3em;
	line-height: 100%;
	color: #f66;
	margin-bottom: 15px;
}

.right:before {
	color: #cf3;
}

.content {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

.progress {
	width: 100%;
	height: 30px;
	position: absolute;
	z-index: 8;
	top: 80px;
	text-align: center;
	display: none;
	transition: .3s;
}

.progress span {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-right: 15px;
	transition: .3s;
}

.progress span:before {
	content: '\e802';
	font-size: 14px;
	line-height: 14px;
	height: 14px;
	color: #b5804b;
	position: absolute;
}

.progress span.active:before  {
	color: #fff;
}

.progress span.pright:before  {
	color: #9c3 !important;
	content: '\e800';
}

.progress span.pwrong:before  {
	color: #f66 !important;
	content: '\e801';
}

.logos {
	position: relative;
	display: block;
	text-align: center;
	margin-bottom: 40px;
}

.logos a {
	display: inline-block;
	width: 120px;
	margin-right: 20px;
}

.logos a img {
	width: 100%;
}

.logos span {
	font-size: .3em;
	display: block;
	line-height: 20px;
	color: #fff;
	letter-spacing: 4px;
}