header#enheader4 {
    /* Convenience variables for header only start here.  Add/update/delete for your needs. */
    --text-color: #ffffff;
    --font1: "scandia-web",sans-serif;
    /* Convenience variables end here */

    --height: min(15.9523vw, 201px);
    --top-bar-height: clamp(35px,3.5714vw, 45px);
    --bottom-bar-height: min(3.2539vw, 41px);

    --logo-width: min(15.9523vw, 201px);

    --top-bar-background: var(--blue);
    --center-bar-background: var(--blue2);
    --bottom-bar-background: var(--blue2);

    --website-name-font: 500 65px / 1.2 "Kanit", sans-serif;
    --website-name-letter-spacing: normal;
    --website-name-color: #ffffff;
    --website-name-visibility: visible;
    --website-name-line-break-display: none;

    --website-motto-font: normal 0.5em 'Nunito', sans-serif;
    --website-motto-letter-spacing: normal;
    --website-motto-color: #666666;

    --marquee-font: 400 clamp(13px, 1.1904vw, 15px) var(--font1);
    --marquee-letter-spacing: 0.15px;
    --marquee-background: var(--top-bar-background);
    --marquee-color: #ffffff;
    --marquee-popup-font: var(--font1);
    --marquee-popup-letter-spacing: 0.15px;
    --marquee-popup-background: var(--gray);
    --marquee-popup-color: #ffffff;
    --marquee-popup-button-color: #000;
    --marquee-popup-button-background: var(--blue);
    --marquee-popup-button-border: 0px solid var(--text-color);
    --marquee-popup-active-button-color: var(--blue);
    --marquee-popup-active-button-background: #000;

    --search-translate-font: normal min(1.3636vw, 15px) var(--font1);
    --search-translate-letter-spacing: normal;
    --search-translate-color: var(--text-color);

    /* Top Navigation params */
    --topnav-font: 500 clamp(13px,1.4285vw,18px) var(--font1);
    --topnav-letter-spacing: normal;
    --topnav-color: #ffffff;
    --topnav-background: var(--blue2);  /*transparent; changed for ADA */
    --topnav-hover-color: #ffffff;
    --topnav-hover-background: var(--blue);
    --topnav-color3: #ffffff;

    --menu-font: 500 clamp(12px,1.2698vw,16px) var(--font1);
    --menu-letter-spacing: normal;
    --menu-background: var(--blue);
    --menu-color: #ffffff;
    --menu-hover-background: var(--blue2);
    --menu-hover-color: #ffffff;
}

@media only screen and (max-width: 1260px) {
    header#enheader4 {
        --website-name-font: 500 clamp(32px,4.9206vw,62px) / 1.2 "Kanit", sans-serif;
    }
}

/* STYLING FOR MOBILE */
@media only screen and (max-width: 768px) {

    header#enheader4.enh1 {

        --header-height: clamp(60px,13.0208vw,100px);
        --header-background: var(--blue2);

        --logo-width: clamp(50px,11.7187vw,90px);

        --website-name-font: 500 clamp(22px,4.9479vw,38px) / 1 "Kanit", sans-serif;
        --website-name-letter-spacing: normal;
        --website-name-color: #ffffff;
        --website-name-line-break-display: inline-block;


        --marquee-background: var(--blue);
        --marquee-color: #ffffff;

        --menu-font: normal clamp(15px, 2.3437vw, 18px) var(--font1);
        --menu-letter-spacing: normal;
        --menu-background: #ffffff;
        --menu-color: #000;
        --menu-hover-background: var(--blue2);
        --menu-hover-color: #ffffff;
    }
}