html, body{
    width:100%;
    height:100%;
    margin:0;
}

.wrapper {
    width:100%;
    height:100%;
    display: grid;
    grid-template-columns:1fr 1000px 1fr;
    grid-template-rows:1fr 100px 100px 100px 50px 50px 50px 50px 1fr;
    }
#yta {
border:2px solid black;
grid-column:2;
grid-row:2/9;
}
#start{
    width:80%;
    height:90%;
    margin-top:2.5%;
    margin-left:auto;
    margin-right: auto;
    border:2px solid black;
    border-radius: 10px;
    font-size:1.5vw;
    background-color: white;
}
#start:hover{
width:85%;
height: 100%;
margin-top:2%;
margin-left:auto;
margin-right: auto;
border:2px solid black;
border-radius: 10px;
font-size:1.7vw;
}
#reset{
    grid-column:3;
    grid-row:8;  
    width:80%;
    height:90%;
    margin-top:2.5%;
    margin-left:auto;
    margin-right: auto;
    border:2px solid black;
    border-radius: 10px;
    font-size:1.5vw;
    background-color: white;
}
#reset:hover{
background-color: lightgray;
width:85%;
height: 100%;
margin-top:0%;
margin-left:auto;
margin-right:auto;
border:2px solid black;
border-radius: 10px;
font-size:1.7vw;
}   
#bild{
    grid-column:3;
    grid-row:2/9;
    height: 100%;
    width: 100%;
}
#målbild{
    grid-column:2;
    grid-row:2/9;
    width:100%;
    height: 100%;
    margin-left:2px;
    margin-top:2px;
}
#slut{
    height: 100%;
    width: 100%;
}
#stats{
    grid-row: 2/9;
    grid-column: 3;
    margin-left: 40%;
    background-color: white;
    font-size: 45px;
    margin-right: 15%;
    padding-left: 5%;
    border-color: black;
    border-radius: 5%;
    border-style: solid;
    border-width: 10px;
}
#Levlar{
    border-color: black;
    border-radius: 5%;
    border-style: solid;
    border-width: 5px;
    grid-column:3;
    grid-row:3/6;
    margin-right:20%;
    margin-left: 20%;
    
}
#Levell{
    padding-left: 25%;
    font-size: 50px;
}
#level{
    padding-left: 35%;
    font-size: 60px;
}
#lvl1{
    width: 30%;
    height:100%;
    padding-left: 70%;
    translate: 0 -241px;
    border-top-right-radius:3% ;
    border-bottom-right-radius:3% ;
}
#lvl2{
    width: 30%;
    height:100%;
    padding-left: 70%;
    border-top-right-radius:3% ;
    border-bottom-right-radius:3% ;
    translate: 0 -485px;
}
#lvl3{
    width: 30%;
    height:100%;
    padding-left: 70%;
    border-top-right-radius:3% ;
    border-bottom-right-radius:3% ;
    translate: 0 -730px;
}
#lvl4{
    width: 30%;
    height:100%;
    padding-left: 70%;
    border-top-right-radius:3% ;
    border-bottom-right-radius:3% ;
    translate: 0 -975px;
}
#lvl5{
    width: 30%;
    height:100%;
    padding-left: 70%;
    border-top-right-radius:3% ;
    border-bottom-right-radius:3% ;
    translate: 0 -1219px;
}
#bg{
    grid-column: 1/4;
    grid-row:1/10;
    height: 100vh;
    width: 100vw;
}