:root{
    /** width **/
    --desktop-max: 1700px;
    --tablet-max: 1299px;
    --mobile-max: 799px;
    --mobile-small: 599px;

    /** colors **/
    --cityBlue1: #0063A7;
    --cityBlue2: #005999;
    --cityBlue3: #B6D6ED;
    --cityBlue3Dim: rgba(182, 214, 237, 15%);
    --cityBlueSoft: #437BA3;
    --cityBlueSoft2: #90B6D2;
    --cityBlueSoft2-ADA: #7294AC;
    --cityBlueSoft2-ADA2: #437ba3;
    --cityBlueSoft2Dim: rgba(144, 182, 210, 0.25);
    --cityLinearBGBlue: linear-gradient(0deg, rgb(233, 241, 247) 100%, rgba(255,255,255,1) 86%);
    --cityLinearBGBlue-solid: #e9f2f7;
    --cityGreen1: #839B4B;
    --cityGreen-compliant: #687C3C;
    --cityGreen2: #DAE6BF;
    --cityGreen2Dim: rgba(218, 230, 191, 0.25);

    --alert: #a64452;
    --blue1: #b6d6ed;
    --green1: #dae6bf;
    --green2: #F8FFE7;
    --lightPurple1: #d5cfd3;
    --lightGray: #f0f0f0;
    --mint1: #73E8A0;
    --mustard1: #f2b54a;
    --gray1: #6E6E6E;
    --grayLight: #f9f9f9;
    --grayLight2: #eeeeee;
    --grayLight3: #C3C3C3;
    --dark1: #1D1D1D;

    /** font sizes **/
    --navTop: 14px;
    --nav: 21px;
    --heading_header_1: 80px;
    --heading_1: 50px;
    --heading_2: 38px;
    --heading_3: 24px;
    --body_1: 16px;
    --body_2: 18px;
}

/** animations
@keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@-moz-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@-webkit-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@-o-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@-ms-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}**/