@media (max-width: 768px) {
    html {
        font-size: 14px;

    }

    #header .titleContainer {
        width: 100%;
        max-width: 90%;
    }

    #formContainer {
        padding: 40px 20px;
        border-radius: 10px;
        width: 90%;
    }

    #container>.imcResult {
        width: 90%;
        padding: 15px;
    }

    .imcResult>.imcValue {
        display: flex;
        column-gap: 10px;
        padding-left: 0;
        justify-content: center;
        align-items: center;
    }

    .imcValueResult {
        font-size: 2.5rem;
    }

    .imcResultText {
        font-size: 1rem;
    }

    #container>.understand {
        width: 90%;
    }

    .categories>.category {
        flex: none;
        width: 100%;

    }

    .categories>.category img {
        width: auto;
    }

}