:root{

    /* STRUCTURAL */
    --max-width: 1200px;
    --gap: 40px;

    /* SECTIONS */
    --section-gap: 100px;
    --section-padding-top: 100px;
    --section-padding-bottom: 100px;
    --section-padding-left: 20px;
    --section-padding-right: 20px;
    --section-max-width: var(--max-width);

    /* COLORS */
    --inactive: #c0dfe9;
    --active: #83c8df;
    --succes: lightgreen; 
    --black: black; 
    --white: white;
    --alert: rgb(231, 65, 59); 
    --text: black;
    --background: white;

    --color-1: #e4eef1;
    --color-2: green;
    --color-3: green;
    --color-4: green;
    --color-5: green;
    --color-6: green;

    --font-headings: 'Phudu', sans-serif;
    --font-text: 'Poppins', sans-serif;

    --border-radius-small: 6px;
    --border-radius-big: 30px;
    

}

/* BACKGROUND */
.bg-white{
    background-color: var(--white)
}
.bg-black{
    background-color: var(--black)
}
.bg-color-1{
    background-color: var(--color-1);
}
.bg-color-2{
    background-color: var(--color-2);
}
.bg-color-3{
    background-color: var(--color-3);
}
.bg-color-4{
    background-color: var(--color-4);
}
.bg-color-5{
    background-color: var(--color-5);
}
.bg-color-6{
    background-color: var(--color-6);
}

/* TEXT */
.text-white{
    color: var(--white)
}
.text-black{
    color: var(--black)
}
.text-color-1{
    color: var(--color-1);
}
.text-color-2{
    color: var(--color-2);
}
.text-color-3{
    color: var(--color-3);
}
.text-color-4{
    color: var(--color-4);
}
.text-color-5{
    color: var(--color-5);
}
.text-color-6{
    color: var(--color-6);
}




@media screen and (max-width: 600px) {
    :root{

        /* DESKTOP */
        --section-gap: 25px;
        --section-padding-top: 50px;
        --section-padding-bottom: 50px;
        --section-padding-left: 20px;
        --section-padding-right: 20px;
        --section-max-width: 100%;

    }
}