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, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, caption,
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: middle;
}

a:link {
    color: #333333;
    text-decoration: none;
}

a:visited {
    color: #333333;
    text-decoration: none;
}

a:hover {
    color: #333333;
    text-decoration: none;
}

a:active {
    color: #333333;
    text-decoration: none;
}

div.containr a:link {
    color: #FA5C5F;
    text-decoration: none;
}

div.containr a:visited {
    color: #FA5C5F;
    text-decoration: none;
}

div.containr a:hover {
    color: #FA5C5F;
    text-decoration: none;
}

div.containr a:active {
    color: #FA5C5F;
    text-decoration: none;
}

body {
    font-family: 'Inter', sans-serif;
    color: #000;
    font-weight: 400;
    /* -webkit-filter: blur(10px); */
    /* -moz-filter: blur(10px); */
    /* -o-filter: blur(10px); */
    /* -ms-filter: blur(10px); */
    /* filter: blur(10px); */
    /* transition:3s; */
}


/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

ol, ul {
    list-style: none;
}


::-webkit-scrollbar {
    width: 3px;
    height: 3px;
    background-color: #f5f5f5;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #c8ccd4;
    border-radius: 20px;
}

::-webkit-scrollbar-track {
    /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);*/
    background-color: #c8ccd4;
}

::-webkit-scrollbar-thumb {
    background-color: #7E7E7E;
    border-radius: 200px;
}


@font-face {
    font-family: "Segoe UI";
    /*src: local("Segoe UI Light");*/
    src: url("segoeuil.ttf");
}

@font-face {
    font-family: "Segoe UI R";
    src: url("segoeui.ttf");
}


@font-face {
    font-family: "psr";
    src: url("psr.ttf");
}

@font-face {
    font-family: "ps";
    src: url("ps.ttf");
}

@font-face {
    font-family: "gb";
    src: url("gb.otf");
}

@font-face {
    font-family: "glb";
    src: url("Gilroy-Bold.ttf");
}

@font-face {
    font-family: "glsb";
    src: url("Gilroy-SemiBold.ttf");
}

@font-face {
    font-family: "glm";
    src: url("Gilroy-Medium.ttf");
}


@font-face {
    font-family: "gl";
    src: url("gl.otf");
}

@font-face {
    font-family: "InterBold";
    src: url("Inter-Bold.otf");
}

@font-face {
    font-family: "InterRegular";
    src: url("Inter-Regular.otf");
}

/*@font-face {*/
/*    font-family: "can";*/
/*    src:url("can.ttf");*/
/*}*/

@font-face {
    font-family: "MontserratBold";
    src: url("Montserrat-Bold.ttf");
}

@font-face {
    font-family: "MontserratRegular";
    src: url("Montserrat-Regular.ttf");
}

@font-face {
    font-family: "InterRegular";
    src: url("Inter-Regular.otf");
}

@font-face {
    font-family: "InterMedium";
    src: url("Inter-Medium.otf");
}

@font-face {
    font-family: "InterBold";
    src: url("Inter-Bold.otf");
}

@font-face {
    font-family: "InterSemiBold";
    src: url("Inter-SemiBold.otf");
}

@font-face {
    font-family: "InterExtraBold";
    src: url("Inter-ExtraBold.otf");
}


@font-face {
    font-family: "Helvetica Neue";
    src: url("Helvetica-Neu-Bold.ttf");
}


/* Fonts */


a:visited.abbuttons, a:link.abbuttons {
    font-family: "Segoe UI Black";
    font-size: 9px;
    color: #fff;
    padding: 7px 15px !important;
    border-radius: 3px !important;
    border: 0px SOLID #707070 !important;
    background: #999;
    text-align: center;
    letter-spacing: 1px;
}

a:visited.abbuttons:hover, a:link.abbuttons:hover {
    font-family: "Segoe UI Black";
    font-size: 9px;
    padding: 7px 15px !important;
    border-radius: 3px !important;
    border: 0px SOLID #ff6a00 !important;
    color: #FFF;
    background: #999;
    text-align: center;
    letter-spacing: 1px;
}

a:visited.abutton, a:link.abutton {
    font-size: 11px;
    color: #000;
    padding: 7px 15px !important;
    border-radius: 3px !important;
    border: 1px SOLID #707070 !important;
    text-align: center;
}

a:visited.abutton:hover, a:link.abutton:hover {
    font-size: 11px;
    padding: 7px 15px !important;
    border-radius: 3px !important;
    border: 1px SOLID #ff6a00 !important;
    color: #FFF;
    background: #ff6a00;
    text-align: center;
}

a:visited.amenu, a:link.amenu {
    font-size: 11px;
    padding: 7px 20px !important;
}

a:hover.amenu {
    font-size: 11px;
    color: #000;
    padding: 7px 20px !important;
}

