:root {

    --pd: 12px;
}


@media screen and (min-width:240px) {
    :root {
        --pd: 16px;
    }
}
@media screen and (min-width:360px) {
    :root {
        --pd: 20px;
    }
}

@media screen and (min-width:480px) {
    :root {
        --pd: 24px;
    }
}

@media screen and (min-width:800px) {
    :root {
        --pd: 28px;
    }
}
@media screen and (min-width:1280px) {
    :root {
        --pd: 32px;
    }
}