/* $breakpoints: ( // null: null, 
sm: "576px", 
md: "768px", 
lg: "992px", 
xl: "1200px", 
xxl: "1440px", 
fhd: "1920px" 
); 
  */

/* ============= // Color -=========================================== // */
._dash_set1 {

    --color1: rgb(73, 75, 211);
    --color2: #b698fe;
    --color3: #a7c6e0;
    --color4: #b1d2ad;
    --color5: #e08965;

    --bg: rgb(20 21 23);

    --text-color: rgb(243 242 244);

    --text-muted-color: rgb(195 197 198);

    --text-xmuted-color: rgb(123 125 129);

    --surface1: rgb(26 27 32);
    --surface2: rgb(32 35 39);
    --surface3: rgb(37 39 43);
    --surface4: rgb(57, 59, 63);

    --border1: rgb(243 242 244);
    --border-muted-color: rgb(238 238 238);
    --border3: rgba(238 238 238, .50)
}


/* ============= // Color -=========================================== // */
._set1 {

    --color1: rgb(73, 75, 211);

    --main-bg: rgb(255 255 255);
    --dark-bg: rgb(15 23 42);
    --dark-bg2: rgb(23, 24, 26);

    --border-color: rgb(15 23 42);
    --border-muted-color: #ebebf1;
    --border-xmuted-color: #f2f2f7;


    --heading-color: rgb(15 23 42);
    --heading-color-light: rgb(255, 255, 255);


    /* // Surfaces // */
    --surface1: rgb(249, 249, 249);
    --surface2: rgb(245, 245, 245);
    --surface3: rgb(238, 238, 238);


    /* --text-color: rgb(15 23 42); */

    --text-color: rgb(15, 14, 54);
    --text-light-color: rgb(255 255 255);

    --text-muted-color: rgba(15, 14, 54, .60);
    --text-muted-color-light: rgb(205, 206, 212);

    --border-light-color: rgb(15 23 42);
    --border-light-muted-color: #ebebf1;
    --border-light-xmuted-color: #f2f2f7;

    --nav-menu-color: rgb(15, 14, 54);

}

/* // =====---==== Mobile Devices up  -==============================---====  */

._set1 {

    --body-font-size: 1.6rem;
    --body-line-height: 1.69;

    --body-font: "Work sans";

    --heading-font: "archiaregular", "Inria sans", sans-serif;
    --heading-font-weight: 600;
    --section-title1: 5.2rem;

    --block-padding: 4.8rem;


    --container-width: 100%;

    /* // Typo // */
    --section-title1-size: 4.2rem;

    --ui-title1-size: 4.2rem;
    --ui-title2-size: 3.4rem;
    --ui-title3-size: 2.8rem;

}

.container {
    padding-left: 5%;
    padding-right: 5%;
}

/*===== ### ====== */
/*===== SM devices up -----------------------------==-----------====== */

@media (min-width: 578px) {

    ._set1 {

        --block-padding: 6.4rem;
        --container-width: 90%;

        --section-title1-size: 4.4rem;

        --ui-title1-size: 4.2rem;
        --ui-title2-size: 3.4rem;
        --ui-title3-size: 2.8rem;



    }

    .container {
        padding-left: initial;
        padding-right: initial;
    }

}

/*===== ### ====== */
/*===== MD devices up -----------------------------==-----------====== */

@media (min-width: 768px) {

    ._set1 {

        --block-padding: 6.4rem;
        --container-width: 90%;

        --section-title1-size: 5.8rem;

        --ui-title1-size: 4.2rem;
        --ui-title2-size: 3.4rem;
        --ui-title3-size: 2.8rem;

    }

}


/*===== ### ====== */
/*===== LG devices up -----------------------------==-----------====== */

@media (min-width: 992px) {

    ._set1 {

        --block-padding: 6.4rem;
        --container-width: 89%;

        --section-title1-size: 6.8rem;

        --ui-title1-size: 5.2rem;
        --ui-title2-size: 4.2rem;

        --ui-title1-size: 4.2rem;
        --ui-title2-size: 3.4rem;
        --ui-title3-size: 2.8rem;

    }

}


/*===== ### ====== */
/*===== XL devices up -----------------------------==-----------====== */

@media (min-width: 1200px) {

    ._set1 {

        --block-padding: 6.4rem;
        --container-width: 87%;

        --section-title1-size: 7.2rem;

        --ui-title1-size: 5.6rem;
        --ui-title2-size: 4.8rem;

        --ui-title1-size: 4.2rem;
        --ui-title2-size: 3.4rem;
        --ui-title3-size: 2.4rem;

    }

}