.bbutton {
    font-size: 11px;
    padding: 7px 20px !important;
    border-radius: 3px !important;
    background: white;
    cursor: pointer;
    border: 1px SOLID #707070 !important;
    margin-right: 20px;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.pointer {
    cursor: pointer;
}

.cursor__default {
    cursor: default !important;
}

.float-right {
    float: right;
}

.float-left {
    float: left;
}

.left {
    float: left;
}

.hide {
    display: none;
}

.show {
    display: block !important;
}

.invisible {
    visibility: hidden;
}

div.contents {
    display: contents;
}

div.left {
    float: left;
}

div.right {
    float: right;
}

.bold {
    font-weight: bold;
}

.text-center {
    text-align: center;
}

.circlelay {
    border-radius: 200px;
}

.pad0 {
    padding: 0px !important;
}

.pad2_5 {
    padding: 2.5px !important;
}

.pad3 {
    padding: 3px !important;
}

.pad5 {
    padding: 5px !important;
}

.pad20 {
    padding: 20px !important;
}

.pad30 {
    padding: 30px !important;
}

.pad40 {
    padding: 40px !important;
}

.pad60 {
    padding: 60px !important;
}

.pad80 {
    padding: 80px !important;
}

.padb5 {
    padding-bottom: 5px !important;
}

.padb7 {
    padding-bottom: 7px !important;
}

.padb10 {
    padding-bottom: 10px !important;
}

.padr5 {
    padding-right: 5px !important;
}

.padr10 {
    padding-right: 10px !important;
}

.pad10 {
    padding: 10px !important;
}

.padr15 {
    padding-right: 15px !important;
}

.padl5 {
    padding-left: 5px !important;
}

.padl10 {
    padding-left: 10px !important;
}

.padl30 {
    padding-left: 30px !important;
}

.padl32 {
    padding-left: 32px !important;
}

.padl35 {
    padding-left: 35px !important;
}

.padl40 {
    padding-left: 40px !important;
}

.padr30 {
    padding-right: 30px !important;
}

.padr40 {
    padding-right: 40px !important;
}

.padt5 {
    padding-top: 5px !important;
}

.padt10 {
    padding-top: 10px !important;
}

.padt20 {
    padding-top: 20px !important;
}

.padt30 {
    padding-top: 30px !important;
}

.padl20 {
    padding-left: 20px !important;
}

.padl25 {
    padding-left: 25px !important;
}

.padr20 {
    padding-right: 20px !important;
}

.padr25 {
    padding-right: 25px !important;
}

.mrgt0 {
    margin-top: 0px !important;
}

.mrg0 {
    margin: 0px !important;
}

.mrg10 {
    margin: 10px;
}

.mrg5 {
    margin: 5px;
}

.mrg15 {
    margin: 15px;
}

.mrg20 {
    margin: 20px;
}

.mrg30 {
    margin: 30px;
}

.mrgt2 {
    margin-top: 2px;
}

.mrgt5 {
    margin-top: 5px;
}

.mrgt7 {
    margin-top: 7px;
}

.mrgt10 {
    margin-top: 10px;
}

.mrgt12 {
    margin-top: 12px;
}

.mrgl2_5 {
    margin-left: 2.5px;
}

.mrgl5 {
    margin-left: 5px;
}

.mrgl7 {
    margin-left: 7px !important;
}

.mrgl10 {
    margin-left: 10px !important;
}

.mrgl15 {
    margin-left: 15px !important;
}

.mrgl20 {
    margin-left: 20px !important;
}

.mrgl25 {
    margin-left: 25px !important;
}

.mrgl30 {
    margin-left: 30px !important;
}

.mrgl40 {
    margin-left: 40px !important;
}

.mrgr2_5 {
    margin-right: 2.5px;
}

.mrgr5 {
    margin-right: 5px;
}

.mrgr7_5 {
    margin-right: 7.5px;
}

.mrgr10 {
    margin-right: 10px !important;
}

.mrgr0 {
    margin-right: 0px;
}

.mrgl0 {
    margin-left: 0px !important;
}

.mrgr15 {
    margin-right: 15px;
}

.mrgr20 {
    margin-right: 20px;
}

.mrgr25 {
    margin-right: 25px;
}

.mrgr30 {
    margin-right: 30px;
}

.mrgr35 {
    margin-right: 35px;
}

.mrgr40 {
    margin-right: 40px;
}

.mrgt15 {
    margin-top: 15px;
}

.mrgt20 {
    margin-top: 20px !important;
}

.mrgt25 {
    margin-top: 25px !important;
}

.mrgt30 {
    margin-top: 30px !important;
}

.mrgt35 {
    margin-top: 35px !important;
}

.mrgt40 {
    margin-top: 40px !important;
}

.mrgt80 {
    margin-top: 80px !important;
}

.mrgt90 {
    margin-top: 90px !important;
}

.mrgt100 {
    margin-top: 100px !important;
}

.mrgt120 {
    margin-top: 120px !important;
}

.mrgb2 {
    margin-bottom: 2px;
}

.mrgb5 {
    margin-bottom: 5px;
}

.mrgb7 {
    margin-bottom: 7px;
}

.mrgb0 {
    margin-bottom: 0px !important;
}

.mrgb10 {
    margin-bottom: 10px;
}

.mrgb12 {
    margin-bottom: 12px;
}

.mrgb15 {
    margin-bottom: 15px;
}

.mrgb20 {
    margin-bottom: 20px;
}

.mrgb25 {
    margin-bottom: 25px;
}

.mrgb30 {
    margin-bottom: 30px;
}

.mrgb35 {
    margin-bottom: 35px;
}

.mrgb40 {
    margin-bottom: 40px;
}

.mrgb50 {
    margin-bottom: 50px;
}

.mrgr70 {
    margin-right: 70px;
}

.f15 {
    font-size: 15px;
}

.f40 {
    font-size: 40px;
}

.gone {
    display: none;
}

.forcehide, .force-hide {
    display: none !important;
}

.wdthauto {
    width: auto !important;
}

.wdth35 {
    width: 35%;
}

.wdth20 {
    width: 20%;
}

.wdth30 {
    width: 30%;
}

.wdth60 {
    width: 60%;
}

.wdth70 {
    width: 70%;
}

.wdth40 {
    width: 40%;
}

.wdth42 {
    width: 42%;
}

.wdth49 {
    width: 49%;
}

.wdth50 {
    width: 50% !important;
}

.wdth60 {
    width: 60%;
}

.wdth65 {
    width: 65%;
}

.wdth70 {
    width: 70% !important;
}

.wdth68 {
    width: 68%;
}

.wdth90 {
    width: 90%;
}

.wdth100 {
    width: 100% !important;
}

.wdthfill {
    width: -webkit-fill-available;
}

.wdth96 {
    width: 96.5% !important;
}

.wdth98 {
    width: 98% !important;
}

.fblack {
    color: #000;
}

.fblue {
    color: #2F72F9 !important;
}

.text_left {
    text-align: left !important;
}

.text_right {
    text-align: right !important;
}

.text_left {
    text-align: left !important;
}

.text_center {
    text-align: center !important;
}


.nobreak {
    white-space: nowrap;
}

.word_break {
    word-break: break-all;
}

.word_break--unset {
    word-break: unset !important;
}


.circlelay {
    border-radius: 200px;
}

.align-left {
    text-align: left !important;
}

.align-right {
    text-align: right;
}

.align-center {
    text-align: center;
}

span.keycopy {
    font-family: "Gilroy Light";
    font-weight: 900;
    color: #000;
    display: flex;
    margin-left: 10px;
    font-size: 9px;
    background: #cccccc;
    padding: 5px 9px;
    border-radius: 3px;
    cursor: pointer;
}

span.greybutton {
    font-family: "Gilroy Light";
    font-weight: 900;
    color: #000;
    margin-left: 10px;
    font-size: 9px;
    background: #cccccc;
    padding: 5px 9px;
    border-radius: 3px;
    cursor: pointer;
}

span.keyblock {
    font-family: Montserrat;
    font-weight: 900;
    color: #FE5757;
    margin-left: 10px;
    font-size: 10px;
    cursor: pointer;
}

span.keyblock--green {
    color: #0F9D58 !important;
}

span.keyblock_inactive {
    font-family: Montserrat;
    font-weight: 100;
    color: #000000;
    font-style: italic;
    margin-left: 10px;
    font-size: 10px;
    cursor: not-allowed;
}

span.keyblocked {
    font-family: Montserrat;
    font-weight: 100;
    color: #000000;
    font-style: italic;
    margin-left: 10px;
    font-size: 10px;
    cursor: not-allowed;
}

p.subbold {
    font-family: gb;
    font-size: 12px;
    color: #333333;
}

p.subboldb {
    font-family: gb;
    font-size: 14px;
    color: #333333;
}

p.headlight {
    font-family: gl;
    font-size: 18px;
    color: #333333;
}

p.headbold {
    font-family: gb;
    font-size: 18px;
    color: #333333;
}

p.smallheadbold {
    font-family: gb;
    font-size: 12px;
    color: #333333;
}

p.msublight {
    font-family: gl;
    font-size: 14px;
    line-height: 18px;
    color: #333333;
}

.ssublight {
    font-family: gl;
    font-size: 12px;
    line-height: 18px;
    color: #333333;
}

.pnormal {
    font-family: gl;
    font-size: 11px;
    color: #333333;
}

.smallp {
    font-family: gl;
    font-size: 9px;
    color: #333333;
}

.sublight {
    font-family: 'Inter', sans-serif;
    font-size: 10px;
    line-height: 14px;
    color: #333333;
}

p.mediumlight {
    font-family: gl;
    font-size: 18px;
    line-height: 14px;
    color: #333333;
}

p.biglight {
    font-family: gl;
    font-size: 22px;
    line-height: 14px;
    color: #333333;
}

p.sublightw {
    font-family: "Segoe UI";
    font-size: 10px;
    /*font-style: italic;*/
    color: #FFFFFF;
    text-align: end;
}

.block {
    display: block;
}

.contents {
    display: contents;
}

.inlineblock {
    display: inline-block;
}

.bg-white {
    background-color: #FFFFFF;
}

.white {
    color: #FFFFFF;
}

.op3 {
    opacity: 0.3;
}

.op5 {
    opacity: 0.5;
}

.op10 {
    opacity: 1 !important;
}

.op7 {
    opacity: 0.7;
}

.red {
    color: #DB4437;
}

.negative {
    filter: grayscale(100%);
}

.empty {
    margin: 15px 0 25px 0;
    background-color: white;
    border-radius: 20px;
    padding: 55px 32px;
}

.zback {
    z-index: -3;
}

.empty--course, .empty--pathway {
    padding: 45px 40px 40px 40px;
    margin: 0;
    display: flex;
    align-items: center;
    flex-direction: column;
    align-content: center;
}

.empty__title {
    color: #000000;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 15px;
}

.empty__sub {
    font-size: 12px;
    margin: 25px 0;
    font-family: 'Inter', sans-serif !important;
}

.empty__button {
    cursor: pointer;
    color: white;
    border: 0;
    outline: 0;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 13px;
    background-color: #622AFF;
    border-radius: 100px;
    padding: 9px 26px;
}

.empty__button--blue {
    background-color: #1C72ED;
}

.bluecard {
    border-radius: 3px;
    background: #1C72ED;
    padding: 2px 10px;
    font-size: 12px;
    color: #FFFFFF;
}

.max250 {
    max-width: 250px;
}

@media (max-width: 1000px) {


    a:visited.abutton:hover, a:link.abutton:hover {
        font-size: 11px;
        padding: 7px 15px !important;
        border-radius: 3px !important;
        border: 1px SOLID #707070 !important;
        text-align: center;
    }

    a:visited.amenu, a:link.amenu {
        font-size: 11px;
        padding: 7px 15px !important;
        text-align: center;
    }
}

.ql-editor {
    padding: 0 !important;
    font-family: "Segoe UI" !important;
    font-size: 15px !important;
    line-height: 30px !IMPORTANT;
}

.ql-editor.ql-blank::before {
 content: attr(data-placeholder) !important;
    left: 0px !important;
    font-style: normal !important;
    position: absolute !important;
    right: 0px !important;
}

.boody a {
    word-break: break-all !important;
}


textarea::-webkit-input-placeholder {
    opacity: 0.5;
}

textarea:-moz-placeholder { /* Firefox 18- */
    opacity: 0.5;
}

textarea::-moz-placeholder { /* Firefox 19+ */
    opacity: 0.5;
}

textarea:-ms-input-placeholder {
    opacity: 0.5;
}

textarea::placeholder {
    opacity: 0.5;
}

input[type=checkbox].css-checkbox {
    /*padding-left:22px;*/
    height: 17px;
    vertical-align: middle;
    cursor: pointer;

}

/*CHECK BOX*/


.check {
    cursor: pointer;
    position: relative;
    margin: auto;
    width: 18px;
    height: 18px;
    -webkit-tap-highlight-color: transparent;
    transform: translate3d(0, 0, 0);
}

.check:before {
    content: "";
    position: absolute;
    top: -10px;
    left: -10px;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background: rgba(34, 50, 84, 0.03);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.check svg {
    position: relative;
    z-index: 1;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke: #c8ccd4;
    stroke-width: 1.5;
    transform: translate3d(0, 0, 0);
    transition: all 0.2s ease;
}

.check svg path {
    stroke-dasharray: 60;
    stroke-dashoffset: 0;
}

.check svg polyline {
    stroke-dasharray: 22;
    stroke-dashoffset: 66;
}

.check:hover:before {
    opacity: 1;
}

.check:hover svg {
    stroke: #4285f4;
}

.cbx:checked + .check svg {
    stroke: #4285f4;
}

.cbx:checked + .check svg path {
    stroke-dashoffset: 60;
    transition: all 0.3s linear;
}

.cbx:checked + .check svg polyline {
    stroke-dashoffset: 42;
    transition: all 0.2s linear;
    transition-delay: 0.15s;
}


/*SNAKEBAR*/
#snackbar {
    font-family: glsb;
    visibility: hidden;
    min-width: 250px;
    margin-left: -125px;
    background-color: #333;
    color: #fff;
    text-align: center;
    border-radius: 200px;
    padding: 16px 30px;
    position: fixed;
    z-index: 1;
    left: 50%;
    bottom: 30px;
    font-size: 14px;
}

#snackbar.show {
    visibility: visible;
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

@-webkit-keyframes fadein {
    from {
        bottom: 0;
        opacity: 0;
    }
    to {
        bottom: 30px;
        opacity: 1;
    }
}

@keyframes fadein {
    from {
        bottom: 0;
        opacity: 0;
    }
    to {
        bottom: 30px;
        opacity: 1;
    }
}

@-webkit-keyframes fadeout {
    from {
        bottom: 30px;
        opacity: 1;
    }
    to {
        bottom: 0;
        opacity: 0;
    }
}

@keyframes fadeout {
    from {
        bottom: 30px;
        opacity: 1;
    }
    to {
        bottom: 0;
        opacity: 0;
    }
}

/*SNAKEBAR*/


/*@media print {*/
/*    #container_paperview {*/
/*        background-color: white;*/
/*        height: 100%;*/
/*        width: 100%;*/
/*        !*position: fixed;*!*/
/*        !*top: 0;*!*/
/*        !*left: 0;*!*/
/*        !*margin: 0;*!*/
/*        !*padding: 15px;*!*/
/*        !*font-size: 14px;*!*/
/*        !*line-height: 18px;*!*/
/*    }*/
/*}*/


#statusbar {
    margin: 0;
    padding: 0;
    background-image: linear-gradient(125deg, #4285F4, #DB4437, #F4B400, #0F9D58);
    background-size: 400% 400%;
    animation: bganimation 2s infinite;
    width: 100%;
    position: fixed;
    height: 3px;
}

#statusbar-mini {
    background-image: linear-gradient(125deg, #4285F4, #F4B400, #0F9D58);
    background-size: 400% 400%;
    animation: bganimation 01s infinite;
    width: 100%;
    height: 3px;
    opacity: 0;
    border-bottom-right-radius: 200px;
    border-bottom-left-radius: 200px;
}

@keyframes bganimation {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}


.StripeElement {
    box-sizing: border-box;

    height: 40px;

    padding: 10px 12px;

    border: 1px solid transparent;
    border-radius: 4px;
    background-color: #EEEEEE;

    box-shadow: 0 1px 3px 0 #e6ebf1;
    -webkit-transition: box-shadow 150ms ease;
    transition: box-shadow 150ms ease;
}

.StripeElement--focus {
    box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
    border-color: #fa755a;
}

.StripeElement--webkit-autofill {
    background-color: #fefde5 !important;
}


/* IMPORTED FROM MAIN.CSS */
/*GLOBAL CLASS*/

.input__empty {
    background: transparent;
    border: 0;
    outline: 0;
}

.white {
    color: #f1f1f1 !important;
}

.black {
    color: #121212 !important;
}

.violet {
    color: #7069FE !important;
}

.blue {
    color: #1C72ED !important;
}

.darkgrey {
    color: #161616 !important;
}

a {
    text-decoration: none;
}

.button {
    cursor: pointer;
    outline: 0;
    border: 0;
    text-align: center;
    font-family: "gb";
    padding: 10px 16px;
    color: #FFFFFF;
    font-size: 12px;
    background: #5CD865;
    border-radius: 7px !important;
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.1) !important;
}

