*{
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  font-family: sans-serif;
  user-select: none;
  scroll-behavior: smooth;}
body{
  background-color: #cd3806;
  width: 100%;
  height: 500000px;}
#boxcenter{
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
z-index: 10;
opacity: 0;
position: fixed;}
#play-again{
  width: 80%;
  font-size: 24px;
  padding: 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin: auto;
  border-radius: 8px;
  background: #FFFFFF;}
#play-again #playbtn{
  background-color: #FF2164;
  color: white;
  font-size: 18px;
  border-radius: 4px;
  padding: 0.5rem 1rem;}
#carwon{
  color: #343b45;
  padding: 0.5rem 0}
#play-again b{
  color: #cd3806;
  padding-top: 0.5rem;}
#track{
 background-image: url(media/road.jpg);
 background-size: cover;
 position: fixed;
 margin-bottom: 1rem;
 display: flex;
 justify-content: space-around;
 width: 100%;
 border-bottom: 60px solid #cd3806;
 height: 100vh;}
#track #carbox{
  display: flex;
  justify-content: center;
  width: 3px;
  height: 100vh;}
#track #carbox img{
  transition: top 0.1s ease;
  padding: 4px 0;
  position: fixed;}
.stop-scrolling{height: 100vh;}
.finish-text{
  position: absolute;
  bottom: -40px;
  z-index: 3;
  color: white;
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 1px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;}
  
/*on tablet & destop mode*/
@media only screen and (min-width: 700px) {
 #play-again{width: 60%;}
 #track #carbox img{height: 90px; }
}
@media only screen and (min-width: 900px) {
 #play-again{width: 40%;}
 #track #carbox img{height: 140px; }
}