/* =reset.css (by Andy Clarke) */

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, img, 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 { margin : 0; padding : 0; border : 0; outline : 0; font-weight : inherit; font-style : inherit; font-size : 100%; font-family : inherit; vertical-align: baseline; background : transparent; }

:focus { outline : 0; } 
ol, ul { list-style : none; }
/*table { border-collapse : collapse; border-spacing : 0; }*/
caption, th, td { text-align : left; font-weight : normal; }
button { overflow : visible; }


/* CLEARING
-------------------------------------------------------------*/

/* =clear */
.clear { clear: both; font-size: 1px; line-height: 0; }

/* =clearfix */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix {display: inline-block; }
/* Hides from IE-mac \*/ * html .clearfix { height: 1%; } .clearfix { display: block; } /* End hide from IE-mac */

/* =all-clear */
.all-clear { overflow: hidden; }
/*Because authors use "_height" as min-height in IE lt 7, it is important to turn the above declaration off in IE lt 7.*/
.all-clear { overflow: hidden; _overflow: visible; }
/*The declaration below is not directly related to the technique, but since we are using "overflow" I like to throw in a fix to prevent IE lt 7 from not respecting the width of a container and expanding its dimension depending on content (large image, long string, etc.).*/
.all-clear { overflow: hidden;	_overflow: visible; _overflow-x: hidden; }
/*Setting hasLayout in IE lt 7*/
.all-clear { overflow: hidden;	_overflow: visible; _overflow-x: hidden; _height: 0; }
/*Taking care of IE Mac*/
.all-clear {	overflow: hidden;	_overflow: visible; _overflow-x: hidden; _height: 0; }
/*\*//*/ 
.all-clear { display: inline-block; }
/**/

/* layout */
body { position: relative; font-family: Tahoma, sans-serif; font-size: 100%; font-weight: 400; -webkit-font-smoothing: antialiased; color: black; background: #F5F5F5; }
.container { padding: 80px 0; background: #F5F5F5; }
.login-box { text-align: center; width: 680px; padding: 40px 50px 0px; margin: 0 auto; }
.logo { float: left; }
h1 { clear: both; font-size: 32px; font-weight: 300; letter-spacing: -1px; padding: 60px 0 20px; }
form .form-group { margin-bottom: 10px; }
form input { font-size: 14px; width: 290px; padding: 10px 14px; border: none; }

form span.error { display: block; font-weight: 600; text-align: left; color: #fff; width: 288px; padding: 6px 16px; margin: 0 auto; background: #c00; }
form button { font-family: Tahoma, sans-serif; font-size: 20px; font-weight: 600; text-transform: uppercase; color: #fff; width: 320px; padding: 10px 14px; margin-bottom: 50px; margin-top: 20px; cursor: pointer; background: black; border: none; border-bottom: 1px solid black; }
form button:hover { background: black; }
form button:active { background: black; border-top: 1px solid black; border-bottom: none; }
form button.login { background: white; border: 1px solid gray; color: black; }
form button.login:hover { background: black; color: white; }
form button.login:active { background: black; border-top: 1px solid black; border-bottom: none; color: black;}
a { text-decoration: none; color: black; }
a:hover { color: #9A1563; }
p.footer { display: block; font-size: 14px; text-align: center; color: black; }

@media only screen and (max-width: 940px) {
	.container { padding-top: 4%; }
}

@media only screen and (max-width: 800px) {
	.container { padding: 0; }
	.login-box { width: auto; padding: 30px 30px 90px; background-size: 28%; background-position: 97% 20px; }
	.logo img { width: 240px; height: 109px; }
}

@media only screen and (max-width: 440px) {
	.login-box { width: auto; padding: 15px 15px 70px; }
	.logo img { width: 220px; height: 100px; }
	h1 { font-size: 28px; }
	p.footer { padding-top: 30px; }	
}

@media only screen and (max-width: 360px) {
	form input { width: 88%; }
	form button { width: 98%; }
}

form .alert { font-size: 20px; font-weight: 700; color: #fff; width: 290px; padding: 10px 14px; margin: 0 auto 10px; }
form .alert-danger {  background: #B30000; }
form .alert-success { background: #00A650; }