#title{
  font-family:'VT323', monospace;
  font-size: 64px;
  font-weight: normal;
  margin-top: auto;
  text-align: center;
}

#color-palette{
  background-color: white;
  border: 2px black solid;
  height: 50px;
  margin:auto;
  text-align: center;
  width : 190px;  
}

.color{
    width:40px;
    height: 40px;
    display: inline-block;
    border: 1px black solid;
    margin-top: 4px;
}

.selected{
   border-radius: 8px;
}

#pixel-board{
    border: 2px black solid;
    height: auto;
    width: auto;
    text-align: center;
    margin:auto;
    margin-top: 15px;
   
}

.pixel{
    width:40px;
    height: 40px;
    display: inline-block;
    border: 1px black solid;
    background-color: rgb(255, 255, 255);
}

.line{
    height: 42px;
    width: auto;
}

#clear-board{
    text-align: center;
    display: block;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 24px;
    padding: 5px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 4px;
    font-family:'VT323', monospace;
}

#generate-board{
    margin-top: 10px;
    font-size: 24px;
    padding: 5px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 4px;
    font-family:'VT323', monospace;
}

#size{
    display: block;
    margin: auto;
    margin-bottom: 10px;
    text-align: center;
}

#board-size{
    width: 90px;
    height: 30px;
    font-size: 24px;
    font-family: 'VT323', monospace;
    border: 2px black solid;
}

main{
    background-color: lightblue;
    padding: 25px;
    border: 2px black solid;
}

footer{
    text-align: center;
    padding: 10px;
    background-color: lightblue;
    border: 2px black solid;
    margin-top:15px;
    font-family: 'VT323', monospace;
}