


#f_account {
	background: linear-gradient(0deg, rgba(255, 255, 255, 1) 75%, rgba(246, 246, 246, 1) 100%);
}


#f_account .min_wrap {


	display: flex;


	gap: 12rem;


	flex-wrap: wrap;


	align-items: flex-end;


}





.l_f_account {


	flex: 1;


	min-width: 0.1rem;


	color: #fff;


	display: flex;


	flex-direction: column;


	justify-content: center;


	position: sticky;


	bottom: 0;


} 


.r_f_account {


	flex: 1;


	padding: 6rem 0;


	min-height: 60rem;


} 





.shape-05 {


	padding: 0 4rem;


}


.shape-05 img {


	display: block;


	width: 100%;


	height: auto;


}





.form_acc {
	font-size: 12px;


	display: flex;


	flex-direction: column;


	gap: var(--gap20);


	background-color: #fff;


	padding: 3.2rem;


	box-shadow: 0 0.8rem 1.6rem rgba(0,0,0,0.1);


	border-radius: 0.8rem;


	-webkit-border-radius: 0.8rem;


	-moz-border-radius: 0.8rem;


	-ms-border-radius: 0.8rem;


	-o-border-radius: 0.8rem;


}


.form_acc .til_ct_cont {


	padding-top: 0;


}





.i_r_f_account {


	background: #fff url(../imgs/shape-01.png) no-repeat top right;


	background-size: 50% auto;


	box-shadow: 0 0.4rem 0.4rem rgba(0, 0, 0, 0.05);


	padding: 3.2rem;


	border-radius: 10px;


	-webkit-border-radius: 10px;


	-moz-border-radius: 10px;


	-ms-border-radius: 10px;


	-o-border-radius: 10px;


}





.t_f_account {


	font-size: var(--font-size-32);


	font-weight: 600;


	padding-bottom: 2.4rem;


}


.ul_f_account {


	display: flex;


	flex-direction: column;


	gap: 16px;


}


.ul_f_account > li {


	user-select: none;


	position: relative;


}


.ol_f_account {


	display: flex;


	flex-wrap: wrap;


	gap: 16px;


}


.ol_f_account > li {


	flex: 1;


}


.ol_f_account > li label {


	display: block;


	line-height: 42px;


	cursor: pointer;


	font-size: 14px;


	padding: 0 16px;


	border: 1px solid #cfd6e4;


	border-radius: 4px;


	-webkit-border-radius: 4px;


	-moz-border-radius: 4px;


	-ms-border-radius: 4px;


	-o-border-radius: 4px;


}


.ol_f_account > li label input {


	cursor: pointer;


	position: relative;


	top: 1px;


	margin-right: 3px;


}


.ol_f_account > li label:checked {


	background-color: #000;


}


.ipt_f_account {


	width: 100%;


	height: 44px;


	border: 1px solid #cfd6e4;


	padding: 0 16px;


	font-size: 14px;


	border-radius: 4px;


	-webkit-border-radius: 4px;


	-moz-border-radius: 4px;


	-ms-border-radius: 4px;


	-o-border-radius: 4px;


	transition: .3s;


	-webkit-transition: .3s;


	-moz-transition: .3s;


	-ms-transition: .3s;


	-o-transition: .3s;


}


.ipt_f_account:focus {


	border-color: var(--tailwind-500);


}


.ico_showpass {


	width: 44px; height: 44px;


	text-align: center;


	line-height: 44px;


	position: absolute;


	top: 0; right: 0;


	z-index: 1;


	cursor: pointer;


	user-select: none;


}


.ico_showpass::before {


	font-family: "Font Awesome 7 Pro";


	font-weight: 300;


	content: "\f070";


}


.ico_showpass.active::before {


	content: "\f06e";


}


