:root {
    --foreground-rgb: 0,0,0;
    --background-start-rgb: 214,219,220;
    --background-end-rgb: 255,255,255;
    --background-wrap: #f5f7fa;
    --color-b-85: rgba(0,0,0,.85);
    --color-b-65: rgba(0,0,0,.65);
    --color-b-45: rgba(0,0,0,.45);
    --color-b-25: rgba(0,0,0,.25);
    --color-b-10: rgba(0,0,0,.1);
    --color-w-85: hsla(0,0%,100%,.85);
    --color-w-65: hsla(0,0%,100%,.65);
    --color-w-25: hsla(0,0%,100%,.25);
    --color-w-20: hsla(0,0%,100%,.2);
    --color-w-15: hsla(0,0%,100%,.15);
    --color-w-10: hsla(0,0%,100%,.1);
    --font-size-12: 12px;
    --font-size-14: 14px;
    --font-size-16: 16px;
    --font-size-18: 18px;
    --font-size-20: 20px;
    --font-size-24: 24px;
    --font-size-32: 32px;
    --font-size-36: 36px;
    --font-size-40: 40px;
    --font-size-48: 48px;
    --global-margin-w: 120px;
    --global-header-h: 80px;
    --color-primary: #4791ff;
    --color-primary-hover: #4082e5;
    --global-w: 1180px
}

@font-face {
    font-family: Poppins;
    font-display: swap;
    src: url(../font/poppins-regular.ttf);
}

html{
    font-size: 4px;
}
html body{
    font-family: Poppins;
}
img, video{
    max-width: 100%;
    height: auto;
}

/* UTILITY CLASSES */
.bg-bg-wrap{
    background-color: var(--background-wrap);
}
.empty-space-12{
    display: block;
    height: 12px;
}

/* HEADER */
header{
    background-color: #fff;
    box-shadow: 0 2px 4px -1px rgba(0,0,0,.1) !important;
}
.nav_nav-container{
    align-items: center;
    height: 100%;
    color: rgba(0,0,0,.85);
    margin-left: 70px;
    font-size: var(--font-size-18);
}

/* NAV */


/* FOOTER and MOBILE NAV */
.MainMenu-Mobile label:after,
.Footer_accordion-wrap label:after {
    content: '>';
    position: absolute;
    right: 1rem;
    color: #000000;
    transition: 0.2s linear;
}

.MainMenu-Mobile input:checked + label:after,
.Footer_accordion-wrap input:checked + label:after {
    transform: rotate(90deg);
    line-height: .8em;
}

.MainMenu-Mobile .accordion > .panel:before,
.Footer_accordion-wrap .accordion > .panel:before{
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: rgba(229,231,235,1);
    position: relative;
    top: 40px;
}

.MainMenu-Mobile .accordion > .panel .accordion__content > .accordion__body ul > li,
.Footer_accordion-wrap .accordion > .panel .accordion__content > .accordion__body ul > li {
    border-bottom: 1px solid rgba(229,231,235,1);
}

.MainMenu-Mobile .accordion__content,
.Footer_accordion-wrap .accordion__content{
    max-height: 0em;
    transition: all 0.4s cubic-bezier(0.865, 0.14, 0.095, 0.87);
}
.MainMenu-Mobile input[name='panel']:checked ~ .accordion__content,
.Footer_accordion-wrap input[name='panel']:checked ~ .accordion__content {
    /* max-height: 50em; */
    max-height: 100vh;
}
.MainMenu-Mobile input[name='panel']:checked ~ label,
.Footer_accordion-wrap input[name='panel']:checked ~ label{
    color: var(--color-primary);
}

/* BUTTON */
button{
    line-height: normal !important;
}

/* HEAD */
.Head_head-wrap {
    display: flex;
    width: 100%
}

.Head_head-wrap .Head_theme1 {
    background-color: #748194
}

.Head_head-wrap .Head_theme2 {
    background-color: #d2a941
}

.Head_head-wrap .Head_theme3 {
    background-color: #b04646
}

.Head_head-wrap .Head_theme4 {
    background-color: #9c7859
}

.Head_head-wrap .Head_theme5 {
    background-color: #b17c3e
}

.Head_head-wrap .Head_theme6 {
    background-color: #454648
}

.Head_head-wrap .Head_theme7 {
    background-color: #3da6a6
}

@media screen and (min-width: 0px) {
    .Head_head-wrap {
        position:relative;
        min-width: 100%;
        background-image: none
    }

    .Head_head-wrap .Head_left-bar {
        position: relative;
        padding: 16rem 6rem;
        opacity: .9;
        z-index: 1
    }

    .Head_head-wrap .Head_left-bar .Head_btn__1 {
        width: -moz-fit-content;
        width: fit-content;
        color: #fff;
        border-color: #fff
    }

    .Head_head-wrap .Head_img-bar {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover
    }
}

@media screen and (min-width: 1180px) {
    .Head_head-wrap {
        min-width:var(--global-w);
        padding: 0
    }

    .Head_head-wrap .Head_left-bar {
        width: 64%;
        padding: 60px 120px 80px calc((100% - var(--global-w))/2);
        background-image: url(/assets/img/casesbg.svg);
        background-repeat: no-repeat;
        background-position-x: calc((100vw - var(--global-w))/2 - 40px);
        background-position-y: 48px;
        opacity: 1
    }

    .Head_head-wrap .Head_left-bar .Head_btn__1 {
        width: -moz-fit-content;
        width: fit-content;
        color: #fff;
        border-color: #fff
    }

    .Head_head-wrap .Head_left-bar .Head_btn__1:hover {
        background: hsla(0,0%,100%,.2)
    }

    .Head_head-wrap .Head_img-bar {
        position: static;
        flex: 1;
        height: 500px;
        -o-object-fit: cover;
        object-fit: cover;
        overflow: hidden
    }
}