@font-face {
    font-family: "Styrene A Web Bold";
    src: url("/fonts/StyreneAWeb-Bold.woff") format('woff');
    src: url("/fonts/StyreneAWeb-Bold.woff2") format('woff2');
}

/* 1920 */

.zag2{
    font-size: 44px;
    font-family: "Onest", sans-serif;
    font-weight: 600;
}

.zag3{
    font-size: 30px;
    font-family: "Onest", sans-serif;
    font-weight: 500;
}

p{
    font-size: 20px;
    font-family: "Onest", sans-serif;
    font-weight: 400;
    line-height: 135%;
}

li{
    font-size: 20px;
    font-family: "Onest", sans-serif;
    font-weight: 400;
    line-height: 135%;
}

.header-txt{
    font-size: 18px;
    font-family: "Onest", sans-serif;
    font-weight: 300;
    line-height: 22px;
}

.header-button-txt{
    font-size: 18px;
    font-family: "Onest", sans-serif;
    font-weight: 400;
    line-height: 22px;
}

.top-txt{
    font-size: 140px;
    font-family: "Styrene A Web Bold";
}

.timer-num{
    font-size: 120px;
    font-family: "Styrene A Web Bold";
}

.grant-txt{
    font-size: 26px;
    font-family: "Onest", sans-serif;
    font-weight: 500;
}

.button-txt{
    font-size: 20px;
    font-family: "Onest", sans-serif;
    font-weight: 500;
    line-height: 135%;
}

.number-txt{
    font-size: 100px;
    font-family: "Styrene A Web Bold";
}

.directions-name{
    font-size: 24px;
    font-family: "Onest", sans-serif;
    font-weight: 500;
    line-height: 135%;
}

.directions-txt{
    font-size: 20px;
    font-family: "Onest", sans-serif;
    font-weight: 500;
    line-height: 135%;
}

/* 2560 */

@media screen and (min-width: 2500px) {
    .zag2{
        font-size: 59px;
        font-family: "Onest", sans-serif;
        font-weight: 600;
    }

    .zag3{
        font-size: 40px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
    }

    p{
        font-size: 27px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 135%;
    }

    li{
        font-size: 27px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 135%;
    }

    .header-txt{
        font-size: 24px;
        font-family: "Onest", sans-serif;
        font-weight: 300;
        line-height: 29px;
    }

    .header-button-txt{
        font-size: 24px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 29px;
    }

    .top-txt{
        font-size: 186px;
        font-family: "Styrene A Web Bold";
    }

    .timer-num{
        font-size: 160px;
        font-family: "Styrene A Web Bold";
    }

    .grant-txt{
        font-size: 34px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
    }

    .button-txt{
        font-size: 26px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }

    .number-txt{
        font-size: 130px;
        font-family: "Styrene A Web Bold";
    }

    .directions-name{
        font-size: 32px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }

    .directions-txt{
        font-size: 26px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }
}

/* 1440 */

@media screen and (max-width: 1900px) {
    .zag2{
        font-size: 38px;
        font-family: "Onest", sans-serif;
        font-weight: 600;
    }
    
    .zag3{
        font-size: 26px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
    }

    p{
        font-size: 18px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 135%;
    }

    li{
        font-size: 18px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 135%;
    }

    .header-txt{
        font-size: 16px;
        font-family: "Onest", sans-serif;
        font-weight: 300;
        line-height: 19px;
    }

    .header-button-txt{
        font-size: 16px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 19px;
    }

    .top-txt{
        font-size: 120px;
        font-family: "Styrene A Web Bold";
    }
    
    .timer-num{
        font-size: 106px;
        font-family: "Styrene A Web Bold";
    }

    .grant-txt{
        font-size: 23px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
    }
    
    .button-txt{
        font-size: 18px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }
    
    .number-txt{
        font-size: 90px;
        font-family: "Styrene A Web Bold";
    }
    
    .directions-name{
        font-size: 21px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }

    .directions-txt{
        font-size: 18px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }
}

/* 1280 */

@media screen and (max-width: 1420px) {
    .zag2{
        font-size: 36px;
        font-family: "Onest", sans-serif;
        font-weight: 600;
    }
    
    .zag3{
        font-size: 24px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
    }

    p{
        font-size: 16px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 135%;
    }

    li{
        font-size: 16px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 135%;
    }

    .header-txt{
        font-size: 14px;
        font-family: "Onest", sans-serif;
        font-weight: 300;
        line-height: 18px;
    }

    .header-button-txt{
        font-size: 14px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 18px;
    }

    .top-txt{
        font-size: 114px;
        font-family: "Styrene A Web Bold";
    }
    
    .timer-num{
        font-size: 98px;
        font-family: "Styrene A Web Bold";
    }

    .grant-txt{
        font-size: 21px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
    }
    
    .button-txt{
        font-size: 16px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }
    
    .number-txt{
        font-size: 82px;
        font-family: "Styrene A Web Bold";
    }
    
    .directions-name{
        font-size: 20px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }
    
    .directions-txt{
        font-size: 17px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }
}

/* 375 */

@media screen and (max-width: 430px) {
    .zag2{
        font-size: 28px;
        font-family: "Onest", sans-serif;
        font-weight: 600;
    }
    
    .zag3{
        font-size: 22px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
    }

    p{
        font-size: 17px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 135%;
    }

    li{
        font-size: 17px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 135%;
    }

    .header-txt{
        font-size: 16px;
        font-family: "Onest", sans-serif;
        font-weight: 300;
        line-height: 22px;
    }

    .header-button-txt{
        font-size: 16px;
        font-family: "Onest", sans-serif;
        font-weight: 400;
        line-height: 22px;
    }
    
    .top-txt{
        /* font-size: 46px; */
        font-size: 14vw;
        font-family: "Styrene A Web Bold";
    }
    
    .timer-num{
        font-size: 80px;
        font-family: "Styrene A Web Bold";
    }

    .grant-txt{
        font-size: 24px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
    }
    
    .button-txt{
        font-size: 18px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }
    
    .number-txt{
        font-size: 60px;
        font-family: "Styrene A Web Bold";
    }
    
    .directions-name{
        font-size: 21px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }
    
    .directions-txt{
        font-size: 18px;
        font-family: "Onest", sans-serif;
        font-weight: 500;
        line-height: 135%;
    }
    
    .footer-txt-m{
        font-size: 42px;
        font-family: "Styrene A Web Bold";
    }
}