
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500&display=swap');
body{
  font-family: 'Orbitron', sans-serif;
}
.container{
    display: flex;
    justify-content: space-evenly;
    /* justify-content: space-evenly; */
    /* background-color: bisque; */
    /* border: 2px solid black; */
    height: 14rem;
    margin-top: 5rem;
     /* width: 190px; */
  /* height: 254px; */
  border-radius: 30px;
  background: #e0e0e0;
  box-shadow: 15px 15px 30px #bebebe,
             -15px -15px 30px #ffffff;

          
}

.col-lg-2{
    /* background-color: aqua; */
    display: flex;
    justify-content: center;
    font-size: 6rem;
    align-items: center;
    /* border: 2px solid red; */
      height: 18rem;
    transform: translateY(-2.15rem);
    
      border-radius: 30px;
  background: #e0e0e0;
  box-shadow: 15px 15px 30px #bebebe,
             -15px -15px 30px #ffffff;
             
             /* width: 18rem !important; */
            }
            
            .col-lg-8{
             font-size: 2rem;
              text-align: center;
              border-radius: 10px;
            background: #e0e0e0;
            box-shadow: 15px 15px 30px #bebebe,
                     -15px -15px 30px #ffffff;
}
@media screen and (max-width: 1024px) {
  .col-lg-2{
    height: 12rem;
    transform: translateY(-1rem);
    font-size: 4rem;
  }
  .container{
    height: 10rem;
  }
}
@media screen and (max-width: 768px) {
  .col-lg-2{
    height: 10rem;
    font-size: 3rem;
    transform: translateY(-1rem);
  }
  .container{
    height: 8rem;
  }
}
@media screen and (max-width: 425px) {
  .col-lg-2{
        height: 8.8rem;
        width: 14rem;
      transform: translateY(1rem);
  }
  .container{
    margin-top: 0.2rem;
    height: 97vh;
    width: 350px;
   
  }
  .col-lg-8{
    width: 35rem;  
    font-size: 1.5rem;
    transform: translateY(1.2rem);
  }
}
@media screen and (max-width: 375px) {
  .col-lg-2{
        height: 8.8rem;
        width: 12rem;
      transform: translateY(1rem);
  }
  .col-lg-8{
    width: 35rem;  
    font-size: 1.2rem;
    transform: translateY(0.7rem);
  }
  .container{
    margin-top: 0.4rem;
    height: 97vh;
    width: 300px;
   
  }}
@media screen and (max-width: 320px) {
  .col-lg-2{
        height: 8.8rem;
        width: 10rem;
      transform: translateY(1rem);
  }
  .container{
    margin-top: 0.5rem;
    height: 97vh;
    width: 270px;
   
  }
  .col-lg-8{
    /* width: 20rem;   */
    font-size: 1rem;
    transform: translateY(0.7rem);
  }
}