body {
	background:  var(--white);
	overflow-x:  hidden;
	overflow-y:  auto;
	min-height:  100%;
	width:       100%;
	font-size:   14px;
	text-align:  left;
	font-family: var(--font-family-global);
}
*:lang(en),
*:lang(fr),
*:lang(nl) {
	font-family: var(--font-family);
}
[dir=rtl] body {
	text-align:  right;
	font-family: var(--font-family-rtl);
}
body * {
	margin:  0;
	padding: 0;
}
body.custom-bg {
	height:          100%;
	background-size: cover;
}
body.default-bg {
	background:      var(--gray-100);
	height:          100%;
	background-size: cover;
}
h2 {
	font-size:   20px;
	text-align:  center;
	font-weight: 700;
}
.container {
	top:      60px;
	z-index:  120;
	width:    480px;
	padding:  0;
	position: relative;
}
input.form-control.has-error {
	border: 1px solid var(--primary) !important;
	color:  var(--primary) !important;
}
input::placeholder {color: var(--gray-300) !important;}
input:focus::-webkit-input-placeholder {
	color:   transparent;
	opacity: 0;
}
input:focus:-moz-placeholder {
	color:   transparent;
	opacity: 0;
}
.form-control {
	width:         400px;
	height:        50px;
	background:    #FFFFFF;
	border:        1px solid var(--gray-400);
	border-radius: 10px;
	font-weight:   400;
	font-size:     14px;
	line-height:   18px;
	color:         var(--gray-600);
}
[dir=ltr] #password-login {padding-right: 52px;}
[dir=rtl] #password-login {padding-left: 52px;}
.form-control:disabled,
.form-control[readonly] {
	border:           1px solid var(--gray-300) !important;
	background-color: var(--white);
	cursor:           default !important;
}
.cursor-default {cursor: default;}
.fa {
	-webkit-transition: all .15s ease-out;
	-moz-transition:    all .15s ease-out;
	-o-transition:      all .15s ease-out;
	transition:         all .15s ease-out;
}
a:hover,
a.btn-link,
a {
	outline:     0;
	border:      0;
	font-weight: 700;
	color:       var(--url-color);
}
hr {
	margin-bottom: 39px;
	border-color:  var(--gray-200);
}
.fa {font: normal normal normal 16px/1 'Font Awesome 5 Free';}
.fa-spinner {
	display:  none;
	position: absolute;
	top:      16px;
}
[dir=ltr] .fa-spinner {left: 10px;}
[dir=rtl] .fa-spinner {right: 10px;}
.text-danger {
	font-size:     12px;
	line-height:   16px;
	min-height:    20px;
	display:       block;
	color:         var(--danger) !important;
	margin-top:    5px;
	margin-bottom: 5px;
}
.uri-logo {display: block;}
.logo-image {
	width:         190px;
	height:        67px;
	margin-bottom: 15px;
}
.logo-image-block {
	background: url(../../img/auth_page/logo_keepgo.svg) no-repeat center;
	width:      193px;
	height:     77px;
	margin:     0 auto 60px;
}
.con-platform-text {
	font-size:      30px;
	margin-bottom:  30px;
	color:          var(--secondary);
	text-transform: uppercase;
}
.w-108 {width: 108px;}
.w-174 {width: 174px;}
.auth-icons {
	width:        35px;
	height:       35px;
	position:     absolute;
	left:         0;
	top:          4px;
	border-right: 1px solid var(--gray-300);
}
.email_description {
	padding-top:    5px;
	padding-bottom: 20px;
}
.user-icon,
.email-icon,
.lock-icon {background: url(../../img/auth_page/auth_icons_gray.png) no-repeat;}
.email-icon {background-position: -36px 10px;}
.lock-icon { background-position: 0 9px;}
.user-icon {background-position: -105px 9px;}
.cursor-text {cursor: text;}
.alert-success {
	border-radius:      10px;
	-webkit-box-shadow: 0 4px 26px rgba(36, 62, 86, 0.1);
	-moz-box-shadow:    0 4px 26px rgba(36, 62, 86, 0.1);
	box-shadow:         0 4px 26px rgba(36, 62, 86, 0.1);
}
span.eye {
	position: absolute;
	top:      27px;
	height:   50px;
	width:    50px;
	cursor:   pointer;
}
[dir=ltr] span.eye {
	right:       0;
	border-left: 1px solid var(--gray-400);
}
[dir=rtl] span.eye {
	left:         0;
	border-right: 1px solid var(--gray-400);
}
span.eye i {
	margin-top: 19px;
	color:      var(--gray-400);
}
[dir=ltr] span.eye i {margin-left: 15px;}
[dir=rtl] span.eye i {margin-right: 15px;}
span.eye .fa-eye {
	color:   var(--gray-600);
	display: none;
}
span.eye .fa-eye-slash {display: block;}
input[type=checkbox] + label {
	display: block;
	margin:  3px;
	cursor:  pointer;
	padding: 3px;
}
input[type=checkbox] + label:before {
	content:            url('../../img/svg_icons/checkbox.svg');
	display:            inline-block;
	width:              16px;
	height:             16px;
	font-size:          14px;
	background:         var(--white);
	border:             1px solid var(--gray-400);
	border-radius:      2px;
	margin-right:       5px;
	vertical-align:     top;
	color:              transparent;
	position:           absolute;
	-webkit-transition: all .2s ease-in-out;
	-moz-transition:    all .2s ease-in-out;
	-o-transition:      all .2s ease-in-out;
	transition:         all .2s ease-in-out;
	margin-left:        0;
}
[dir=ltr] input[type=checkbox] + label:before {left: 0;}
[dir=rtl] input[type=checkbox] + label:before {right: 0;}
input[type=checkbox] + label:active:before {
	-ms-transform: scale(0);
	transform:     scale(0);
}
input[type=checkbox]:checked + label:before {
	background-color: var(--url-color);
	border-color:     var(--url-color);
	color:            var(--white);
	font-weight:      700;
}
input[type=checkbox]:disabled + label:before {
	-ms-transform: scale(1);
	transform:     scale(1);
	border-color:  var(--gray-300);
}
input[type=checkbox]:checked:disabled + label:before {
	-ms-transform:    scale(1);
	transform:        scale(1);
	background-color: var(--success);
	border-color:     var(--success);
}
.out-wrapper {
	width:              480px;
	min-height:         575px;
	background:         var(--white);
	-webkit-box-shadow: 0 4px 26px rgba(36, 62, 86, 0.1);
	-moz-box-shadow:    0 4px 26px rgba(36, 62, 86, 0.1);
	box-shadow:         0 4px 26px rgba(36, 62, 86, 0.1);
	border-radius:      20px;
	padding:            40px;
}
#reset-password-sent-email.out-wrapper { min-height: 245px;}
#recovery-password-wrapper.out-wrapper { min-height: 340px;}
#reset-password-sent-email .reset-password-user-email {
	font-weight:   700;
	font-size:     14px;
	line-height:   18px;
	color:         var(--indigo);
	cursor:        default;
	margin-top:    10px;
	display:       block;
	margin-bottom: 20px;
}
#reset-password-sent-email .reset-password-user-email:hover {text-decoration: none;}
#auth-tabs {
	height:           39px;
	background-color: var(--white);
	border:           none;
	border-radius:    4px 4px 0 0;
}

