@font-face {
    font-family: "frank-new";
    src: url("../../assets/fonts/new-frank/200.woff") format("woff"), url("../../assets/fonts/new-frank/200.woff2") format("woff2"), url("../../assets/fonts/new-frank/200.otf") format("opentype");
    font-weight: 200
}

@font-face {
    font-family: "frank-new";
    src: url("../../assets/fonts/new-frank/300.woff") format("woff"), url("../../assets/fonts/new-frank/300.woff2") format("woff2"), url("../../assets/fonts/new-frank/300.otf") format("opentype");
    font-weight: 300
}

@font-face {
    font-family: "frank-new";
    src: url("../../assets/fonts/new-frank/400.woff") format("woff"), url("../../assets/fonts/new-frank/400.woff2") format("woff2"), url("../../assets/fonts/new-frank/400.otf") format("opentype");
    font-weight: 400
}

@font-face {
    font-family: "frank-new";
    src: url("../../assets/fonts/new-frank/500.woff") format("woff"), url("../../assets/fonts/new-frank/500.woff2") format("woff2"), url("../../assets/fonts/new-frank/500.otf") format("opentype");
    font-weight: 500
}

@font-face {
    font-family: "frank-new";
    src: url("../../assets/fonts/new-frank/700.woff") format("woff"), url("../../assets/fonts/new-frank/700.woff2") format("woff2"), url("../../assets/fonts/new-frank/700.otf") format("opentype");
    font-weight: 700
}

@font-face {
    font-family: "frank-new";
    src: url("../../assets/fonts/new-frank/800.woff") format("woff"), url("../../assets/fonts/new-frank/800.woff2") format("woff2"), url("../../assets/fonts/new-frank/800.otf") format("opentype");
    font-weight: 800
}

@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800&display=swap');

* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

body {
}

body, input, select, h1 {
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-weight: 400
}

section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

::placeholder {
    opacity: 0
}

h1.orange-tio-heading1 {
    color: #ee7f22;
    font-size: 30px;
    font-weight: 700;
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

section#topSection {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: auto;
    background: #fff;
    padding-top: 40px;
    padding-bottom: 10px;
    padding-left: 15px;
    padding-right: 15px
}

/*ARABIC*/
html:lang(ar) {
    direction: rtl;
}

.input-item .input-item:lang(ar):nth-child(2) {
    margin-right: auto;
    margin-left: unset;
}

img.logoTop:lang(ar) {
    margin-right: 0;
    margin-left: auto;
}

p.Error:lang(ar) {
    text-align: right;
}

.toggle__text:lang(ar) {
    margin-right: 35px;
    margin-left: unset;
}

.toggle__label:lang(ar) {
    padding-right: calc(var(--uiToggleSize) + var(--uiToggleIndent));
    padding-left: unset;
}

.toggle__label:lang(ar):before, .toggle__label:lang(ar):after {
    right: 0;
    left: auto;
}

.toggle__input:lang(ar):not(:disabled):checked ~ .toggle__label:lang(ar) .toggle__text:lang(ar):before {
    right: .2em;
    left: auto;
    -webkit-transform-origin: left center;
}

/*END OF ARABIC*/
.flex-tabRow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin: auto;
    width: 100%;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    -ms-flex-item-align: end;
    align-self: flex-end;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

button.flex-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: auto;
    width: 50%;
    padding: 31px 15px;
    font-size: 22px;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    border: none;
    background: #0d0d0d;
    font-weight: 700;
    outline: none;
    color: #f3f3f3;
    cursor: pointer;
    position: relative
}

button.flex-btn.left.active-tab::after {
    content: "";
    position: absolute;
    right: 0px;
    top: 0;
    bottom: 0;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0) #0d0d0d;
    border-width: 0px 36px 89px 0px;
    width: 0;
    height: 0;
    z-index: 99
}

button.flex-btn.right.active-tab::before {
    content: "";
    position: absolute;
    left: -36px;
    top: 0;
    bottom: 0;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0) #f3f3f3;
    border-width: 0px 36px 91px 0px;
    width: 0;
    height: 0
}

section .section_inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: auto;
    max-width: 1200px;
    /*height: 100%;*/
    width: 100%;
    padding-left: 15px;
    padding-right: 15px
}