/*===== XXL devices up -----------------------------==-----------====== */

@media (min-width: 1440px) {

    ._set1 {

        --block-padding: 6.4rem;
        --container-width: 1440px;

    }

}

/*===== XXXL devices up -----------------------------==-----------====== */

@media (min-width: 1920) {

    ._set1 {

        --block-padding: 6.4rem;
        --container-width: 1440px;

        --section-title1-size: 8.8rem;

    }

}


body {

    font-family: var(--body-font);

    font-size: var(--body-font-size);
    line-height: var(--body-line-height);

    color: var(--text-color);

    background-color: var(--main-bg);
}

h1,
h2,
h3,
h4,
h5,
h6,
.ui-title1,
.ui-title2,
.ui-title3,
.ui-heading,
.section-title1 {
    font-family: var(--heading-font);
    font-weight: var(--heading-font-weight);
}

.container {
    max-width: var(--container-width);
}



.nav-menu li a {
    color: var(--nav-menu-color);
}


.list-style\=none {
    list-style: none;
}

/*===== ### ====== */
/*===== Typography -----------------------------==-----------====== */
.section-title1 {

    font-size: var(--section-title1-size);
}


.ui-title1 {

    font-size: var(--ui-title1-size);
}

.ui-title2 {

    font-size: var(--ui-title2-size);
}

.ui-title3 {

    font-size: var(--ui-title3-size);
}

/*===== ### ====== */
/*===== Block -----------------------------==-----------====== */

.ui-block:not([class*="py="]) {
    padding-top: var(--block-padding);
    padding-bottom: var(--block-padding);
}


.ui-icon .lni {
    font-size: inherit;
}

/*===== ### ====== */
/*===== Border ------------------------- === - ----==-----------====== */

.border-t,
.border-r,
.border-b,
.border-l,
[class*="border"] {
    border-color: var(--border-color);

}

.border-t.bc\=muted,
.border-r.bc\=muted,
.border-b.bc\=muted,
.border-l.bc\=muted,
[class*="border"].bc\=muted {
    border-color: var(--border-muted-color);

}

.border-t.bc\=xmuted,
.border-r.bc\=xmuted,
.border-b.bc\=xmuted,
.border-l.bc\=xmuted,
[class*="border"].bc\=xmuted {
    border-color: var(--border-xmuted-color);

}

/*===== ### ====== */
/*===== Background -----------------------------==-----------====== */

.bg\=1,
.bg\=main {
    background-color: var(--main-bg);
}

.c\=text,
a:not([class*=" c="]) {
    color: var(--text-color);
}


.bg\=surface1 {
    background-color: var(--surface1);
}

.bg\=surface1 .bg\=surface1 {
    background-color: var(--surface2);
}

.bg\=surface1 .bg\=surface2 {
    background-color: var(--surface3);
}

.bg\=surface2 {
    background-color: var(--surface2);
}

.bg\=surface2 .bg\=surface1 {
    background-color: var(--surface3);
}

.bg\=surface3 {
    background-color: var(--surface3);
}


/* ==== // BG dark 1 -=================================================== // */

.bg\=dark {
    background-color: var(--dark-bg);
}

.bg\=dark .c\=text,
.bg\=dark:not([class*=" c="]),
.bg\=dark a:not([class*=" c="]) {
    color: var(--text-light-color);
}

.bg\=dark.c\=text-muted,
.bg\=dark .c\=text-muted,
.bg\=dark.link-c\=text-muted a:not([class*=" c="]),
.bg\=dark .link-c\=text-muted a:not([class*=" c="]) {
    color: var(--text-muted-color-light);
}

.bg\=dark .ui-heading:not([class*="c="]) {
    color: var(--text-light-color);
}

/* ==== // BG colo1 -=================================================== // */

.bg\=color1.c\=text,
.bg\=color1 .c\=text,
.bg\=color1:not([class*="c="]),
.bg\=color1 a:not([class*="c="]) {
    color: var(--text-light-color);
}

/* ==== // BG dark 2 -=================================================== // */

.bg\=dark2 {
    background-color: var(--dark-bg2);
}

.bg\=dark2 .c\=text,
.bg\=dark2:not([class*="c="]),
.bg\=dark2 a:not([class*="c="]) {
    color: var(--text-light-color);
}

.bg\=dark2.c\=text-muted,
.bg\=dark2 .c\=text-muted,
.bg\=dark2.link-c\=text-muted a:not([class*=" c="]),
.bg\=dark2 .link-c\=text-muted a:not([class*=" c="]) {
    color: var(--text-muted-color-light);
}

