
:root {
	--button-height: 52px;
	--input-height: 52px;
}
.sect-login{
	min-height: calc(100vh - 152px);
	display: flex;
}
.sect-login .login-frame{min-height: 100%;}
.sect-login .img-holder{
	position: relative;
	background: url(/images/login-banner.png);
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
}
.sect-login .img-holder:after{
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	background: rgba(var(--primary-color), .3);
	z-index: 1;
}
.sect-login .img-holder *{position: relative;z-index: 9;}
.sect-login .outer-frame{
	--width: 65%;
	max-width: var(--width);
	flex: 0 0 var(--width);
	width: 100%;
}

.outer-frame {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.login-form label{margin-bottom: .2rem;}
.btn{
	padding: 0.675rem .75rem;
}

@media only screen  and (max-width: 991px){
	.sect-login{height: auto;}
	.sect-login .outer-frame{--width: 100%;}
}
@media only screen  and (max-width: 767px){
	.sect-login .img-holder{min-height: 270px;}
}
.devider-or{
	text-align: center;
	position: relative;
	color: var(--dark-color-50);
	margin-bottom: 20px;
}
.devider-or:after{
	content: '';
	position: absolute;
	left: 0;
	height: 1px;
	width: 100%;
	top: 50%;
	transform: translateY(-50%);
	background: var(--dark-color-50);
	z-index: 1;
}
.devider-or span{display: inline-block;background: var(--body-color); padding: 1px 7px;z-index: 7;position: relative;}