* {
    box-sizing: border-box;
}

html {
    font-size: 30px;
}

@media screen and (max-width: 3450px) {
    html {
        font-size: 29px;
    }
}

@media screen and (max-width: 3300px) {
    html {
        font-size: 28px;
    }
}

@media screen and (max-width: 3100px) {
    html {
        font-size: 26px;
    }
}

@media screen and (max-width: 2850px) {
    html {
        font-size: 23px;
    }
}

@media screen and (max-width: 2500px) {
    html {
        font-size: 22px;
    }
}

@media screen and (max-width: 2380px) {
    html {
        font-size: 20px;
    }
}


@media screen and (max-width: 2250px) {
    html {
        font-size: 19px;
    }
}

@media screen and (max-width: 2150px) {
    html {
        font-size: 17px;
    }
}

@media screen and (max-width: 2050px) {
    html {
        font-size: 16px;
    }
}

@media screen and (max-width: 1800px) {
    html {
        font-size: 14px;
    }
}

@media screen and (max-width: 1580px) {
    html {
        font-size: 13px;
    }
}


@media screen and (max-width: 1480px) {
    html {
        font-size: 12px;
    }
}


@media screen and (max-width: 1200px) {
    html {
        font-size: 16px;
    }
}

@media screen and (max-width: 1024px) {
    html {
        font-size: 16px;
    }
}

@media screen and (max-width: 960px) {
    html {
        font-size: 12px;
    }
}

@media screen and (max-width: 768px) {
    html {
        font-size: 16px;
    }
}


@media screen and (max-width: 350px) {
    html {
        font-size: 14px;
    }
}