Math Project code

CSS for entire site------>
body {
  background-color:lightgray;
  color: black;
  font-family: Verdana;
}

a{
  color:darkgray;
  text-decoration:none;
}

a:hover{
  color:gray;
}

#spritebox{
  height:600px;
  width:400px;
  background-color:white;
  position:fixed;
  margin-left:5px;
  border-width:3px;
  border-style:outset;
  border-color:lightgray;
  }

#infobox{
  height:550px;
  width:700px;
  padding:10px;
  background-color:white;
  border-width:3px;
  border-style:outset;
  border-color:lightgray;
  float:left;
  margin-left:450px;
  margin-top:30px;
  overflow-y:scroll;
  border-radius:10px;
}

#infobox1{
  height:550px;
  width:700px;
  padding:10px;
  background-color:white;
  float:center;
  border-width:3px;
  border-style:solid;
  margin-top:30px;
  overflow-y:scroll;
  border-radius:10px;
}
 ::-webkit-scrollbar {
    width:11px;
    height:11px;}

    ::-webkit-scrollbar-track {
    border:5px solid {color:scrollbar bg};
    background:{color:Scrollbar};}

    ::-webkit-scrollbar-thumb:vertical{
    border:2px solid {color:Scrollbar bg};
    width:2px;
    background:white;
    }

    ::-moz-selection {background:none; color:black;
    {block:iftextshadow}
    text-shadow:0 0 3px black;
    {/block:iftextshadow}
    }
    ::selection {background:none; color:black;
    {block:iftextshadow}
    text-shadow:0 0 3px black;
    }

HTML for homepage--------------------------------------->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>The web site of charliesmathproject</title>
    <!-- The style.css file allows you to change the look of your web pages.
         If you include the next line in all your web pages, they will all share the same look.
         This makes it easier to make new pages for your site. -->
    <link href="/style.css" rel="stylesheet" type="text/css" media="all">
  </head>
  <body>
<center>
 <div id="infobox1">
<br><br><br>
 <img src="sadsfdghfjghjk.png" width=400px/><br><br>
  <h1>WELCOME TO CHARLIE'S MATH GAME</h1><br>
<a href="/1.html">SKIP TO GAME</A> / <a href="/how2play.html">HOW TO PLAY</a> / <a href="/credit.html">CREDITS</A><br><br>
 </div>
  </body>
</html>

HTML for questions--------------------------------------------->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>The web site of charliesmathproject</title>
    <!-- The style.css file allows you to change the look of your web pages.
         If you include the next line in all your web pages, they will all share the same look.
         This makes it easier to make new pages for your site. -->
    <link href="/style.css" rel="stylesheet" type="text/css" media="all">
  </head>
  <body>
  <!-- SCM Music Player http://scmplayer.co -->
<script type="text/javascript" src="https://scmplayer.co/script.js"
data-config="{'skin':'skins/aquaBlue/skin.css','volume':50,'autoplay':false,'shuffle':false,'repeat':1,'placement':'bottom','showplaylist':false,'playlist':[{'title':'Cabinet Man','url':'https://www.youtube.com/watch?v=SU1ILi7cc9k'},{'title':'Two Trucks','url':'https://www.youtube.com/watch?v=z9wXfeMrL44'},{'title':'Everybody Likes You','url':'https://www.youtube.com/watch?v=4xElp-lYnyE'},{'title':'I Understand','url':'https://www.youtube.com/watch?v=PtBCIZeVFio'},{'title':'Buttercup','url':'https://www.youtube.com/watch?v=e2qG5uwDCW4'}]}" ></script>
<!-- SCM Music Player script end -->
  <div id="spritebox">
  <img src="https://cdn.discordapp.com/attachments/441739393552613388/445721213277437962/wait.png" height=550px width=400px><br>
  <center>waiting...</center>
  <center><div style="font-size:20px;"><b><a href="progress1.html">progress</a><b>     </b><a href="/quit.html">quit</a></b></div></center>
  </div>
<center>
 <div id="infobox">
 <center>
<h1>PROBLEM 1</h1>
<h3>Solve the multi-step equation to defeat Jude!</h3>
- 7x + 10 = 24 <br><br>
a.)<a href="/wrong.html">x=2</a><br><br>
b.)<a href="/2.html">x=-2</a><br><br>
c.)<a href="/wrong.html">x=4</a><br>
</center>
  </body>
</html>