img.logoTop {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    flex: 1 1 auto;
    flex-wrap: wrap;
    width: 80%;
    max-width: 270px;
    margin-left: 0;
}

section#topSection h1 {
    margin-top: 0;
    margin-bottom: 5vh;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-item-align: center;
    align-self: center;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

button.flex-btn.active-tab {
    background: #f3f3f3;
    color: #ee7f22
}

.flex-tab-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: auto;
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-top: 20px;
    padding-bottom: 30px;
    margin-bottom: auto;
    -ms-flex-item-align: center;
    align-self: center;
}

.flex-cols.col-left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: start;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: auto;
    margin-top: 20px;
    position: relative;
}

section#tabSection {
    margin-top: 30px;
    min-height: 55vh
}

.input-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: row;
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    position: relative;
    margin: 5px auto;
    max-width: 660px;
    padding: 0 5px 0 5px;
    margin-bottom: 8px;
    margin-top: 5px;
}

.input-item.pair {
    /* margin-bottom: 10px; */
    /* margin-top: 45px; */
}

p.instr {
    color: #717171;
    font-size: 15px;
    margin-bottom: 20px
}

form#register-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: start;
    justify-content: center;
    margin: auto;
    margin-top: 10px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    position: relative
}

.flex-cols.col-right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 24.7%;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 40px;
    margin-bottom: auto
}

.input-item label {
    position: absolute;
    top: -5px;
    bottom: 0;
    margin: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 30px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 10px;
    pointer-events: none;
    color: #A9A9A9;
    -webkit-transition: all 0.15s linear;
    -o-transition: all 0.15s linear;
    transition: all 0.15s linear;
    padding: 5px 18px 5px 10px;
    border-radius: 120px;
    font-size: 13px;
    font-weight: 600;
    border-bottom-left-radius: 1px;
}

.input-item select, .input-item input {
    padding: 8px;
    height: 45px;
    border: 1px solid #b7b7b7;
    outline: none;
    border-radius: 5px;
    width: 100%;
    padding-left: 10px;
    transition: all 0.15s linear;
    /* -webkit-appearance: none; */
    background-color: #ffffff;
    font-size: 14px;
}

.input-item.validated select, .input-item.validated input {
    /* border-color: #71d875 */
}

.inputActivated label, .input-item input:active, .input-item input:focus, .input-item select:active, .input-item select:focus {
    border-color: #0084b7;
    color: #000000 !important;
    box-shadow: #0093e8 0px 0px 3px 0px;
}

.input-item input:active ~ p.pseudoLabel, .input-item input:focus ~ p.pseudoLabel, .input-item select:active ~ p.pseudoLabel, .input-item select:focus ~ p.pseudoLabel {
    opacity: 1;
    border-color: #000000
}

.Passvalidated span, .Passvalidated svg {
    color: #dcdcdc;
}

.input-item.validated input {
    color: #000
}

.input-item.validated select, .input-item.validated select ~ label, .input-item.validated input ~ label {
    color: #000000
}

.input-item input:active ~ label, .input-item input:focus ~ label, .input-item select:active ~ label, .input-item select:focus ~ label {
    color: #000000
}

p.Passvalidated {
}

input#Phone {
    padding-left: 94px !important;
}

input#Phone:lang(ar){
    padding-left: 0px !Important;
    padding-right: 84px !Important;
}

.iti__flag-container {
    margin-left: 5px;
}

.input-item .input-item {
    width: 33%;
    flex-direction: column;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    max-width: 320px;
    margin-top: 0;
    margin-bottom: 0;
}

.input-item.small {
}

.input-item .input-item:nth-child(1) {
}

.input-item .input-item:nth-child(2) {
    margin-left: auto;
}

form#register-form hr {
    width: 100%;
    opacity: 0.3;
    margin-top: 10px;
    margin-bottom: 20px
}

.flex-cols.col-right h1 {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-weight: 600;
    color: #ee7f22;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    padding-bottom: 15px;
    margin-bottom: 24px;
    margin-top: 40px;
    text-align: center
}

.flex-cols.col-right p {
    margin-top: 0px;
    margin-bottom: 15px;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    font-size: 14px
}

