html {
    font-family: sans-serif;
}

h1 {
    margin: 0px;
}

ul{
    list-style-type: none;
    text-align: left;

}
.maker {
  display: flex;
  flex-direction: row;
}

.maker div {
  margin: 10%;
  margin-top: 0px;
}

.basic_info2 {
    position: absolute;
    width: 296px;
    height: 55px;
    left: 600px;
    top: 100px;
}
/** face options **/
.face {
    position: absolute;
    width: 806px;
    height: 348px;
    left: 100px;
    top: 500px;
    border-color: black;
    border-width: 3px;
}


.face h3 {
    text-align: center;
}

.skincolor {
    position: absolute;
    width: 124px;
    height: 288px;
    left: 0px;
    top: 50px;
}
.hair {
    position: absolute;
    width: 124px;
    height: 285px;
    left: 150px;
    top: 50px;
}

.haircolor {
    position: absolute;
    width: 124px;
    height: 288px;
    left: 300px;
    top: 50px;
}

.eyes {
    position: absolute;
    width: 124px;
    height: 288px;
    left: 450px;
    top: 50px;
}

.mouth {
    position: absolute;
    width: 124px;
    height: 288px;
    left: 600px;
    top: 50px;
}
/** clothing options **/
.clothing {
    position: absolute;
    width: 657px;
    height: 246px;
    left: 100px;
    top: 850px;
}

.shirtcolor {
    position: absolute;
    width: 657px;
    height: 246px;
    left: 0px;
    top: 50px;
}

.hats {
    position: absolute;
    width: 657px;
    height: 246px;
    left: 200px;
    top: 50px;
}

.hats h3 {
    position: absolute;
    left: 30px;
}

.hats ul{
    position: absolute;
    left: 0px;
    top: 40px;
}

.glasses {
    position: absolute;
    width: 657px;
    height: 246px;
    left: 450px;
    top: 50px;
}

.glasses ul {
    position: absolute;
    left: 0px;
    top: 40px;
}

.glasses h3 {
    position: absolute;
    left: 30px;
}
