/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Reddit+Sans:ital,wght@0,200..900;1,200..900&display=swap');
/*-----------------------for PC-----------------------*/
@media screen and (min-width:801px) {
  /*-----------------------body-----------------------*/
  .counterWrapper {
    display: block;
    background: #0E3D85;
    padding: 20px 30px;
    height: 255px;
        width: 100%;
      margin: 0 auto
  }
 
  .counterWrapper h2 {
      display: block;
    width: 10%;
    float: left;
    font-size: 18px;
    color: #fff;
    text-align: right;
    padding-right: 0px;
    letter-spacing: 1px;
    margin-top: 40px;
      
   
  }
  .counter-flex {
    width: 100%;
    height: 200px;
    float: right;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    /*min-height: 600px;*/
  }
  .counter-box {
    width: auto;
    margin-right: 4%;
      margin: 0 auto
  }
  .counter-box h3 {
    margin-bottom: 0px;
    margin-left: 20px;
  }
  .counter-box h2 {
    font-size: 50px;
    text-align: right;
    font-family: 'Inter';
    color: #fff;
    font-family: "Manrope", sans-serif;
    width: 240px;
  }
  .counter-box h2 i {
    font-size: 20px;
    font-style: normal
  }
  .counter-box p {
    text-align: center;
    font-family: arial;
    color: #fff;
    float: left;
    margin-right: 20px;
    width: 30px;
  }
}
/*------------------for mobile------------------------*/
@media screen and (max-width:800px) {
  /*-----------------------body-----------------------*/
  .counterWrapper {
    display: block;
    width: 90%;
    background: #0E3D85;
    padding: 20px;
    height: auto;
    margin: 0 auto;
       

  }
  .counterWrapper h2 {
    width: 100%;
    float: right;
    font-size: 22px;
    color: #fff;
    text-align: right;
    letter-spacing: 1px;
    margin: 20px auto;
  }
  .counter-flex {
    width: 100%;
    height: auto;
    display: flex;
    /*flex-wrap: nowrap;
    flex-direction: row;*/
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
  }
  .counter-box {
    width: 100%;
    margin: 10px 0px;
    margin: 0 auto;
    text-align: right;
  }
  .counter-box h3 {
    margin: 0px;
    text-align: left;
  }
  .counter-box h2 {
    font-size: 50px;
    text-align: right;
    font-family: 'Inter';
    color: #fff;
    font-family: "Manrope", sans-serif;
    width: 220px;
    padding: 0px;
    margin: 20px 0px;
    float: right;
  }
  .counter-box h2 i {
    font-size: 20px;
    font-style: normal
  }
}