.bg\=dark2 .ui-heading:not([class*="c="]) {
    color: var(--text-light-color);
}


.bg\=dark2 .border-t,
.bg\=dark2 .border-r,
.bg\=dark2 .border-b,
.bg\=dark2 .border-l,
.bg\=dark2 [class*="border"],
.ui-form .form-field {
    border-color: var(--border-color);

}

.border-t.bc\=muted,
.border-r.bc\=muted,
.border-b.bc\=muted,
.border-l.bc\=muted,
[class*="border"].bc\=muted,
.form-bc\=muted .form-field {
    border-color: var(--border-muted-color);

}

.border-t.bc\=xmuted,
.border-r.bc\=xmuted,
.border-b.bc\=xmuted,
.border-l.bc\=xmuted,
[class*="border"].bc\=xmuted,
.form-bc\=xmuted .form-field {
    border-color: var(--border-xmuted-color);

}


.ui-form .form-error .form-field {
    border-color: rgb(252 97 97);

}

.ghxf {
    background-image: linear-gradient(to bottom, transparent 0%, transparent 20%, #dde9ed 20%, #dde9ed 100%);
}



@media (max-width: 800px) {

    .nav-menu {
        background-color: #fff;
        /* position: absolute; */
        top: 100%;
    }
    
    .ui-nav:not(.menu-open) .nav-menu {
        display: none;
    }

    .ui-nav.mobi-horizontal-menu .nav-menu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        overflow-x: auto;
        height: 5rem;
    }

    .ui-nav.mobi-horizontal-menu .nav-menu li {
        margin-left: 0;
        margin-right: 4rem;
    }

    .ui-nav.mobi-horizontal-menu .nav-menu li:last-child {
        margin-right: 0;
    }
    
}

.nav-menu li {
    position: relative;
}

/* .nav-menu li.active::before,
.nav-menu li.active::after {

    content: '';
    display: block;
    position: absolute;
    width: 2px;
    left: 50%;
    background-color: currentColor;
    height: 4rem;
    z-index: -1;
} */

/* .nav-menu li.active::before {
    opacity: .6;
}

.nav-menu li.active::after {

    position: absolute;
    left: 0%;
    width: 100%;
    top: auto;
    bottom: -40%;
    background-color: currentColor;
    height: 4px;
} */


/* .nav-menu li:nth-child(2) {
    color: #e7e0f6;
} */


.nav-menu li.active::after {

    content: '';
    display: block;
    position: absolute;
    width: .6rem;
    left: 50%;
    top: 120%;
    transform: rotate(45deg);
    margin-left: -0.6rem;
    background-color: currentColor;
    height: .6rem;
    z-index: -1;
}

.shadow1,
.hover\:shadow1:hover {
    box-shadow: 0px 10px 10px 0px rgba(0, 0, 79, 0.05);
}









.theme9 {
    --c1: rgb(121, 114, 136);
    --c1: rgb(227 213 255);
    --c2: rgb(252, 225, 172);
    --c3: rgb(187, 229, 245);
    --c4: rgb(204, 239, 190);

    /* --b1: rgb(232, 234, 239); */
    --b1: rgb(224 227 233);
    /* --b2: rgb(247, 245, 242); */
    --b2: rgb(244 242 240);

    --b3: rgb(180 184 191);

    --txt1: rgb(29, 31, 49);
    --txt2: rgb(143, 143, 148);
    --txt3: rgb(159, 161, 158);

    --bg-light-1: rgb(247, 247, 247);
    --bg-light-2: rgb(244, 244, 244);

}

.grow-1 {
    flex-grow: 1;
}

.shrink-0 {
    flex-shrink: 0;
}

.bg\=c1 {
    background-color: var(--c1);
}

.bg\=c2 {
    background-color: var(--c2);
}

.bg\=c3 {
    background-color: var(--c3);
}

.bg\=c4 {
    background-color: var(--c4);
}

.bg\=light1 {
    background-color: var(--bg-light-1);
}

.bg\=light2 {
    background-color: var(--bg-light-2);
}

/* .theme9 .b, 
.theme9 [class^="~~~b-~~~~~~"], 
.theme9 [class*="~~~ b-~~~~~~"], 
.theme9 [class*="~~~(border-t~~~~~~"], 
.theme9 [class*="~~~(b-r~~~~~~"], 
.theme9 [class*="~~~(border-l~~~~~~"], 
.theme9 [class*="~~~(border-b~~~~~~"], 
.#{$quantum_prefix}form .form-field, 
.#{$quantum_prefix}form .form-field[type="~~~checkbox~~~~~~"]:not(:checked):focus { 
    border-color: grey(8); 
}  */

