@charset "utf-8";

/* CSS Document */



@import url('https://fonts.googleapis.com/css?family=Barrio');

@import url('https://fonts.googleapis.com/css?family=Fredericka+the+Great');



html{margin:0;padding:0;}

body{

	margin:0;

	padding:0;

	background:#7f0000;

	font-family: Helvetica Neue, Helvetica, Arial, sans-serif;

	font-size: 14px;

}

.clear{clear:both;}

#header{

	clear:both;

	background:#fff;

	box-shadow: 0 5px 15px 0 rgba(0,0,0,0.8);

	padding:10px 5%;

	text-align: center;

	z-index: 1;

	position: relative;

}

#header h1{

	/*font-family: 'Barrio', cursive;*/

	font-family: 'Fredericka the Great', cursive;

	text-transform: uppercase;

	color:#7f0000;

	font-size: 6vw;

	margin:0;

	font-weight: normal;}

#header h2{

	color:#8A8A8A;

	text-transform: uppercase;

	font-size: 4vw;

	margin:0;

}

#contentwrap{

	clear:both;

	padding:25px 15%;

	position: relative;

}

#contentbkgd{

	display:block;

	position: absolute;

	z-index: 0;

	bottom:0;left:0;

	width:100%;height:50%;

	background: url(images/dance.svg) repeat-x;

	background-size: contain;

	background-position: center;

	opacity: 0.2;

}

#content{

	float:left;

	width:70%;

	color:#fff;

	font-size: 16px;

	line-height: 28px;

	position: relative;

	z-index: 1;

}

#content a{text-decoration: none;color:#fff;}

#content a:hover{text-decoration: underline;}

#content a.button{color:#fff;background:#000;padding:5px 10px;margin:5px;display: inline-block;text-decoration: none!important;}
#content a.button:hover{background:#666;}

#sidebar{

	float:right;

	width:20%;

	padding:0 0 0 5%;

	color:#fff;

	font-size: 16px;

	line-height: 28px;

	border-left:2px solid #fff;

	position: relative;

	z-index: 1;

}

#register{

	clear:both;

}

label{

	display:block;

	float:left;

	width:24%;

	padding:0 1% 0 0;

	clear:both;

	text-align: right;

	font-weight: bold;

	margin:10px 0;

}

input, select{

	display: block;

	width:50%;

	float:left;

	margin:5px 0;

	box-sizing:border-box;

	padding:5px 10px;

	font-family: Helvetica Neue, Helvetica, Arial, sans-serif;

	border:0;

	color:#464646;

	outline:none;

}

input[type=submit],

input[type=reset]{

	clear:both;

	background:#000;

	color:#fff;

	text-transform: uppercase;

	font-weight: bold;

	-webkit-appearance:none;

	float:none;

	margin:10px auto;

	padding:8px 10px;

	position: relative;

	border:1px solid #fff;

	cursor: pointer;

}

input[type=submit]:hover,

input[type=reset]:hover{

	background:#141515;

}



/*TABLET*/

@media screen and (max-width:1200px){

	#contentwrap{padding:15px 5%;}

	#header h1{font-size:8vw;}

	#header h2{font-size:6vw;}

}



/*MOBILE*/

@media screen and (max-width:800px){

	#content{float:none;width:100%;}

	#sidebar{float:none;width:100%;padding:10px 0;margin:30px 0;border-top:2px solid #fff;border-left:none;}

	label{float:none;width:100%;text-align: left;}

	input, select{float:none;width:100%;}

}