:root{
    --primary-key-color: #EE2737;
    --primary-dark-key-color: #b31d29;
    --primary-light-key-color: #f52738;


    --secondary-key-color: #00A499;
    --secondary-dark-key-color: #03938A;
    --secondary-light-key-color: #00ccbe;

    --neutral-dark-key-color: #545859;
    --neutral-mid-dark-key-color: #c9c9c9;
    --neutral-mid-key-color: #EDEDED;
    --neutral-light-key-color: #F3F3F3;


    --padding-horizontal: 35rem;
    --padding-vertical: 40rem;
}
@media all and (min-width: 768px){
    :root{
        --padding-horizontal: 52rem;
        --padding-vertical: 60rem;
    }
}
@media all and (min-width: 1366px){
    :root{
        --padding-horizontal: 125rem;
        --padding-vertical: 70rem;
    }
}
@media all and (min-width: 1600px){
    :root{
        --padding-horizontal: calc((100vw - 1334rem) / 2);
        --padding-vertical: 100rem;
    }
}
@media all and (min-width: 1920px){
    :root{
        --padding-horizontal: calc((1920rem - 1334rem) / 2);
        --padding-vertical: 100rem;
    }
}