.bc\=b1,
[class^="b-"].bc\=b1,
[class*=" b-"].bc\=b1,
.border-t.bc\=b1,
[class*="(border-t"].bc\=b1,
.b-r.bc\=b1,
[class*="(b-r"].bc\=b1,
.border-b.bc\=b1,
[class*="(border-b"].bc\=b1,
.border-l.bc\=b1,
[class*="(border-l"].bc\=b1 {
    border-color: var(--b1);
}

.bc\=b2,
[class^="b-"].bc\=b2,
[class*=" b-"].bc\=b2,
.border-t.bc\=b2,
[class*="(border-t"].bc\=b2,
.b-r.bc\=b2,
[class*="(b-r"].bc\=b2,
.border-b.bc\=b2,
[class*="(border-b"].bc\=b2,
.border-l.bc\=b2,
[class*="(border-l"].bc\=b2 {
    border-color: var(--b2);
}


.bc\=b3,
[class^="b-"].bc\=b3,
[class*=" b-"].bc\=b3,
.border-t.bc\=b3,
[class*="(border-t"].bc\=b3,
.b-r.bc\=b3,
[class*="(b-r"].bc\=b3,
.border-b.bc\=b3,
[class*="(border-b"].bc\=b3,
.border-l.bc\=b3,
[class*="(border-l"].bc\=b3 {
    border-color: var(--b3);
}


.c\=txt1,
.icon-c\=txt1 .ui-icon,
.heading-c\=txt1 .ui-heading:not([class*=" c="]):not([class^="c="]),
[class*="heading-c\="] .heading-c\=txt1 .ui-heading:not([class*=" c="]):not([class^="c="]) {
    color: var(--txt1);
}

.c\=txt2,
.icon-c\=txt2 .ui-icon,
.heading-c\=txt2 .ui-heading:not([class*=" c="]):not([class^="c="]),
[class*="heading-c\="] .heading-c\=txt2 .ui-heading:not([class*=" c="]):not([class^="c="]) {
    color: var(--txt2);
}

.c\=txt3,
.icon-c\=txt3 .ui-icon,
.heading-c\=txt3 .ui-heading:not([class*=" c="]):not([class^="c="]),
[class*="heading-c\="] .heading-c\=txt3 .ui-heading:not([class*=" c="]):not([class^="c="]) {
    color: var(--txt3);
}



.cardo_box {
    position: relative;
    border-style: hidden;
    overflow: visible;
}


.cardo_box .inner,
.cardo_box .content {
    z-index: 4;
    position: relative;
}

.cardo_box::before {
    border-color: inherit;
    background-color: inherit;
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    border-width: 1px;
    border-style: solid;
    border-radius: inherit;
    z-index: 1;
    left: 0;
    transform: translate(-5px, 5px);
    -webkit-transform: translate(-5px, 5px);
}

.cardo_box.right_bottom::before {
    transform: translate(7px, 7px);
    -webkit-transform: translate(7px, 7px);
}

@media (min-width: 992px) {

    .border-last-on-row-0.lg\(columns\=4\) > *:nth-child(4n) {
        border-color: transparent;
    }
}



@font-face {
    font-family: 'archiaregular';
    src: url('../fonts/archia/archia-regular-webfont.eot');
    src: url('../fonts/archia/archia-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/archia/archia-regular-webfont.woff2') format('woff2'),
         url('../fonts/archia/archia-regular-webfont.woff') format('woff'),
         url('../fonts/archia/archia-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}


#xx-modal {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: -1;
    visibility: hidden;
    display: none
}

#xx-modal .modal-bg,
#xx-modal .modal-window {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 10
}

#xx-modal .modal-window {
    visibility: hidden
}

#xx-modal .modal-bg {
    position: absolute;
    z-index: 10;
    background-color: rgba(0,0,0,.6);
    background-color: rgba(220,220,220,.6)
}

#xx-modal .modal-window+.modal-window {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 20
}

#xx-modal .modal-content {
    z-index: 20
}

#xx-modal .modal-content:not([class*=bg--]) {
    background: transparent
}

#xx-modal.ready-modal {
    display: block;
    visibility: visible;
    z-index: 5000
}

#xx-modal .ready-modal-window.modal-window {
    visibility: visible
}

#xx-modal .container {
    z-index: 40
}

.modal-bg {
    opacity: 0
}

.modal-window .modal-content {
    position: relative;
    opacity: 0
}

.modal-window.no-bg .modal-bg {
    background-color: transparent
}