.flex-tab-item > p {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.input-item.inputActivated select, .input-item.inputActivated input {
    -webkit-box-shadow: rgba(0, 0, 0, 0.11) 0px 0px 6px 0px;
    box-shadow: rgba(0, 0, 0, 0.11) 0px 0px 6px 0px
}

.input-item-check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 6px;
    /* padding: 15px; */
    position: relative;
    max-width: 640px;
    margin: auto;
    margin-bottom: 15px;
}

.input-item-check > label {
    margin-left: 8px;
    font-size: 12px;
    line-height: 1.5;
}

.input-item-check {
    -moz-user-select: none;
    -ms-user-select: none;
}

.input-item-check p {
    font-size: 12px;
    line-height: 1.5;
}

.input-item-check input {
    cursor: pointer;
    left: 0;
    /* background-color: black; */
    border: none;
    outline: none !important;
}

.checkmark {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    height: 15px;
    width: 15px;
    background-color: #f3f3f3;
    margin: auto;
    border: 2px solid black;
    display: none
}

.input-item-check:hover input ~ .checkmark {
    background-color: #ccc
}

.input-item-check input:checked ~ .checkmark {
    background-color: #ee7f22
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none
}

.input-item-check input:checked ~ .checkmark:after {
}

.input-item-check .checkmark:after {
    top: 1.5px;
    left: 2.4px;
    width: 10.2px;
    height: 11px;
    background: #ee7f22
}

.btn_Container {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: auto
}

button.register_Cta_formBtn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: auto;
    width: 100%;
    max-width: 200px;
    padding: 12px 10px;
    font-size: 16px;
    font-weight: 600;
    color: #FFFFFF;
    background: #ff7a04;
    border-radius: 42px;
    border: 1px solid transparent;
    -webkit-transition: all 0.15s linear;
    -o-transition: all 0.15s linear;
    transition: all 0.15s linear;
    cursor: pointer;
    margin-top: 20px;
    letter-spacing: 2.15px;
}

button.register_Cta_formBtn:hover {
    background: transparent;
    color: #ef9122;
    border: 1px solid #ef9122
}

.input-item.inputActivated select option {
    font-size: 16px;
    outline: none;
    border: none;
    font-weight: 500
}

form#login-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin: auto;
    margin-top: 20px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    max-width: 390px
}

.flex-cols.center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 820px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: auto;
    -ms-flex-item-align: center;
    align-self: center;
    margin-bottom: auto
}

form#login-form .input-item {
    margin: auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 100%;
    max-width: unset
}

.flex-cols.center > p {
    width: 100%;
    margin: auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.flex-cols.center > img {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 260px;
    margin-bottom: 0
}

.flex-cols.center > h1 {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 15px
}

a.form-anchors {
    text-align: right;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: 10px;
    color: #7d7d7d;
    margin-bottom: 5px;
    font-weight: 500;
    font-size: 14px;
    -webkit-transition: all 0.15s linear;
    -o-transition: all 0.15s linear;
    transition: all 0.15s linear;
    text-decoration: none;
    cursor: pointer
}

a.form-anchors:hover {
    color: #000000
}

section#footer {
    padding-top: 25px;
    padding-bottom: 25px;
    margin-top: 40px
}

.footerLinks {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 100%;
    margin-bottom: 15px
}

section#tabSection .section_inner {
    box-shadow: rgba(0, 0, 0, 0.25) 1px 1px 5px 0px;
    margin-bottom: 20px;
    background-color: #fdfdfd;
    border-radius: 5px;
}

section#tabSection .section_inner.verification .leftAlign_cell {
    width: 100%;
}

.section_inner.verification {
    margin-top: 0;
}

.display-inline {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 25px
}

.display-inline a {
    color: #000000;
    text-decoration: none;
    padding-bottom: 5px;
    border-bottom: 1px solid rgba(0, 0, 0, 0);
    -webkit-transition: all 0.15s linear;
    -o-transition: all 0.15s linear;
    transition: all 0.15s linear
}

.display-inline a:hover {
    color: #797979;
    border-color: rgba(121, 121, 121, 0.22)
}

.risk_disclaimer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 15px;
    width: 100%;
    margin-top: 15px
}

