/*
		File: 	login.css
		Date: 	2014
		Auth:	Creativeink Design Group | web@creativeink.ca
		~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/

/*---------------------------------------------------------------------------- 
CORE HTML TAGS
-----------------------------------------------------------------------------*/
@import url("../../Config/bg.css");
@import url("../../Config/font.css");
@import url("../css/buttons.css");

body {
	margin:0px auto 0px auto;
	color:#000000;
	text-align:center;
	
	/* DISABLE HIGHLIGHT */
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
html {
	overflow-x: hidden;
}
a { text-decoration:none; }
a:link { color:#000000;  }
a:visited { color:#000000; }
a:hover { color:#000000; }
#wrapper {
	position: absolute;
	top: 50%;
	left: 0px;
	width: 100%;
	height: 1px;
	overflow: visible;
	visibility: visible;
	display: block;
}
#content {
	position: absolute;
	width: 900px;
	margin-left: -450px; /* HALF WIDTH */
	height: 520px;
	top: -260px; /* HALF HEIGHT */
	left: 50%;
}
#container { 
	width:420px; /* LOGIN PANEL WIDTH */
}
#logo {
	max-width:380px; 
	max-height:200px;
	margin-bottom:10px;
}





/*---------------------------------------------------------------------------- 
  LOGIN FORM
-----------------------------------------------------------------------------*/
.login {
  	width: 400px;
  	background-color: #ffffff;
  	box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.3);
  	margin: 100px auto;
}
.login h1 {
  	text-align: center;
  	color: #5b6574;
  	font-size: 24px;
  	padding: 20px 0 20px 0;
  	border-bottom: 1px solid #dee0e4;
}
.login form {
  	display: flex;
  	flex-wrap: wrap;
  	justify-content: center;
  	padding-top: 20px;
}
.login form label {
  	display: flex;
  	justify-content: center;
  	align-items: center;
  	width: 50px;
  	height: 50px;
  	background-color: #3274d6;
  	color: #ffffff;
}
.login form input[type="password"], .login form input[type="text"] {
  	width: 310px;
  	height: 50px;
  	border: 1px solid #dee0e4;
  	margin-bottom: 20px;
  	padding: 0 15px;
}
.login form input[type="submit"] {
  	width: 100%;
  	padding: 15px;
 	margin-top: 20px;
  	background-color: #3274d6;
  	border: 0;
  	cursor: pointer;
  	font-weight: bold;
  	color: #ffffff;
  	transition: background-color 0.2s;
}
.login form input[type="submit"]:hover {
	background-color: #2868c7;
  	transition: background-color 0.2s;
}


/*---------------------------------------------------------------------------- 
  TEXT
-----------------------------------------------------------------------------*/

.FormStyle { 
	padding:2px;
	text-align:center;
}
.error_msg { 
	margin-top:5px;
	padding-top:10px;
	padding-bottom:10px;
	background-color: #000000;
	font-weight:bold;
	font-size:18px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	color:#F00;
}
.table_rounded,th,td { 
	border:none;
	border-collapse:collapse;
	padding:10px;
}
.table_rounded	{ 
	background:#F2F2F2;
	padding:8px;
	border:1px solid #666666;
}
.table_rounded {
	-webkit-box-shadow:1px 1px 15px rgba(0,0,0,0.75);
	-moz-box-shadow:1px 1px 15px rgba(0,0,0,0.75);
	font-size:11px;
}

/* BROWSERS */
.browsers {  
	width:420px;
	text-decoration:none;
	padding:0;
	color:#0000000;
	border:1px solid #000000;
	-moz-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.6);
	-webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.6);
	box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.6);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#BEBEBE', endColorstr='#FFFFFFF');
	background: -webkit-gradient(linear, left top, left bottom, from(#BEBEBE), to(#FFFFFFF));
	background: -moz-linear-gradient(top,  #BEBEBE, #FFFFFFF);
}
.ie_alert { font-weight:bold; color:#FF0000; font-size:1.5em; }