.but_f_account {


	width: 100%;


	height: 44px;


	background: var(--tailwind-600);


	border: 0;


	cursor: pointer;


	font-weight: 600;


	font-size: 16px;


	color: #fff;


	border-radius: 4px;


	-webkit-border-radius: 4px;


	-moz-border-radius: 4px;


	-ms-border-radius: 4px;


	-o-border-radius: 4px;


	margin-top: 8px;


	transition: .3s;


	-webkit-transition: .3s;


	-moz-transition: .3s;


	-ms-transition: .3s;


	-o-transition: .3s;


}


.but_f_account:hover, .but_f_account:active .but_f_account:focus {


	background-color: var(--PrimaryColor);


}


.bot_ul_f_account {


	display: flex;


	flex-wrap: wrap;


	justify-content: space-between;


	align-items: baseline;


	color: rgba(34,37,49,.7);


}


.bot_ul_f_account label {


	cursor: pointer;


}


.bot_ul_f_account input {


	cursor: pointer;


	position: relative;


	top: 1px;


}


.bot_ul_f_account a {


	color: var(--tailwind-600);


}


.line_f_accpunt {


	height: 1px;


	background-color: #cfd6e4;


	position: relative;


}


.line_f_accpunt span {


	white-space: nowrap;


	font-size: 12px;


	line-height: 12px;


	text-transform: uppercase;


	position: absolute;


	top: -6px;


	left: 50%;


	color: rgba(34,37,49,.7);


	margin: auto;


	background-color: #fff;


	padding: 0 16px;


	display: inline-block;


	transform: translateX(-50%);


	-webkit-transform: translateX(-50%);


	-moz-transform: translateX(-50%);


	-ms-transform: translateX(-50%);


	-o-transform: translateX(-50%);


}


.lk_f_account {


	display: flex;


	flex-wrap: wrap;


	gap: 1.6rem;


}


.lk_f_account a {


	display: flex;


	justify-content: center;


	align-items: center;


	flex: 1;


	text-align: center;


	padding: 9px 16px;


	color: rgba(34,37,49,.7);


	border: 1px solid #cfd6e4;


	font-weight: 600;


	border-radius: 4px;


	-webkit-border-radius: 4px;


	-moz-border-radius: 4px;


	-ms-border-radius: 4px;


	-o-border-radius: 4px;


	transition: .3s;


	-webkit-transition: .3s;


	-moz-transition: .3s;


	-ms-transition: .3s;


	-o-transition: .3s;


}


.lk_f_account img {


	display: inline-block;


	width: auto;


	height: 24px;


	padding-right: .8rem;


}


.lk_f_account a:hover {


	background-color: var(--tailwind-50);


}


.link_f_account {


	text-align: center;


}


.link_f_account p {


	color: rgba(34,37,49,.7);


}


.link_f_account a {


	color: var(--tailwind-600);


}


.bot_ul_f_account a, .link_f_account a:hover {


	text-decoration: underline;


}





/************************************************************************************


RESPOSIVE


*************************************************************************************/





@media only screen and (max-width: 1280px) {


	.r_f_account {


		padding: 6rem 2rem;


	}


	.form_acc {


		max-width: 100%;


	}


}





@media only screen and (max-width: 1024px) {


	.shape-05 {


		display: none;


	}


}





@media only screen and (max-width: 1023px) {


	#f_login {


		display: block;


	}


	.l_f_login {


		height: auto;


		position: relative;


		min-width: 100%;


	}


	.r_f_login {


		min-height: inherit;


	}


	.r_f_account {


		padding: 4.8rem 10%;


	}





	.text_l_f_login, .l_f_account {


		display: none;


	}


}





@media only screen and (max-width: 480px) {


	.logo_f_login {


		width: 48px;


		height: 48px;


		padding: .8rem;


		border-radius: 16px;


		-webkit-border-radius: 16px;


		-moz-border-radius: 16px;


		-ms-border-radius: 16px;


		-o-border-radius: 16px;


	}


	.l_f_login {


		padding: 2.4rem;


	}


	.r_f_login {


		padding: 3.2rem 2.4rem;


	}


	.r_f_account {


		padding: 4rem 0;


	}


	.form_acc {


		padding: 2rem;


	}


}