.risk_disclaimer p {
    color: #000;
    width: 100%;
    font-size: 13px;
    line-height: 1.4rem
}

.copyRight_row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 20px;
    border-top: 1px solid #b9b9b9;
    padding-top: 20px
}

.copyRight_row .Logo {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
    height: 100%;
    margin-top: auto;
    margin-bottom: auto;
    width: 15%
}

.copyRight_row .Logo img {
    width: 100%;
    max-width: 150px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    margin: auto
}

.copyRight {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #FFFFFF;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 70%
}

.copyRight p {
    font-size: 12px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #000000
}

.socialLinks {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    width: 15%
}

.socialLinks a {
    color: #ef9122;
    background: #fff;
    margin: 5px;
    padding: 5px;
    border-radius: 120px;
    width: 30px;
    height: 30px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 700;
    -webkit-transition: all 0.15s linear;
    -o-transition: all 0.15s linear;
    transition: all 0.15s linear
}

.socialLinks a:hover {
    color: #2e2c32
}

.form_topRow {
    display: flex;
    flex-direction: row;
    width: 100%;
    flex: 1 1 auto;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    padding-bottom: 15px;
    border-bottom: 1px solid #e6e6e6;
    margin-bottom: 20px;
}

.leftAlign_cell {
    display: flex;
    flex-direction: column;
    width: 42%;
    /* min-width: 320px; */
}

.leftAlign_cell h2 {
    font-size: 14px;
    color: #777777;
    font-weight: 700;
}

.rightAlign_cell {
    display: flex;
    flex-direction: column;
    /* width: 30%; */
    justify-content: flex-end;
    align-items: flex-end;
    min-width: 220px;
    margin-left: 20px;
    font-size: 14px;
}
.midAlign_cell{
    display: flex;
    flex-direction: column;
    /* width: 25%; */
    justify-content: flex-end;
    align-items: flex-end;
    min-width: 230px;
    font-size: 14px;
}
.midAlign_cell p a {
    color: #ef9122;
    text-decoration: none;
    margin-left: 0px;
}
.rightAlign_cell p a {
    color: #ef9122;
    text-decoration: none;
    margin-left: 10px;
}

.validationBox {
    display: flex;
    width: 100%;
    align-items: center;
    flex-wrap: wrap;
    max-width: 660px;
    margin: auto;
    /* margin-top: 5px; */
    margin-bottom: 20px;
    justify-content: flex-start;
    padding: 0 5px 0 5px;
}

.validationBox p {
    min-width: 230px;
    /* margin: 5px; */
    margin-top: 0;
    margin-left: 0;
    font-size: 13px;
    margin-bottom: 10px;
    display: flex;
    color: #676767;
}

.validationBox p span {
    margin-left: 10px;
    display: flex;
    align-items: center;
    padding-bottom: 0.3px;
}

.validationBox p span:lang(ar) {
    margin-left: 0px;
    margin-right: 10px;
}

.validationBox p svg {
    font-size: 10px;
    align-items: center;
    display: flex;
    justify-content: center;
    margin-top: auto;
    margin-bottom: auto
}

span.checkVal {
    display: none;
    position: absolute;
    right: 21px;
    top: 0;
    bottom: 0;
    margin: auto;
    align-items: center;
    color: #71d875;
    opacity: 0;
    transition: all 0.15s linear;
}

.validated span.checkVal {
    opacity: 1
}

.vipBlack_upsell {
    display: none;
    width: 225px;
    position: absolute;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin: auto;
    right: 0;
    line-height: 1.6;
    padding: 30px 34px;
    text-align: center;
    top: 21px;
    background: #f9f9f9;
    z-index: 9999;
}

.vipBlack_upsell:lang(ar) {
    left: 0;
    right: auto;
}

.vipBlack_upsell:before {
    position: absolute;
    content: '';
    background-image: url(../images/vip-black.png);
    background-repeat: no-repeat;
    background-size: contain;
    top: -7px;
    right: -7px;
    width: 80px;
    height: 80px
}

.vipBlack_upsell.nobefore:before{
    content:'';
    background-image: none;
}

.vipBlack_upsell img {
    margin-bottom: 13px;
    width: 100%;
    max-width: 60px;
}

.vipBlack_upsell p a {
    color: #ff8600
}