.button--suttle {
    color: #666666;
    background: transparent;
    border: 1px SOLID #8C8C8C;
}

.button--smallshadow {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1) !important;
}

.button--round {
    border-radius: 200px !important;
}

.button--padded {
    padding: 12px 16px;
}

.button--model {
    font-family: "InterBold";
    padding: 12px 0;
}

.button--smalltext {
    font-size: 12px;
    padding: 10px 16px;
}


.yellowbg {
    background: #e0a800;
}

.greenbg {
    background: #5CD865;
}

.bluebg {
    background: #1C72ED;
}

.redbg {
    background: #DB4437;
}

.violetbg {
    background: #7069FE;
}

.bluetext {
    color: #1C72ED !important;
}

.greentext {
    color: limegreen;
}

.darkgreentext {
    color: #219464 !important;
}

.redtext {
    color: #DB4437 !important;
}

.redbg {
    background: #DB4437 !important;
}

.yellowtext {
    color: #e0a800;
}

.greybg {
    background: #666666 !important;
}

.greytext {
    color: #666666 !important;
}

.greylitetext {
    color: #999999 !important;
}

.blacktext {
    color: #222222 !important;
}

.button--blank {
    background: transparent;
    border: 1px SOLID #666666;
}

.button--special {
    background: transparent;
    border: 1px SOLID #e0a800;
}