#auth-tabs .nav-link {
	position:           relative;
	border:             0;
	padding:            0 16px 16px;
	height:             39px;
	width:              200px;
	text-align:         center;
	font-weight:        700;
	font-family:        var(--font-family);
	font-size:          16px;
	line-height:        19px;
	color:              var(--gray-600);
	border-bottom:      3px solid transparent;
	-webkit-transition: all .15s ease-in-out;
	-moz-transition:    all .15s ease-in-out;
	-o-transition:      all .15s ease-in-out;
	transition:         all .15s ease-in-out;
}
#auth-tabs .nav-link.active {
	color:         var(--indigo);
	border-bottom: 3px solid var(--url-color);
}
#auth-tabs a {
	text-align:         center;
	margin:             0;
	outline:            none;
	border:             none;
	height:             100%;
	-webkit-transition: none;
	-moz-transition:    none;
	-o-transition:      none;
	transition:         none;
}
#auth-tabs a:hover {
	border:        none;
	outline:       none;
	border-bottom: 3px solid var(--url-color);
	color:         var(--indigo);
}
.auth-title-txt {
	font-weight:   700;
	font-size:     18px;
	line-height:   22px;
	margin-top:    30px;
	margin-bottom: 20px;
	color:         var(--indigo);
}
#recovery-password-wrapper .auth-title-txt,
#reset-password-sent-email .auth-title-txt,
#recovery-password-wrapper .auth-title-txt {margin-top: 0;}
.auth-sub-title-txt {
	font-weight:   400;
	font-size:     14px;
	line-height:   18px;
	color:         var(--gray-600);
	margin-top:    10px;
	margin-bottom: 20px;
}
.auth-label {
	font-weight:   700;
	font-size:     14px;
	line-height:   18px;
	margin-bottom: 9px;
	color:         var(--indigo);
	display:       block;
}
.or-class {
	margin-top:    40px;
	margin-bottom: 20px;
	font-weight:   400;
	font-size:     14px;
	line-height:   18px;
	color:         var(--gray-600);
}
#sign-up .label-is-active,
#sign-in .remember-me-label {
	display:             inline-block;
	position:            relative;
	line-height:         16px;
	margin:              0;
	top:                 auto;
	cursor:              pointer;
	font-size:           14px;
	-webkit-user-select: none;
	-moz-user-select:    none;
	-ms-user-select:     none;
	user-select:         none;
}
[dir=ltr] #sign-up .label-is-active,
[dir=ltr] #sign-in .remember-me-label {
	padding: 0 0 30px 28px;
	left:    auto;
}
[dir=rtl] #sign-up .label-is-active,
[dir=rtl] #sign-in .remember-me-label {
	padding: 0 28px 30px 0;
	right:   auto;
}
#sign-up .label-is-active a,
#sign-in .remember-me-label a {text-decoration: underline;}
#sign-in input[type="checkbox"],
#sign-up input[type="checkbox"] {display: none;}
#sign-in .forgot-password-url {
	display:              inline-block;
	font-weight:          700;
	font-size:            14px;
	line-height:          18px;
	text-align:           right;
	text-decoration-line: underline;
	max-width:            190px;
	color:                var(--url-color);
}
[dir=ltr] #sign-in .forgot-password-url {float: right;}
[dir=rtl] #sign-in .forgot-password-url {float: left;}
#recovery-password-wrapper .back-to-login {
	font-weight: 700;
	font-size:   16px;
	line-height: 19px;
	color:       var(--gray-600);
	cursor:      pointer;
}
#recovery-password-wrapper .back-to-login svg {
	vertical-align: top;
	margin-top:     2px;
	margin-right:   4px;
}
[dir=rtl] #recovery-password-wrapper .back-to-login svg {
	-webkit-transform: rotate(180deg);
	-ms-transform:     rotate(180deg);
	-o-transform:      rotate(180deg);
	transform:         rotate(180deg);
}
#recovery-password-wrapper .reset-password,
#recovery-password-wrapper .recovery-password-button,
#sign-up .register-button,
#sign-in .login-button {
	width:         100%;
	min-width:     140px;
	height:        50px;
	border-radius: 10px;
	margin-top:    0;
	margin-bottom: 17px;
}
#recovery-password-wrapper .reset-password:focus,
#recovery-password-wrapper .recovery-password-button:focus,
#sign-up .register-button:focus,
#sign-in .login-button:focus {outline: none;}
[dir=ltr] #recovery-password-wrapper .reset-password,
[dir=ltr] #recovery-password-wrapper .recovery-password-button,
[dir=ltr] #sign-up .register-button,
[dir=ltr] #sign-in .login-button {margin-left: 0;}