.vipBlack_upsell p {
    font-size: 14px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-weight: 600;
}
.vipBlack_upsell:lang(es){
    width: 242px
}
.vipBlack_upsell p:lang(es){
    font-size: 11px;

}
p.Error {
    display: none;
    width: 100%;
    justify-content: center;
    align-items: center;
    max-width: 620px;
    font-size: 13px;
    color: #c61a24;
    text-align: left;
    padding-right: 15px;
    font-weight: 500;
    margin-top: 8px;
}

span#hidden {
    display: none
}

a#viewMore {
    color: #0092fd;
    cursor: pointer;
    text-decoration: underline;
    padding-left: 34px;
    font-size: 13px;
}

.input-item.error input {
    border-color: #FF0000;
    box-shadow: #FF0000 0px 0px 3px 0px;
}

.error span.checkVal {
    opacity: 1;
    color: #FF0000
}

.error label {
    color: #FF0000
}

.error p.pseudoLabel {
    /* border-color: #FF0000; */
    /* box-shadow: rgba(0, 0, 0, 0) 0px 0px 5px 0px; */
    /* color: #FF0000; */
    opacity: 1;
}

p.pseudoLabel {
    /* position: absolute; */
    font-size: 14px;
    /* left: 37px; */
    /* top: -3px; */
    /* margin: auto; */
    height: 20px;
    bottom: 0;
    border-radius: 120px;
    padding: 1px 5px;
    opacity: 1;
    transition: all 0.15s linear;
    /* opacity: 0.5; */
    pointer-events: none;
    /* top: -68px !important; */
    /* left: 22px !important; */
    margin-bottom: 5px;
    color: black;
}

.validated p.pseudoLabel {
}

.activeInput {
    top: -68px !important;
    left: 22px !important;
    opacity: 1 !important
}

.phoneField.activated p.pseudoLabel {
    top: -68px !important;
    left: 22px !important;
    opacity: 1 !important
}

.phoneField p.pseudoLabel {
    left: 122px
}

a.email-support {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 0;
    margin-left: 0;
    color: #000;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.15s linear
}

a.email-support:hover {
    color: #6d6d6d
}

a.email-support svg {
    color: #ff8600;
    margin-right: 5px;
    align-items: center;
    display: flex;
    justify-content: center;
    margin-top: auto;
    font-size: 20px;
    margin-bottom: auto
}

a.email-support svg:lang(ar) {
    margin-right: 0;
    margin-left: 5px;
}

p.vipBlack_upsell_mobile {
    /* background: black; */
    /* width: 100%; */
    /* margin-bottom: 5px; */
    display: none;
    /* padding-left: 15px !important; */
    /* padding-top: 5px; */
    /* padding-bottom: 5px; */
    /* align-items: center; */
    /* font-size: 17px !important; */
}

img.mob-image {
    display: none;
}

.verification {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
    margin: auto;
    flex-wrap: wrap;
    margin-top: 50px;
    margin-bottom: 50px;
}

img.desktop-image {
    width: 100%;
    display: flex;
    max-width: 820px;
    margin: auto;
}

.verification > p {
    text-align: center;
    margin: auto;
    text-transform: uppercase;
}

p.one {
    display: flex;
}

p.two {
    font-weight: 600;
    font-size: 22px;
    text-align: center;
    padding-bottom: 23px;
}

p.three {
    display: flex;
    color: #b5b5b5;
}

.flex-cols.col-left.form_instructions.verification-instr p.instr {
    width: 100%;
    color: #000;
    max-width: 690px;
    font-size: 18px;
    line-height: 1.8rem;
    text-align: center;
}

.flex-cols.col-left.form_instructions.verification-instr > h2 {
    font-size: 50px;
    margin-bottom: 20px;
    text-align: center;
}

.verification-steps {
    display: flex;
    width: 100%;
    justify-content: space-around;
    flex-wrap: wrap;
    flex-direction: row;
}

.verification-steps p {
    text-transform: uppercase;
}

