/* section content  */
:root {
    --white: #fff;
    --white-200: #eaecf0;
    --white-200-02: rgba(234, 236, 240, .2);
    --black: #000;
    --black-1000-40: #00000066;
    --gray-50: #f9fafb;
    --gray-100: #f2f4f7;
    --gray-150: #f5f5f5;
    --gray-200: #eaecf0;
    --gray-300: #dadfe8;
    --gray-400: #aeaeae;
    --gray-500: #667085;
    --gray-600: #475467;
    --gray-700: #344054;
    --gray-700-05: #34405580;
    --gray-800: #1d2939;
    --gray-900: #101828;
    --gray-950: #0c111d;
    --blue-300: #98a2b3;
    --blue-500: #314155;
    --blue-500-02: rgba(49, 65, 85, .2);
    --blue-600: #163c53;
    --green-500: #63a64c;
    --green-500-05: rgba(99, 166, 76, .5);
    --green-500-03: rgba(99, 166, 76, .3);
    --green-500-02: rgba(99, 166, 76, .2);
    --green-500-01: rgba(99, 166, 76, .1);
    --red-500: #f83030;
    --error-600: #d92d20;
}

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

section .content {
    margin: 0 auto;
}

@media (min-width: 576px) {
    section .content {
        max-width: 540px;
    }
}
@media (min-width: 768px) {
    section .content {
        max-width: 720px;
    }
}
@media (min-width: 992px) {
    section .content {
        max-width: 960px;
    }
}
@media (min-width: 1200px) {
    section .content {
        max-width: 1140px;
    }
}
@media (min-width: 1400px) {
    section .content {
        max-width: 1320px;
    }
}