#t1, #t2 {
    position:absolute; left:5%; width:90%; height:5%;font-size:1em; font-weight:bold;}

#t1 {top:20%;}
#t2 {top:55%;}

#d1, #d2, #d3, #d4, #d5, #d6, #d7, #d8, #d9, #d10, #d11, #d12, #d13, #d14, #d15, #d16, #d17, #d18, #d19, #d20
{position:absolute; top:30%; width:2%; height:5%; font-size:1.8em; font-weight:bold;}

#d1 {left:25%;} #d2 {left:27%;} #d3 {left:29%;} #d4 {left:31%;} #d5 {left:33%;}
#d6 {left:35%;} #d7 {left:37%;} #d8 {left:39%;} #d9 {left:41%;} #d10 {left:43%;}
#d11 {left:45%;} #d12 {left:47%;} #d13 {left:49%;} #d14 {left:51%;} #d15 {left:53%;}
#d16 {left:55%;} #d17 {left:57%;} #d18 {left:59%;} #d19 {left:61%;} #d20 {left:63%;}


/* the number of jumps - over decimal points */

#j10, #j9, #j8, #j7, #j6, #j5, #j4, #j3, #j2, #j1 
{position:absolute; top:25%;  width:2%; height:5%; font-size:1em; font-weight:bold;}

#j10 {left:27%;} #j9  {left:31%;} #j8  {left:35%;} #j7  {left:39%;} #j6  {left:43%;}
#j5  {left:47%;} #j4  {left:51%;} #j3  {left:55%;} #j2  {left:59%;} #j1  {left:62%;}

#jj10, #jj9, #jj8, #jj7, #jj6, #jj5, #jj4, #jj3, #jj2, #jj1 
{position:absolute; top:60%;  width:2%; height:5%; font-size:1em; font-weight:bold;}

#jj10 {left:27%;} #jj9  {left:31%;} #jj8  {left:35%;} #jj7  {left:39%;} #jj6  {left:43%;}
#jj5  {left:47%;} #jj4  {left:51%;} #jj3  {left:55%;} #jj2  {left:59%;} #jj1  {left:62%;}


#answer1, #aanswer1, #sf3, #ssf3, #sf4, #ssf4, #sf5, #ssf5 {position:absolute;left:25%; width:50%; height:5%; font-size:1.8em;font-weight:bold;}

#answer1 {top:35%;}
#sf3 {top:40%;}
#sf4 {top:45%;}
#sf5 {top:39%;}	   

#aanswer1 {top:71%;}
#ssf3 {top:77%;}
#ssf4 {top:83%;}

#go1,#go3, #ggo1, #ggo3, #go4 {position:absolute;}

#go1,#go3, #ggo1, #ggo3 {left:75%}

#go1 {top:30%;}  #go3 {top:42%;} #ggo1 {top:65%;} #ggo3 {top:77%;}	   

#go4 {top:9%; left:5%;}	


/* ****************************************************************************
    lower part of screen
****************************************************************************** */
#dd0, #dd1, #dd2, #dd3, #dd4, #dd5, #dd6, #dd7, #dd8, #dd9, #dd10, #dd11, #dd12, #dd13, #dd14, #dd15, #dd16, #dd17, #dd18, #dd19, #dd20, #dd21 {position:absolute; top:65%; width:2%; height:5%; font-size:1.8em; font-weight:bold;}

#dd0 {left:24%;} #dd1 {left:26%;} #dd2 {left:27%;} #dd3 {left:29%;} #dd4 {left:31%;} #dd5 {left:33%;}
#dd6 {left:35%;} #dd7 {left:37%;} #dd8 {left:39%;} #dd9 {left:41%;} #dd10 {left:43%;}
#dd11 {left:45%;} #dd12 {left:47%;} #dd13 {left:49%;} #dd14 {left:51%;} #dd15 {left:53%;}
#dd16 {left:55%;} #dd17 {left:57%;} #dd18 {left:59%;} #dd19 {left:61%;} #dd20 {left:63%;} #dd21 {left:65%;}

	   

button {
    border: none;
    color: white;
    padding: 20px 32px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    border-radius: 5px; 
}

.button1 {
    background-color: #4CAF50; 
    
}

.button1:hover {
    background-color: #008CBA;}


.button2 {
    background-color: red; 
   }

.button2:hover {
    background-color: purple;}

.button3 {
    background-color: blue;
}

.button3:hover {
    background-color: chocolate;}