.toggle {
    --uiToggleSize: var(--toggleSize, 20px);
    --uiToggleIndent: var(--toggleIndent, .4em);
    --uiToggleBorderWidth: var(--toggleBorderWidth, 2px);
    --uiToggleColor: #5a5a5a;
    /* --uiToggleDisabledColor: var(--toggleDisabledColor, #868e96); */
    /* --uiToggleBgColor: #fff; */
    --uiToggleArrowWidth: var(--toggleArrowWidth, 2px);
    --uiToggleArrowColor: #fff;
    display: flex;
    position: relative;
    align-items: center;
    /* justify-content: center; */
    margin: auto;
}

.toggle__input {
    position: absolute;
    left: -99999px;
    /* display: none; */
    /*     opacity: 0; */
    position: absolute;
    -webkit-appearance: none;
}

.toggle__label {
    display: flex;
    cursor: pointer;
    min-height: var(--uiToggleSize);
    padding-left: calc(var(--uiToggleSize) + var(--uiToggleIndent));
    /* align-items: center; */
    /* justify-content: center; */
    /* margin: auto; */
    /* pointer-events: none; */
    /* align-items: start; */
    /* justify-content: center; */
    /* top: 0; */
    /* bottom: 0; */
    /* margin-top: 0; */
}

.toggle__label:before, .toggle__label:after {
    content: "";
    box-sizing: border-box;
    width: 1em;
    height: 1em;
    font-size: var(--uiToggleSize);
    position: absolute;
    left: 0;
    top: 4px;
    /* bottom: 0; */
    margin: auto;
}

.toggle__label:before {
    border: var(--uiToggleBorderWidth) solid var(--uiToggleColor);
    z-index: 2;
}

.toggle__input:disabled ~ .toggle__label:before {
    border-color: var(--uiToggleDisabledColor);
}

.toggle__input:focus ~ .toggle__label:before {
    box-shadow: 0 0 0 2px var(--uiToggleBgColor), 0 0 0px 4px var(--uiToggleColor);
}

.toggle__input:not(:disabled):checked:focus ~ .toggle__label:after {
    box-shadow: 0 0 0 2px var(--uiToggleBgColor), 0 0 0px 4px var(--uiToggleColor);
}

.toggle__input:not(:disabled) ~ .toggle__label:after {
    background-color: var(--uiToggleColor);
    /* opacity: 0; */
}

.toggle__input:not(:disabled):checked ~ .toggle__label:after {
    opacity: 1;
}

.toggle__text {
    margin-top: auto;
    margin-bottom: auto;
    color: black;
    margin-left: 5px;
}

/*
The arrow size and position depends from sizes of square because I needed an arrow correct positioning from the top left corner of the element toggle
*/

.toggle__text:before {
    content: "";
    box-sizing: border-box;
    width: 0;
    height: 0;
    font-size: var(--uiToggleSize);
    border-left-width: 0;
    border-bottom-width: 0;
    border-left-style: solid;
    border-bottom-style: solid;
    border-color: var(--uiToggleArrowColor);
    position: absolute;
    /* bottom: 0; */
    top: 15.2px;
    margin: auto;
    left: .2em;
    z-index: 3;
    -webkit-transform-origin: left top;
    /* transform-origin: left top; */
    -webkit-transform: rotate(-40deg) skew(10deg);
    /* transform: rotate(-40deg) skew(10deg); */
}

.toggle__input:not(:disabled):checked ~ .toggle__label .toggle__text:before {
    width: .5em;
    height: .25em;
    border-left-width: var(--uiToggleArrowWidth);
    border-bottom-width: var(--uiToggleArrowWidth);
    will-change: width, height;
    /* transition: width .1s ease-out .2s, height .2s ease-out; */
}

/*
=====
LEVEL 2. PRESENTATION STYLES
=====
*/

/*
The demo skin
*/

.toggle__label:before, .toggle__label:after {
    border-radius: 6px;
    outline: none;
}

/*
The animation of switching states
*/

.toggle__input:not(:disabled) ~ .toggle__label:before,
.toggle__input:not(:disabled) ~ .toggle__label:after {
    /* opacity: 1; */
    /* -webkit-transform-origin: center center; */
    /* transform-origin: center center; */
    /* will-change: transform; */
    /* transition: -webkit-transform .2s ease-out; */
    /* transition: transform .2s ease-out; */
    /* transition: transform .2s ease-out, -webkit-transform .2s ease-out; */
}

