body {
    background-image: url('backgroundoscill.jpg');
    background-size: cover;
}
font {
    .medievalsharp-regular {
  font-family: "MedievalSharp", cursive;
  font-weight: 400;
  font-style: normal;
}
}

#icone {
    transform: translate(200px, -170px);
    border: 8px rgb(142, 109, 52) solid;
    width: 100px;
    height:100px;
    border-radius: 10px;
}

#icons {
    transform: translate(1100px, -285px);
    border: 8px rgb(142, 109, 52) solid;
    width: 100px;
    height:100px;
    border-radius: 10px;
}
#icone2 {
    transform: translate(350px, -200px);
    border: 8px rgb(142, 109, 52) solid;
    width: 700px;
    height:200px;
    border-radius: 10px;
}

h1 { 
    text-align: center;
    font-family: "MedievalSharp", cursive;
    font-size: 40px;
    
    
    
}

h2 {
    text-align: center;
    font-size: 24px;
    font-family: "MedievalSharp", cursive;
}

h3 {
    text-align: center;
    transform: translate(920px, -263px);
    border: 2px black solid;
    width: 100px;
    border-radius: 10px;
    background-color: antiquewhite;
    font-size: 16px;
    height: 35px;

}

h4 {
    text-align: center;
    transform: translate(730px, -200px);
    border: 2px black solid;
   width: 100px;
   border-radius: 10px;
   background-color: antiquewhite;

}


h5 {
    text-align: center;
    transform: translate(-278px, -400px);
    
}

h6 {
    text-align: center;
    transform: translate(1060px, -330px);
    border: 2px black solid;
    width: 100px;
    border-radius: 10px;
    background-color: antiquewhite;
    font-size: 16px;
}

#canvas {
    border: 5px solid black;
    height: 500px;
    width: 900px;
    margin-bottom: 2em;
    transform: translate(250px, -150px);
    background-color: antiquewhite;
    text-align: center;
}
#submit {
    transform: translate(250px,-60px);
    height: 40px;
    width: 100px;
    font-size: 20px;
    border-radius: 10px;
    border: 2px solid black;
    background-color: antiquewhite;
}

#record {
    transform: translate(300px, -60px);
    height: 70px;
    width: 100px;
    font-size: 20px;
    background-color: antiquewhite;
    border-radius: 10px;
    border: 2px solid black;
}

#vol-slider {
    transform: translate(300px, -60px);
}

#thickness-slider {
    transform: translate(350px, -60px);
}

#input {
    transform: translate(373px, -120px);
}
#color {
    transform: translate(730px, -65px);
}