.button--disabled {
    background: #666666;
    color: #999999;
    /*border: 1px SOLID #666666;*/
}

.textsm {
    font-family: InterRegular;
    font-size: 12px;
    color: #121212;
}

.text {
    font-family: glb;
    font-size: 15px;
    line-height: 1.7;
    color: #121212;
}

.text__regular {
    font-family: gl;
}

.text__semibold {
    font-family: glsb !important;
}

.text__medium {
    font-family: glm !important;
}

.text__bold {
    font-family: gb;
}

.text__italic {
    font-style: italic;
}

.text__in {
    font-family: InterRegular;
    font-weight: normal;
}

.text__insb {
    font-family: InterSemiBold;
}

.text__helv {
    font-family: "Helvetica Neue";
}

.text__mn {
    font-family: Montserrat;
}

.text--extrasuper {
    font-size: 26px;
}

.text--xxlsuper {
    font-size: 28px !important;
}

.text--lsuper {
    line-height: 32px;
    font-size: 24px;
}

.text--super {
    line-height: 30px;
    font-size: 22px !important;
}

.text--supermini {
    line-height: 27px;
    font-size: 20px !important;
}

.text--supernano {
    font-size: 18px;
}

.text--micro {
    font-size: 16px;
    color: #777777;
}

.text--mini {
    font-size: 14px;
    color: #777777;
}