.toggle__input:not(:disabled) ~ .toggle__label:before {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    /* transition-delay: .2s; */
}

.toggle__input:not(:disabled) ~ .toggle__label:after {
    -webkit-transform: rotateY(90deg);
    transform: rotateY(90deg);
}

.toggle__input:not(:disabled):checked ~ .toggle__label:before {
    -webkit-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
    transition-delay: 0s;
}

.toggle__input:not(:disabled):checked ~ .toggle__label:after {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    /* transition-delay: .2s; */
}

.toggle__text:before {
    /*     opacity: 0; */
}

.toggle__input:not(:disabled):checked ~ .toggle__label .toggle__text:before {
    opacity: 1;
    /* transition: opacity .1s ease-out .3s, width .1s ease-out .5s, height .2s ease-out .3s; */
}

/*
=====
LEVEL 3. SETTINGS
=====
*/

.toggle {
    --toggleColor: #000000;
    /* --toggleBgColor: #ef9122; */
    --toggleSize: 23px;
    font-size: 12px;
    line-height: 1.5;
    /* width: 0; */
    /* pointer-events: none; */
}

.page__toggle {
    /* font-size: 28px; */
    /* font-weight: 700; */
    color: #fff;
}

.page__toggle:nth-child(n+2) {
    margin-top: 50px;
}

.validationBox p.Error {
    display: none;
    text-align: left;
    flex-direction: row;
    justify-content: flex-start;
    margin-top: 0;
    margin-bottom: 15px;
    margin-left: 0;
}

.validationBox p.Error.latinCheck svg {
    margin-right: 5px;
}

.svg-inline--fa.fa-w-16 {
    width: 0.8em;
}

select {
    -moz-appearance: none;
    -webkit-appearance: none;
}

span.selectArrow {
    position: absolute;
    bottom: 10px;
    right: 10px;
    pointer-events: none;
}

span.selectArrow:lang(ar) {
    right: auto;
    left: 10px;
}

.vipBlack_upsell ul li {
    text-align: center;
    font-size: 14px;
    margin: auto;
    width: 100%;
    margin-bottom: 10px;
    /* font-weight: 600; */
}

.vipBlack_upsell ul {
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    list-style: none;
}

div#overlayBlock {
    background: rgba(255, 255, 255, 0.92);
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 99999;
    max-width: 660px;
    display: none;
}

