
/* DESKTOP STYLES */

@media only screen and (min-width:481px) {

body {
	margin: 0px;
	padding: 0px;
	background-color: #ececec;
	width: 100%;
	font-family: Arial, Verdana, sans-serif;
}

#mainContainer {
	padding: 0px;
	height: 650px;
	width: 80%;
	max-width: 960px;
	min-width: 481px;
	margin: 0px auto;
	background-color: #001935; /*backgroundcolor-fallback*/
   	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#001935), to(#c9dbf2));
   	background-image: -webkit-linear-gradient(left, #001935, #c9dbf2);
   	background-image:    -moz-linear-gradient(left, #001935, #c9dbf2);
   	background-image:     -ms-linear-gradient(left, #001935, #c9dbf2);
   	background-image:      -o-linear-gradient(left, #001935, #c9dbf2);
}


#header {
	margin: 0px auto ;
	padding: 0;
	height: 150px;
	width: 100%;
}

#header img {
	margin: 30px 0 0 30px;
	padding: 0px;
	max-width: 50%;
}

#formWrapper {
	height: 490px;
	width: 100%;
	margin: 0px ;
	padding: 0;
	background-color: #fff ;	
	color: #000;
	font-family: Arial, Verdana, sans-serif;
}

#formWrapper h1 {
	font-family: Arial, Verdana, sans-serif;
	font-size: 1.5em;
	font-weight: 550;
	color: #001935;
	padding: 60px 0 60px 30px;
	margin: 0;
	text-align: left;
	line-height: 30px;

}

#formWrapper form {
	margin: 0;
	padding: 0 0 30px 30px;
	width: 500px;

}

#formWrapper form label {
	font-family: Arial, Verdana, sans-serif;
	font-size: 0.8em;
	text-align: left;
	color: #000;
	padding: 0 0 15px 0;
	margin: 0 ;
	display: block;
}

#formWrapper form select{
	max-width:400px;
	width: 60%; 
	height: 1.8em;
	margin: 0 1em 1em 0;
	padding: 0 ;
	float: left;
	font-size: 0.8em;
	font-family: Arial, Verdana, sans-serif;
}


#formWrapper form #OKbutton{
	width:110px; 
	margin: 0;
	font-size: 0.8em;
	font-weight: bold;
	font-family: Arial, Verdana, sans-serif;
	float: left;
	background-color: #3676bb;
	color: #fff;
	padding: 0.2em 0;
	border: none;
}

#maincontent form #region {
	width: 194px;
}


}



/* MOBILE STYLES */

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

body {
	margin: 0;
	padding: 0;
	background-color: #001935; /*backgroundcolor-fallback*/
   	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#001935), to(#c9dbf2));
   	background-image: -webkit-linear-gradient(left, #001935, #c9dbf2);
   	background-image:    -moz-linear-gradient(left, #001935, #c9dbf2);
   	background-image:     -ms-linear-gradient(left, #001935, #c9dbf2);
   	background-image:      -o-linear-gradient(left, #001935, #c9dbf2);
	width: 100%;
	font-family: Arial, Verdana, sans-serif;
}

#mainContainer {
	padding: 0px;
	height: auto;
	width: 100%;
	margin: 0px ;

}


#header {
	margin: 0px auto ;
	padding: 0;
	height: 5em;
	width: 100%;
}

#header img {
	margin: 1em 0 0 2em;
	padding: 0px;
	max-width: 50%;
	max-height: 50%;
}

#formWrapper {
	height: auto;
	width: 100%;
	margin: 0;
	padding: 2em 0;
	background-color: #fff ;	
	color: #000;
	font-family: Arial, Verdana, sans-serif;
}

#formWrapper h1 {
	font-family: Arial, Verdana, sans-serif;
	font-size: 1.5em;
	font-weight: 550;
	color: #001935;
	padding: 0 0 3em 0;
	margin: 0 auto;
	width: 80%;
	min-width: 200px;
	text-align: left;

}

#formWrapper form {
	margin: 0 auto;
	padding: 0 0 5em 0 ;
	width: 80%;
	min-width: 200px;
}

#formWrapper form label {
	font-family: Arial, Verdana, sans-serif;
	font-size: 1em;
	text-align: left;
	color: #000;
	padding: 0 0 1em 0;
	margin: 0 ;
	display: block;
}

#formWrapper form select{
	width:95%; 
	height: 2em;
	margin: 0 0 2em 0;
	padding: 0 ;
	display: block;
	font-size: 1em;
	font-family: Arial, Verdana, sans-serif;
}

#maincontent form #region {
	width: 95%;


}

#formWrapper form #OKbutton{
	width: 95%;
	height: 2em; 
	margin: 0 ;
	font-size: 1em;
	font-weight: bold;
	padding: 0 ;
	display: block;
	font-family: Arial, Verdana, sans-serif;
	background-color: #3676bb;
	color: #fff;
	padding: 0.2em 0;
	border: none;
}



}
