:root {


    /*


#FDFDF8,#532500,#5B1601,#843C09,#A9682A,#E76F05,#CD6900,#BC600E,#CD711F,#E79342,#F7B779,#FFFEDF,#CD904F,#FDC48F,#FEF6D8,#FEE6BC,#FDD19A,#FFFEDF,#CD904F,#E76F05,#A9682A,#8C4B12,#843C09,#8D4004,#4c1f00



    */

    /*
    --color0: #FDFDF8;
    --color1: #532500;
    --color2: #5B1601;
    --color3: #843C09;
    --color4: #A9682A;
    --color5: #E76F05;
    --color6: #CD6900;
    --color7: #BC600E;
    --color8: #CD711F;
    --color9: #E79342;
    --color10: #F7B779;
    --color11: #FFFEDF;
    --color12: #CD904F;
    --color13: #FDC48F;
    --color14: #FEF6D8;
    --color16: #FEE6BC;
    --color17: #FDD19A;
    --color18: #FFFEDF;
    --color19: #CD904F;
    --color20: #E76F05;
    --color21: #A9682A;
    --color22: #8C4B12;
    --color23: #843C09;
    --color24: #8D4004;
    --color25: #4c1f00; */


    --color0: #5B1601;
    --color1: #532500;
    --color2: #4C1F00;
    --color3: #843C09;
    --color4: #8D4004;
    --color5: #8C4B12;
    --color6: #BC600E;
    --color7: #A9682A;
    --color8: #CD6900;
    --color9: #CD711F;
    --color10: #E76F05;
    --color11: #CD904F;
    --color12: #E79342;
    --color13: #F7B779;
    --color14: #FDC48F;
    --color15: #FDD19A;
    --color16: #FEE6BC;
    --color17: #FEF6D8;
    --color18: #FFFEDF;
    --color19: #FDFDF8;

    --gray0: #12100b;
    --gray1: #1F1D1A;
    --gray2: #3F3934;
    --gray3: #5E564E;
    --gray4: #7E7268;
    --gray5: #9D8F82;
    --gray6: #BDAB9C;
    --gray7: #DCC8B6;
    --gray8: #E1D0C0;
    --gray9: #E6D8CB;
    --gray10: #EBE0D5;
    --gray11: #F0E7E0;
    --gray12: #F4EDE8;
    --gray13: #F7F3EF;
    --gray14: #FAF7F5;
    --gray15: #FDFBFA;
    --gray16: #FFFFFF;
}


/* styles.css: Basic styling for forms */
body {
    font-family: Arial, sans-serif;
    margin: 20px;
    background-color: #fbf7f4;
}

form {
    max-width: 400px;
    margin: auto;
}

label {
    display: block;
    margin-top: 10px;
}

input {
    width: 100%;
    margin-top: 5px;
    border: 1px solid #DDD;
    padding: 6px;
    background: #FFF;
    border-radius: 5px
}

button {
    display: block;
    padding: 10px;
    border-radius: 7px;
    font-size: 1.2em;
    border: none;
    color: var(--gray14);
    font-weight: 600;
    background-color: var(--color5);
    margin-top: 5px;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
}

button:hover {
    color: var(--gray14);
    background-color: var(--color9);
}