*{
     padding: 0;
     margin: 0;
     box-sizing: border-box;
     font-family: orange-kid;
     user-select: none;
}

@font-face {
     font-family: orange-kid;
     src: url(orange\ kid.otf);
}

body{
     padding: 40px;
     font-size: 20px;
}
.game{
     border: 10px solid brown;
}
h1{
     background: linear-gradient(brown,black);
     text-align: center;
     color: white;
     padding: 20px;
     font-size: 60px;
}
.main{
     display: flex;
     justify-content: space-evenly;
     padding: 20px;
     background-color: grey;

}
.upgrades{
     background-color: white;
     padding: 20px;
     width: 33.33%;
     min-height: 700px;
}
.upgrades button{
     cursor: pointer;
     background: none;
     border: none;
     font-family: orange-kid;
     font-size: 20px;
}
.upgrades button:hover{
     text-decoration: underline;
     font-weight: bolder;
}
.upgrade{
     padding: 10px;
     margin: 10px;
}
.upgrade:hover{
     background-color: lightgray;
}
.stats{
     width: 33.33%;
     padding: 20px;
     background-color: black;
     color: white;
     min-height: 700px;

}
.control{
     width: 33.33%;
     padding: 20px;
     background-color: white;
     text-align: center;
     min-height: 700px;
     font-size: 20px;
}
body{
     background-color: black;
}
.bold{
     font-weight: 900;
}
.rows{
     display: flex;
     justify-content: space-evenly;
}
.control button{
     background-color: red;
     color: white;
     border-radius: 15px;
     margin: 10px;
     padding: 20px;
     width: 100%;
     font-size: 20px;
}
.stats span{
     font-weight: 100;
}
video{
     width: 50%;
     height: 25%;
}

/*Responsive*/
@media only screen and (max-width: 1068px){
     .main{
          /* text-align: center; */
          display: block;
     }
     .upgrades,
     .control,
     .stats{
          width: 100%;
          /* height: 500px; */
     }
     body{
          padding: 10px;
     }
}
