media queries.css

  @media screen and (max-width: 1085px) {
    .banner {
      height: 20vh;
      /* font-size:3rem; */
    }
    .intro h1 {
      font-size: 2rem;
    }
    .mini {
      font-size: 1rem;
    }
    #utility {
      font-size: 3rem;
    }
  }

  @media screen and (max-width: 869px) and (min-width: 445px) {
    .banner {
      height: 15vh;
      font-size: 2rem;
    }
    .contact-us h3 {
      font-size: 2.5rem;
    }
    .about {
      height: auto;
    }
  }

  @media screen and (max-width: 444px) and (min-width: 350px) {
    .intro-content {
      height: auto;
    }
    .banner {
      height: 10vh;
      font-size: 1.5rem;
    }
    .mini-services {
      flex-wrap: wrap;
    }
    .mini {
      margin: 1rem;
    }
    #utility {
      font-size: 2.5rem;
    }
    .intro h1 {
      font-size: 2rem;
    }

    .contact-us h3 {
      font-size: 2rem;
    }
    .about {
      height: auto;
    }
  }

  @media screen and (max-width: 349px) {
    .intro-content {
      height: auto;
    }
    .banner {
      height: 8vh;
      font-size: 1rem;
    }
    .mini-services {
      flex-wrap: wrap;
    }
    .mini {
      margin: 1rem;
    }
    #utility {
      font-size: 2rem;
    }

    .intro h1 {
      font-size: 1.5rem;
    }
    .nav-bar ul li a {
      font-size: 1rem;
      padding-bottom: 0rem;
    }
    .nav-bar ul {
      padding: 0rem 0rem;
    }
    .nav-bar li {
      list-style: none;
      margin: 1rem 0rem;
    }
    .contact-us h3 {
      font-size: 1rem;
    }
    /* media queries for about us page */
    .about {
      height: auto;
      font-size: 1rem;
    }
    .about h1 {
      font-size: 1.5rem;
    }
    .desc h1 {
      font-size: 1.5rem;
    }
  }

  @media screen and (min-width: 611px) {
    .desc {
      width: 50%;
      background-color: rgb(49, 35, 35);
      color: #007bb5;
      display: flex;
      font-family: "Courgette", cursive;
    }
    .desc h1 {
      margin: auto auto;
    }
    .footer-sub {
      display: flex;
      height: 14vh;
      /* flex-wrap: wrap; */
    }
    .social-media {
      background-color: rgb(19, 13, 13);
      width: 50%;
      display: flex;
      justify-content: center;
      text-align: center;
    }
  }
  @media screen and (max-width: 610px) {
    .desc {
      width: 100%;
      background-color: rgb(49, 35, 35);
      color: #007bb5;
      display: flex;
      font-family: "Courgette", cursive;
      height: 15vh;
    }
    .desc h1 {
      margin: auto auto;
    }
    .footer-sub {
      display: flex;
      height: 30vh;
      /* flex-wrap: wrap; */
      flex-direction: column;
    }
    .social-media {
      background-color: rgb(19, 13, 13);
      width: 100%;
      display: flex;
      justify-content: center;
      text-align: center;
      height: 15vh;
    }
  }
    @media screen and (max-width:1800px)  and (min-width: 560px) {
      .our-services ul li {
        font-size: 2rem;
        padding: 2rem;

      }
      .para{
        font-size: 1.5rem;
      }
    }
    @media screen and (max-width: 559px) {
      .our-services ul li{
        font-size: 25px;
        padding-left: 0rem;
        padding-top: 2rem;
        padding-bottom: 2rem;
      }
      .para{
        font-size: 1rem;
      }
    }
  @media screen and (min-width: 460px) {
    .about {
      font-size: 2rem;
      height: 105vh;
      
    }
    .tech {
      margin-top: 5rem;
    }
  }

  @media screen and (max-width: 460px) {
    .about {
      font-size: 1.5rem;
      height: auto;
    }
    .tech {
      margin-top: 0rem;
    }
  }