style.css

:root{
    --mt-color1:#403139;
    --mt-color2:#77A1A6;
    --mt-color3:#D8D9D7;
    --mt-color4:#594731;
    --mt-color5:#BF988F;
    --mt-color6:red;
}




*{
    margin:0;
    padding: 0;
    box-sizing: border-box;}
   body{ 
    background: linear-gradient(
        135deg,
        var(--mt-color1),
        var(--mt-color2),
        var(--mt-color3),
       
        var(--mt-color5)
    )
}
.section{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100vh;
    position: relative;
    justify-content:center ;
    align-items: center;
}

/* #canvas{
    
  
    position: absolute;
    top:50%;
    left: 55%;
  
   
 
    transform: translate(-50%,-50%);
} */

.controls{
    position: absolute;
    padding: 10px;
    border: 2px solid white;
    top:20px;
    left:20px;
    width:250px;
    background-color: rgba(255, 255, 255, 0.15);
}

.btnC{
    padding: 10px 40px;
    width: 225px;
    font-size: 20px;


}


label, input{
    color:white;
    
}