/* RESET */
html, body, div, span,applet, object, iframe,
h1, h2, h3, h4, h5, h6,p, blockquote, pre, a, 
abbr, acronym, address,big, cite, code, del, 
dfn, em, font, ins, kbd, q, s,samp, small, 
strike, strong, sub, sup, tt, var,dl, dt, dd, 
ol, ul, li, fieldset, form, label,legend, 
table, caption, tbody,tfoot, thead, tr, th, td  { border:0; font-family:inherit; font-size:100%; font-style:inherit; font-weight:inherit; margin:0; outline:0; padding:0 }
table                                           { border-collapse:separate; border-spacing:0 }
caption, th, td                                 { font-weight:normal; text-align:left }
blockquote:before,blockquote:after              { content:"" }
a img                                           { border:0 }
:focus                                          { outline:none }
article,aside,details,figcaption,figure,footer,
header,hgroup,menu,nav,section                  { display:block }
body                                            { background:#fff; }
a                                               { color:inherit; text-decoration:none; outline:none }
p                                               { margin: 0 0 1.2em; padding:0; text-align:left }
input,textarea,select,button                    { font-family:inherit }
input[type="submit"]                            { cursor:pointer; outline:0 }


html, body{
	background:#eeeeee;
	font-family:Calibri, Arial, Helvetica, Tahoma;
	height:100%;
	overflow: hidden;
}

#login--wrapper {
	background: url(../img/bg-body.png) left center;		
	border: 1px solid #ddd;
  	width:250px;
  	height:275px;
  	padding: 20px;
  	text-align: center;
	position: absolute;
	top:0;
	bottom: 0;
	left: 0;
	right: 0; 
	margin:auto;
}

#logo {
	margin-bottom: 10px;
}

.msg {
	margin-bottom:15px;
}

form {
}

form div {
	display: block;
	float:left;
	margin-bottom:10px;
	width: 100%;
}

form label {
	float:left;
	margin-top:8px;
	width: 30%;
}

form input[type="text"],
form input[type="password"] {
	background: #fff;
	border:1px solid #ddd;
	float:right;
	padding:5px 10px;
	width: 65%;
	box-sizing : border-box;
}

.btn-ngrey {
	display: block;
	margin-left: 35%;
	margin-bottom: 30px;
	width: 65%;
	padding:2px 0;
}


.copyright {
	color: #666;
	margin-top: 20px; 
	text-align: center;
}

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

	#login--wrapper {
		position: relative;
		top:20px;
	}

}

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

	#login--wrapper {
		width: 80%;
		height: 300px;
	}

	form label {
		float:left;
		margin-top:8px;
		width: 30%;
	}

	form input[type="text"],
	form input[type="password"] {
		width: 100%;
		box-sizing : border-box;
	}

	.btn-ngrey {
		margin-left: 0; 
		width: 100%;
	}

}