[dir=rtl] #recovery-password-wrapper .reset-password,
[dir=rtl] #recovery-password-wrapper .recovery-password-button,
[dir=rtl] #sign-up .register-button,
[dir=rtl] #sign-in .login-button {margin-right: 0;}
#recovery-password-wrapper .reset-password { margin-bottom: 0;}
#recovery-password-wrapper .recovery-password-button {
	margin-bottom: 40px;
	margin-top:    0;
}
#sign-up .register-button {margin-top: 0;}

.social-networks-wrapper {
	display:         flex;
	align-content:   center;
	flex-wrap:       nowrap;
	justify-content: space-around;
	align-items:     center;
	gap:             20px;
}

.social-network-icons-button-wrapper {
	display:         flex;
	align-content:   center;
	flex-wrap:       nowrap;
	justify-content: center;
	align-items:     center;
	gap:             10px;
	cursor:          pointer;
	flex:            1;
	padding:         13px 10px;
	border-radius:   10px;
	background:      var(--white);
	box-shadow:      0 2px 6px 0 rgba(0, 0, 0, 0.08);
}

.social-network-icons-button-wrapper:hover {
	text-decoration: none;
	box-shadow:      2px 0 6px 0 rgba(0, 0, 0, 0.08);
}

.social-network-icons-button-wrapper h3 {
	font-weight: 700;
	font-size:   12px;
	line-height: normal;
	font-style:  normal;
	color:       var(--black);
}
.social-network-icon {
	width:   24px;
	height:  24px;
	display: inline-block;
	outline: none;
}

