
body {
	background:#fff;
	padding:0;
	margin:0;
	font-family: "Inter", sans-serif;
	font-weight: 400;
	font-size:14px;
	color:#000;
	overflow-x: hidden;
}

* {
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
}

ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

a {text-decoration: none;}

img {max-width:100%;}

::-webkit-input-placeholder { color:#aaaaaa;}
::-moz-placeholder {color:#aaaaaa;}
:-ms-input-placeholder { color:#aaaaaa;}
:-moz-placeholder { color:#aaaaaa;}


/* START:: ResAvenue Login Page */
.resLoginBg {
	background-color: #fff;
	background-position: left top;
	background-repeat: repeat;
	min-height: 100vh;
}
.resLogHeader {
	background-color: #fafcff;
	border-bottom: 1px solid #e3e3e3;
	padding: 35px 70px;
	box-shadow: 0 0px 10px rgba(0,0,0,0.09);
}
.resNavbar {
	position: relative;
	min-height: 44px;
	padding: 0 210px;
}
.resNavbar a.resLogo {
	display: block;
	width: 200px;
	position: absolute;
	left: 0;
	top: 7px;
}
.resNavbar .menu {
	font-size: 0;
	text-align: center;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}
.resNavbar .menu li {
	display: inline-block;
	padding: 0 45px;
}
.resNavbar .menu li a {
	font-size: 18px;
	color: #000;
	text-decoration: none;
	display: inline-block;
	line-height: 44px;
	position: relative;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}
.resNavbar .menu li a::after {
	content: '';
	display: block;
	background-color: #116bb5;
	width: 0;
	height: 5px;
	position: absolute;
	bottom: 0;
	left: 0;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}
.resNavbar .menu li a:hover,
.resNavbar .menu li.active a { 
	color: #116bb5;
}
.resNavbar .menu li a:hover::after,
.resNavbar .menu li.active a::after {
	width: 100%;
}

.resNavbar .resSignupBtn {
	background: linear-gradient(to right, #09304a 0%,#166eac 100%);
	width: 115px;
	height: 42px;
	line-height: 42px;
	font-size: 15px;
	font-weight: 500;
	text-align: center;
	color: #fff;
	position: absolute;
	right: 0;
	top: 1px;
	border-radius: 5px;
}

.resLoginContWrap {
	max-width: 1770px;
	width: 100%;
	margin: 0 auto;
	padding: 120px 70px 50px;
}
.resLoginContWrap::after {
	content: '';
	display: block;
	clear: both;
	overflow: hidden;
}
.resLoginContLeft {
	width: 100%;
	padding-left: 110px;
	padding-right: 650px;
}
.resLoginContLeft .leftTitle {
	font-size: 52px;
	font-weight: 700;
	color: #000;
}

.resLoginContLeft .leftTitle span {
	background: #F65031;
	background: linear-gradient(to right, #F65031 0%, #FF7100 50%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.resLoginContLeft .resContItems {padding-top: 60px;}
.resLoginContLeft .resContItems li {
	min-height: 72px;
	font-size: 18px;
	display: block;
	position: relative;
	padding-left: 100px;
	margin-bottom: 65px;
}
.resLoginContLeft .resContItems li:last-child {margin-bottom: 0;}
.resLoginContLeft .resContItems li img {position: absolute; left: 0; top: 0;}
.resLoginContLeft .resContItems li span {
	font-size: 23px;
	font-weight: 700;
	text-transform: uppercase;
	display: block;
	margin-bottom: 6px;
	padding-top: 8px;
	background: #F65031;
	background: linear-gradient(to right, #F65031 0%, #FF7100 50%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.menuToggle {
	background: linear-gradient(to right, #09304a 0%,#166eac 100%);
	width: 28px;
	height: 28px;
	padding: 4px 5px;
	position: absolute;
	left: 0;
	top: 8px;
	z-index: 99;
	border-radius: 5px;
	display: none;
	cursor: pointer;
}
.menuToggle span {
	background-color: #fff;
	width: 100%;
	height: 3px;
	display: block;
	margin: 3px 0;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}
.menuToggle.active span:nth-child(1) { transform: rotate(-45deg) translate(-3px, 4px);}
.menuToggle.active span:nth-child(2) { display: none;}
.menuToggle.active span:nth-child(3) { transform: rotate(45deg) translate(0px, -1px);}

.resLoginContRight {
	max-width: 530px;
	width: 100%;
	float: right;
}
.loginFormSection {
	background-color: #fff;
	border: 1px solid #f0f0f0;
	padding: 0 39px;
	box-shadow: 0 0px 15px rgba(0,0,0,0.07);
	border-radius: 10px;
	position: relative;
	overflow: hidden;
}
.loginFormSection .loginFormTitle {
	font-size: 18px;
	color: #1D242A;
	font-weight: 500;
	text-align: center;
	line-height: 25px;
	padding: 35px 0 34px;
}
.loginFormSection .loginTabs {
	font-size: 0;
	margin-bottom: 30px;
}
.loginFormSection .loginTabs a {
	background-color: #fbfcfe;
	width: 50%;
	font-size: 16px;
	font-weight: 500;
	text-transform: uppercase;
	display: inline-block;
	line-height: 48px;
	vertical-align: top;
	color: #2D2D2D;
	text-align: center;
	border: 1px solid #cbdbf2;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}
.loginFormSection .loginTabs a.crsTab {
	border-right-color: transparent;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
.loginFormSection .loginTabs a.cmTab {
	border-left-color: transparent;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}
.loginFormSection .loginTabs a.active {
	background-color: #e3efff;
	border-color: #b5cef2;
	color: #116BB5;
}

.loginFormSection .loginTabs a span.mob {display: none;}

.loginTabCont {display: none; position: relative; padding-bottom: 50px;}
.loginTabCont.active {display: block;}

.error-text {font-size:12px; color:red; padding:3px 0 0; display:none;}
.crsLoginField {
	background:#fff;
	margin-bottom:30px;
	position: relative;
}
.crsLoginField .input_label {
	font-size: 15px;
	color: #8FA3BE;
	padding: 0 5px;
	position: absolute;
	left: 10px;
	top: 15px;
	transition:all 300ms ease-in-out;
  	pointer-events:none;
}
.crsLoginField .form__input {
	background-color: transparent;
	border: 1px solid #c3d4ed;
	border-radius: 5px;
	outline: none;
	font-family: "Inter", sans-serif;
	font-size: 15px;
	width: 100%;
	padding: 15px 15px;
}
.crsLoginField .form__input:focus{
	border-color: #1d65b5;
}
.crsLoginField .form__input:focus~label,
.crsLoginField .form__input:not(:placeholder-shown)~label{
	background-color: #fff;
    font-size:13px;
	font-weight: 500;
	color:#165C8D;
	top:-8px;
    z-index:1;
}
.crsLoginField .form__input::-webkit-input-placeholder{ color:transparent;}
.crsLoginField .form__input::-moz-placeholder{ color:transparent;}
#pass_view,
#pass_view_cm {
	display: block;
	position: absolute;
	right: 18px;
	top: 17px;
}



.crs-btns {
	background: linear-gradient(to right, #09304a 0%,#166eac 100%);
	display: inline-block;
	text-decoration:none;
	width: 100%;
	height: 50px;
	line-height: 50px;
	text-align: center;
	border:0;
	outline:none;
	font-size: 18px;
	font-weight: 500;
	color: #fff;
	text-transform: uppercase;
	padding:0 15px;
	border-radius:5px;
	cursor: pointer;
}
.loginBtnField { margin-bottom: 15px;}

.forgotLinkRow { font-size: 0; text-align: center; color: #3273A9; padding-bottom: 30px; margin: 0 -12px;}
.forgotLinkRow a {
	font-size: 14px;
	color: #3273A9;
	text-decoration:none;
	margin:2px 0;
	display: inline-block;
	padding: 0 12px;
	vertical-align: top;
	border-right: 2px solid #6596be;
}
.forgotLinkRow a:last-child { border-right: 0;}

.loginBtmPanel {
	background: url(../images/login-btm-bg.png) no-repeat center top;
	width: 100%;
	height: 50px;
	text-align: center;
	position: absolute;
	left: 0;
	bottom: 0;
}
.loginBtmPanel > div {
	font-size: 15px;
	color: #1B1B1B;
	padding-top: 18px;
}
.loginBtmPanel > div a {color: #116BB5;}

.storeWrap {text-align: center; margin-bottom: 36px; font-size: 0;}
.storeWrap span {
	width: 50%;
	display: inline-block;
	vertical-align: top;
	border-right: 2px solid #1d65b5;
	padding-right: 15px;
	text-align: right;
}
.storeWrap span:last-child {
	border-right: 0; 
	text-align: left; 
	padding-left: 15px; 
	padding-right: 0;
}
.storeWrap span img {max-width: 100%;}

.crsFormInner {
	background-color: #fff;
	width: 100%;
	height: 100%;
	padding: 0 39px 110px;
	position: absolute;
	left: auto;
	right: -100%;
	top: 0;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
	z-index: 9;
}
.crsFormInner.open {right: 0;}

.crsFormInner .formInnerTop {
	padding-top: 50px;
	font-size: 16px;
	color: #1D242A;
	font-weight: 400;
	line-height: 25px;
	text-align: center;
	margin-bottom: 50px;
}
.crsFormInner .formInnerTop span {display: block; font-size: 20px; font-weight: 600; margin-bottom: 10px;}

.crsFormInner .crsFormInrFoot {
	width: 100%;
	height: 110px;
	padding: 0 39px;
	position: absolute;
	bottom: 0;
	left: 0;
}
.crsFormInner .crsFormInrFoot > div {
	padding-top: 30px;
	border-top: 1px solid #C3D4ED;
}
.crsFormInner .crsFormInrFoot > div:after {
	content: '';
	display: block;
	clear: both;
}
.crsFormInner .crsFormInrFoot .backBtn {
	height: 50px;
	display: inline-block;
	line-height: 50px;
	padding-left: 30px;
	padding-right: 5px;
	font-size: 16px;
	color: #121212;
	position: relative;
	float: left;
}
.crsFormInner .crsFormInrFoot .backBtn .icon {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.crsFormInner .crsFormInrFoot .crs-btns {
	width: 225px;
	font-size: 16px;
	float: right;
}
/* END:: ResAvenue Login Page */


/* Responsive CSS */
@media (max-width:1580px) {
	.resLogHeader {padding-left: 20px; padding-right: 20px;}
	.resNavbar .menu li {padding: 0 35px;}
	.resLoginContLeft {padding-left: 0;}
}
@media (max-width:1359px) {
	.resNavbar a.resLogo {width: 150px; top: 11px;}
	.resNavbar .menu li {padding: 0 20px;}
	.resLoginContWrap { padding-top: 80px; padding-left: 20px; padding-right: 20px;}
	.resLoginContLeft .leftTitle {font-size: 42px;}
}
@media (max-width:1169px) {
	.resNavbar .menu li {padding: 0 14px;}
	.resNavbar .menu li a {font-size: 15px;}
	.resLoginContLeft {padding-right: 560px;}
	.resLoginContLeft .leftTitle {font-size: 36px;}
	.resLoginContLeft .resContItems li span {padding-top: 0;}
}
@media (max-width:1023px) {
	.resLoginBg {
		position: relative;
		left: 0;
		-webkit-transition: all 0.4s ease-in-out;
		-moz-transition: all 0.4s ease-in-out;
		-ms-transition: all 0.4s ease-in-out;
		transition: all 0.4s ease-in-out;
	}
	.maximizeMenu.resLoginBg {left: 220px;}

	.menuToggle {display: block;}
	.resLogHeader {padding: 20px;}
	.resNavbar a.resLogo {
		left: 50%;
		-webkit-transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		transform: translateX(-50%);
	}
	.resNavbar {padding: 0;}
	.resNavbar .menu { background-color: #fafcff; width: 220px; height: 100%; padding: 20px; text-align: left; position: fixed; left: -220px; top: 0; z-index: 99;}
	.maximizeMenu .resNavbar .menu {left: 0; box-shadow: 8px 0 8px -8px rgba(0,0,0,0.09);}

	.resNavbar .menu li {display: block; padding: 0;}
	.resLoginContWrap {padding-top: 50px;}
	.resLoginContLeft {max-width: 530px; margin: 0 auto; padding: 50px 0 0;}
	.resLoginContRight {float: none; margin: 0 auto;}
}

@media (max-width:767px) {
	.resNavbar .resSignupBtn {width: 78px;}
	.resLoginContWrap {padding-top: 30px;}
	.loginFormSection .loginTabs a {font-size: 15px;}
	.loginFormSection {padding-left: 20px; padding-right: 20px;}
	.crsFormInner, .crsFormInner .crsFormInrFoot {padding-left: 20px; padding-right: 20px;}
	.resLoginContLeft { display:none;}
	
	
}
@media (max-width:479px) {
	.resNavbar a.resLogo { width: 120px; top: 13px;}
	.loginFormSection .loginTabs a span.mob {display: inline-block;}
	.loginFormSection .loginTabs a span.deskt {display: none;}
	.crsFormInner .crsFormInrFoot .crs-btns {width: auto; font-size: 15px;}
	.crsFormInner .crsFormInrFoot .backBtn {padding-left: 25px; font-size: 15px;}
}


/* Start of Pass view/hide toggle btn 
===================================== */

/* Default state – password hidden */
#pass_view.hide-pass .viewPassIcon {
    display: inline-block;
}
#pass_view.hide-pass .hidePassIcon {
    display: none;
}

/* When password is visible */
#pass_view.show-pass .viewPassIcon {
    display: none;
}
#pass_view.show-pass .hidePassIcon {
    display: inline-block;
}
#pass_view{
	color:#6a99bf;
}

/* End of Pass view/hide toggle btn 
===================================== */

/* Start of Get New Pass btn 
===================================== */
.passRecoveryMsg {
	background-color: #fff;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 999;
	display: flex;
	align-items: center;
	justify-content: center;
}
.passRecoveryMsg .contMsg {
	font-size: 16px;
	color: #1D242A;
	font-weight: 400;
	line-height: 25px;
	text-align: center;
}
.passRecoveryMsg .contMsg .crs-btns {
	max-width: 200px;
	margin: 50px auto 0;
	display: block;
}
/* End of Get New Pass btn 
===================================== */
