@font-face {
	font-family: 		'Museo';
	src: 			url('/fonts/museosansrounded-100-webfont.ttf') format('truetype');
	font-weight: 		100;
}
@font-face {
	font-family: 		'Museo';
	src: 			url('/fonts/museosansrounded-300-webfont.ttf') format('truetype');
	font-weight: 		300;
}
@font-face {
	font-family: 		'Museo';
	src: 			url('/fonts/museosansrounded-500-webfont.ttf') format('truetype');
	font-weight: 		500;
}
@font-face {
	font-family: 		'Museo';
	src: 			url('/fonts/museosansrounded-700-webfont.ttf') format('truetype');
	font-weight: 		700;
}
@font-face {
	font-family: 		'Museo';
	src: 			url('/fonts/museosansrounded-900-webfont.ttf') format('truetype');
	font-weight: 		900;
}
@font-face {
	font-family: 		'Museo';
	src: 			url('/fonts/museosansrounded-1000-webfont.ttf') format('truetype');
	font-weight: 		1000;
}


BODY {
	font-family:		'Museo';
	font-size:		30px;
	font-weight:		100; 
}

INPUT, SELECT, OPTION, TEXTAREA {
	font-family:		'Museo';
	font-size:		1em;
	font-weight:		100; 
}

BODY {
	color:			#000000;
	overflow-x:		hidden;
}


FORM {
	margin:			0;
	padding:		0;
}


H1, H2, H3, H4 { clear:both;  }

H2 {
	font-size:		1.2em;
	font-weight:		100;
	padding-left:		0;
	padding-top:		0.8em;
	padding-bottom:		0.8em;
	margin:			0;
}

H3 {
	color:			#ebf265;
	text-transform:		uppercase;
	font-weight:		900;
	font-size:		0.7em;
	letter-spacing:		0.1em;
	margin-bottom:		2em;
}

H2 div, H3 div { display:inline }
H2 span { font-size:1.4em;  }

#title h2 {
	width:			49%;
	display:		inline-block;
	vertical-align:		middle;
}

#title h3 {
	width:			49%;
	display:		inline-block;
	vertical-align:		bottom;
	text-align:		right;
}



.header_field, .header_button {
	border:			0.05em solid #ffffff; 
	border-radius: 		1em; 
	background-color:	#02c39a;
	padding-left:		0.8em;
	padding-right:		0.8em;
	padding-top:		0.1em;
	padding-bottom:		0.1em;
	color:			white;
	font-size:		0.8em;
}

.header_button:hover {
	background-color: 	#ebf265;
	color:			#132E42;
}

#header_username, #header_password {
	display:none
}


#header {
	background-color: 	#02c39a;
	padding-top:		0.5em;
	padding-bottom:		1em;
	height:			1.5em;
}

#header_cont {
	width:		90%;
	margin:		auto auto;
}

#header_left {
	float:		left;
	width:		auto;
	display:	inline-block;
	vertical-align:	bottom;
}

#header_right {
	float:		right;
	width:		auto;
	display:	inline-block;
	text-align:	right;
	vertical-align:	top;
	margin-top:	0.35em;
	background-color: 	#02c39a;
}

#header_right a {
	text-decoration:	none; 
	color:			white;
	font-size:		0.8em; 
}



#header_search {
	height:		1.2em; 
	width:		70%; 
	margin:		auto auto; 
	border:		0.05em solid #ffffff; 
	border-radius: 	1em; 
}


#header_search img {
	margin-left:	0.5em;
	margin-top:	0.2em;
	height:		0.7em;
}

#header_search input {
	width:			80%;
	height:			80%;
	background: 		transparent;
	border:			0;
	color:			white;
	font-family:		'Museo';
	font-weight:		300;
	font-size:		0.8em;
	height:			1em;
	margin-top:		0.1em;
}
#header_search input:focus{
    outline: none;
}

#logo {
	height:			1.5em;
	margin-top:		0.2em;
}



#menu {
	float:			right;
	height:			0.8em;
	margin-top:		0.3em;
	cursor:			pointer;
}

#menu_icon {
	height:			0.8em;
	vertical-align:		top;
	cursor:			pointer;
}


#menu_list {
	display:		none;	
	width:			100%;
	position:		absolute; 
	top:			1.1em;
	padding-top:		1em;
}

#menu_list UL {
	float:			right;
	width:			15%; 
	background-color:	#ffffff; 
	border:			0.08em solid #02c39a; 
	color:			#363636;
	font-size:		0.7em;
	padding-left:		1em;
	padding-right:		1em;
	padding-top:		0;
	padding-bottom:		0;
}

#menu_list LI {	
	width:			100%;
	text-transform:		uppercase;
	list-style-type: 	none;
	display:		inline-block;
	margin-top:		0.7em;
	margin-bottom:		0.7em;
	cursor:			pointer;
}

#menu_list LI:hover { color: #02c39a }

#menu_list a { 	color: #363636; text-decoration:none; }
#menu_list a:hover {  font-weight:500 }


#list { background-color:white; color:#696969 }
#list_c { width:90%; margin:auto }
.list_noItems { padding-top:2em; text-align:center; background-color:#ffffff; color:black }


.button  {
	background-color: 	#ebf265;
	color:			#132E42;
	font-size:		1em;
	font-weight: 		500;	
	font-family:		'Museo';
	border-radius:		0.5em;
	padding:		0.3em;
	padding-left:		0.7em;
	padding-right:		0.7em;
	margin-top:		0.5em;
	border:			0;
	cursor:			pointer;
	text-decoration:	none;
} 



.button2, .button3 {
	background-color: 	#ebf265;
	color:			#132E42;
	font-size:		0.8em;
	font-weight: 		300;	
	font-family:		'Museo';
	border-radius:		0.5em;
	padding:		0.3em;
	padding-left:		0.7em;
	padding-right:		0.7em;
	margin-top:		0.5em;
	border:			0;
	cursor:			pointer;
	text-decoration:	none;
} 

.button:hover, .button2:hover {
	color:			#ffffff;
	background-color:	#132E42;
} 

.button3 {
	color:			#ffffff;
	background-color:	#132E42;
} 


.validator { color:red; padding:1em; }

.fieldName {
	color:			black;
	text-align:		right;
	padding-right:		1em;
	width:			35%; 
	display:		inline-block;
	vertical-align:		middle;
	margin-top:		1em;
}

.fieldValue {
	color:			black;
	width:			60%; 
	display:		inline-block;
	vertical-align:		middle;
	margin-top:		1em;
}

 
.contentNormal {
	background-color:	#063a47;
}



/***** different screens *********/

/* for 1250px or less */
@media screen and (max-width: 1250px) {
	BODY { font-size: 25px }
}




/* for 1100px or less */
@media screen and (max-width: 1100px) {
	BODY { font-size: 20px }
}



/* for 950px or less */
@media screen and (max-width: 500px) {
	
	#header input { max-width:5em }

}