#sign-up .get-bonus {
	font-weight:    700;
	font-size:      12px;
	line-height:    24px;
	text-transform: uppercase;
	color:          var(--gray-600);
	display:        none;
}
#sign-up .get-bonus.elp {display: inline-block;}
#sign-up .get-bonus svg {
	vertical-align: top;
	margin-top:     18px;
}
#email-register.elp {
	width:   185px;
	display: inline-block;
}
.ms-24 {margin-left: 24px;}
.btn {
	width:              180px;
	height:             50px;
	border-radius:      25px;
	position:           relative;
	-webkit-transition: background-color .15s ease-in-out;
	-moz-transition:    background-color .15s ease-in-out;
	-o-transition:      background-color .15s ease-in-out;
	transition:         background-color .15s ease-in-out;
}

.lh-18 {line-height: 18px;}
.hidden {display: none;}
.notice-line-id {min-height: 20px;}
.bonus-2gb-img {
	display:        inline-block;
	background:     url(../../img/auth_page/bonus_2gb.png) no-repeat center;
	height:         55px;
	width:          42px;
	vertical-align: middle;
}
.notification-block {
	display:       flex;
	align-items:   flex-start;
	margin-bottom: 20px;
}
.notification-block::before {
	content:    '';
	width:      25px;
	height:     24px;
	margin:     auto 0;
	background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNSAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBzdHlsZT0id2lkdGg6IDI1cHg7Ij4KICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTIuNDk0IDBDNS44NjQgMCAwLjUgNS4zNzAwMSAwLjUgMTJDMC41IDE4LjYyOTkgNS44NjQgMjMuOTk5OSAxMi40OTQgMjMuOTk5OUMxOS4xMjQgMjMuOTk5OSAyNC41IDE4LjYyOTkgMjQuNSAxMkMyNC41IDUuMzcwMDEgMTkuMTI0IDAgMTIuNDk0IDBaTTEyLjUgMjEuNkM3LjE5NTk5IDIxLjYgMi44OTk5NiAxNy4zMDQgMi44OTk5NiAxMkMyLjg5OTk2IDYuNjk1OTQgNy4xOTU5OSAyLjQwMDAyIDEyLjUgMi40MDAwMkMxNy44MDM5IDIuNDAwMDIgMjIuMSA2LjY5NTk5IDIyLjEgMTJDMjIuMSAxNy4zMDM5IDE3LjgwNCAyMS42IDEyLjUgMjEuNloiIGZpbGw9IiNGMjM1MjYiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTMuNzAwMSAxNS42SDExLjNWMThIMTMuNzAwMVYxNS42WiIgZmlsbD0iI0YyMzUyNiI+PC9wYXRoPgogICAgICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik0xMy43MDAxIDZIMTEuM1YxMy4ySDEzLjcwMDFWNloiIGZpbGw9IiNGMjM1MjYiPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvc3ZnPg==");
}
.notification-block .notification-text {width: 100%;}
[dir=ltr] .notification-block .notification-text {
	text-align:    left;
	margin-right:  0;
	padding-right: 0;
}
[dir=rtl] .notification-block .notification-text {
	text-align:   right;
	margin-left:  0;
	padding-left: 0;
}

