@charset "utf-8";
/* CSS Document */
body {
	background-color:#E9E9E9;
}

.Main {
	border: 1px solid gray;
	width:500px;
	border-radius:10px;
}

#company_help { 
	float: right;
	position:relative;
	left: -40px;
	top: 24px;
}
a { 
	font-style:italic;
	text-decoration:none;
}
div.help {
	font-style: normal;
	font-size:1.15em;
	border-radius: 50%;
	width: 20px; 
	height: 20px; 
	background-color:#337ab7;
	text-align: center;
	vertical-align: middle;
	display: inline-block;
	margin-left: 10px;
	color: #FFF;
}
div.help span {
	position:relative;
}
div.help:hover {
	background-color:#286090;
}

div.forgot {
	padding-right: 0px;
	position:relative;
	top:-20px;
}

button[type="submit"] {
	position:relative;
	top:-10px;
}

div.Fields {
	display:inline-block;
}

div.Background {
	background-image: url("../images/GlobeBG500.jpg"); 
	height:150px;
	width:500px; 
	border-radius:10px 10px 0px 0px;
}

div.Header {
	background-color:#0097dc; 
	color:White; 
	height:30px; 
	padding-top:12px; 
	padding-left:5px; 
	text-align:left; 
	vertical-align:text-top; 
	font-family:Arial, Helvetica, sans-serif;
	width:500px;
	padding-bottom:30px;
}

div.FieldWrapper {
	padding-top:20px;
	width:500px;
	background-color:white;
	border-radius: 0px 0px 10px 10px;
}

div.Logo{
	display:inline-block;
	text-align: left;
	width:200px;
	position:relative;
	top:-100px;
	left: -25px;
	/*transform:translate(-15%,-100%);*/
}
div.Fields {
	padding-top:20px;
	text-align: right;
	width:180px;
}

div.tiny_font {
	font-size: 7pt;
	color: #101010;
	margin: 0px 10px;
	padding-bottom:5px;
}


/* Used for transforming the Placholder text */

input.fancyPlaceholder {
	box-sizing: border-box;
	width: 100%; 
	height: calc(2em + 2px);
	margin: 0 0 1em;
	padding: 4px;
	border: 1px solid #ccc;
	border-radius: 5px;
	background: #fff;
	resize: none;
	outline: none;
}

input.fancyPlaceholder:focus {
	border-color: #66afe9;
}

input.fancyPlaceholder:focus + label[placeholder]:before,
input.fancyPlaceholder:valid + label[placeholder]:before {
	-webkit-transition-duration: .2s;
		transition-duration: .2s;
	-webkit-transform: translate(-0.5em, -1.3em) scale(0.8, 0.8);
		transform: translate(-0.5em, -1.3em) scale(0.8, 0.8);
	color: #0059A4;
	font-weight:bold;
}

input.fancyPlaceholder:invalid + label[placeholder][alt]:before {
	content: attr(alt);
}

input.fancyPlaceholder + label[placeholder] {
	display: block;
	pointer-events: none;
	line-height: 1.25em;
	margin-top: calc(-2.5em - 2px);
	margin-bottom: calc((2.5em - 1em) + 2px);
	text-align: left;

}

input.fancyPlaceholder + label[placeholder]:before {
	font-size: 1.2em;
	font-weight: normal;
	content: attr(placeholder);
	display: inline-block;
	margin-left: 2px;
	padding: 0 2px;
	color: #898989;
	white-space: nowrap;
	-webkit-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
	background-size: 100% 5px;
	background-repeat: no-repeat;
	background-position: center;
}