:root {

 /*   --vh: calc(1vh - 0.05px);
*/
/*    --radius: 20px;*/
    --radius: 24px;
    --radius2: 20px;
    --bg:#E8E8E8;

    --hero-blue:#004265;
    --search-blue:#062539;
    --cta-blue:#082E47;

    --btt-blue:#084D66;

    --footer-1:#00283d;
    --footer-2:#111b29;


    --orange:#FF8B2B;
    --menu-orange:#EE8229;


    --black:#111B29;
    --tc-black:#0B0C0C;

    --link:#172642;

    --nav-blue:#525962 /*#535A63*/;
    --menu-blue:#125f84 /*#126086*/;

    --blue:#3F5FDE;
    --mid-blue:#C5E9F7;
    --light-blue:#F3F8FF;

    --purple:#46345A;
    --mid-purple:#DAD4F9;
    --light-purple:#F7F4FB;


    --light-blue-box:#F3F8FF;

    --logo-green:#7FC347;
    --logo-lightblue:#0077AD;
    --logo-red:#E31E36;
    --logo-blue:#215568;



    --unit:16px;
    --gutter:32px;
    --gutter_big:48px;
    --wrapper-margin:64px;


    --grid-third:calc((((100% - (var(--gutter) * 11)) / 12) * 4 ) + (var(--gutter) * 3));
    --grid-twothirds:calc((((100% - (var(--gutter) * 11)) / 12) * 8 ) + (var(--gutter) * 7));
    --grid-quarter: calc((((100% - (var(--gutter) * 11)) / 12) * 3 ) + (var(--gutter) * 2));
    --grid-half: calc(50% - (var(--gutter) / 2));
    --grid-sixth: calc((((100% - (var(--gutter) * 11)) / 12) * 2 ) + var(--gutter));


    --cards_third: calc(((100% - var(--gutter)) / 3) - (var(--gutter) * (2 / 3)));
    /*--cards_twothirds: calc(((100% - var(--gutter)) * (2 / 3)) - (var(--gutter) * (2 / 3)));*/
    /*--cards_twothirds: calc(((100% - (var(--gutter) * 2)) * (2 / 3)) - (var(--gutter) * (2 / 3)));*/
    --cards_twothirds: calc((var(--cards_third) * 2) + var(--gutter));
    --cards_half: calc((((100% - var(--gutter)) / 2)) - (var(--gutter)));

    /*
    min-width: calc(((((var(--maxwidth) - (var(--wrapper-margin) * 2) - (var(--gap) * 11)) / 12) * 2) + (var(--gap) * 1)));
    */



    --overflow: calc(100% + 2px);


}

@media all and (max-width: 1499px) {
/*    :root {
        --wrapper-margin:48px;
    }*/
}

@media all and (max-width: 1199px) {
    :root {
        --wrapper-margin:48px;

    }
}

@media all and (max-width: 899px) {
    :root {
        --wrapper-margin:32px;
    }
    :root {
        --masthead-height: 82px;
    }

}


@media all and (max-width: 599px) {
    :root {
        --wrapper-margin:16px;
        --gutter_big:32px;
        --gutter:16px;
        --radius: 20px;
        --radius2: 16px;
    }
}