html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}
h1 { font-size: 15px; }
.loginbox {
	margin: auto; 
	position: relative; 
}

.loginbox {
	font-family: Inter, Helvetica, Arial, sans-serif;
	line-height: 1em;
	width: 19.5em;
}
.loginbox .logo {
	width: 21.5em;
}
.loginbox h1 { 
	font-size: 18px; 
	color: #8A8A8A; 
	font-weight: normal; 
	padding: 0 0 20px 0; 
	text-align: center;
}
.loginbox .red {color: #EF6A28;}
.loginbox p { margin: 0; }
.button-space { margin: 10px 0 15px 0 !important; }
.loginbox label { display: block; color: #666; letter-spacing: 1px; font-size: 18px; }
.loginbox button { 
	background-color:#97CF40;
	cursor: pointer;
	border-radius:3px;
	text-indent:0;
	display:inline-block;
	color:#fff;
	font-family:Arial;
	font-size:19px;
	font-weight:bold;
	font-style:normal;
	height:37px;
	line-height:23px;
	text-decoration:none;
	text-align:center;
	width:100%;
	height:42px;
}
.loginbox button:hover {
	background-color:#fff;	
	border: 1px solid #97CF40;
	color: #97CF40;
}
.loginerror { 
	color: #990000; 
	background: #fbe3e3; 
	padding: 0 10px; 
	overflow: hidden; 
	display: none; }
.loginerror p { margin: 10px 0; }

.loginboxinner { 
	background: #fff; 
	padding: 20px; 
    position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid red;
	top: 10em;
}
.loginboxholder {
	justify-content: left;;
}

.loginheader {float: left; }

.loginform p {
	margin: 16px 0;
	color: #999;
	text-align: center;
}
.loginform a { 
	color: #88BB3A;
	border-bottom: 1px solid; 
	text-decoration: none; 
}

.loginform p.or {
	width: 100%; 
	text-align: center; 
	border-bottom: 1px solid #999; 
	line-height: 0.1em;
	margin: 30px 0; 
 } 
 
 .loginform p.or span { 
	 background:#fff; 
	 padding:0 10px; 
 }

form input[type="text"],  input[type="password"]  {
    padding: 10px 14px 12px 14px;
	height: 42px;
    background-color: #F8F8F8;
    border: 1px solid #888;
    color: #444;
    margin: 10px 0 0 0;
    font-size: 16px;
	text-align: left;
	border-radius: 3px;
}

form input::placeholder { color: #8A8A8A; }

.login-ad {
	padding: 0 5em 5em 5em;
	background-image: url(../images/chat-bg.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	background-color: #666;
	color: #fff;
	font-family: Inter, Helvetica, Arial, sans-serif;
	line-height: 1em;
	display: flex;
	justify-content: center;
	align-items: center;
}
.login-ad h2 {
	font-weight: 600;
	font-size: 40px;
	margin: 1em 0;
}
.login-ad h3 {
	font-weight: 500;
	font-size: 28px;
	line-height: 1.25em;
	margin: 1em 0;
}
.login-ad p {
	font-weight: 400;
	font-size: 20px;
	line-height: 1.5em;
}
.login-ad a {
	color: #fff;
	text-decoration: underline;
}

.title { font-family: Inter, Helvetica, Arial, sans-serif; }


@media screen and (max-width: 480px) {
	
	body { font-size: 16px; text-align: center; padding: 0 1.5em; }

	.grid-x > .small-6 { width: 100%;}
	.loginbox { width: auto; }
	input { width: 90% !important; margin: 0 auto !important; }
	.loginbox button { width: 90%; }
	img {max-width:100%;}

	.login-ad {display: none;}
}	