.text--submini {
    font-size: 13px;
}

.text--sub {
    font-size: 12px;
    color: #444444;
    line-height: 20px;
}

.text--nano {
    font-size: 10px;
    color: #444444;
}

.text--ultranano {
    font-size: 9px;
    color: #444444;
}

.text--nanoplus {
    font-size: 11px;
    color: #444444;
    line-height: 18px;
}

.text--label {
    font-size: 12px;
    font-family: glb;
    color: #444444;
}

.text--labellite {
    font-size: 12px;
    font-family: gl;
    color: #444444;
}

.text--normal {
    font-family: InterRegular;
    font-size: 12px;
    line-height: 23px;
    word-break: break-all;
    color: #444444;
    /*z-index: 0;*/
}

.text--sublite {
    font-size: 10px;
    font-family: InterRegular;
    color: #333333;
}

.pbigbold {
    font-family: InterBold;
    font-size: 26px;
    color: #121212;
}

.pbigthin {
    font-family: InterRegular;
    font-size: 26px;
    color: #121212;
}

.pbigthin--big {
    font-size: 40px;
}

.text span {
    margin-top: -3px;
}

.input {
    padding: 12px 20px;
    font-family: 'Inter', sans-serif;
    font-size: 11px;
    border-radius: 5px !important;
    outline: 0;
    border: 0px SOLID #aaaaaa;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 20, 0.08), 0 2px 4px 0 rgba(0, 0, 20, 0.08);
}

.input-withborder {
    padding: 11px 20px;
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    border-radius: 0px !important;
    outline: 0;
    border: 3.5px SOLID #CFCFCF;
}

.input-withnumber::-webkit-inner-spin-button,
.input-withnumber::-webkit-outer-spin-button {
    -webkit-appearance: unset !important;
    margin: unset !important;
}

.input-withthinborder {
    padding: 11px 18px;
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    border-radius: 0px !important;
    outline: 0;
    border: 2px SOLID #CFCFCF;
}

.input-rounded {
    border-radius: 20px !important;
}

.inputbox, .selectbox {
    border: 2px SOLID #1C72ED;
    background: transparent;
    padding: 10px 16px;
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    color: #121212;
    width: 100%;
    margin: 5px 0;
}

.inputbox:focus, .selectbox:focus {
    border: 2px SOLID #0f58bd;
}

.input:focus {
    border: 0;
}

.hyperstack_idsfsdfnput_blue {
    padding: 10px 16px;
    font-family: MontserratRegular;
    font-size: 11px;
    border-radius: 1px !important;
    outline: 0;
    border: 2px SOLID #1C72ED;
    /*box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.1) !important;*/
}

.selectnox {
    width: auto;
    min-width: 100px;
    color: #121212;
    padding: 19px 0;
}

.select_round {
    background: transparent;
    font-family: InterBold;
    /*color: #f1f1f1;*/
    margin: 5px 0;
    width: auto;
    color: #121212;
    padding: 7px 10px;
    border-radius: 40px;
    border: 3px SOLID #333333;
}

.select_round:focus {
    outline: 0;
}

.input_big {
    font-family: InterRegular;
    font-size: 40px;
    padding: 15px 28.4px;
    margin-left: -25px !important;
}