.bottom-banner {
	margin-top: 30px;
}
.bottom-banner img {
	max-width: 100%;
}
@media only screen and (max-width: 768px) {
	.container {
		top:        15px;
		margin-top: 20px;
	}
	.logo-image {
		width:  150px;
		height: 53px;
	}
	
	.con-platform-text {
		margin-bottom: 20px;
		font-size:     22px;
	}
	
	.w-108 {width: 26%;}
	
	.w-174 {width: 48%;}
	
	.or-class {margin-top: 20px; }
	
	.grecaptcha-badge,
	.swiper-container {display: none;}
	
	#email-register.elp {width: 100%;}
	
	#sign-up .get-bonus.elp {margin-top: 7px;}
	
	#sign-up .get-bonus svg {transform: rotate(90deg);}
	
}
@media only screen and (max-width: 576px) {
	.label-is-active,
	.btn,
	body * {font-size: 13px;}
	
	.ms-24 {margin-left: 28px;}
	
	.label-is-active {font-size: 13px;}
	
	.custom-btn-facebook.disabled {background-position: 10px -46px;}
	
	.custom-btn-google.disabled {background-position: -41px -46px;}
	
	.custom-btn-linkedin.disabled {background-position: -90px -45px;}
	
	.container {
		top:        0;
		margin-top: 44px;
        margin-bottom: 44px;
		width:      100%;
        height: 100vh;
	}
	
	.logo-image {
		width:         120px;
		height:        42px;
		margin-bottom: 5px;
	}
	
	.con-platform-text {
		margin-bottom: 15px;
		font-size:     20px;
	}
	
	#auth-tabs {
		width:  100%;
		margin: 0 auto;
	}
	
	#auth-tabs .nav-link {
		font-size: 13px;
		width:     50%;
		padding:   0 16px 10px;
		height:    30px;
	}
	
	.auth-title-txt {
		font-size:   16px;
		line-height: 19px;
		margin-top:  15px;
	}
	
	span.eye {
		top:    27px;
		height: 40px;
	}
	
	span.eye .fa-eye-slash {margin-top: 15px;}
	
	.element-form {height: 65px;}
	
	.logo-image-block {margin-bottom: 40px;}
	
	.out-wrapper {
		width:      90%;
		margin:     0 auto 60px;
		padding:    20px;
		min-height: 510px;
	}
	
	.register-content .label-is-active {line-height: 18px;}
	
	#confirm-registration-page .element-form label,
	.form-control {
		width:  100%;
		height: 40px;
	}
	
	.social-network-icons-button-wrapper {
		padding: 10px;
		flex:    0;
	}
	
	.social-networks-wrapper {
		justify-content: center;
		gap:             24px;
	}
	
	.social-network-icons-button-wrapper h3 {
		display: none;
	}
    
    .logo-image-block {
        background: url(../../img/auth_page/keepgo_logo_85x30.svg) no-repeat center;
        width:      85px;
        height:     30px;
        margin:     0 auto 16px;
    }
    
    [lang="de"] #sign-in .forgot-password-url{
        width: 100px;
        margin-bottom: 20px;
    }
}
@media only screen and (max-width: 320px) {
	.recovery-password-button {
		margin-top:    44px;
		margin-bottom: 40px;
	}
	
	.swiper-container-horizontal > .swiper-pagination-bullets { bottom: 8px; }
	
	.or-class {left: 15%;}
	
	hr {margin-bottom: 30px;}
}

.interrupted-line {
	color:         var(--gray-400);
	display:       flex;
	align-items:   center;
	text-align:    center;
	width:         100%;
	margin-bottom: 20px;
}
.interrupted-line::before,
.interrupted-line::after {
	content:       '';
	flex:          1;
	border-bottom: 1px solid var(--gray-400);
}
.interrupted-line:not(:empty)::before {
	margin-right: 3px;
}
.interrupted-line:not(:empty)::after {
	margin-left: 3px;
}


