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

html {
    /* font-size: 10px; */
    /*  Default Browser font-size = 16px */
    /*  10px / 16px = .625 = 62.5% */
    /* percentage of users browers font-size setting */
    /* we cannot use this because it resets radzen styles  */
    /*font-size: 62.5%;*/
    /* we need to set the font-size default to 14px because AntDesign styles dp*/
    /* $ 14px \div 16px = 0.875rem $  14px equals 0.875rem (assuming a 16px root font size).  */
    font-size: 87.5%;


    /*Firefox supports scroll-behavior: smooth since version 36 (2015)*/
    /*Chrome and Edge support scroll-behavior: smooth since 2017 (Chrome 61)*/
    /*Safari supports scroll-behavior: smooth starting with Safari 15.4 (released in March 2022)*/
    scroll-behavior: smooth;
}


body {
    font-family: "Open Sans", sans-serif;
    line-height: 1;
    font-weight: 400;
    color: #555;
    height: 100vh;
}

 
/*HELPERS*/

.kms-container {
    /* This will set the content's max width as well as center */
    max-width: 85.7rem;
    margin: 0 auto;
    /*padding: 0 3.2rem;*/
}

.kms-hide {
    display: none !important;
}




strong {
    font-weight: 500;
}

/**:focus {
    outline: none;
    box-shadow: inset 0 0 0 0.8rem rgba(85, 85, 85, 0.5);
}*/

.margin-right-sm {
    margin-right: 1.4rem !important;
}

.margin-top-sm {
    margin-top: 1.4rem !important;
}

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


.kms-grid {
    display: grid;
    gap: 6.857rem;
}

.kms-grid--1-row {
    grid-template-rows: 1fr !important;
}

.kms-grid--2-col {
    grid-template-columns: repeat(2, 1fr);
}

.kms-grid--3-col {
    grid-template-columns: repeat(3, 1fr);
}

.kms-grid--4-col {
    grid-template-columns: repeat(4, 1fr);
}



/* SITE COLORS */

.theme-body-background {
    background-color: #f8f9fa;
}

.theme-background-primary {
    background-color: #2e56a5;
}

.theme-background-primary-tint-light {
    background-color: #eaeef6;
}

.theme-forecolor-primary {
    color: #fff;
}





/*  
    Media Queries
    =============
    In media queries, rem and em do NOT depend on html font size in media queries
    Instead: 1rem = 1em = 16px
    To be safe: always use em when setting media queries - not rem
    You can then use rem within the style rule
*/

/* =========================================================================== */
/*  Below 1344 pixels  {smaller Desktops} =@media (max-width: 84em)  */
/* ========================================================================== */



/* ========================================================================= */
/*  Below 1200 pixels  {Landscape Tablets}*/
/*  standard 1200px break   1200/16*  = @media (max-width: 75em) */
/* ======================================================================== */

@media (max-width: 75em) {

    html {
         font-size: 10px; 
          Default Browser font-size = 16px 
          14px / 16px = .875 = 87.5% 
          12px / 16px = .75 = 75% 
          10px / 16px = .625 = 62.5% 
          9px / 16px = .5625 = 56.25% 
         percentage of users browers font-size setting 
        font-size: 75%;
    }

    .kms-container {
        max-width: 68.57rem;
    }
}


/* ========================================================================= */
/*  Below 944 pixels  {Tablets}   944/16  @media (max-width: 59em)*/
/* ======================================================================== */

@media (max-width: 59em) {

    /*html {*/
        /* font-size: 10px; */
        /*  Default Browser font-size = 16px */
        /*  14px / 16px = .875 = 87.5% */
        /*  12px / 16px = .75 = 75% */
        /*  10px / 16px = .625 = 62.5% */
        /*  9px / 16px = .5625 = 56.25% */
        /* percentage of users browers font-size setting */
        /*font-size: 62.5%;
    }*/

    .kms-container {
        padding: 0;
        width: 100%;
        max-width: 100%;
    }

    .margin-right-sm {
        margin-right: 1rem !important;
    }

    .margin-top-sm {
        margin-top: 1rem !important;
    }

}


/* ========================================================================= */
/*  Below 704 pixels  {Smaller Tablets}  704/16 @media (max-width: 44em) */
/* ======================================================================== */


/* ========================================================================= */
/*  Below 544 pixels  {Phones}  544/16 @media (max-width: 34em) */
/* ======================================================================== */