.status {
    display: flex;
    padding: 5px 7px;
    border-radius: 5px;
    font-size: 11px;
    font-weight: 500;
    width: fit-content;
    font-family: InterRegular;
}

.status_red {
    color: #DA3939;
    background-color: #FFAFAF;
}

.status_green {
    color: #199B3C;
    background-color: #A4FABB;
}

.status_grey {
    color: #333333;
    background-color: #CCCCCC;
}

.status_red span, .status_green span, .status_grey span {
    margin-left: 6px;
    font-size: 14px;
}

.status--left span {
    margin-right: 6px;
    margin-left: 0px !important;
    font-size: 14px;
}

.pagination {
    cursor: pointer;
    padding: 7px 10px;
    border: 2px SOLID #ebebeb;
    margin-right: 10px;
    font-size: 12px;
}

.pagination__active {
    background: #ebebeb;
}

.flex {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.flex-force {
    display: flex !important;
}

.text--alignleft {
    text-align: left;
}

.text--alignright {
    text-align: right;
}

.text--aligncenter {
    text-align: center;
}

.flex__alignleft {
    align-items: flex-start;
}

.flex__alignright {
    align-items: flex-end;
}

.flex__aligncenter {
    align-items: center;
}

.flex__justifycenter {
    justify-content: center;
}

.flex__justifyend {
    justify-content: flex-end;
}

.flexv {
    display: flex;
    flex-direction: column;
    /*align-items: center;*/
    justify-content: center;
}

.flex_end {
    justify-content: flex-end;
    margin-left: auto;
}

.flexv-start {
    align-items: flex-start;
}

.flex_bottom {
    align-items: flex-end;
}

.flex_between {
    justify-content: space-between;
}

.flex_direction_row {
    flex-direction: row;
}

.gap5 {
    gap: 5px;
}
.gap7_5 {
    gap: 7.5px;
}

.gap10 {
    gap: 10px;
}

.gap15 {
    gap: 15px;
}

.gap20 {
    gap: 20px;
}

.gap23 {
    gap: 23px;
}

.gap25 {
    gap: 25px;
}


.gap35 {
    gap: 35px;
}

.scrolly {
    overflow-y: auto;
}

.noscroll {
    overflow: hidden;
}

.disabled {
    cursor: default;
    opacity: 0.5;
    filter: grayscale(100%);
    z-index: -1;
}

.disabled_minimal {
    cursor: default !important;
    opacity: 0.5;
}

.select__noarrow {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.tag {
    cursor: pointer;
    font-family: InterRegular;
    font-size: 10px;
    background-color: transparent;
    /*color: #FFFFFF;*/
    padding: 5px 10px;
    border-radius: 5px;
    border: 1px SOLID #999999;
}

.tag:hover {
    background-color: #eee;
}

/*GLOBAL CLASS*/


a:link {
    color: #333333;
    text-decoration: none;
}

a:visited {
    color: #333333;
    text-decoration: none;
}

a:hover {
    color: #333333;
    text-decoration: none;
}

a:active {
    color: #333333;
    text-decoration: none;
}

.hide {
    display: none;
}

.psmall {
    font-family: Montserrat, sans-serif;
    font-weight: 500;
    font-size: 12px;
    color: #444444;
}

.pmedium {
    font-family: Montserrat, sans-serif;
    font-weight: 700;
    font-size: 13px;
    color: #404040;
    line-height: 18px;
}

.mrgt20 {
    margin-top: 10px;
}

.align-right {
    text-align: right;
}

/* OPTIONS DROPDOWN */
.dropOptions {
    position: relative;
}

.drop-options-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 140px;
    padding: 15px 18px;
    border-radius: 10px;
    /*margin-top: 10px;*/
    /*text-align: right;*/
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    transition: 100ms ease-in-out;
}

.drop-options-content--lowview {
    top: 50px;
    position: fixed;
    /*z-index: 10000;*/
}

.drop-options-content--lowpad {
    padding: 7.5px 0px !important;
}

.drop-options-content li {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    font-size: 12px;
    padding: 7.5px 18px;
}

.drop-options-content li:hover {
    background: #EEEEEE;
    cursor: pointer;
}


.drop-options-content--bottom {
    bottom: 50px;
}


.drop-options-content--top {
    top: 40px;
}

.show {
    display: block;
}

/* OPTIONS DROPDOWN */


/* IMPORTED FROM MAIN.CSS */


/**/
.keytooltip {
    position: relative;
    display: inline-block;
}

.keytooltip .keytooltiptext {
    visibility: hidden;
    width: 140px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px;
    position: absolute;
    z-index: 1;
    bottom: 150%;
    left: 50%;
    margin-left: -75px;
    opacity: 0;
    transition: opacity 0.3s;
}

.keytooltip .keytooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}

.keytooltip:hover .keytooltiptext {
    visibility: visible;
    opacity: 1;
}

.text_overflow {
    overflow: hidden;
    max-width: 244px;
    position: relative;
    white-space: nowrap;
}

.text_overflow:after {
    content: '';
    position: absolute;

    left: 250px;
    margin-left: -40px;
    width: 40px;
    height: 100%;
    top: 0;
    background: linear-gradient(to right, rgba(240, 244, 245, 0), rgba(240, 244, 245, 1));
}

span.light {
    font-family: gl;
    size: 12px;
}

.i {
    position: relative;
    display: inline-block;
    margin-top: -4px;
}

.i img {
    cursor: pointer;
}

