@charset "utf-8";
body {
  margin:0px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:1em; 
}
h1, h2, h3, h4, h5, h6, a { margin:0; padding:0;}

.login { margin:0 auto; max-width:590px; }

.login-form h2 {
  color:#fff;
  text-align:left;
  margin:22px 0 13px 18px;
  font-size: 2.59em;
}
.login-form h3 {
  text-align:left;
  margin-left:115px;
  font-size: 1em;
  color:#fff;
}
.login-form {
  background:#2E9AFE;
  background-repeat:no-repeat;
  box-sizing:border-box;
  padding-top:15px;
  margin:50px auto 0 auto;
  text-align:center;
  overflow: hidden;
  border-radius: 8px;
}
.login input[type="text"],
.login input[type="password"] {
  width: 100%;
  max-width:350px;
  height:29px;
  margin:10px 0;
  border-radius:5px;
  border:2px solid #99cccc;
  outline:none;
  padding: 5px 0;
  padding-left:8px;
  font-size: .97em;
}
.login-form input[type="button"] {
border: 2px solid #99cccc;
	font-size: 1em;
	font-weight: bold;
	background: none;
	cursor: pointer;
	padding: 12px 36px;
	display: inline-block;
	height: auto;
	width: 40%;
	max-width:150px;
	margin: 14px 2px 2px 2px;
	outline: none;
	background: #99cccc; 
	color:#333;
	border-radius:5px;
}
.login-form input[type="button"]:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.login-form input[type="button"]:hover {
	color: #333;
	background: #bce8f1;
	border-radius: 4px solid #99cccc;
	-webkit-transition:background 0.3s ease-in-out;
	-moz-transition:background 0.3s ease-in-out;
	transition:background-color 0.3s ease-in-out;
	
}
.login-form input[type="button"]:active {
	box-shadow:inset 0 1px 3px rgba(0,0,0,0.5);
}
.login-form input[type="submit"] {
border: 2px solid #99cccc;
	font-size: 1em;
	font-weight: bold;
	background: none;
	cursor: pointer;
	padding: 12px 36px;
	display: inline-block;
	height: auto;
	width: 40%;
	max-width:150px;
	margin: 14px 2px 2px 2px;
	outline: none;
	background: #99cccc; 
	color:#333;
	border-radius:5px;
}
.login-form input[type="submit"]:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.login-form input[type="submit"]:hover {
	color: #333;
	background: #bce8f1;
	border-radius: 4px solid #99cccc;
	-webkit-transition:background 0.3s ease-in-out;
	-moz-transition:background 0.3s ease-in-out;
	transition:background-color 0.3s ease-in-out;
}
.login-form input[type="submit"]:active {
	box-shadow:inset 0 1px 3px rgba(0,0,0,0.5);
}
.copy {
	color:#333333;
	font-size: .7em;
	margin:28px 0 13px 25px;
	text-align:left;
}
.no-access {
  color:#ffcc33;
  cursor:pointer;
  font-size: .85em;
  margin: 23px 0 20px 0;
  text-align:center;
  text-decoration:underline;
}
.try-again {
  color:#cc0000;
  font-size: .84em;
  font-weight: bold;
}
a:link {
	color:#336666;
	font-weight:bold;
	font-size: .93em;
}
a:hover { color:#669999; }
a:visited { color:#ffcc33; }
/***** Warnings *******/
.alert {
  padding: 8px 6px;
  margin: 0 auto;
  margin-bottom: 16px;
  border: 1px solid transparent;
  max-width: 350px;
  border-radius:5px;
}
.alert-success {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}
.alert-info {
  color: #0054a4;
  background-color: #d9edf7;
  border-color: #bce8f1;
}
.alert-warning {
  color: #cc9933;
  background-color: #fcf8e3;
  border-color: #faebcc;
}
.alert-danger {
  color: #990000;
  background-color: #f2dede;
  border-color: #ebccd1;
}
@media only screen and (min-width : 150px) and (max-width : 590px){
.login-form {
  margin:0px auto 0 auto;
    background-image:url(../img/logo.jpg);
}

.login-form h2 {
  text-align:center;
  margin:28px 0 13px 0;
}
  .login-form h3 {
    text-align:center;
    margin:0;
  }
  .no-access { margin:10px 0; }
  .login-button {
    margin-bottom:10px;
  }
  .login input[type="text"],
 .login input[type="password"],
 .alert {
  max-width:300px;
}
.copy { text-align:center; }
}