@font-face{
  font-family:'Bariol Bold';
  src: url('Bariol_Bold.otf'); 
}

@font-face{
  font-family:'Bariol Serif';
  src: url('Bariol_Serif_Regular.otf'); 
}

* {
	box-sizing: border-box;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
 color:rgba(255,255,255,0.25);
}
::-moz-placeholder { /* Firefox 19+ */
  color:rgba(255,255,255,0.25);
}
:-ms-input-placeholder { /* IE 10+ */
  color:rgba(255,255,255,0.25);
}
:-moz-placeholder { /* Firefox 18- */
  color:rgba(255,255,255,0.25);
}

body
{
	margin:0px;
	height:100%;
	//background:#EFEFEF;
}

div
{
	//display:inline-block;

	color:#515151;
	//border:1px solid #AAAAAA;
}

.logo
{
	max-width:200px;
	margin-bottom:50px;
	padding-top:80px;
	//display:block;
}

.overlay
{
	z-index:10;
	display: block;
	//position:absolute;
	text-align: center;
	//padding-top:25%;
	padding:30px;
	//margin-top: -200px;
	margin-bottom:20px;
	width:100%;
	//height:100%;
	//background:rgba(255,255,255,0.3);
	/*-webkit-box-shadow: inset -1px -4px 5px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: inset -1px -4px 5px 0px rgba(0,0,0,0.2);
	box-shadow: inset -1px -4px 5px 0px rgba(0,0,0,0.2);*/
	
}

.separator
{
	height:30px;
}

.fixed-footer
{
	//position:relative;
	//margin-top:-250px;
	margin-top:20%;
	padding:10px;
	text-align: center;
	width:100%;
	z-index:2000;
	background:#EFEFEF;
}

.subsublabel
{
	font-size:17px;
	color:#777777;
	padding:15px;
}

.bottom-overlay
{
	background:#FEFEFE;
	
	height: 60px;
	position:relative;
	top:-60px;
	//z-index:1000000;
}

.header
{
	font-family: 'Bariol Bold';
	font-family: 'Bariol Serif';
	font-size:50px;
	//padding:20px;
	margin-top:100px;
	line-height:100%;
	//text-align: center;
	//background:rgba(255,255,255,0.7);
}

.subheader
{
	font-family: 'Bariol Serif';
	font-size:26px;
	padding-bottom:30px;
	//text-align: center;
	//line-height:150%;
	//background:rgba(255,255,255,0.7);
}

.main-button
{
	border: 2px solid #5592c5;
	background:rgb(85, 146, 197);
	border-radius:6px;
	font-family:'Bariol Bold';
	color:#FFFFFF;
	font-size:25px;
	padding:10px;
}

.preview
{
	//position:fixed;
	//float:right;
	width:90%;
	left:50%;
	padding:20px;
	top:10%;
	//width:100%;
	border-radius: 4px;
	background:#FFFFFF;
	box-shadow: 0px 0px 9px 0px #888888;
	margin-bottom:-100px;
}

.content
{
	padding:30px;
	height:100%;
	font-family: 'Bariol Bold';
	//max-width:50%;
	width:90%;
	text-align: left;
	//position:absolute;
	margin-bottom:100px;
}

.content img
{
	//box-shadow: 0px 0px 9px 0px #AAAAAA;
	//margin:20px;
}

.dark
{
	background:#EFEFEF;
}

@media (max-width: 1500px) {
  .preview
	{
		width:150%;
	}
}

@media (max-width: 600px) {
	body
	{
		height:250%;
	}
  .preview
	{
		float:none;
		position:relative;
		top:auto;
		margin-right:0px;
		left:0px;
		width:300%;
		//top:60%;
	}

	.content
	{
		position:relative;
		padding:5px;
		top:auto;
		max-width:100%;
		margin-bottom:10%;
	}
}