header#enheader {

    --text-color: #333333;
    --font1: Karla, sans-serif;

    --height: min(19vw, 210px);
    --top-bar-height: min(2.9090vw, 32px);
    --bottom-bar-height: min(3.6363vw, 40px);
    --column-gap: min(1.63vw, 18px);

    --logo-width: min(8vw, 88px); /* Should be at least the original logo size + 20px for paddings */
    --logo-shadow-color: rgb(0, 0, 0, 50%);
    --logo-border-color: #dddddd;
    --logo-background: #ffffff;
    --logo-padding: 10px 10px;/*yok*/
    --top-bar-background: #ffffff;
    --top-bar-border-color: var(--gray); /* if border enabled */
    --center-bar-background: #ffffff;
    --bottom-bar-background: var(--red3);
    --bottom-bar-border-color: #e0e0e0; /* if border enabled */

    --website-name-font-family: 'PT Sans Narrow', sans-serif;
    --website-name-font-family: 'Alkatra';
    --website-name-font-size: min(4.54vw, 50px);
    --website-name-color: var(--text-color);
    --website-name-shadow-color: #cccccc;
    --website-name-font-weight: 600;
    --website-name-line-height: 1;
    --website-name-visibility: visible;
    --website-name-line-break-display: none;

    --website-motto-font-family: 'Josefin Sans', sans-serif;
    --website-motto-font-size: 0.4em;
    --website-motto-color: var(--black);

    --marquee-font-family: var(--font1);
    --marquee-font-size: min(1.4545vw, 16px);
    --marquee-background: var(--top-bar-background);
    --marquee-color: #555555;

    --search-translate-font-family: var(--font1);
    --search-translate-font-size: min(1.3636vw, 15px);
    --search-translate-color: var(--text-color);


    /* Top Navigation params */
    --topnav-font-family: var(--font1);
    --topnav-font-size: clamp(12px, 1.6363vw, 18px);
    --topnav-color: #ffffff;
    --topnav-background: var(--red3);
    --topnav-hover-color: #ffffff;
    --topnav-hover-background: var(--red3);
    --topnav-color3: #ffffff;
    --topnav-color4:var(--black);

    --menu-font-family: var(--font1);
    --menu-font-size: clamp(12px, 1.4545vw, 16px);
    --menu-background: var(--red3);
    --menu-color: #ffffff;
    --menu-hover-background: var(--black);
    --menu-hover-color: #ffffff;




}

header#enheader.enh1-0-2a {
    --height: 210px;
    --column-gap: 22px;
    --bottom-bar-background: var(--blue);
    --website-name-font-family: 'Nunito', sans-serif;
    --topnav-color: #f2f2f2;
    --topnav-color3: #f2f2f2;

}


header#enheader.enh1-1-2 {
    --logo-width: min(10.9090vw, 120px);
}

header#enheader.enh1-1-3 {
    --logo-width: min(13.6363vw, 150px);
}

header#enheader.enh1-1-4 {
    --logo-width: min(14.5454vw, 160px);
}

.enh1-website-enroll {
    text-align: right;
    font-size: 14px;
    background: #f7c620;
    padding: 7px 12px 7px 12px;
    margin-top: -4px;
    transition: background 0.3s ease-in-out;
    transform-origin: left;
}

.enh1-website-enroll-top-nav:hover,
.enh1-website-enroll-top-nav:focus,
.enh1-website-enroll-top-nav:hover .enh1-website-enroll-top-nav-content,
.enh1-website-enroll-top-nav:focus .enh1-website-enroll-top-nav-content,
.enh1-website-enroll:hover,
.enh1-website-enroll:focus{
    background: var(--black);
    color: var(--white) ;
}

 div.enh-1-website-enroll-wrap{
     display: flex;
     flex-direction: column;
     margin-top: -31px;
     line-height: 1.5;
 }




div.enh1-website-enroll-row1 {
    font-weight: 1000;
    font-size: clamp(12px, 1.6363vw, 18px);
    margin-top: 33px;
    text-align: center;
    transition:  0.3s ease-in-out;

}
.enh1-website-enroll-top-nav-content{
    transition:  0.3s ease-in-out;
}


div.enh1-website-enroll-row2 {
    text-align: center;
    font-size: clamp(12px, 1.27vw, 14px);
    transition: 0.3s ease-in-out;
}
@media only screen and (max-width: 1000px) {
    div.enh-1-website-enroll-wrap{
        line-height: 1;
    }
}
@media only screen and (max-width: 768px) {
    .enh1-website-enroll{
        display: none !important;
    }
    .header.enh1 div.enh1-middle{
        column-gap: 0px !important;
    }
}
@media only screen and (min-width: 768px) {
    .enh1-website-enroll-top-nav{
        display: none;
    }
}
@media only screen and (max-width: 768px) {
    .enh1-website-enroll-top-nav {
        display: block;
        background: #f7c620;
        font-weight: 1000;
        margin: 0px 10px 0px -10px;
    }

    .enh1-website-enroll-top-nav-a {

    }

    .enh1-website-enroll-top-nav-content {
    padding: 10px;
    }
}

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

    header#enheader.enh1 {

        --header-height: clamp(90px, 19vw, 150px);
        --header-height:110px;

        --header-background: #fafafa;

        --logo-width: clamp(80px, 15vw, 110px);
        --logo-width: 70px;

        --website-name-font-size: clamp(24px, 4.5vw, 32px);
        --website-name-font-size: clamp(26px, 5vw, 36px);
        --website-name-font-size: 40px;
        --website-name-font-color: #000000;
        --website-name-font-weight: 1000;
        --website-name-line-break-display: none;

        --website-motto-font-size: 16px;

        --marquee-background: var(--red);
        --marquee-color: white;

        --search-translate-color: #000000;

        --mobnav-button-background: var(--header-background);
        --mobnav-button-color: var(--red);
        --mobnav-button-hover-background: var(--red);
        --mobnav-button-hover-color: var(--header-background);

        --menu-font-family: var(--font1);
        --menu-font-size: clamp(12px, 3.5vw, 22px);
        --menu-background: #f8f8f8;
        --menu-color: #444444;
        --menu-hover-background: var(--red);
        --menu-hover-color: #f8f8f8;
        -logo-shadow-color: rgb(0, 0, 0, 10%);

    }


}
@media only screen and (max-width: 580px) {

    header#enheader.enh1 {
        --website-name-line-break-display: inline-block;
        --website-name-font-size: 33px;
    }
}

@media only screen and (max-width: 450px) {

    header#enheader.enh1 {
        --website-name-font-size: 30px;
    }

    header.enh1.enh1 div.enh1-website-name-motto {
       justify-content: center;
        align-items: center;
        text-align: center;
    }
}

@media only screen and (max-width: 340px) {

    header#enheader.enh1 {
        --website-name-font-size: min(9.16vw,33px);
        --logo-width: 60px;

    }
}



/*@media only screen and (max-width: 500px) {

    header#enheader.enh1 {
        --website-name-font-size: clamp(24px, 3vw, 30px);
        --header-height: 14.1vw;
        --website-name-font-weight: 700;
    }
}*/