.i .i__tip {
    visibility: hidden;
    min-width: 120px;
    width: max-content;
    max-width: 260px;
    background-color: #333333;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 11px 15px;
    position: absolute;
    z-index: 1;
    line-height: 1.4;
    top: -150%;
    left: 180%;
    box-shadow: 0 1px 6px 0 #ccc;
    /*-webkit-transition: box-shadow 150ms ease;*/
    /*transition: box-shadow 150ms ease;*/
    font-family: InterRegular;
    font-size: 10.5px;
    opacity: 0;

    transition: opacity 0.2s ease-in-out;
    transform: scale(1);
}

.i .i__tip::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 100%;
    margin-top: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent #333333 transparent transparent;
}

.i:hover .i__tip {
    visibility: visible;
    opacity: 1;
}

#feedback-widget, #helper-widget {
    font-size: 13px;
    font-family: "InterRegular";
    background-color: #1575E5;
    border: 2px SOLID #1575E5;
    color: #FFFFFF;
    padding: 20px 10px 20px 9px;
    cursor: pointer;
    opacity: 1;
    text-align: center;
    position: fixed;
    border-bottom-right-radius: 12px;
    border-top-right-radius: 12px;
    /*bottom: 0;*/
    /*right: 90px;*/

    right: 0;
    /*transform: rotate(180deg);*/
    writing-mode: vertical-rl;
    transform: rotate(180deg) translateX(-3px);
    box-sizing: border-box !important;
    /*display: block;*/
    direction: ltr !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    word-wrap: normal !important;
    white-space: nowrap !important;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
    transition: 0.1s ease;
}

#feedback-widget {
    top: 240px;
}

#helper-widget {
    top: 390px;
}

#assistant-widget {
    opacity: 1;
    position: fixed;
    bottom: 25px;
    right: 25px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    transition: transform 100ms linear, opacity 80ms linear;
}

#assistant-launcher {
    cursor: pointer;
    width: 50px;
    transform: rotate(0deg) scale(1);
    transition: transform 100ms linear, opacity 80ms linear;
    filter: drop-shadow(0px 4px 3px rgba(0, 0, 0, 0.15));
}

#assistant-launcher.animatable:hover {
    transform: rotate(90deg) scale(1.05);
}

#assistant-widget-container {
    display: none;
    height: 600px;
    width: 380px;
    background: #FFFFFF;
    border-radius: 20px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.15);
    margin-bottom: 20px;
}

.aw-container {
    display: flex;
    height: 100%;
    flex-direction: column;
}

.aw-body {
    flex: 13;
    padding: 15px 15px 0 15px;
    display: flex;
    flex-direction: column;
}

.aw-body__head {
    height: 100%;
}

.aw-body__head__preview {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.aw-tile-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
    margin: 10px 0;
}

.aw-tile-container > div {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 16px 12px 16px 16px;
    border-radius: 10px;
    background: #F7F7F7;
    cursor: pointer;
    font-size: 12px;
    line-height: 20px;
    gap: 10px;
}

.aw-tile-container > div:hover {
    background: #EDEDED;
}

.aw-tile-container div img {
    width: 15px;
}

.aw-body__messagebody {
    /*flex: 1;*/
    display: flex;
    flex-direction: column-reverse;
    overflow-y: auto;
    max-height: 440px;
}

.aw-message {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin: 5px 0px;
    width: 100%;
}

.aw-message > div {
    font-size: 12px;
    line-height: 18px;
    max-width: 290px;
    padding: 12px 14px;
    border-radius: 7px;
    background: #F7F7F7;
}

#last-message > :not(ol):not(ul):not(pre):last-child:after,
#last-message > ol:last-child li:last-child:not(:has(p)):after,
#last-message > pre:last-child code:after,
#last-message > ul:last-child li:last-child:not(:has(p)):after,
#last-message > ol:last-child li:last-child p:last-child:after,
#last-message > ul:last-child li:last-child p:last-child:after {
    -webkit-animation: blink 0.7s infinite;
    animation: blink 0.7s infinite;
    content: " ▋";
    margin-left: .25rem;
    vertical-align: baseline;
}

#last-message.completed > :not(ol):not(ul):not(pre):last-child:after,
#last-message.completed > ol:last-child li:last-child:not(:has(p)):after,
#last-message.completed > pre:last-child code:after,
#last-message.completed > ul:last-child li:last-child:not(:has(p)):after,
#last-message.completed > ol:last-child li:last-child p:last-child:after,
#last-message.completed > ul:last-child li:last-child p:last-child:after {
    -webkit-animation: none;
    animation: none;
    content: none;
    margin-left: 0;
    vertical-align: baseline
}

@keyframes blink {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.aw-message a {
    color: #1C72ED;
    text-decoration: none;
}

.aw-message ul {
    list-style-type: circle;
}

.aw-message ol, .aw-message ul {
    list-style-type: decimal;
    padding-left: 15px;
    margin: 15px 0;
}

.aw-message ol li, .aw-message ul li {
    margin: 5px 0;
}

.aw-composer {
    flex: 1;
    margin: 15px;
    background: #F7F7F7;
    border-radius: 15px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 0 12px 0 0px;
    transition: 1s;
}

.aw-confirmator {
    display: none;
    background: #00000050;
    border-radius: 20px;
    font-size: 12px;
    position: absolute;
    /*bottom: 70px;*/
    width: 100%;
    height: 600px;
    /*box-shadow: 0 -4px 6px #ddd;*/
}

.aw-confirmator > div {
    position: absolute;
    bottom: 0px;
    background: #F7F7F7;
    padding: 18px 15px;
    border-radius: 16px 16px 20px 20px;
    width: 100%;
}

.aw-confirmator__primary {
    display: none;
}

.aw-confirmator__processing {
    display: none;
    padding: 25px !important;
    gap: 25px;
    flex-direction: column;
    align-items: center;
}

.aw-confirmator p {
    /*margin: 0;*/
    /*text-align: center;*/
    padding: 3px 4px;
    line-height: 18px;
}

.aw-confirmator button {
    width: 100%;
    padding: 11px 15px;
    background: #5CD865;
    outline: 0;
    border-radius: 32px;
    border: 0;
    color: white;
    font-family: "Inter Medium";
    cursor: pointer;
    font-size: 12px;
    margin-top: 14px;
}

.aw-confirmator button.btn--negative {
    background: #E9E9E9;
    color: #333333;
}

.aw-composer input {
    outline: 0;
    border: 0;
    padding: 10px 15px;
    background: transparent;
    width: 100%;
}

.aw-composer img {
    opacity: 0.5;
    cursor: pointer;
}


.widget-hide {
    transform: rotate(180deg) translateX(-50px) !important;
}

#helper-widget:hover, #feedback-widget:hover {
    box-shadow: 0 0 20px #1C72ED80;
    transform: rotate(180deg) translateX(0px);
}