.modal-window.no--bg .modal-bg {
    display: none
}

.modal-window.modal-content-in .modal-bg,.modal-window.modal-content-in .modal-content {
    opacity: 1;
    will-change: transform
}

.modal-window.scale-in .modal-content {
    opacity: 0;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    transition: opacity 0s 0s,transform .005s
}

.modal-window.scale-in.modal-content-in .modal-bg {
    transition: opacity .3s
}

.modal-window.scale-in.modal-content-in .modal-content {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
    transition: visibility 0s linear 0s,opacity .25s 0s,transform .25s
}

.modal-window.bottom-up .modal-content {
    opacity: 0;
    -webkit-transform: translate3d(0,100%,0);
    transform: translate3d(0,100%,0);
    transition: visibility 0s linear 0s,opacity .28s .2s,transform .28s
}

.modal-window.bottom-up.modal-content-in .modal-bg {
    transition: opacity .3s
}

.modal-window.bottom-up.modal-content-in .modal-content {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    transition: visibility 0s linear 0s,opacity .25s 0s,transform .25s
}

.modal-window.bottom-up-2 .modal-content {
    opacity: 0;
    -webkit-transform: translate3d(0,100%,0);
    transform: translate3d(0,100%,0);
    transition: visibility 0s linear 0s,opacity .12s .2s,transform .12s
}

.modal-window.bottom-up-2.modal-content-in .modal-bg {
    transition: opacity .3s
}

.modal-window.bottom-up-2.modal-content-in .modal-content {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    transition: visibility 0s linear 0s,opacity .2s 0s,transform .28s
}

.modal-window.bottom-up-3 .modal-content {
    opacity: 0;
    -webkit-transform: translate3d(0,100%,0);
    transform: translate3d(0,100%,0);
    transition: transform .18s cubic-bezier(0.6,.4,0,1),opacity .18s cubic-bezier(0.6,.4,0,1)
}

.modal-window.bottom-up-3.modal-content-in .modal-bg {
    transition: opacity .3s
}

.modal-window.bottom-up-3.modal-content-in .modal-content {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0) scale(1);
    transform: translate3d(0,0,0) scale(1);
    transition: transform .3s cubic-bezier(0.6,.4,0,1),opacity .3s cubic-bezier(0.6,.4,0,1)
}

.modal-window.slide-down-sm .modal-content,.modal-window.slide-down-sm.modal-content-off .modal-content {
    opacity: 0;
    -webkit-transform: translate3d(0,-10px,0);
    transform: translate3d(0,-10px,0);
    transition: visibility 0s linear 0s,opacity .23s 0s,transform .23s
}

.modal-window.slide-down-sm.modal-content-in .modal-bg {
    transition: opacity .3s
}

.modal-window.slide-down-sm.modal-content-in .modal-content {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    transition: visibility 0s linear 0s,opacity .2s 0s,transform .32s
}

.modal-window.slide-down-md .modal-content,.modal-window.slide-down-md.modal-content-off .modal-content {
    opacity: 0;
    -webkit-transform: translate3d(0,-20px,0);
    transform: translate3d(0,-20px,0);
    transition: visibility 0s linear 0s,opacity .23s 0s,transform .23s
}

.modal-window.slide-down-md.modal-content-in .modal-bg {
    transition: opacity .3s
}

.modal-window.slide-down-md.modal-content-in .modal-content {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    transition: visibility 0s linear 0s,opacity .2s 0s,transform .32s
}

.modal-window.slide-in-right-md .modal-content,.modal-window.slide-in-right-md.modal-content-off .modal-content {
    opacity: 0;
    -webkit-transform: translate3d(100%,0,0);
    transform: translate3d(100%,0,0);
    transition: visibility 0s linear 0s,opacity .23s 0s,transform .23s
}

.modal-window.slide-in-right-md.modal-content-in .modal-bg {
    transition: opacity .3s
}

.modal-window.slide-in-right-md.modal-content-in .modal-content {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    transition: visibility 0s linear 0s,opacity .2s 0s,transform .32s
}

.modal-window.slide-up-sm .modal-content {
    opacity: 0;
    -webkit-transform: translate3d(0,10px,0);
    transform: translate3d(0,10px,0);
    transition: visibility 0s linear 0s,opacity .23s 0s,transform .23s
}

.modal-window.slide-up-sm.modal-content-in .modal-bg {
    transition: opacity .3s
}

.modal-window.slide-up-sm.modal-content-in .modal-content {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    transition: visibility 0s linear 0s,opacity .2s 0s,transform .32s
}