body
{
	background: black;
	overflow: hidden;
}
.background-wrapper {
	position: fixed;
	left: 0;
	right: 0;
	z-index: 1;
	display: block;
    background: #000 url(background.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width: 105%;
    height: 105vh;
	transition: all 0.4s ease-in-out;
	animation: bf-zoom 10s ease-in-out 0.6;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-delay: 0.6s;
}
.sem-login
{
	position: fixed;
	top: 50%;
	left: 50%;
	width: 320px;
	transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transition: all 0.3s ease-in-out 0.4s;
	z-index: 2;
}
.brand-logo
{
	display: inline-block;
	width: 120px;
	height: 40px;
    background: transparent url(SEM_Logo.png);
    position: absolute;
    bottom: -50px;
    left: 50%;
    transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    opacity: 0;
	transition: all 0.3s ease-in-out;
	z-index: 2;
}
.panel-login
{
	width: 382px;
	border-radius: 100%;
	transform: scale(0.1, 0.1) translateX(-100px) translateY(-100px);
	overflow: hidden;
	opacity: 0;
	transition: all 0.3s ease-in-out 0.51s;
	position: relative;
	overflow: hidden !important;
}
.insider
{
	opacity: 0;
	transition: all 0.3s ease-in-out 0.61s;
	position: relative;
	transform: translate(0, 30px);
	padding: 10px;
}
.insider .panel-header h1
{
	text-transform: uppercase;
	font-size: 20px;
	padding: 12px 14px;
}
.insider label
{
	font-weight: 500;
	color: #656565;
}
.insider .panel-footer
{
	background: none;
	border: none;
	padding-top: 0;
}
.insider .panel-footer button
{
	line-height: 2.2;
}
body.load .panel-login
{
	opacity: 1;
	transform: scale(1, 1) translateX(-30px) translateY(0px);
	overflow: auto;
	border-radius: 3px;
}
body.load .insider
{
	opacity: 1;
	transform: translate(0, 0);
}
body.load .brand-logo
{
	opacity: 0.4;
    bottom: 15px;
}
body.load .background-wrapper
{
	opacity: 0.7;
}
.login-options button:x-child
{
	float: right;
}
/* Change the white to any color ;) */
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 20px white inset;
    border-bottom: 1px solid #d2d2d2;
}
input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 20px white inset;
    border-bottom: 1px solid #d2d2d2;
}
@keyframes bf-zoom
{
	0%
	{
		-webkit-filter: blur(5px);
		  -moz-filter: blur(5px);
		  -o-filter: blur(5px);
		  -ms-filter: blur(5px);
		  filter: blur(5px);
	}
	100%
	{
		/*transform: scale(1.3, 1.3);*/
    	-webkit-filter: blur(5px);
		  -moz-filter: blur(5px);
		  -o-filter: blur(5px);
		  -ms-filter: blur(5px);
		  filter: blur(5px); 
	}
}

.form-resetpw
{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	transition: all 0.3s ease-in-out;
	z-index: -1;
	visibility: hidden;
}
.resetpw-wrapper
{
	background: #f44336;
	border-radius: 1025px;
	transition: all 0.3s ease-in-out;
	position: absolute;
	bottom: 41px;
	left: 90px;
	width: 4px;
	height: 4px;
	opacity: 0;
	visibility: hidden;
}
.form-resetpw.focus .resetpw-wrapper
{
	transform: scale(185, 185);
	bottom: 91px;
	left: 160px;
	opacity: 1;
	visibility: visible;
}
.form-resetpw.focus
{
	width: 100%;
	height: 382px;
	top: 0;
	left: 0;
	z-index: 1;
	visibility: visible;
}
.panel-resetpw
{
	color: #fff;
	background: transparent;
	z-index: 3;
	position: absolute;
	top: 30px;
	left: 0;
	width: 100%;
	padding: 10px;
	opacity: 0;
	box-shadow: none;
}
.form-resetpw.focus .panel-resetpw
{
	top: 0;
	opacity: 1;
	transition: all 0.3s ease-in-out 0.3s;
}
.panel-resetpw .panel-header h1,
.panel-resetpw .panel-body label
{
	color: #F0F0F0;
}
.panel-resetpw .panel-body .form-control
{
	background: transparent !important;
	border-bottom: 1px solid #E5E5E5;
	color: #E5E5E5;
}

.btn-cancel-resetpw
{
	position: absolute;
	top: 0;
	right: 10px;
	color: #FFFFFF !important;
	opacity: 0.6;
	font-size: 0px;
	padding: 5px;
	width: 20px;
	height: 20px;
	background: url(times.png) no-repeat;
	transition: opacity 0.2s ease-in-out;
	-webkit-transition: opacity 0.2s ease-in-out;
	-moz-transition: opacity 0.2s ease-in-out;
	-o-transition: opacity 0.2s ease-in-out;
}
.btn-cancel-resetpw:hover,
.btn-cancel-resetpw:focus
{
	opacity: 1;
	box-shadow: none !important;
	border: none !important;
	outline: none !important;
}
.btn-white
{
	background: #F0F0F0;
	color: #f44336 !important;
}
body.register-new-user .panel-login
{
	width: 600px;
	transform: scale(1, 1) translateX(-135px) translateY(0px);
	transition: all 0.3s ease-in-out 0.3s;
}