.loader {
    text-align: center;
    padding: 1em;
    vertical-align: top;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

/*
  Set the color of the icon
*/
.loader svg path,
.loader svg rect {
    fill: #FF6700;
}

a.logolink {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    flex: 1 1 auto;
    flex-wrap: wrap;
    width: 80%;
    max-width: 270px;
    margin-left: 0;
}

@media only screen and (max-width: 1190px) {
    p.vipBlack_upsell_mobile {
        /* display: flex; */
        /* color: #ff8600; */
    }

    .vipBlack_upsell {
        position: relative;
        /* width: 100%; */
        padding: 10px 15px;
        /* background: #ff8600; */
        /* color: #000; */
        /* font-weight: 500; */
        margin-top: 40px;
        margin-bottom: 20px;
        /* padding: 0; */
        max-width: 480px;
        /* padding-bottom: 15px; */
        order: 1;
        z-index: 0;
    }

    .vipBlack_upsell p {
        font-size: 14px;
        padding-top: 5px;
        padding-bottom: 5px;
        padding-left: 5px;
        padding-right: 5px;
        /* color: #000; */
    }

    .vipBlack_upsell img {
        /* display: none */
    }


}
@media only screen and (max-width: 1100px){
    .form_topRow:lang(de){
        font-size: 15px;
    }
    .leftAlign_cell h2:lang(de){
        font-size: 15px;
    }
    .leftAlign_cell:lang(de){
        width: 38%;
    }
}
@media only screen and (max-width: 991px) {
    .leftAlign_cell:lang(de),
    .midAlign_cell:lang(de),
    .rightAlign_cell:lang(de){
        width: 100%;
        font-size: 14px;
    }
    .form_topRow:lang(de){
        font-size: 14px;
    }
    .leftAlign_cell h2:lang(de){
        font-size: 14px;
    }
    .rightAlign_cell {
        justify-content: center;
        align-items: center;
        width:100%;
    }

    .leftAlign_cell {
        justify-content: center;
        align-items: center;
        margin-bottom: 10px;
        width:100%;
    }
    .leftAlign_cell span{
        text-align:center;
        margin-top: 10px !important;
    }
    .midAlign_cell{
        justify-content: center;
        align-items: center;
        margin-bottom: 10px;
        width:100%;
    }
}

@media only screen and (max-width: 820px) {
    button.flex-btn {
        font-size: 18px;
        padding: 10px
    }

    button.flex-btn::before, button.flex-btn::after {
        display: none
    }
}

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

    img.desktop-image {
        display: none;
    }

    img.mob-image {
        display: flex;
    }

    .verification {
        flex-wrap: nowrap;
    }

    .verification-steps {
        flex-direction: column;
        width: 200px;
        justify-content: center;
        align-items: center;
        height: 340px;
        position: relative;
    }

    p.one {
        position: absolute;
        top: 0;
        margin: auto;
        width: 100%;
        text-align: center;
        justify-content: center;
        margin-top: 20px;
    }

    p.two {
        position: absolute;
        margin: auto;
        width: 100%;
    }

    p.three {
        position: absolute;
        bottom: 0;
        margin: auto;
        width: 100%;
        text-align: center;
        align-items: center;
        justify-content: center;
        margin-bottom: 20px;
    }

    .input-item {
        width: 100%;
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        max-width: 100%;
        flex-wrap: wrap
    }

    .input-item .input-item {
        width: 100%;
        max-width: unset;
        margin: 5px auto;
        margin-bottom: 30px;
        flex-direction: row;
    }

    .input-item .input-item:nth-child(2) {
        margin-bottom: 0;
    }

    button.flex-btn.left.active-tab {
        margin-left: -15px
    }

    button.flex-btn.right.active-tab {
        margin-right: -16px
    }
}

@media screen and (max-width: 650px) {
    section#topSection h1 {
        padding-top: 1em
    }

    .flex-cols.col-right {
        margin-top: 25px
    }

    .flex-cols.col-right h1 {
        margin-top: 0
    }

    .flex-cols.col-left {
        width: 100%;
        max-width: none;
        margin-top: 0px;
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        -webkit-order: 2;
    }

    .input-item {
        width: 100%;
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        max-width: 100%
    }

    .input-item.pair {
        margin-bottom: 15px;
    }

    .footerLinks {
        float: none;
        display: block;
        width: 100%;
        margin: 10px
    }

    .footer_column {
        width: 100%;
        display: contents;
        float: none
    }

    .risk_disclaimer p {
        text-align: center
    }

    .display-inline a {
        margin-bottom: 10px
    }

    .copyRight, .socialLinks {
        width: 100%;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin-top: 5px;
        text-align: center
    }

    .copyRight_row .Logo {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 50%;
        text-align: center
    }

    .flex-cols.col-right {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        -webkit-order: 1
    }
    a.logolink,
    img.logoTop {
        width: 100%;
        margin: auto;
    }

    a.email-support {
        width: 100%;
        margin-top: 15px;
        margin-bottom: 10px;
    }

    section#tabSection {
        margin-top: 15px
    }

    /*arabic*/
    img.logoTop:lang(ar) {
        margin-right: auto;
    }
}

@media screen and (max-width: 500px) {
    .leftAlign_cell h2,
    .midAlign_cell,
    .rightAlign_cell{
        font-size: 15px;
    }
    .validationBox {
        margin: auto;
        justify-content: center;
        max-width: 200px
    }

    .validationBox p {
        margin: auto;
        margin-bottom: 15px;
        align-items: center;
        width: 100%
    }

    p.instr {
        text-align: center;
        order: 0;
    }

    #btn_register_tab {
        font-size: 100%
    }

    #btn_login_tab {
        font-size: 100%
    }

    button.flex-btn.left.active-tab {
        margin-left: -15px
    }
}

.red {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    flex: 1 1 auto;
}

.leftAlign_cell span {
    font-size: 14px;
    margin-top: 0;
    display: flex;
    color: rgba(0, 0, 0, 0.77);
    max-width: 390px
}