@import url("./editor.css");

html, body, form
{
	margin: 0;
	padding: 0;
	width: 100%;
	min-width:320px;
	height:100%;
	z-index:1;
}
#wrapperTop
{
	display:block;
	position:relative;
	width:100%;
	height: 10%;
	min-height:95px;
	z-index:25;
}
#containerTop
{
	max-width: 980px;
	width:100%;
	height:100%;
	margin: 0 auto;
}
#wrapperSlogan{
	float: left;
	min-width: 200px;
	width:75%;
	height:100%;
}

#wrapperLogo 
{
	float: left;
	min-width:100px;
	width: 25%;
	height:100%;
	
	position:relative;
}

#wrapperSlider{
	width: 100%;
	height: 55%;
}

#videoDiv
{
	max-width: 640px;
	/*float:right;*/
	position:relative;
	width:100%;
	height:100%;
	z-index:10;
}
#textDiv
{
	max-width: 640px;
	/*float:right;*/
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	z-index:1;
	color:#333;
	/*padding:20px;*/
}

#textDiv a{
	color:#333;
}
#textDiv span{
	margin: 30px 20px;
	display:block;
}

#containerOverlay
{
	position:absolute;
	max-width: 980px;
	width:100%;
	height:70%;
	margin-left: auto;
	margin-right:auto;
	margin-top: auto;
	margin-top:auto;
	left:0;
	right:0;
	top:0;
	bottom:15%;
}
#spacerYouTube{
	float: left;
	/*min-width: 200px;*/
	width:40%;
	height:100%;
}
#testframe{
	-moz-border-radius: 10px;
	border-radius: 10px;
	border:0px solid black;
}
#wrapperYouTube {
	float: left;
	position:relative;
	min-width:100px;
	width: 60%;
	height:100%;

	-moz-border-radius: 10px;
	border-radius: 10px;
	border:1px solid white;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	background:#fff;
	opacity:.9;
}

#wrapperBottom
{
	width:100%;
	height:35%;
}
#containerBottom
{
	max-width: 980px;
	width:100%;
	height:100%;
	margin: 0 auto;
}
#wrapperErgoline{
	float: left;
	min-width: 100px;
	width:40%;
	
	position:relative;
	top: -50%;
}
#spacerContentTop {
	float: left;
	min-width:200px;
	width: 60%;

	/*height:25%;*/
	
color: #fff;
font: 300 32px/1.2 'Roboto Condensed';
padding:30px 0 25px 0;
text-align:center;
}
#wrapperFacebook {
	float: left;
	width: 28%;
	height:100px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	border:1px solid white;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	padding:10px;
	position:relative;
}
#wrapperChoice{
	float: left;
	width: 4%;
	
	text-align:center;
	font: 300 50px/1.8 'Roboto Condensed';
}

#wrapperEmail {
	float: right;
	width: 28%;
	height:100px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	border:1px solid white;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	padding:15px 10px;
	text-align:center;
}
#spacerContentBottom{
    float: left;
    min-width: 200px;
    width: 60%;
}
#logo{
    width:140%;
    position:absolute;
    right:0;
    top:10%;
}
#logo img{
    width:100%;
}
#ergoline{
    width:100%;
}
#ergoline img{
    width:100%;
}
.bigPink{
	color: #e0007f;
	font: 400 60px/.85 'Roboto Condensed';
}

.bigWhite{
	color: #fff;
	font: 300 36px/0.9 'Roboto Condensed';
}

@media only screen and (min-width:0px) and (max-width: 560px) {
	#wrapperTop
	{
		height:10%;
		min-height:65px;
	}
	#wrapperSlogan 
	{
		display:none;
	}
	#wrapperLogo 
	{
		width:100%;
	}
	#wrapperSlider
	{
		/*height: 300px !important;*/
	}
	#spacerYouTube
	{
		display:none;
	}
	#wrapperYouTube {
		width: 100%;
	}
	#wrapperErgoline{
		display:none;
	}
	#spacerContentTop {
	float: left;
	min-width:200px;
	width: 100%;

	/*height:25%;*/
	
color: #fff;
font: 300 16px/1.2 'Roboto Condensed';
padding:15px 0 15px 0;
text-align:center;
	}
	#wrapperFacebook {
		/*float: none;*/
		width: 100%;
		/*margin-top:15px;*/
	}
	#wrapperChoice{
		float: none;
		width: 100%;
		font: 300 12px/1.0 'Roboto Condensed'
	}

	#wrapperEmail {
		float: none;
		width: 100%;
	}
	#spacerContentBottom{
	    float: none;
	    width: 100%;
	}
	#logo{
	    width:60%;
	}
}

@media only screen and (min-width:560px) and (max-width: 960px) {

}

@media screen and (min-width:960px) and (min-height:760px) {
	#wrapperSlider
	{
		/*height: 520px !important;*/
	}
}

@media screen and (min-width:960px) and (min-height:1200px) {
	#wrapperSlider
	{
		/*height: 660px !important;*/
	}
}

/* Forms */
#form1 .invalid input { color: #ff0000; }

#form1 input {
	background: #fff;
	border: none;
	color:#666;
	padding: 3px 5px 2px;
	width: 95%;
	outline:none;
	box-shadow:none;
	margin: 0;
	-moz-border-radius: 5px;
	border-radius: 5px;
	font: 300 13px/1.2 'Roboto Condensed';
	max-width:200px;
}

#form1 label {
	display:inline-block;
	width: 100%;
}

#form1 .success{
	-moz-border-radius: 10px;
	border-radius: 10px;
	border:1px solid white;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	padding:10px;
	margin-top:15px;
	display:none;
}

#form1 .error, #form1 .empty {
	text-align: left;
	display:none;
	font-size:10px;
	color:#fff;
	margin-left: 3px;
	top: -3px;
}

.btns{
	padding-top: 5px;
}

.btns a{
	font: 300 13px/1.2 'Roboto Condensed';
	display:inline-block;
	text-decoration:none;
}

input, select, textarea {
	vertical-align:middle;
}

.btnSend{
	background:#ffffff;
	color:#666;
	display:block;
	float:left;
	padding:5px 5px 2px;
	text-decoration:none;

	-webkit-transition: all 0.3s ease-out; 
	-moz-transition: all 0.3s ease-out; 
	-o-transition: all 0.3s ease-out; 
	transition: all 0.3s ease-out;
	
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.btnSend:hover{
	background:#ffffff;
	color:#666;
}
/* End Forms */

#login-mask {
	position:absolute;
	top:0;
	left:0;
	background:#fff;
	width:100%;
	height:100%;
	display:block;
	opacity:.9;
	-moz-border-radius: 10px;
	border-radius: 10px;
	border:1px solid white;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	text-align:center;
	display:none;
	color:#333;
}
#login-mask a{
	color:#333;
}
#fb-login {
	position:relative;
	top:38px;
	text-decoration:none;
}