@media only screen and (min-width:250px) and (max-width:400px){ 
  img{
    /* width: 100%; */
  }
    /* banner */
    .banner-img{
      background-image: url("../img/banner.PNG");
      height:20vh;
    }
    .banner2-img{
      background-image: url("../img/Barcode\ scanner-banner.jpg");
      height: 20vh;
    }
    .banner-text {
      font-size: 35px;
      text-align: center;
    }
    /* conetnt-1 */
    .content-1{
        padding: 25px 10px;
      }
      .content-1 .row{
        flex-direction: column-reverse;
      }
    .content1-text p {
        margin-inline-end: 0;
        text-align: justify;
    }
         /* content-2 */
    .content-2{
        padding: 20px 0;
      }

     /*content-3  start*/
     .content-3{
       padding: 0;
     }
     .content-3 .flex{
        flex-direction: column;
      }
      .content-3 .card{
        /* width: 100%; */
        height: 580px;
    } 
    .content-3 .card1 {
      width: 240px;
      height: auto;
      border-radius: 10px;
      overflow: hidden;
      margin: 0;
      text-align: center;
      border: none;
  }
  .content-3 h3 {
    font-size: 26px;
}
    .content1-text h3 {
      /* width: 230px; */
  }
  .img-head img{
    width: auto;
  }
  .img-bottom img{
    width: auto;
  }
  .spec-img{
    width: auto;
  }
  .main-img img{
    width: auto;
  }
  .content2-h3 img{
    width: auto;
  }
  .mini-text{
      height: auto;
  
  }
  .infra-flex2 .infra-card .infra-img img{
    width: 100%;
    height: auto;
  }
  .card-Philosophy{
    flex-direction: column;
  }
}
@media only screen and (min-width: 250px) and (max-width: 768px) {
  .content1-flex {
    display: flex;
    justify-content: center;
    align-items: center;
}
.flex-box4 {
  flex-wrap: wrap;
}
.banner10 .banner-text {
  background-color: #00000038;
    border-radius: 10px;
}
.banner10 .banner-text h1{
  font-size: 25px;
}
.infra-img img{
  width: 96%;
}
.mini-text{
  height: auto;

}
.infra-flex2 .infra-card {
  height: auto;
}
}
        /* medium */
        @media only screen and (min-width: 401px) and (max-width: 767px) {
     /* banner */
     .banner-img{
      background-image: url("../img/banner.PNG");
      height:22vh;
    }
    .banner2-img{
      background-image: url("../img/Barcode\ scanner-banner.jpg");
      height: 22vh;
    }
    .banner-text h1{
      font-size: 35px;
      text-align: center;
    }
    .content-3 h3 {
      font-size: 35px;
  }
    /* conetnt-1 */
    .content-1{
        padding: 25px 10px;
      }
      .content1-imgbox{
        text-align: center;
        
      }
      .content-1  .row{
        flex-direction: column-reverse;
      }
    .content1-text p {
        margin-inline-end: 0;
        text-align: justify;
    }
        /* content-2 */
        .content-2{
            padding: 40px 0;
          }
         /*content-3  start*/
     .content-3 .flex{
        flex-direction: column;
      }
      .content-3 .card{
        height: 580px;
        align-items: center;
    justify-content: center;
    } 
    .content-3 .card3 {
      height: 446px;
      border-radius: 10px;
      overflow: hidden;
      margin: 8px 3px;
    }
    .content-3 .card1 {
      width: 240px;
      height: auto;
      border-radius: 10px;
      overflow: hidden;
      margin: 0;
      text-align: center;
      border: none;
  }
  .bartender-imgbox {
    text-align: center;
    margin-bottom: 2px;
    height: 228px;
    width: 251px;
}
.bartender img {
  width: 100% !important;
}

.bartender {
  /* padding: 40px 40px 30px; */
  padding: 20px;
}
.bartrend2 {
  margin-top: 1rem;
  margin-bottom: 2rem;
}
.bartender-text h3 {
  font-size: 31px;
}
.why-box {
 
  margin-bottom: 15px;
}
}
     /* large */
@media only screen and (min-width: 768px) and (max-width: 991px){
        /* content-1 */
  .content1-flex{
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .content1-text hr {
    right: 150px;
  }  
      /* content-2 */
      .content2-text .card {
        width: 100%;
    }
      /* content-3 */
                
  .content2-img img {
    width: 360px;
}
  .content-3 .card{
    width: 412px;
    height: 580px;
    align-items: center;
justify-content: center;
} 
.content-3 .card3 {
  width: 304px;
  height: 410px;
  border-radius: 10px;
  overflow: hidden;
  margin: 8px 3px;
}
.content-3 .card1 {
  width: 240px;
  height: auto;
  border-radius: 10px;
  overflow: hidden;
  margin: 0;
  text-align: center;
  border: none;
}
.col-card12{
  padding:  30px 0;
}
.bartender {
  /* padding: 15px; */
  margin: 20px 0;
}
.bartrend2 {

  margin: 20px 0;
}
.bartender-imgbox {
  margin-bottom: 10px;
  text-align: center;
  width: 251px;
  height: 186px;
}
.bartender img {
  width: 100% !important;
}
.why-box {
 
  margin-bottom: 15px;
}
}
@media only screen and (min-width: 991px) and (max-width: 1220px){
      /* content-2 */
      .content2-text .card {
        width: 100%;
    }
    /* content-3 */
   
    .content-3 .card{
      width: 304px;
      height: 562px;
      border-radius: 10px;
      overflow: hidden;
      margin: 8px 3px;
    } 
    .content-3 .card3 {
      width: 304px;
      height: 410px;
      border-radius: 10px;
      overflow: hidden;
      margin: 8px 3px;
    }
    .content-3 .card1 {
      width: 240px;
      height: auto;
      border-radius: 10px;
      overflow: hidden;
      margin: 0;
      text-align: center;
      border: none;
  }
    .card4{
      width: 304px;
        height: 700px !important;
        border-radius: 10px;
        overflow: hidden;
        margin: 8px 3px;
    }
    .software-box .card {
      width: 300px;
      padding: 20px 10px;
      height: 600px;
      margin: 10px;
  }
  .software{
    padding: 46px 0px !important;
  }
  .e-icon{
    width: 200px;
      height: 300px;
  }
  .infra-flex2 .infra-card {
    width: 270px;
    height: 448px;
    margin: 15px 10px; 
    text-align: center;
  }
  }
  @media only screen and (min-width: 250px) and (max-width: 991px){
    .flex-box1{
      display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }
    .unified-img img{
      width: 100%;
    }
    .infra-flex{
      display: flex;
      flex-wrap: wrap;
      align-items: center;
    justify-content: center;
    }
    .infra-card{
        margin: 10px 10px;
    }
}
@media only screen and (min-width: 991px) and (max-width: 1100px){
  .infra-card{
      height: 650px;
      
  }
}
@media only screen and (min-width: 768px) and (max-width: 868px){
  .navbar .navbar-brand img {
    /* width: 100%; */
}
}