#feedback-popup {
    z-index: 1;
    position: absolute;
    top: 30%;
    right: -500px;
    padding: 22px 26px 12px 26px;
    width: 320px;
    border-radius: 10px;
    box-shadow: 0 0 100px #00000050;
    background: white;
    height: auto;
    /*transition: 0.01s ease;*/
}

#feedback-popup textarea {
    margin: 15px -26px;
    padding: 10px 26px;
    width: 320px;
    background-color: #EEEEEE;
    border: 0;
    font-family: "InterRegular";
    font-size: 13px;
    min-height: 100px;
}

#help-widget {
    font-size: 20px;
    font-family: "glb";
    background-color: #7069FE;
    color: white;
    padding: 11px 18px;
    cursor: pointer;
    opacity: 1;
    text-align: center;
    position: fixed;
    border-radius: 200px;
    /*border-top-left-radius: 12px;*/
    /*border-top-right-radius: 12px;*/
    bottom: 35px;
    right: 35px;
    display: flex;
    flex-direction: row;
    align-items: center;
    box-shadow: 0 2px 4px rgb(145 92 182 / 40%);
}

.popclose {
    position: absolute;
    top: -10px;
    right: 20px;
    cursor: pointer;
}

#survey-popup {
    z-index: 1;
    position: absolute;
    bottom: -500px;
    right: 100px;
    padding: 26px;
    width: 460px;
    border-radius: 10px 10px 0px 0px;
    box-shadow: 0 0 100px #00000050;
    background: white;
    height: auto;
}

#survey-popup textarea {
    margin: 16px 0px;
    padding: 12px 15px;
    width: 100%;
    background-color: #EEEEEE;
    border: 0;
    border-radius: 5px;
    font-family: "InterRegular";
    font-size: 14px;
    min-height: 100px;
}

#survey-popup textarea:focus {
    outline: 0;
    border: 0;
}

#survey-popup select {
    padding: 9px 10px;
    width: auto;
    background-color: #EEEEEE;
    border: 0;
    border-radius: 5px;
    font-family: "InterRegular";
    font-size: 13px;
}

.scale-widget {
    display: flex;
    flex-direction: row;
    gap: 7px;
    margin: 20px 0 15px 0;
}

.scale-widget button {
    /* padding: 5px 10px; */
    font-size: 16px;
    white-space: nowrap;
    vertical-align: middle;
    display: inline-block;
    background: none;
    border: none;
    box-shadow: none;
    cursor: pointer;
    text-align: center;
    font-weight: 500;
    border-radius: 100%;
    margin: 0;
    outline: none;
    margin-left: 0px;
    width: 35px;
    height: 35px;
    border: 3px solid #eee;
    transform: scale(1);
    transition: background 0.2s ease-in, color 0.2s ease-in, border-color 0.2s ease-in, transform 0.2s cubic-bezier(0.5, 2, 0.5, 0.75);
}

.scale-widget button.detractor-hover {
    background: #f44336;
    color: white;
    border-color: #f55a4e;
    transform: scale(1.05);
}

.scale-widget button.passive-hover {
    background: #f57c00;
    color: white;
    border-color: #ff8910;
    transform: scale(1.05);
}

.scale-widget button.promoter-hover {
    background: #4caf50;
    color: white;
    border-color: #5cb860;
    transform: scale(1.05);
}

/**/


@media (max-width: 700px) {
    .mob-mrgt5 {
        margin-top: 5px;
    }

    .mob-mrgt10 {
        margin-top: 10px;
    }

    .mob-mrgt20 {
        margin-top: 20px;
    }

    .mob-mrgt30 {
        margin-top: 30px;
    }

    .mob-fsize12 {
        font-size: 12px;
    }

    .mob-wdth100 {
        width: 100% !important;
    }

    .inputbox, .selectbox {
        width: 100% !important;
    }
}


.greyarea {
    display: none;
    position: fixed;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.09);
    z-index: 998;
    opacity: 0;
    transition: all 0.2s ease-in-out;
}

.greyarea.active {
    display: block;
    opacity: 1;
}

.popup {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 3; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0, 0, 0); /* Fallback color */
    background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */
}

/* Modal Content */
.popup-content {
    background-color: #fefefe;
    margin: auto;
    border-radius: 10px;
    padding: 40px;
    border: 1px solid #888;
    width: 440px;
}

.shimmer {
    border-radius: 10px;
    background: linear-gradient(-45deg, #eee 40%, #fafafa 50%, #eee 60%);
    background-size: 300%;
    background-position-x: 100%;
    animation: shimmer_effect 1s infinite linear;
}

@keyframes shimmer_effect {
    to {
        background-position-x: 0;
    }
}