@charset "utf-8";

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}

/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display: block;}
body {line-height: 1;}
ol,ul {list-style: none;}
blockquote,q {quotes: none;}
blockquote:before,blockquote:after,q:before,q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}

@font-face {
    font-family: 'Expo Arabic';
    src: url('./fonts/ExpoArabic-Medium.eot');
    src: url('./fonts/ExpoArabic-Medium.eot?#iefix') format('embedded-opentype'),
        url('./fonts/ExpoArabic-Medium.woff2') format('woff2'),
        url('./fonts/ExpoArabic-Medium.woff') format('woff'),
        url('./fonts/ExpoArabic-Medium.ttf') format('truetype'),
        url('./fonts/ExpoArabic-Medium.svg#ExpoArabic-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Expo Arabic';
    src: url('./fonts/ExpoArabic-Book.eot');
    src: url('./fonts/ExpoArabic-Book.eot?#iefix') format('embedded-opentype'),
        url('./fonts/ExpoArabic-Book.woff2') format('woff2'),
        url('./fonts/ExpoArabic-Book.woff') format('woff'),
        url('./fonts/ExpoArabic-Book.ttf') format('truetype'),
        url('./fonts/ExpoArabic-Book.svg#ExpoArabic-Book') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Expo Arabic';
    src: url('./fonts/ExpoArabic-SemiBold.eot');
    src: url('./fonts/ExpoArabic-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('./fonts/ExpoArabic-SemiBold.woff2') format('woff2'),
        url('./fonts/ExpoArabic-SemiBold.woff') format('woff'),
        url('./fonts/ExpoArabic-SemiBold.ttf') format('truetype'),
        url('./fonts/ExpoArabic-SemiBold.svg#ExpoArabic-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* General 
--------------------------------------------------------------------------------------------------------*/
* {outline: none !important;box-sizing: border-box;}
html,body {min-width: 320px;min-height: 100vh;}
body {-ms-overflow-style: scrollbar;-webkit-font-smoothing: subpixel-antialiased;font-family: "Expo Arabic", sans-serif;color: #1A1B1F;background: rgba(242, 240, 244, 1);font-size: 16px;line-height: 24px;letter-spacing: 0.5px;}
input[type=text],input[type=email],input[type=password],textarea {-webkit-appearance: none;appearance: none;}
strong {font-weight: 700;}
h4,.h4 {font-size: 32px;font-weight: 600;line-height: 40px;}
h6,.h6 {font-size: 24px;font-weight: 600;line-height: 32px;}
.container {max-width: 1140px;margin: 0 auto;padding: 0 16px;}
button {cursor: pointer;}
.unordered-list {padding-left: 20px;list-style-type: disc;}
.ordered-list {padding-left: 20px;list-style-type: number;}
.primary-link {color: #1f299b;text-decoration: none;}
.primary-link:hover,.primary-link:focus,.primary-link:hover {text-decoration: underline;}
.policy-page {min-height: 100vh;background: #f2f0f4;padding-bottom: 40px;}
.policy-page .logo-wrapper {background-color: #19217c;padding: 24px 0;}
.policy-page .logo-wrapper .logo {display: block;height: 48px;}
.policy-page .logo-wrapper .container {display: flex;align-items: center;}
.policy-page .language-btn {margin-left: auto;color: #fff;align-items: center;border: 2px solid #0000;border-radius: 8px;display: inline-flex;font-size: 14px;font-weight: 500;height: auto;justify-content: center;letter-spacing: .1px;line-height: 20px;padding: 10px 22px 6px;appearance: none;-webkit-box-align: center;-webkit-box-pack: center;user-select: none;position: relative;white-space: nowrap;vertical-align: middle;outline-offset: 2px;transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;transition-duration: 200ms;font-family: inherit;}
.policy-page .language-btn,.policy-page .language-btn:active,.policy-page .language-btn:focus,.policy-page .language-btn:hover {background: none;box-shadow: none;}
.policy-page .language-btn:active,.policy-page .language-btn:focus,.policy-page .language-btn:hover {background-color: #ffffff29;}
.policy-page .language-btn img:first-child {margin-left: -8px;margin-right: 6px;display: block;height: 24px;margin-bottom: -2px;margin-top: -2px;position: relative;top: -2px;width: 24px;}
.back-btn {margin-left: -8px;margin-right: 4px;position: relative;top: -2px;padding: 10px;background: none;border: 0;border-radius: 50px;box-shadow: none;height: auto;min-width: auto;width: auto;display: inline-flex;appearance: none;-webkit-box-align: center;align-items: center;-webkit-box-pack: center;justify-content: center;user-select: none;white-space: nowrap;vertical-align: middle;outline-offset: 2px;transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;transition-duration: 200ms;}
.back-btn>img {display: block;height: 24px;width: 24px;}
.back-btn:active,.back-btn:focus,.back-btn:hover {background-color: #00000029;}
.policy-page .head-block {padding: 20px 0 92px;background-color: #1f299b;color: #fff;}
.policy-page .head-block .container {display: flex;align-items: center;}
.policy-page .content {margin-top: -72px;font-size: 14px;font-weight: 400;line-height: 20px;letter-spacing: 0.25px;}
.primary-card {background-color: #fff;box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.060), 0px 1px 3px rgba(0, 0, 0, 0.100);border-radius: 8px;}
.policy-page .content .primary-card {padding: 40px;}
.policy-page .ordered-list {padding-left: 20px;list-style: decimal;}
.policy-page .ordered-list.alpha {list-style: lower-alpha;}
.policy-page .unordered-list {padding-left: 20px;list-style: disc;}

/* login
--------------------------------------------------------------------------------------------------------*/
.login-layout{min-height: 100vh;background: #fff;position: relative;display: flex;}
.login-layout:after{position: absolute;content: '';display: block;width: 1px;top: 24%;bottom: 24%;background-color: #c7c6ca;left: 50%;}
.login-layout .btn.language-btn.btn-text{color: #1a1b1f;opacity: 0.72;position: absolute;right: 16px;top: 16px;background: none;box-shadow: none;align-items: center;border: 2px solid #0000;border-radius: 8px;display: inline-flex;font-size: 14px;font-weight: 500;height: auto;justify-content: center;letter-spacing: .1px;line-height: 20px;padding: 10px 22px 6px;appearance: none;-webkit-box-align: center;-webkit-box-pack: center;user-select: none;white-space: nowrap;vertical-align: middle;outline-offset: 2px;transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;transition-duration: 200ms;font-family: inherit;}
.login-layout .btn.language-btn.btn-text:hover,.login-layout .btn.language-btn.btn-text:focus,.login-layout .btn.language-btn.btn-text:active{opacity: 1;background-color: #f2f0f4;}
.login-layout .btn.language-btn.btn-text:focus{box-shadow:0 0 0 4px #c7c6ca;}
.login-layout .btn.language-btn.btn-text img:first-child {margin-left: -8px;margin-right: 6px;}
.login-layout .btn.language-btn.btn-text img {display: block;height: 24px;margin-bottom: -2px;margin-top: -2px;position: relative;top: -2px;width: 24px;}
.login-layout .left-block,.login-layout .right-block{flex-grow: 0;flex-basis: 50%;flex-shrink: 0;max-width: 50%;display: flex;flex-direction: column;align-items: center;}
.login-layout .right-block{justify-content: center;padding: 0 16px;}
.login-layout .left-block{padding: 48px 32px 32px;}
.login-layout .logo{display: inline-block;vertical-align: top;}
.login-layout .logo >img{display: block;height: 48px;width: 180px;}
.login-layout .logo-vrl{display: inline-block;vertical-align: top; margin-top: -50px; margin-bottom: -150px;}
.login-layout .logo-vrl >img{display: block;height: 220px;width: 270px;}
.login-layout .policies{padding-top: 32px;padding-bottom: 8px;text-align: center;}
.login-layout .policies>li{padding: 0 8px 8px;display: inline-block;vertical-align: top;}
.login-layout .copyright{color: #1a1b1f;opacity: 0.64;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0.25px;text-align: center;}
.login-layout .login-form{margin-top: auto;margin-bottom: auto;width: 320px;max-width: 100%;padding: 48px 0;}
.login-layout .login-form .login-subtitle{font-size:16px;font-weight:600;line-height:24px;letter-spacing:0.5px;color: #1a1b1f;opacity: 0.56;padding-bottom: 24px;}
.login-layout .login-form.signup-container{width: 480px;}
.login-layout .login-form .forgot-password{text-align: right;margin-top: -16px;}
.login-layout .login-illustration{display: block;height: 536px;width: 536px;max-width: 100%;}
.login-layout .login-bottom{text-align: center;padding-top: 24px;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0.25px;}
.login-layout .login-bottom .primary-link{font-size: 14px;font-weight: 600;line-height: 20px;letter-spacing: 0.25px;}
.login-layout .btn-block{width: 100%;}
.login-layout .btn.btn-filled{background-color: #1f299b;color: #fff;align-items: center;border: 2px solid #0000;border-radius: 8px;display: inline-flex;font-size: 14px;font-weight: 500;height: auto;justify-content: center;letter-spacing: .1px;line-height: 20px;padding: 12px 22px;appearance: none;-webkit-box-align: center;-webkit-box-pack: center;user-select: none;position: relative;white-space: nowrap;vertical-align: middle;outline-offset: 2px;transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;transition-duration: 200ms;font-family: inherit;text-decoration: none;}
.login-layout .btn.btn-filled:active, .login-layout .btn.btn-filled:focus, .login-layout .btn.btn-filled:hover {background-color: #161d6c;}
.login-layout .btn.btn-filled:focus {box-shadow: 0 0 0 4px #1f299b3d;}

@media(max-width:1199px) {
    h4,.h4 {font-size: 28px;line-height: 36px;}
    h6,.h6 {font-size: 20px;line-height: 28px;}
    .policy-page {padding-bottom: 16px;}
}

@media(max-width:991px) {
    .policy-page .content .primary-card {padding: 24px;}
    .login-layout:after,.login-layout .right-block{display: none;}
    .login-layout .left-block{flex-basis: 100%;max-width: 100%;padding: 24px;}
    .login-layout .login-header{width: 100%;display: flex;align-items: center;}
    .login-layout .btn.language-btn.btn-text{position: static;margin-left: auto;margin-right: -16px;}
}

@media(max-width:767px) {
    .policy-page .logo-wrapper .logo {height: 36px;}
    .policy-page .logo-wrapper {padding: 16px 0;}
    .policy-page .head-block {padding: 16px 0 80px;}
    .policy-page .content .primary-card {padding: 24px 16px;}
    .login-layout .logo > img{height: 40px;width: 150px;}
}

@media(max-width:575px) {
    .login-layout .login-form{width: 360px;}
}

.lang-ar {direction: rtl;}
body:not(.lang-ar) .ar-block,.lang-ar .en-block {display: none;}
.lang-ar .rtl-invert {transform: scaleX(-1);}
.lang-ar .policy-page .head-block .back-btn {margin-right: -8px;margin-left: 4px;}
.lang-ar .policy-page .logo-wrapper .language-btn {margin-right: auto;margin-left: 0;}
.lang-ar .policy-page .ordered-list,.lang-ar .policy-page .unordered-list {padding-left: 0;padding-right: 20px;}
.lang-ar .policy-page .language-btn img:first-child {margin-left: 6px;margin-right: -8px;}

/* login
--------------------------------------------------------------------------------------------------------*/
.lang-ar .login-layout .btn.language-btn.btn-text{left: 16px;right: auto;}
.lang-ar .login-layout .login-form .forgot-password{text-align: left;}
.lang-ar .login-layout .btn.language-btn.btn-text img:first-child {margin-left: 6px;margin-right: -8px;}

@media(max-width:991px) {
    .lang-ar .login-layout .btn.language-btn.btn-text{margin-right: auto;margin-left: -16px;}
}