*{
    margin: 0;
    padding: 0;
    background-color: brown;
}

div{
    position: absolute;
}

#RubikF1{
    background-color: red;
    top: 50vh;
    left: 50vh;
    width: 10vh;
    height: 10vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
}
#RubikF2{
    background-color: red;
    top: 50vh;
    left: 61vh;
    width: 10vh;
    height: 10vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
}
#RubikF3{
    background-color: red;
    top: 50vh;
    left: 72vh;
    width: 10vh;
    height: 10vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
}
#RubikF4{
    background-color: red;
    top: 61vh;
    left: 50vh;
    width: 10vh;
    height: 10vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
}
#RubikF5{
    background-color: red;
    top: 61vh;
    left: 61vh;
    width: 10vh;
    height: 10vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
}#RubikF6{
    background-color: red;
    top: 61vh;
    left: 72vh;
    width: 10vh;
    height: 10vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
}
#RubikF7{
    background-color: red;
    top: 72vh;
    left: 50vh;
    width: 10vh;
    height: 10vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
}
#RubikF8{
    background-color: red;
    top: 72vh;
    left: 61vh;
    width: 10vh;
    height: 10vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
}#RubikF9{
    background-color: red;
    top: 72vh;
    left: 72vh;
    width: 10vh;
    height: 10vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
}
#RubikT1{
    background-color: white;
    top: 45.6vh;
    left: 74.5vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(315deg);
}
#RubikT2{
    background-color: white;
    top: 45.6vh;
    left: 63.5vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(315deg);
}
#RubikT3{
    background-color: white;
    top: 45.6vh;
    left: 52.5vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(315deg);
}
#RubikT4{
    background-color: white;
    top: 41.2vh;
    left: 56.9vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(315deg);
}
#RubikT5{
    background-color: white;
    top: 41.2vh;
    left: 67.9vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(315deg);
}
#RubikT6{
    background-color: white;
    top: 41.2vh;
    left: 78.9vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(315deg);
}
#RubikT7{
    background-color: white;
    top: 36.8vh;
    left: 83.3vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(315deg);
}
#RubikT8{
    background-color: white;
    top: 36.8vh;
    left: 72.3vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(315deg);
}
#RubikT9{
    background-color: white;
    top: 36.8vh;
    left: 61.3vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(315deg);
}
#RubikS1{
    background-color: blue;
    top: 51.3vh;
    left: 80vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(45deg);
    rotate: 90deg;
    
}
#RubikS2{
    background-color: blue;
    top: 61.8vh;
    left: 80vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(45deg);
    rotate: 90deg;
    
}
#RubikS3{
    background-color: blue;
    top: 72.8vh;
    left: 80vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(45deg);
    rotate: 90deg;
    
}
#RubikS4{
    background-color: blue;
    top: 68.1vh;
    left: 84.8vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(45deg);
    rotate: 90deg;
    
}
#RubikS5{
    background-color: blue;
    top: 57.1vh;
    left: 84.8vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(45deg);
    rotate: 90deg;
    
}
#RubikS6{
    background-color: blue;
    top: 46.5vh;
    left: 84.8vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(45deg);
    rotate: 90deg;
    
}
#RubikS7{
    background-color: blue;
    top: 42.5vh;
    left: 89vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(45deg);
    rotate: 90deg;
    
}
#RubikS8{
    background-color: blue;
    top: 52.4vh;
    left: 89vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(45deg);
    rotate: 90deg;
    
}
#RubikS9{
    background-color: blue;
    top: 63.4vh;
    left: 89vh;
    width: 9.8vh;
    height: 3.3vh;
    border-color: black;
    border-width: 10px;
    border-style: solid;
    border-radius: 15%;
    transform: skew(45deg);
    rotate: 90deg;
}