* {
    margin: 0;
    padding: 0;
}

@media screen and (min-width: 1500px) {
    .hero-heading {
        margin-top: 25rem;
    }
}

@media screen and (max-width: 1500px) {
   
    .items-sec-img-wrapper {
        grid-row: 3/-1;
    }

    .hero-heading h1 {
        padding-top: 12vmin;
    }

    .navbar .navbar-brand {
        font-size: 3.5rem;
    }

   
   .section-title h1 {
       font-size: 4.5rem;
   }

   .section-title p {
       font-size: 35px;
       padding: 5px 40px 20px 0;
       margin-bottom: 1.2em;
   }

   .section-title a {
       font-size: 34px;
   }

   .sec-service {
       padding-bottom: 8rem;
       position: relative;
       text-decoration: none;
   }

   .sec-service h3 {
       font-size: 28px;
       font-weight: 400;
   }

   .sec-service p {
       padding: 5px 0px 20px 0;
       font-weight: 300;
      font-size: 32px;
   }
   
   /* ---Sec-3 lightblub */
   .sec3-header h4 {
       font-size: 30px;
   }

   .sec3-header h1 {
       font-size: 3.5rem;
   }

   .item-header h3 {
       font-size: 1.8rem;
   }

   .item-text {
       font-size: 1.7rem;
       margin-left: 0.2rem;
       text-align: left;
   }

   .items-sec-img-wrapper {
       grid-column: 7/11;
       grid-row: 2/6;
       width: 100% !important;
   }

   .items-sec-img-wrapper img {
       width: 100%;
       object-fit: cover;
       opacity: 0.8;
       animation: scaleup 6s ease-in-out infinite;
   }

   /* ---Hosting */
   .sec-4-header h1 {
     font-size: 4rem;
   }

   .sec-4-header p {
       font-size: 3rem;
   }

   .swiper-container {
       width: 100%;
       padding-top: 50px;
       padding-bottom: 50px;
   }

   .swiper-btn a {
       font-size: 30px;
   }

   .swiper-btn {
       margin-top: 5rem;
   }

   /* ---Partners */

   .partner-heading h1 {
       font-size: 4rem;
   }

   .partner-heading p {
       font-size: 2.5rem;
   }

   /* -------Sec-5 */
   .sec-5-header h1 {
       font-size: 4rem;
   }

   .sec-5-header p {
       font-size: 2.5rem;
   }

   .sec-5-btn a {
       font-size: 28px;
       padding: 22px 25px;
       right: 41%;
   }


   .serv-features-wrapper {
       height: 800px;
       grid-template-columns: repeat(4, 1fr);
   }

 

   .serv-feature-item:nth-child(odd) .ser-feature-icon {
       display: block;
       margin-top: 12rem;
   }

   /* -----Footer */
    #footer .footer-top h4 {
        font-size: 30px;
    }

    #footer .footer-top .footer-social a {
        font-size: 24px;
    }

    #footer .footer-top .footer-links ul li {
        padding-right: 5px;
        color: #ffea00;
        font-size: 18px;
        padding: 10px 0;
        border-bottom: 1px solid #262c44;
    }

    #footer .footer-top .footer-links ul li {
        font-size: 28px;
    }

    #footer .footer-top .footer-contact .btn {
        font-size: 22px;
    }

    #footer .copyright {
       font-size: 18px;
    }

}

@media screen and (max-width: 1400px) {
    /* -------Personalized Tech Guid */
    .section-title h1 {
        font-size: 4rem;
    }

    .section-title p {
        font-size: 18px;
        padding: 5px 470px 20px 0;
        margin-bottom: 2em;
    }

    .section-title  a{
        border: 1px solid;
        padding: 10px 35px;
        margin: 5rem 0;
        font-size: 14px;
    }

    .sec-service h3 {
        font-size: 18px;
    }
    
    .sec-service p {
        padding: 5px 90px 20px 0;
        font-size: 1.3rem;
    }
    
    .sec-service i {
        font-size: 3rem;
        padding-bottom: 12px;
        padding-top: 6rem; 
    }
    
    
    /* ---Lightbuld */
    .sec3-header h4 {
        font-size: 18px;
    }

    .sec3-header h1 {
        font-size: 2.2rem;
    }
    .item-text {
        font-size: 1.2rem;
        margin-left: 1rem;
        text-align: justify;
        color: #6e6e6a;
    }
    
    .items:nth-child(1) {
        grid-column: 3/7;
    }

    .items:nth-child(2) {
        grid-column: 2/6;
    }

    .items:nth-child(3) {
        grid-column: 3/7;
    }

    .items:nth-child(4) {
        grid-column: 11/15;
    }

    .items:nth-child(5) {
        grid-column: 12/16;
    }

    .items:nth-child(6) {
        grid-column: 11/15;
    }

    /*----Hosting--- */
    .card-container {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }

    .host-btn {
        margin-bottom: 5rem;
    }
    
  
    /* -----------Partner */
     .partner-heading p {
         font-size: 1.5rem;
     }

     .partner-item > li img {
        padding-top: 2rem;
    }

     /* ---Work Together */
     .sec-5 {
        margin-top: 7rem ;
        margin-bottom: 17rem;
    }

    
     .sec-5-header p {
        font-size: 1.5rem;
    }
    

     /* ---------Service Page */
     .service h1 {
         font-size: 4rem;
         padding-top: 1.5rem;
     }

     .service {
         height: 100vh;
     }
     

     .service-goal h6 {
         font-size: 22px;
     }

     .service-goal p {
         font-size: 2rem;
         padding-bottom: 2rem;
     }

     .service-info h2 {
         font-size: 1.5rem;
     }

     .service-info p {
         font-size: 1.2rem;
     }

     .service-title h1 {
         text-align: center;
         font-size: 1.5rem;
     }

     .service-title2 i {
         font-size: 45px;
         color: #2a8d19;
     }

     .service-title2 h1 {
        font-size: 1.5rem;
     }

     .service-title3 i {
         font-size: 45px;
         color: #66696b;
     }

     .service-title3 h1 {
        font-size: 1.5rem;
     }

     .service-title4 i {
         font-size: 45px;
         color: #112d42;
     }

     .service-title4 h1 {
        font-size: 1.5rem;
     }

     .service-title5 i {
         font-size: 45px;
         color: #e6e22f;
     }

     .service-title5 h1 {
        font-size: 1.5rem;
     }

     .service-title6 i {
         font-size: 45px;
         color: #919088;
     }

     .service-title6 h1 {
        font-size: 1.5rem;
     }

     .read-more-btn {
        font-size: 1rem;
     }

     /* ----Coompany Page */
     .quot {
        height: auto;
    }

    .quot-heading h3 {
       padding-bottom: 2rem;
    }

    /* --Contact Page */
    .contact {
        min-height: 100vh;
    }
    .contact .container .contactForm {
        margin-left: 0px;
        padding-left: 220px;
    }

    /* Subscribe Section of Contact */

    .letter {
        margin-top: 35vmin;
    }

    .subscribe {
        margin-top: 20vmin; 
        margin-bottom: 40vmin;
    }
    
}

@media screen and (max-width: 1200px) {
     /* ----Hosting */
     .hosting-header h1{
        font-size: 3rem;
        padding-top: 2rem;
    }

    
     .card-container {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
    }

    .card-base {
        width: 350px;
        height: 500px;
        margin: 10px;
    }

    .swiper-btn {
        margin-top: 20px;
        padding-bottom: 80px;
    }

    /* -----Contact Page */
    .contact .container {
        width: 90%;
        min-width: auto;
        margin: 20px;
    }

    .contact .container .contactinfo {
        top: 0;
        height: 550px;
        position: relative;
    }

    .contact .container .contactForm {
        position: relative;
        width: calc(100% - 350px);
        padding-left: 0px;
        margin-left: 0px;
        padding: 40px;
        height: 550px;
    }
}

@media screen and (min-width: 1200px) {
    /* ----Header */
    .hero-heading p {
       padding: 0 15rem;
    }

     /* -------Hosting Section */
     .card-base {
         width: 350px;
         height: 450px;
         margin: 20px;
         border-radius: 40px;
         box-shadow: 2px 2px 22px rgba(0, 0, 0, 0.8);
     }
    
    .serv-features-wrapper {
        height: 800px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }

    .serv-feature-item:nth-child(1) {
        border-right: 0.5px solid #cdcdcd;
    }

    .serv-feature-item:nth-child( 2) {
        border-right: 0.5px solid #cdcdcd;
    }

    .serv-feature-item:nth-child(3) {
        border-right: 0.5px solid #cdcdcd;
    }

    .serv-feature-item:nth-child(odd) .serv-feature-icon {
        display: block;
        margin-top: 12rem;
    }

    .serv-feature-item:nth-child(even) .serv-feature-icon {
        display: block;
        margin-top: 2rem;
    }
} 


@media screen and (max-width: 1025px) {
  .header .header-logo {
      /* font-size: 1rem;
    color: #535351; 
    text-decoration: none; */
      cursor: pointer;
      /* font-weight: bold; */
      margin-left: 1rem;
      max-width: 270px;
      width: 100%;
      max-height: 200px;
  }

    .header .navbar ul li {
        margin: 0 .1rem;
    }

    .header .navbar ul li a {
        font-size: 1.3rem;
    }

    .hero-heading {
        padding: 0 80px;
        margin-top: 5rem;
    }

     /* -----Cloud Section */
     .cloud-sec {
        margin: 7rem 0;
        padding-top: 0;
    }
 
    .cloud-content h1 {
        font-size: 5rem;
        max-width: 480px;
    }
 
    .cloud-content p {
        margin-bottom: 80px;
        max-width: 550px;
        font-size: 2.2rem;
    }
 
    .features-group-2 {
        margin-left: 40px;
        margin-top: 50px;
        padding-bottom: 40px ;
    }
 
    .feature-1,
    .feature-2,
    .feature-3,
    .feature-4 {
        max-width: 650px;
        height: 420px;
        padding: 20px;
    }
 
    .features h3 {
        font-size: 1.3rem;
        padding: 15px 0 15px 0;
    }
 
    .features ul li {
        font-size: 20px;
    }
 

     .features i {
         padding-right: 8px;
         font-size: 6px;
         color: #02d7dd;
     }

     .cloud-btn {
         display: inline-block;
         padding: .8rem 3rem;
         font-size: 2rem;
     }


      /* ---Personalized */
      .section-title h1 {
          font-size: 4.5rem;
      }

      .section-title p {
          font-size: 35px;
          padding: 5px 40px 20px 0;
          margin-bottom: 1.2em;
      }

      .section-title a {
          font-size: 34px;
      }

      .sec-service {
          padding-bottom: 8rem;
          position: relative;
          text-decoration: none;
      }

      .sec-service h3 {
          font-size: 28px;
          font-weight: 400;
      }

      .sec-service p {
          padding: 5px 0px 20px 0;
          font-weight: 300;
          font-size: 32px;
      }

      .home-offer {
          clip-path: polygon(0 0, 100% 0, 100% 100%, 70% 92%, 0 100%);
      }

      /* ---Sec-3 lightblub */

      .sec3-header h1 {
        font-size: 2.8rem;
        padding-bottom: 25px;
     }

      .items-sec-img-wrapper {
          grid-column: 7/11;
          grid-row: 2/6;
          width: 100% !important;
      }

      .items-sec-img-wrapper img {
          width: 100%;
          margin-top: 8rem;
      } 

      /* ---Hosting */
      .sec-4-header h1 {
          font-size: 4rem;
      }

      .sec-4-header p {
          font-size: 3rem;
      }

      .swiper-btn {
          margin-top: 5rem;
      }

      /* ---Partners */

      .partner-heading h1 {
          font-size: 4rem;
      }

      .partner-heading p {
          font-size: 2.5rem;
      }

      /* -------Sec-5 */
      .sec-5-header h1 {
          font-size: 4rem;
      }

      .sec-5-header p {
          font-size: 2.5rem;
      }

      .sec-5-btn a {
          font-size: 28px;
          padding: 22px 25px;
          
      }

      /* ------Service Page */
      .serv-features-wrapper {
          height: auto;
      }

     
      .serv-feature-item:nth-child(odd) .serv-feature-icon {
          display: block;
          margin-top: 0rem;
      }

      .serv-feature-item:nth-child(even) .serv-feature-icon {
          display: block;
          margin-top: 2rem;
      }

      .serv-feature-heading p {
          font-size: 3.2rem;
      }

      .serv-feature-heading h6 {
          font-size: 2rem;
      }

       /* ---Contact Page */
     .contact .container {
        display: flex;
        flex-direction: column-reverse;
    } 

    .contact .container .contactForm {
        padding: 10px 0px;
        margin-left: 0px;
        display: flex; 
        flex-direction: column;
        padding-left: 0px;
        width: calc(100% - 130px);
        height: 100%;
        box-shadow: 0 50px 50px rgba(0, 0, 0, 0.5);
        border-radius: 20px;
    }

    

    .subscribe {
        margin-top: 0vmin; 
        margin-bottom: 3vmin;
    }
}

@media screen and (max-width: 1024px) {
    .header .header-logo {
        /* font-size: 1rem;
    color: #535351; 
    text-decoration: none; */
        cursor: pointer;
        /* font-weight: bold; */
        margin-left: 1rem;
        max-width: 270px;
        width: 100%;
        max-height: 200px;
    }

    .header .navbar ul li {
        margin: 0 .1rem;
    }

    .header .navbar ul li a {
        font-size: 1.3rem;
    }

    .hero-heading {
        padding: 0 80px;
        margin-top: 5rem;
    }

     /* -----Cloud Section */
     .cloud-sec {
        margin: 7rem 0;
        padding-top: 0;
    }
 
    .cloud-content h1 {
        font-size: 5rem;
        max-width: 480px;
    }
 
    .cloud-content p {
        margin-bottom: 80px;
        max-width: 550px;
        font-size: 2.2rem;
    }
 
    .features-group-2 {
        margin-left: 40px;
        margin-top: 50px;
        padding-bottom: 40px ;
    }
 
    .feature-1,
    .feature-2,
    .feature-3,
    .feature-4 {
        max-width: 650px;
        height: 420px;
        padding: 20px;
    }
 
    .features h3 {
        font-size: 1.3rem;
        padding: 15px 0 15px 0;
    }
 
    .features ul li {
        font-size: 20px;
    }
 

     .features i {
         padding-right: 8px;
         font-size: 6px;
         color: #02d7dd;
     }

     .cloud-btn {
         display: inline-block;
         padding: .8rem 3rem;
         font-size: 2rem;
     }


      /* ---Personalized */
      .section-title h1 {
          font-size: 4.5rem;
      }

      .section-title p {
          font-size: 35px;
          padding: 5px 40px 20px 0;
          margin-bottom: 1.2em;
      }

      .section-title a {
          font-size: 34px;
      }

      .sec-service {
          padding-bottom: 8rem;
          position: relative;
          text-decoration: none;
      }

      .sec-service h3 {
          font-size: 28px;
          font-weight: 400;
      }

      .sec-service p {
          padding: 5px 0px 20px 0;
          font-weight: 300;
          font-size: 32px;
      }

      .home-offer {
          clip-path: polygon(0 0, 100% 0, 100% 100%, 70% 92%, 0 100%);
      }

      /* ---Hosting */
      .sec-4-header h1 {
          font-size: 4rem;
      }

      .sec-4-header p {
          font-size: 3rem;
      }

      .swiper-btn {
          margin-top: 5rem;
      }

      /* ---Partners */

      .partner-heading h1 {
          font-size: 4rem;
      }

      .partner-heading p {
          font-size: 2.5rem;
      }

      /* -------Sec-5 */
      .sec-5-header h1 {
          font-size: 4rem;
      }

      .sec-5-header p {
          font-size: 2.5rem;
      }

      .sec-5-btn a {
          font-size: 28px;
          padding: 22px 25px;
          
      }

      /* ------Service Page */
      .serv-features-wrapper {
          height: auto;
      }

     
      .serv-feature-item:nth-child(odd) .serv-feature-icon {
          display: block;
          margin-top: 0rem;
      }

      .serv-feature-item:nth-child(even) .serv-feature-icon {
          display: block;
          margin-top: 2rem;
      }

      .serv-feature-heading p {
          font-size: 3.2rem;
      }

      .serv-feature-heading h6 {
          font-size: 2rem;
      }

       /* ---Contact Page */
     .contact .container {
        display: flex;
        flex-direction: column-reverse;
    } 

    .contact .container .contactForm {
        padding: 10px 0px;
        margin-left: 0px;
        display: flex; 
        flex-direction: column;
        padding-left: 0px;
        width: calc(100% - 130px);
        height: 100%;
        box-shadow: 0 50px 50px rgba(0, 0, 0, 0.5);
        border-radius: 20px;
    }

    .contact .container .contactinfo {
        border-radius: 20px;
        width: 350px;
        height: calc(100% - 80px);
        background: #112d42;
        z-index: 1;
        padding: 40px;
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        box-shadow: 0 20px 20px rgba(0, 0, 0, 0.2);
    }

    .subscribe {
        margin-top: 0vmin; 
        margin-bottom: 3vmin;
    }
}


@media screen and (max-width: 1000px) {
    .items-sec {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .items {
        width: 40rem;
        margin-bottom: 6rem;
    }

    .items-sec-img-wrapper {
        width: 40rem;
    }

    .items-sec-img-wrapper img {
        width: 100%;
    }

     .items-sec-img-wrapper {
         grid-row: 3/-1;
     }

     .hero-heading h1 {
         padding-top: 12vmin;
     }

     

     /* Personalized */
     .home-offer {
         margin-top: 15vmin;
         margin-bottom: 20vmin;
         background: #112d42;
         clip-path: polygon(0 0, 100% 0, 100% 100%, 61% 90%, 0 100%);
     }


     .section-title h1 {
         font-size: 4.5rem;
     }

     .section-title p {
         font-size: 35px;
         padding: 5px 40px 20px 0;
         margin-bottom: 1.2em;
     }

     .section-title a {
         font-size: 34px;
     }

     .sec-service {
         padding-bottom: 8rem;
         position: relative;
         text-decoration: none;
     }

     .sec-service h3 {
         font-size: 28px;
         font-weight: 400;
     }

     .sec-service p {
         padding: 5px 0px 20px 0;
         font-weight: 300;
         font-size: 32px;
     }

     /* ---Sec-3 lightblub */
      /* ---Light Bulp */
    .items-sec-img-wrapper img {
        display: none;
     }

     .sec3-header h4 {
         font-size: 30px;
     }

     .sec3-header h1 {
         font-size: 3rem;
     }

     .items {
         margin-bottom: 1.5rem;
     }

     .item-header h3 {
        font-size: 3rem;
     }

     .item-text {
         font-size: 2.3rem;
         margin-left: 0.2rem;
         text-align: left;
     }

     .item-header i {
         font-size: 3.5rem;
     }

     .items-sec-img-wrapper {
         grid-column: 7/11;
         grid-row: 2/6;
         width: 100% !important;
         margin-left: 8rem;
     }

     .items-sec-img-wrapper img {
         width: 80%;
         object-fit: cover;
         opacity: 0.8;
         animation: scaleup 6s ease-in-out infinite;
     }

     .swiper-btn a {
         font-size: 30px;
          right: 36%;
     }

     /* -------Sec-5 */
     .sec-5-header h1 {
         font-size: 4rem;
     }

     .sec-5-header p {
         font-size: 2.5rem;
          padding: 0 0rem;
     }

     .sec-5-btn a {
         font-size: 28px;
         padding: 22px 25px;
         right: 38%;
     }

     /* ---------Service Page  */

}




@media screen and (max-width: 991px) {

    .hori-selector {
        margin-top: 0px;
        margin-left: 10px;
        border-radius: 0;
        border-bottom-left-radius: 25px;
        border-bottom-left-radius: 25px;
    }

    /* -------Personalized */
    .section-title p {
        font-size: 18px;
    }

    .home-offer {
        margin-top: 15vmin;
        margin-bottom: 20vmin;
        background: #112d42;
        clip-path: polygon(0 0, 100% 0, 100% 100%, 81% 98%, 0 100%) !important;
    }


    .hori-selector .right,
    .hori-selector .left {
        right: 10px;
    }

    .hori-selector .left {
        top: -25px;
        left: auto;
    }

    .hori-selector .right {
        bottom: -25px;
    }

    .hori-selector .left::before {
        left: -25px;
        top: -25px;
    }

    .hori-selector .right::before {
        left: -25px;
        top: -25px;
    }

     /* ----contact page */
     .contact {
         background: none;
     }

     .contact::before {
         display: none;
     }

     .contact .container {
         display: flex;
         flex-direction: column-reverse;
         /* padding: 0 40px; */
     }

     .contact .container .contactForm {
         width: 100%;
         height: auto;
     }


     .contact .container .contactinfo {
         width: 100%;
         height: auto;
         flex-direction: row;
     }

     .contact .container .contactinfo .sci {
         position: relative;
         display: flex;
         justify-content: center;
         align-items: center;
         flex-direction: row;
     }
}

@media screen and (max-width: 769px) {
    .header .fa-bars {
        display: block;
        font-size: 2rem;
    }

    .header .navbar {
        position: fixed;
        top: -110%;
        left: 0;
        height: auto;
        width: 100%;
        background-color: #000;
        z-index: 1000;
        border-top: 0rem solid rgba(0, 0, 0, .3);  
    }

    .header .navbar ul {
        height: 100%;
        width: 100%;
        flex-flow: column;
    }

    .header .navbar ul li {
        margin: 1rem 0;
    }

     .header .navbar ul li a {
        color: #6e6e6a; 
        font-size: 1.5rem;
     }

     .header .fa-times {
        transform: rotate(108deg);  
     }

     .header .nav-toggle {
         top: 5.8rem; 
        
     }

     #myVideo {
        height: 50%;
      }
      

     .hero-heading {
         padding: 0 40px;
         margin-top: 5rem;
     }

     .hero-heading p {
         font-size: 1.5rem;
         color: whitesmoke;
         font-weight: 300;
     }

     .header-btn {
         display: inline-block;
         padding: .5rem 2rem;
         border-radius: 5rem;
         font-size: 1.2rem;
         margin-top: 16px;
     }

     .hero-heading h1 {
         font-size: 3rem;
         text-transform: uppercase;
         color: transparent;
         -webkit-text-stroke: 1px #ffea00;
         letter-spacing: 3px;
         font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
     }

     .hero-heading h3 {
         font-size: 2rem;
         text-transform: capitalize;
         font-weight: bold;
     }


     /* ---Cloud Section */
    .cloud-sec {
        margin: 7rem 0;
        padding-top: 0;
    }

    .cloud-content h1 {
        font-size: 5rem;
        max-width: 480px;
    }

    .cloud-content p {
        margin-bottom: 80px;
        max-width: 550px;
        font-size: 2.2rem;
    }

    .features-group-2 {
        margin-left: 40px;
        margin-top: 50px;
        padding-bottom: 40px;
    }

    .feature-1,
    .feature-2,
    .feature-3,
    .feature-4 {
        max-width: 650px;
        height: 450px;
        padding: 40px 0;
    }

    .features h3 {
        font-size: 1.4rem;
        padding: 15px 0 15px 0;
    }

    .features ul li {
        font-size: 20px;
    }

     /* -------Personalized */
     .section-title p {
         font-size: 32px;
         padding: 5px 0px 0px 0;
     }

     .sec-service h3 {
         font-size: 28px;
     }

     .sec-service i {
         font-size: 3rem;
         padding-top: 4rem;
     }

     .home-offer {
         margin-top: 15vmin;
         margin-bottom: 20vmin;
         clip-path: polygon(0 0, 100% 0, 100% 100%, 67% 98%, 0 100%);
     }

     /* ----Lightbulp */
     .sec3-header h1 {
         font-size: 2rem;
     }

     .sec-project h1 {
         font-size: 43px;
         font-weight: 600;
     }

     .sec-project p {
         font-size: 2.5rem;
         text-align: center;
     }

    
     /* ---Hosting */
     .sec-4-header {
         padding-top: 0rem;
     }

     .sec-4-header h1 {
         font-size: 3rem;
     }

     .sec-4-header p {
         font-size: 2rem;
         padding: 0 0;
     }

     .swiper-btn a {
         font-size: 30px;
         right: 32% !important;
     }

     .swiper-btn {
         margin-top: 2.8rem;
     }

     .sec-5-btn a {
         right: 34%;
     }

     .partner-item li {
         width: 100%;
         text-align: center;
         margin-bottom: 50px;
     }

     .partner-item > li img {
         max-width: 500px;
         width: 100%;
         height: auto;
         transition: all 0.3s ease;
         opacity: 1;
         padding-top: 3rem;
     }

     /* ----Service Page */
      .service-page {
          padding-bottom: 5rem;
      }

     .service-section {
         flex-direction: column;
     }

     .service-section h2 {
        font-size: 2.2rem;
     }

     .service-info p {
         font-size: 34px;
     }

     .service-title i {
         font-size: 45px;
         color: #02d7dd;
         margin-left: 18rem;
     }

     .service-title2 {
         width: 100%;
     }

     .service-title2 i {
         font-size: 45px;
         color: #2a8d19;
         margin-left: 18rem;
     }

     .service-title3 {
         width: 100%;
     }

    .service-title3 i {
        font-size: 45px;
        color: #66696b;
        margin-left: 19rem;
    }

     .service-title4 {
         width: 100%;
     }

     .service-title4 i {
         font-size: 45px;
         color: #112d42;
         margin-left: 18rem;
     }

     .service-title5 {
         width: 100%;
     }

     .service-title5 i {
         font-size: 45px;
         color: #e6e22f;
         margin-left: 18rem;
     }

     .service-title6 {
         width: 100%;
     }

     .service-title6 i {
         font-size: 45px;
         color: #919088;
         margin-left: 19rem;
     }

     .service-title h1 {
         font-size: 35px;
     }

     .service-title2 h1 {
         font-size: 35px;
     }

     .service-title3 h1 {
         font-size: 35px;
     }

     .service-title4 h1 {
         font-size: 35px;
     }

     .service-title5 h1 {
         font-size: 35px;
     }

    .service-title6 h1 {
        font-size: 35px;
    }

    /* ---------Service Contact Form */
    .service h1 {
        font-size: 4rem;
    }

    /* --------Company Section */
     .quot {
         height: 100vh;
         border-radius: 20%;
     }

     .quot-heading h2 {
         font-size: 2.1rem;
         padding-top: 50px;
     }

     .quot-heading h3 {
         margin-left: 0em;
         padding-bottom: 15px;
         font-size: 27px;
     }

     .quot-heading i {
         font-size: 25px;
     }

     .company {
         margin-top: 15rem;
     }

     .about-company {
         flex-direction: column;
         padding: 0 10px;
     }

     .about-company:nth-child(2) {
         flex-direction: column-reverse;
     }

     .about-heading h1 {
         font-size: 4rem;
     }

     .about-heading h5 {
         font-size: 1.8rem;
     }

     .family {
         font-size: 2.2rem;
         max-width: 700px;
     }

     #aboutVideo {
         width: 100%;
         max-width: 1550px;
         padding-left: 0rem;
         border-radius: 20px;
         margin-top: 3rem;
         justify-content: center;
         padding: 0 10px;
         align-items: center;
     }

     .vision {
         margin-top: 8rem;
     }

     .vision img {
         max-width: 1250px;
     }

     .vision-heading {
         padding-left: 0rem;
     }

     .vision-heading h1 {
         font-size: 4rem;
     }

     .vision-heading p {
         font-size: 2.2rem;
         padding-bottom: 2rem;
     }

     .values {
         margin-top: 6rem;
         margin-bottom: 8rem;
     }

     .values-heading h1 {
         font-size: 4rem;
     }

     .values-heading {
         margin-top: 0rem;
     }

     .values-heading p {
         font-size: 2.2rem;
         padding-bottom: 2rem;
     }

     .values img {
         margin-left: 0rem;
     }

     /* ----Contact Page */

    .contact .container .contactForm {
        padding: 25px;
    }
    
    .contact .container .contactinfo {
        padding: 25px;
        flex-direction: column;
        align-items: flex-start;
    }
    
    .contact .container .contactinfo .sci {
        margin-top: 40px;
    }

    .contact .container .contactForm .formBox .inputBox.w50 {
        width: 100%;
    }
    
    .page-contact .container .contactForm .formBox .inputBox.w50 {
        width: 100%;
    }

    
    /* ---Subcribe Section */
    .subscribe-container::before {
        height: 10rem;
    }

    .subscribe-heading {
        left: 50%;
        transform: translateX(-50%);
    }

    form {
        border-radius: initial;
        transform: initial;
        box-shadow: none;
    }
} 


@media screen and (max-width: 768px) {
    .header .fa-bars {
        display: block;
        font-size: 2rem;
    }

    .header .navbar {
        position: fixed;
        top: -120%;
        left: 0;
        height: auto;
        width: 100%;
        background-color: #000;
        z-index: 1000;
        border-top: 1rem solid rgba(0, 0, 0, .3); 
    }

    .header .navbar ul {
        height: 100%;
        width: 100%;
        flex-flow: column;
    }

    .header .navbar ul li {
        margin: 1rem 0;
    }

     .header .navbar ul li a {
        color: #6e6e6a; 
        font-size: 1.5rem;
     }

     .header .fa-times {
        transform: rotate(108deg);  
     }

     .header .nav-toggle {
         top: 5.8rem;
        
     }

     #myVideo {
        height: 50%;
      }
      

     .hero-heading {
         padding: 0 40px;
         margin-top: 5rem;
     }

     .hero-heading p {
         font-size: 1.5rem;
         color: whitesmoke;
         font-weight: 300;
     }

     .header-btn {
         display: inline-block;
         padding: .5rem 2rem;
         border-radius: 5rem;
         font-size: 1.2rem;
         margin-top: 16px;
     }

     .hero-heading h1 {
         font-size: 3rem;
         text-transform: uppercase;
         color: transparent;
         -webkit-text-stroke: 1px #ffea00;
         letter-spacing: 3px;
         font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
     }

     .hero-heading h3 {
         font-size: 2rem;
         text-transform: capitalize;
         font-weight: bold;
     }

   /* --------Cloud */
   .cloud-sec {
       margin: 7rem 0;
       padding-top: 0;
   }

   .cloud-content h1 {
       font-size: 5rem;
       max-width: 480px;
   }

   .cloud-content p {
       margin-bottom: 80px;
       max-width: 550px;
       font-size: 2.2rem;
   }

   .features-group-2 {
       margin-left: 40px;
       margin-top: 50px;
       padding-bottom: 40px ;
   }

   .feature-1,
   .feature-2,
   .feature-3,
   .feature-4 {
       max-width: 650px;
       height: 420px;
       padding: 20px;
   }

   .features h3 {
       font-size: 1.3rem;
       padding: 15px 0 15px 0;
   }

   .features ul li {
       font-size: 20px;
   }

    /* -------Personalized */
    .section-title p {
        font-size: 32px;
        padding: 5px 0px 0px 0;
    }

    .sec-service h3 {
        font-size: 28px;
    }

    .sec-service i {
        font-size: 3rem;
        padding-top: 4rem;
    }

    .home-offer {
        margin-top: 15vmin;
        margin-bottom: 20vmin;
        clip-path: polygon(0 0, 100% 0, 100% 100%, 67% 98%, 0 100%) ;
    }

    /* ----Lightbulp */
    .sec3-header h1 {
        font-size: 2rem;
    }

    .sec-project h1 {
        font-size: 43px;
        font-weight: 600;
    }

    .sec-project p {
        font-size: 2.5rem;
        text-align: center;
    }

    /* ---Hosting */
    .sec-4-header {
        padding-top: 0rem;
    }

    .sec-4-header h1 {
        font-size: 3rem;
    }

    .sec-4-header p {
        font-size: 2rem;
        padding: 0 0;
    }

    .swiper-btn a {
        font-size: 30px;
        right: 25%;
    }

    .swiper-btn {
        margin-top: 4rem;
      
    }

    .sec-5-btn a {
        right: 35%;
    }

    .partner-item li {
        width: 100%;
        text-align: center;
        margin-bottom: 50px;
    }

    .partner-item > li img {
        max-width: 300px;
        width: 100%;
        height: auto;
        transition: all 0.3s ease;
        opacity: 1;
        padding-top: 3rem;
    }

    /* ----Service Page */
    .service-section {
        flex-direction: column;
    }

    .service-title {
        width: 100%;
    }

    .service-title i {
        font-size: 45px;
        color: #02d7dd;
        margin-left: 18rem;
    }

    .service-title2 {
        width: 100%;
    }

    .service-title2 i {
        font-size: 45px;
        color: #2a8d19;
        margin-left: 18.3rem;
    }

    .service-title3 {
        width: 100%;
    }

    .service-title3 i {
        font-size: 45px;
        color: #66696b;
        margin-left: 18.7rem;
    }

    .service-title4 {
        width: 100%;
    }

    .service-title4 i {
        font-size: 45px;
        color: #112d42;
        margin-left: 18rem;
    }

    .service-title5 {
        width: 100%;
    }

    .service-title5 i {
        font-size: 45px;
        color: #e6e22f;
        margin-left: 18rem;
    }

    .service-title6 {
        width: 100%;
    }

    .service-title6 i {
        font-size: 45px;
        color: #919088;
        margin-left: 18.7rem;
    }

    .service-title h1 {
        font-size: 35px;
    }

    .service-title2 h1 {
        font-size: 35px;
    }

    .service-title3 h1 {
        font-size: 35px;
    }

    .service-title4 h1 {
        font-size: 35px;
    }

    .service-title5 h1 {
        font-size: 35px;
    }

    .service-title6 h1 {
        font-size: 35px;
    }

     .service-section h2 {
         font-size: 2.2rem;
     }

     .service-info p {
         font-size: 34px;
     }

    /* ----Company Section */
  
     /* ----Contact Page */

     .contact .container .contactForm {
         padding: 25px;
     }

     .contact .container .contactinfo {
         padding: 25px;
         flex-direction: column;
         align-items: flex-start;
     }

     .contact .container .contactinfo .sci {
         margin-top: 40px;
     }

     .contact .container .contactForm .formBox .inputBox.w50 {
         width: 100%;
     }

     .page-contact .container .contactForm .formBox .inputBox input[type="submit"] {
         max-width: 150px;
         padding: 12px;
         font-size: 18px;
        
     }

     /* ---Subcribe Section */
     .subscribe-container::before {
         height: 10rem;
     }

     .subscribe-heading {
         left: 50%;
         transform: translateX(-50%);
     }

     form {
         border-radius: initial;
         transform: initial;
         box-shadow: none;
     }
}


@media screen and (max-width: 700px) {
    .hero-heading h1 {
        padding-top: 5vmin;
        font-size: 4em;
    }

    .header-btn {
        display: none;
      
    }

    .subscribe-container::before {
        height: 10rem;
    }

    .subscribe-heading {
        left: 50%;
        transform: translateX(-50%);
    }

    form {
        border-radius: initial;
        transform: initial;
        box-shadow: none;
    }
}

@media screen and (max-width: 600px){
    .contact .container .contactForm {
         padding: 25px;
    }

    .contact .container .contactinfo {
        padding: 25px;
        flex-direction: column;
        align-items: flex-start;
    }

    .contact .container .contactinfo .sci {
        margin-top: 40px;
    }

    .contact .container .contactForm .formBox .inputBox.w50 {
        width: 100%;
    }
}

@media  screen and (max-width: 576px) {
      /* ------Nav Section */
      .navbar .navbar-brand {
          font-size: 2rem;
      }

      .hero-heading h1 {
          padding-top: 8vmin;
          font-size: 4em;
      }

      .hero-heading p {
          font-size: 2em;
      }

      /* ------Cloud Section */
      .cloud-sec {
          margin: 5rem 0;
          padding-top: 0;
      }

      .cloud-content h1 {
          font-size: 4rem;
          max-width: 480px;
      }

      .cloud-content p {
          margin-bottom: 80px;
          max-width: 480px;
          font-size: 1.8rem;
      }

      .features-group-2 {
          margin-left: 0px;
          margin-top: 20px;
          /* padding-bottom: 50px; */
          align-items: center;
      }

      .feature-1,
      .feature-2,
      .feature-3,
      .feature-4 {
          max-width: 650px;
          height: 450px;
          padding: 40px;
          align-items: center;
          justify-content: center;
      }

      .features h3 {
          font-size: 1.6rem;
          padding: 15px 0 15px 0;
      }

      .features ul li {
          font-size: 20px;

      }

      .cloud-btn {
          display: block;
          padding: .8rem 0rem;
          text-align: center;
          align-items: center;
      }

      /* -------Personalized */
      .section-title p {
          font-size: 25px;
          padding: 8px 5px 0px 0;
      }

      .sec-service h3 {
          font-size: 24px;
      }

      .sec-service p {
          font-size: 22px;
          padding: 5px 90px 20px 0;
      }

      .section-title a {
          padding: 10px 35px;
          margin: 5rem 0;
          font-size: 16px;
      }

      .sec-service i {
          font-size: 2rem;
          padding-top: 2rem;
      }

      .home-offer {
          margin-top: 15vmin;
          margin-bottom: 20vmin;
          clip-path: polygon(0 0, 100% 0, 100% 100%, 67% 98%, 0 100%);
      }

      /* ----Lightbulp------- */
      .sec3-header h4 {
          font-size: 18px;
      }

      .sec3-header h1 {
          font-size: 1.8rem;
          padding-bottom: 25px;
          text-align: center;
          padding: 0 15px;
      }

      .items {
          width: 100%;
          margin-bottom: .3rem;
          padding: 0 15px;
      }

      .sec3-header h1 {
          font-size: 2rem;
      }

      .item-text {
          font-size: 1.2rem;
          margin-left: 1rem;
          text-align: left;
          padding: 0 22px;
      }

      .item-header i {
          font-size: 3rem;
          margin-right: 2rem;
          margin-left: 15px;
      }

      /* ---Hosting */
      .sec-4-header {
          padding-top: 0rem;
      }

      .sec-4-header h1 {
          font-size: 2rem;
      }

      .sec-4-header p {
          font-size: 1.2rem;
          padding: 0 0;
      }

      .swiper-btn a {
          font-size: 10px;
          right: 38% !important;
      }

      .swiper-btn {
          margin-top: .2rem;
      }

      .sec-5-btn a {
          right: 34%;
      }

      /* ---Partner Section */
      .partner-sec {
          padding-top: 5rem;
      }

      .partner-heading h1 {
          font-size: 3rem;
          font-weight: bold;
          color: #434a54;
      }

      .partner-heading p {
          font-size: 1.8rem;
          padding: 0 15px;
          margin-top: 1.2rem;
          font-weight: 300;
      }

      /*-------Work Together--  */
      .sec-5 {
          margin-top: 10rem;
          margin-bottom: 20rem;
      }

      .sec-5-header h1 {
          font-size: 3rem;
      }

      .sec-5-header p {
          font-size: 1.8rem;
          padding: 0 20px;
          margin-top: 1.2rem;
      }

      .sec-5-btn a {
          /* right: 45%; */
          color: #fff;
          font-size: 20px;
          padding: 18px 25px;
          margin-top: 2rem;
          align-items: center;
          text-align: center;
      }

      /* ----Service Page */
      .service-page {
          padding-bottom: 5rem;
      }

      .service-section {
          flex-direction: column;
      }

      .service-section h2 {
          font-size: 2.2rem;
      }

      .service-info p {
          font-size: 34px;
      }

      .service-title i {
          font-size: 45px;
          color: #02d7dd;
          margin-left: 18rem;
      }

      .service-title2 {
          width: 100%;
      }

      .service-title2 i {
          font-size: 45px;
          color: #2a8d19;
          margin-left: 18rem;
      }

      .service-title3 {
          width: 100%;
      }

      .service-title3 i {
          font-size: 45px;
          color: #66696b;
          margin-left: 19rem;
      }

      .service-title4 {
          width: 100%;
      }

      .service-title4 i {
          font-size: 45px;
          color: #112d42;
          margin-left: 18rem;
      }

      .service-title5 {
          width: 100%;
      }

      .service-title5 i {
          font-size: 45px;
          color: #e6e22f;
          margin-left: 18rem;
      }

      .service-title6 {
          width: 100%;
      }

      .service-title6 i {
          font-size: 45px;
          color: #919088;
          margin-left: 15rem;
      }

      .service-title h1 {
          font-size: 30px;
      }

      .service-title2 h1 {
          font-size: 30px;
      }

      .service-title3 h1 {
          font-size: 30px;
      }

      .service-title4 h1 {
          font-size: 30px;
      }

      .service-title5 h1 {
          font-size: 30px;
      }

      .service-title6 h1 {
          font-size: 30px;
      }

      .page-contact .container .contactForm .formBox .inputBox input[type="submit"] {
          max-width: 150px;
          padding: 12px;
          font-size: 18px;
      }
}

@media screen and (max-width: 541px) {
    /* ------Nav Section */
    .navbar .navbar-brand {
        font-size: 2.2rem;
    }

    .hero-heading h1 {
        padding-top: 8vmin;
        font-size: 2.2rem;
    }

    .hero-heading p {
        font-size: 1.4rem;
    }

    .header .header-logo {
        cursor: pointer;
        margin-left: 1rem;
        max-width: 300px;
        width: 100%;
    }

    /* ------Cloud Section */
    .cloud-sec {
        margin: 5rem 0;
        padding-top: 0;
    }

    .cloud-content h1 {
        font-size: 4rem;
        max-width: 480px;
    }

    .cloud-content p {
        margin-bottom: 80px;
        max-width: 550px;
        font-size: 1.3rem;
    }

    .features-group-2 {
        margin-left: 0px; 
        margin-top: 20px; 
    }

    .feature-1,
    .feature-2,
    .feature-3,
    .feature-4 {
        max-width: 650px;
        height: 420px;
        padding: 20px;
        align-items: center;
        justify-content: center;
    }

    .features h3 {
        font-size: 1.4rem;
        padding: 15px 0 15px 0;
    }

    .features ul li {
        font-size: 20px;
        
    }

    .cloud-btn {
        display: block;
        padding: .8rem 0rem;
        text-align: center;
        align-items: center;
    }


    /* -------Personalized */
    .section-title p {
        font-size: 1.3rem;
        padding: 5px 0px 0px 0;
    }

    .sec-service h3 {
        font-size: 28px;
    }

    .sec-service i {
        font-size: 3rem;
        padding-top: 4rem;
    }

    .home-offer {
        margin-top: 15vmin;
        margin-bottom: 20vmin;
        clip-path: polygon(0 0, 100% 0, 100% 100%, 67% 98%, 0 100%);
    }

    /* ----Lightbulp */


    .items {
        width: 100%;
        margin-bottom: 1rem !important;
        padding: 0 5px;
    }
    .sec3-header h1 {
        font-size: 2rem;
    }

    .sec-project h1 {
        font-size: 43px;
        font-weight: 600;
    }

    .sec-project p {
        font-size: 2.5rem;
        text-align: center;
    }

    /* ---Hosting */
    .sec-4-header {
        padding-top: 0rem;
    }

    .sec-4-header h1 {
        font-size: 2rem;
    }

    .sec-4-header p {
        font-size: 1.2rem;
        padding: 0 0;
    }

    .swiper-btn a {
        font-size: 10px;
        right: 38% !important;
    }

    .swiper-btn {
        margin-top: .2rem;
    }

    .sec-5-btn a {
        right: 34%;
    }

    /* ----Service Page */
    .service-page {
        padding-bottom: 5rem;
    }

    .service h1 {
        padding-top: .8rem;
        font-size: 2.5rem;
    }

    .serv-feature-sec {
        margin-top: 7rem;
        margin-bottom: 7rem;
    }

    .serv-feature-heading h6 {
        font-size: 24px;
    }

    .serv-feature-heading p {
        font-size: 1.8rem;
        padding-bottom: 15px;
    }

    .service-section {
        flex-direction: column;
    }

    .service-section h2 {
        font-size: 1.6rem;
    }

    .service-info p {
        font-size: 25px;
    }

    .service-goal p {
       font-size: 1.8rem; 
    }

    .service-title i {
        font-size: 45px;
        color: #02d7dd;
        margin-left: 12rem;
    }

    .service-title2 {
        width: 100%;
    }

    .service-title2 i {
        font-size: 45px;
        color: #2a8d19;
        margin-left: 12rem;
    }

    .service-title3 {
        width: 100%;
    }

    .service-title3 i {
        font-size: 45px;
        color: #66696b;
        margin-left: 13rem;
    }

    .service-title4 {
        width: 100%;
    }

    .service-title4 i {
        font-size: 45px;
        color: #112d42;
        margin-left: 12rem;
    }

    .service-title5 {
        width: 100%;
    }

    .service-title5 i {
        font-size: 45px;
        color: #e6e22f;
        margin-left: 12rem;
    }

    .service-title6 {
        width: 100%;
    }

    .service-title6 i {
        font-size: 45px;
        color: #919088;
        margin-left: 12.5rem;
    }

    .service-title h1 {
        font-size: 25px;
    }

    .service-title2 h1 {
        font-size: 25px;
    }

    .service-title3 h1 {
        font-size: 25px;
    }

    .service-title4 h1 {
        font-size: 25px;
    }

    .service-title5 h1 {
        font-size: 25px;
    }

    .service-title6 h1 {
        font-size: 25px;
    }

    /* -------Company Page */
    .quot {
        height: 90vh;
        border-radius: 20%;
    }

    .quot-heading h2 {
        font-size: 1.4rem;
        padding: 50px 10px;
    }

    .quot-heading h3 {
        margin-left: 0em;
        padding-bottom: 15px;
        font-size: 27px;
    }

    .quot-heading i {
        font-size: 25px;
    }

    .company {
        margin-top: 15rem;
    }

    .about-company {
        flex-direction: column;
        padding: 0 10px;
    }

    .about-company:nth-child(2) {
        flex-direction: column-reverse;
    }

    .about-heading h1 {
        font-size: 3rem;
    }

    .about-heading h5 {
        font-size: 1.2rem;
    }

    .family {
        font-size: 1.3rem;
        max-width: 700px;
    }

    #aboutVideo {
        width: 100%;
        max-width: 1550px;
        padding-left: 0rem;
        border-radius: 20px;
        margin-top: 3rem;
        justify-content: center;
        padding: 0 10px;
        align-items: center;
    }

    .vision {
        margin-top: 8rem;
    }

    .vision img {
        max-width: 1250px;
    }

    .vision-heading {
        padding-left: 0rem;
    }

    .vision-heading h1 {
        font-size: 3rem;
    }

    .vision-heading p {
        font-size: 1.3rem;
        padding-bottom: 2rem;
    }

    .values {
        margin-top: 6rem;
        margin-bottom: 8rem;
    }

    .values-heading h1 {
        font-size: 3rem;
    }

    .values-heading {
        margin-top: 0rem;
    }

    .values-heading p {
        font-size: 1.3rem;
        padding-bottom: 2rem;
    }

    .values img {
        margin-left: 0rem;
    }

    /* ---Contact Page */
   
    .contact .container .contactForm {
        padding: 25px;
    }

    .contact .container .contactinfo {
        padding: 25px;
        flex-direction: column;
        align-items: flex-start;
       
    }

    .contact .container .contactinfo .sci {
        margin-top: 40px;
    }

    .contact .container .contactForm .formBox .inputBox.w50 {
        width: 100%;
    }

    .page-contact .container .contactForm .formBox .inputBox input[type="submit"] {
        max-width: 150px;
        padding: 12px;
        font-size: 18px;
       
    }

    /* ---Subcribe Section */
    .letter .news h1 {
        font-size: 2.3rem;
   }

   .letter .news p {
    font-size: 1.3rem;
    color: #6e6e6a;
}

   
    .subscribe {
        margin-top: 15vmin; 
        margin-bottom: 35vmin;
    }

    .subscribe-heading {
      text-align: center !important;
      padding-top: 0;
      left: 10rem;
      top: 2rem;
    }


    /* ----Footer */
    .footer-logo a {
        font-size: 2.5rem;
        padding-top: 1.2rem;
    }
}


@media screen and (max-width: 500px) {
    .items {
        width: 20rem;
    }
}


@media screen and (max-width: 414px) {

    .service h1 {
        font-size: 2rem !important;
    }

    /* ------Nav Section */
    .navbar .navbar-brand {
        font-size: 1.7rem;
    }

    .header .fa-bars {
        font-size: 1.5rem;
    }

    .hero-heading h1 {
        padding-top: 5rem;
        font-size: 1.5rem;
    }

    .hero-heading p {
        font-size: 1rem;
    }

    /* ------Cloud Section */
    .cloud-sec {
        margin: 1rem 0;
        padding-top: 0;
        padding-bottom: 5rem;
    }

    .cloud-content h1 {
        font-size: 4rem;
        max-width: 480px;
    }

    .cloud-content p {
        margin-bottom: 80px;
        max-width: 480px;
        font-size: 1.8rem;
    }

    .features-group-2 {
        margin-left: 0px;
        margin-top: 20px;
        /* padding-bottom: 50px; */
        align-items: center;
    }

    .feature-1,
    .feature-2,
    .feature-3,
    .feature-4 {
        max-width: 650px;
        height: 450px;
        padding: 40px;
        align-items: center;
        justify-content: center;
    }

    .features h3 {
        font-size: 1.3rem;
        padding: 15px 0 15px 0;
    }

    .features ul li {
        font-size: 20px;

    }

    .cloud-btn {
        display: block;
        padding: .8rem 0rem;
        text-align: center;
        align-items: center;
    }


    /* -------Personalized */
    .section-title h1 {
        font-size: 3rem;
        padding: 8px 0;
        padding-top: 4rem;
        filter: invert(1);
        opacity: 0.5;
    }

    .section-title p {
        font-size: 25px;
        padding: 8px 5px 0px 0;
    }

    .sec-service h3 {
        font-size: 24px;
    }

    .sec-service p {
        font-size: 22px;
        padding: 5px 90px 20px 0;
    }

    .section-title a {
        padding: 10px 35px;
        margin: 5rem 0;
        font-size: 16px;
    }

    .sec-service i {
        font-size: 2rem;
        padding-top: 2rem;
    }

    .home-offer {
        margin-top: 15vmin;
        margin-bottom: 20vmin;
        clip-path: polygon(0 0, 100% 0, 100% 100%, 67% 98%, 0 100%);
    }

    /* ----Lightbulp------- */
    .section-3 {
        margin: 3rem 0;
       
    }
    .sec3-header h4 {
        font-size: 18px;
    }

    .sec3-header h1 {
        font-size: 1.8rem;
        padding-bottom: 25px;
        text-align: center;
        padding: 0 15px;
    }

    .item-header h3 {
        font-size: 1.8rem;
        line-height: 2rem;
        font-weight: bold;
        margin-bottom: 1.5rem;
        margin-top: 1.4rem;
    }

    .items {
        width: 100%;
        margin-bottom: .3rem;
        padding: 0 15px;
    }

    .sec3-header h1 {
        font-size: 2rem;
    }

    .item-text {
        font-size: 1.2rem;
        margin-left: 1rem;
        text-align: left;
        padding: 0 22px;
    }

    .item-header i {
        font-size: 3rem;
        margin-right: 2rem;
        margin-left: 15px;
    }


    /* ---Hosting */
    .section-4 {
        margin-top: 5rem;
    }

    .sec-4-header {
        padding-top: 0rem;
    }

    .sec-4-header h1 {
        font-size: 1.5rem;
        padding-top: 2rem;
    }

    .sec-4-header p {
        font-size: 1.2rem;
        padding: 0 0;
    }


    .item p {
        color: #0c002b;
        line-height: 25px;
        margin: 10px;
        padding-bottom: 20px;
        font-size: 1.6rem;
    }

    .item img {
        width: 100%;
        height: 100px;
        object-fit: cover;
        border-radius: 20px 20px 0 0;
    }


    .swiper-btn a {
        font-size: 10px;
        right: 34% !important;
    }

    .swiper-btn {
        margin-top: .2rem;
    }

    .sec-5-btn a {
        right: 34%;
    }

    /* ---Partner Section */
    .partner-sec {
        padding-top: 5rem;
    }

    .partner-heading h1 {
        font-size: 3rem;
        font-weight: bold;
        color: #434a54;
    }

    .partner-heading p {
        font-size: 1.8rem;
        padding: 0 15px;
        margin-top: 1.2rem;
        font-weight: 300;
    }

    .partner-item li {
        width: 100%;
        text-align: center;
        margin-bottom: 50px;
    }

    .partner-item > li img {
        max-width: 300px;
        width: 100%;
        height: auto;
        transition: all 0.3s ease;
        opacity: 1;
        padding-top: 3rem;
    }

    /*-------Work Together--  */
    .sec-5 {
        margin-top: 10rem;
        margin-bottom: 20rem;
    }

    .sec-5-header h1 {
        font-size: 3rem;
    }

    .sec-5-header p {
        font-size: 1.8rem;
        padding: 0 20px;
        margin-top: 1.2rem;
    }

    .sec-5-btn a {
        right: 21%;
        color: #fff;
        font-size: 20px;
        padding: 18px 25px;
        margin-top: 2rem;
        align-items: center;
        text-align: center;
    }

    /* ----Service Page */
    .fa-cog {
        font-size: 25rem;
    }

    .service-project {
        margin-top: 10em;
    }

    /* .service-goal  p {
        font-size: 16px;
    } */

    .service-page {
        padding-bottom: 5rem;
    }

    .service h1 {
        font-size: 3rem;
        padding-top: 0;
        margin-top: 0;
    }

    .service-section {
        flex-direction: column;
    }

    .service-section h2 {
        font-size: 1.2rem;
    }

    .service-info p {
        font-size: 25px;
    }

    .service-info {
        padding: 50px 20px;
    }

    .service-title i {
        font-size: 45px;
        color: #02d7dd;
        margin-left: 8rem;
    } 

    .service-title2 {
        width: 100%;
    }

    .service-title2 i {
        font-size: 45px;
        color: #2a8d19;
        margin-left: 8rem;
    }

    .service-title3 {
        width: 100%;
    }

    .service-title3 i {
        font-size: 45px;
        color: #66696b;
        margin-left: 9rem;
    }

    .service-title4 {
        width: 100%;
    }

    .service-title4 i {
        font-size: 45px;
        color: #112d42;
        margin-left: 8rem;
    }

    .service-title5 {
        width: 100%;
    }

    .service-title5 i {
        font-size: 45px;
        color: #e6e22f;
        margin-left: 8rem;
    }

    .service-title6 {
        width: 100%;
    }

    .service-title6 i {
        font-size: 45px;
        color: #919088;
        margin-left: 9rem;
    }

    .service-title h1 {
        font-size: 25px;
    }

    .service-title2 h1 {
        font-size: 25px;
    }

    .service-title3 h1 {
        font-size: 25px;
    }

    .service-title4 h1 {
        font-size: 25px;
    }

    .service-title5 h1 {
        font-size: 25px;
    }

    .service-title6 h1 {
        font-size: 25px;
    }

     .page-contact .container .contactForm .formBox .inputBox input[type="submit"] {
         max-width: 150px;
         padding: 12px;
         font-size: 18px;
         /* margin-left: 5em; */
     }

     .read-more-btn {
        font-size: 16px;
     }

     /* ------Company Section */
     .quot {
         height: 90vh;
         border-radius: 20%;
     }

     .quot-heading h2 {
         padding: 27px 17px;
         font-size: 20px;
     }

     .quot-heading h3 {
         margin-left: 0em;
     }

     .quot-heading i {
         font-size: 20px;
     }

     .company {
         margin-top: 10rem;
     }

     .about-company {
         flex-direction: column;
         padding: 0 10px;
     }

     .about-company:nth-child(2) {
         flex-direction: column-reverse;
     }

     .family {
         font-size: 1.4rem;
         max-width: 400px;
     }

     #aboutVideo {
         width: 100%;
         max-width: 1550px;
         padding-left: 0rem;
         border-radius: 20px;
         margin-top: 3rem;
         justify-content: center;
         padding: 0 10px;
         align-items: center;
     }

     .vision {
         margin-top: 8rem;
     }

     .vision img {
         max-width: 1250px;
     }

     .vision-heading {
         padding-left: 0rem;
     }

     .vision-heading p {
         font-size: 1.4rem;
     }

     .values {
         margin-top: 6rem;
         margin-bottom: 8rem;
     }

     .values-heading {
         margin-top: 0rem;
     }

     .values-heading p {
         font-size: 1.2rem;
         font-family: 300;
         color: #333;
         max-width: 1050px;
     }

     .values img {
         margin-left: 0rem;
     }

     
    /* ----Contact */
    .page-contact .container .contactForm {
        padding: 50px 50px;
        background: #fff;
        margin-left: 0px;
        width: 100%;
        height: 100%;
        box-shadow: 0 50px 50px rgba(0, 0, 0, 0.5);
        margin-bottom: 18vmin;
        border-radius: 20px;
        padding-left: 0;
    }

    .page-contact .container .contactForm .formBox .inputBox input[type="submit"] {
        max-width: 150px;
        padding: 12px;
        font-size: 18px;
    }

    .letter .news h1 {
        font-size: 3rem;
   }
   
   .letter .news p {
       font-size: 1.2rem;
   }

   .subscribe-heading {
    font-size: 2rem;
    top: 2rem;
    text-align: center;
    }

    /* ----Footer-- */
    .footer-logo a {
        font-size: 2.8rem;
        padding-top: .5rem;
    }

    #footer .copyright {
        font-size: 1rem;
    }
    

}

@media screen and (max-width: 415px) {
    .service h1 {
        font-size: 2rem !important;
    }

    /* ------Nav Section */
    .navbar .navbar-brand {
        font-size: 1.7rem;
    }

    .header .fa-bars {
        font-size: 1.5rem;
    }

    .hero-heading h1 {
        padding-top: 5rem;
        font-size: 1.5rem;
    }

    .hero-heading p {
        font-size: 1rem;
    }

      .header .header-logo {
          cursor: pointer;
          margin-left: 1rem;
          max-width: 200px;
          width: 100%;
      }

    /* ------Cloud Section */
    .cloud-sec {
        margin: 1rem 0;
        padding-top: 0;
        padding-bottom: 5rem;
    }

    .cloud-content h1 {
        font-size: 4rem;
        max-width: 480px;
    }

    .cloud-content p {
        margin-bottom: 80px;
        max-width: 480px;
        font-size: 1.8rem;
    }

    .features-group-2 {
        margin-left: 0px;
        margin-top: 20px;
        /* padding-bottom: 50px; */
        align-items: center;
    }

    .feature-1,
    .feature-2,
    .feature-3,
    .feature-4 {
        max-width: 650px;
        height: 450px;
        padding: 40px;
        align-items: center;
        justify-content: center;
    }

    .features h3 {
        font-size: 1.3rem;
        padding: 15px 0 15px 0;
    }

    .features ul li {
        font-size: 20px;

    }

    .cloud-btn {
        display: block;
        padding: .8rem 0rem;
        text-align: center;
        align-items: center;
    }


    /* -------Personalized */
    .section-title h1 {
        font-size: 3rem;
        padding: 8px 0;
        padding-top: 4rem;
        filter: invert(1);
        opacity: 0.5;
    }

    .section-title p {
        font-size: 25px;
        padding: 8px 5px 0px 0;
    }

    .sec-service h3 {
        font-size: 24px;
    }

    .sec-service p {
        font-size: 22px;
        padding: 5px 90px 20px 0;
    }

    .section-title a {
        padding: 10px 35px;
        margin: 5rem 0;
        font-size: 16px;
    }

    .sec-service i {
        font-size: 2rem;
        padding-top: 2rem;
    }

    .home-offer {
        margin-top: 15vmin;
        margin-bottom: 20vmin;
        clip-path: polygon(0 0, 100% 0, 100% 100%, 67% 98%, 0 100%);
    }

    /* ----Lightbulp------- */
    .sec3-header h4 {
        font-size: 18px;
    }

    .sec3-header h1 {
        font-size: 1.8rem;
        padding-bottom: 25px;
        text-align: center;
        padding: 0 15px;
    }

    .item-header h3 {
        font-size: 1.8rem;
        line-height: 2rem;
        font-weight: bold;
        margin-bottom: 1.5rem;
        margin-top: 1.4rem;
    }

    .items {
        width: 100%;
        margin-bottom: .3rem;
        padding: 0 15px;
    }

    .sec3-header h1 {
        font-size: 2rem;
    }

    .item-text {
        font-size: 1.2rem;
        margin-left: 1rem;
        text-align: left;
        padding: 0 22px;
    }

    .item-header i {
        font-size: 3rem;
        margin-right: 2rem;
        margin-left: 15px;
    }


    /* ---Hosting */
    .sec-4-header {
        padding-top: 0rem;
    }

    .sec-4-header h1 {
        font-size: 1.5rem;
        padding-top: 2rem;
    }

    .sec-4-header p {
        font-size: 1.2rem;
        padding: 0 0;
    }


    .item p {
        color: #0c002b;
        line-height: 25px;
        margin: 10px;
        padding-bottom: 20px;
        font-size: 1.6rem;
    }

    .item img {
        width: 100%;
        height: 100px;
        object-fit: cover;
        border-radius: 20px 20px 0 0;
    }


    .swiper-btn a {
        font-size: 10px;
        right: 34% !important;
    }

    .swiper-btn {
        margin-top: .2rem;
    }

    .sec-5-btn a {
        right: 34%;
    }

    /* ---Partner Section */
    .partner-sec {
        padding-top: 5rem;
    }

    .partner-heading h1 {
        font-size: 3rem;
        font-weight: bold;
        color: #434a54;
    }

    .partner-heading p {
        font-size: 1.8rem;
        padding: 0 15px;
        margin-top: 1.2rem;
        font-weight: 300;
    }

    .partner-item li {
        width: 100%;
        text-align: center;
        margin-bottom: 50px;
    }

    .partner-item > li img {
        max-width: 300px;
        width: 100%;
        height: auto;
        transition: all 0.3s ease;
        opacity: 1;
        padding-top: 3rem;
    }

    /*-------Work Together--  */
    .sec-5 {
        margin-top: 10rem;
        margin-bottom: 20rem;
    }

    .sec-5-header h1 {
        font-size: 3rem;
    }

    .sec-5-header p {
        font-size: 1.8rem;
        padding: 0 20px;
        margin-top: 1.2rem;
    }

    .sec-5-btn a {
        right: 21%;
        color: #fff;
        font-size: 20px;
        padding: 18px 25px;
        margin-top: 2rem;
        align-items: center;
        text-align: center;
    }

    /* ----Service Page */
    .fa-cog {
        font-size: 25rem;
    }

    .service-project {
        margin-top: 10em;
    }

    /* .service-goal  p {
        font-size: 16px;
    } */

    .service-page {
        padding-bottom: 5rem;
    }

    .service h1 {
        font-size: 3rem;
        padding-top: 0;
        margin-top: 0;
    }

    .service-section {
        flex-direction: column;
    }

    .service-section h2 {
        font-size: 1.2rem;
    }

    .service-info p {
        font-size: 25px;
    }

    .service-info {
        padding: 50px 20px;
    }

    .service-title i {
        font-size: 45px;
        color: #02d7dd;
        margin-left: 8rem;
    } 

    .service-title2 {
        width: 100%;
    }

    .service-title2 i {
        font-size: 45px;
        color: #2a8d19;
        margin-left: 8rem;
    }

    .service-title3 {
        width: 100%;
    }

    .service-title3 i {
        font-size: 45px;
        color: #66696b;
        margin-left: 9rem;
    }

    .service-title4 {
        width: 100%;
    }

    .service-title4 i {
        font-size: 45px;
        color: #112d42;
        margin-left: 8rem;
    }

    .service-title5 {
        width: 100%;
    }

    .service-title5 i {
        font-size: 45px;
        color: #e6e22f;
        margin-left: 8rem;
    }

    .service-title6 {
        width: 100%;
    }

    .service-title6 i {
        font-size: 45px;
        color: #919088;
        margin-left: 9rem;
    }

    .service-title h1 {
        font-size: 25px;
    }

    .service-title2 h1 {
        font-size: 25px;
    }

    .service-title3 h1 {
        font-size: 25px;
    }

    .service-title4 h1 {
        font-size: 25px;
    }

    .service-title5 h1 {
        font-size: 25px;
    }

    .service-title6 h1 {
        font-size: 25px;
    }

     .page-contact .container .contactForm .formBox .inputBox input[type="submit"] {
         max-width: 150px;
         padding: 12px;
         font-size: 18px;
         /* margin-left: 5em; */
     }

     .read-more-btn {
        font-size: 16px;
     }

     /* ------Company Section */
     .quot {
         height: 90vh;
         border-radius: 20%;
     }

     .quot-heading h2 {
         padding: 27px 17px;
         font-size: 20px;
     }

     .quot-heading h3 {
         margin-left: 0em;
     }

     .quot-heading i {
         font-size: 20px;
     }

     .company {
         margin-top: 10rem;
     }

     .about-company {
         flex-direction: column;
         padding: 0 10px;
     }

     .about-company:nth-child(2) {
         flex-direction: column-reverse;
     }

     .family {
         font-size: 1.4rem;
         max-width: 400px;
     }

     #aboutVideo {
         width: 100%;
         max-width: 1550px;
         padding-left: 0rem;
         border-radius: 20px;
         margin-top: 3rem;
         justify-content: center;
         padding: 0 10px;
         align-items: center;
     }

     .vision {
         margin-top: 8rem;
     }

     .vision img {
         max-width: 1250px;
     }

     .vision-heading {
         padding-left: 0rem;
     }

     .vision-heading p {
         font-size: 1.4rem;
     }

     .values {
         margin-top: 6rem;
         margin-bottom: 8rem;
     }

     .values-heading {
         margin-top: 0rem;
     }

     .values-heading p {
         font-size: 1.2rem;
         font-family: 300;
         color: #333;
         max-width: 1050px;
     }

     .values img {
         margin-left: 0rem;
     }

     
    /* ----Contact */
    .page-contact .container .contactForm {
        padding: 50px 50px;
        background: #fff;
        margin-left: 0px;
        width: 100%;
        height: 100%;
        box-shadow: 0 50px 50px rgba(0, 0, 0, 0.5);
        margin-bottom: 18vmin;
        border-radius: 20px;
        padding-left: 0;
    }

    .page-contact .container .contactForm .formBox .inputBox input[type="submit"] {
        max-width: 150px;
        padding: 12px;
        font-size: 18px;
    }

    .letter .news h1 {
        font-size: 3rem;
   }
   
   .letter .news p {
       font-size: 1.2rem;
   }

   .subscribe-heading {
    font-size: 2rem;
    top: 2rem;
    text-align: center;
    }

    /* ----Footer-- */
    .footer-logo a {
        font-size: 2.8rem;
        padding-top: .5rem;
    }

    #footer .copyright {
        font-size: 1rem;
    }
    
    
}

@media  screen and (max-width: 412px) {
    .header .fa-bars {
        font-size: 1.5rem;
    }

    .hero-heading {
        padding: 0 10px;
        margin-top: 4rem;
    }

    .hero-heading p {
        font-size: 1.2rem;
    }
    
    .hero-heading h1 {
        font-size: 1.5rem;
    }

     .header .header-logo {
         cursor: pointer;
         margin-left: 1rem;
         max-width: 200px;
         width: 100%;
     }

    /* -----------Cloud Section */
    .cloud-sec {
        margin: 2rem 0;
        padding-bottom: 10rem;
    }


    .features-group-2 {
        margin-left: 0px;
        margin-top: 20px;
        padding-bottom: 40px;
    }
    
    .feature-1,
    .feature-2,
    .feature-3,
    .feature-4 {
        max-width: 450px;
        height: 400px;
        padding: 20px;
    }

    .features h3 {
        font-size: 1.3rem;  
    }

    .section-title p {
        font-size: 18px;
        padding: 5px 5px 5px 0;
        font-weight: 300;
        color: whitesmoke;
        margin-bottom: 2em;
    }

    .sec-service p {
        padding: 5px 5px 5px 0;

    }

    /* -------Item Section Home Section-3---- */
    .section-3 {
        margin-bottom: 2rem;
    
    }

    /* -----Section-4---Hosting-- */
    .section-4 {
        margin-top: 5rem;
    }
    
}

@media screen and (max-width: 376px) {
   

    .header .fa-bars {
        font-size: 1.5rem;
    }

    .hero-heading {
        padding: 0 20px;
        margin-top: 5rem;
    }

    .hero-heading p {
        font-size: 1rem;
    }
    
    .hero-heading h1 {
        font-size: 1.5rem;
    }

     .header .header-logo {
         cursor: pointer;
         margin-left: 1rem;
         max-width: 200px;
         width: 100%;
     }

    /* -----------Cloud Section */
    .cloud-sec {
        margin:10rem 0;
        padding-top: 0vh;
        margin-bottom: 2rem;
    }

    .cloud-content h1 {
        margin-top: 130px;
        font-size: 3rem;
    }

    .cloud-content p {
        font-size: 1.3rem;
    }

    .features-group-2 {
        margin-left: 0px;
    }
    
    .feature-1,
    .feature-2,
    .feature-3,
    .feature-4 {
        max-width: 450px;
        height: 370px;
        padding: 20px;
    }

    .features h3 {
        font-size: 1.2rem;
    }
    
    .features ul li {
       font-size: 1.2rem;
    }

    /* -----Personalized Tech Guid */
    .section-title h1 {
        font-size: 2.8rem;
    }
    
    .section-title p {
        font-size: 1.2rem;
        padding: 5px 20px 20px 0;
    }
    
    .section-title  {
      margin-bottom: 2rem;
    }

    /* -------Item Section Home Section-3---- */
    .section-3 {
        margin: 8rem 0;
        width: 100%;
        margin-bottom: 3rem;
    }

    .sec3-header h4 {
        font-size: 18px;
    }

    .sec3-header h1 {
        font-size: 1.3rem;
        padding-bottom: 15px;
    }

    .items-sec {
        margin-top: 2rem;
    }
    
    .item-header i {
        font-size: 2.2rem;
        margin-right: 1rem;
    }
    
    .item-header h3 {
        margin-bottom: .5rem;
        margin-top: .5rem;
    }

    /* -----Section-4---Hosting-- */
    .section-4 {
        margin-bottom: 20vmin;
        margin-top: 0rem;
    }

    .hosting-header h1{
        padding-top: 2rem;
        font-size: 2.5rem;
    }

    .hosting-header p {
        opacity: 0.5;
        font-size: 1.3rem;
    }

    .card-base {
        width: 350px;
        height: 430px;
        margin: 20px;
    }

    /* -----Partner Section */
    .partner-sec {
        padding-bottom: 6rem;
    }

    .partner-heading h1 {
        font-size: 3rem;
    }
    
    .partner-heading p {
        font-size: 1.3rem;
    }

    /* ------Sec-5---Work Together---- */
    .sec-5 {
        margin-top: 2rem ;
        margin-bottom: 12rem ;
    }

    .sec-5-header h1 {
        font-size: 3rem;
    }

    .sec-5-header p {
        font-size: 1.2rem;
        padding: 0 0px;
        margin-top: 1.2rem;
        font-weight: 300;
        color: #6e6e6a;
    }

    .sec-service h3 {
        font-size: 1.3rem;
    }
    
    .sec-service p {
        padding: 5px 0px 0px 0;
        font-size: 1.2rem;
    }

    .sec-5-btn a {
        font-size: 16px;
        letter-spacing: 4px;
        padding: 15px 15px;
    }

    /* -----Footer */
    .footer-logo a {
        font-size: 2.5rem;
        padding-top: 0rem;
    }

    #footer .copyright {
       font-size: .8rem;
    }
    

    /* ----Service Page */
    .fa-cog {
        font-size: 25rem;
    }

    .service-project {
        margin-top: 10em;
    }

    .service-goal p {
        font-size: 1.6rem;
    }

    .service-page {
        padding-bottom: 5rem;
    }

    .service h1 {
        font-size: 3rem;
        padding-top: 0;
        margin-top: 0;
    }

    .service-section {
        flex-direction: column;
    }

    .service-section h2 {
        font-size: 1.2rem;
    }

    .service-info p {
        font-size: 25px;
    }

    .service-info {
        padding: 50px 20px;
    }

    .service-title i {
        font-size: 45px;
        color: #02d7dd;
        margin-left: 7rem;
    }

    .service-title2 {
        width: 100%;
    }

    .service-title2 i {
        font-size: 45px;
        color: #2a8d19;
        margin-left: 7rem;
    }

    .service-title3 {
        width: 100%;
    }

    .service-title3 i {
        font-size: 45px;
        color: #66696b;
        margin-left: 8rem;
    }

    .service-title4 {
        width: 100%;
    }

    .service-title4 i {
        font-size: 45px;
        color: #112d42;
        margin-left: 7rem;
    }

    .service-title5 {
        width: 100%;
    }

    .service-title5 i {
        font-size: 45px;
        color: #e6e22f;
        margin-left: 7rem;
    }

    .service-title6 {
        width: 100%;
    }

    .service-title6 i {
        font-size: 45px;
        color: #919088;
        margin-left: 8rem;
    }

    .service-title h1 {
        font-size: 25px;
    }

    .service-title2 h1 {
        font-size: 25px;
    }

    .service-title3 h1 {
        font-size: 25px;
    }

    .service-title4 h1 {
        font-size: 25px;
    }

    .service-title5 h1 {
        font-size: 25px;
    }

    .service-title6 h1 {
        font-size: 25px;
    }

    .page-contact {
        margin-top: 2rem;
    }

    .page-contact .container .contactForm h1 {
        font-size: 2.5rem;
    }

    .page-contact .container .contactForm .formBox .inputBox input[type="submit"] {
        max-width: 150px;
        padding: 12px;
        font-size: 18px;
        margin-left: 3.5em;
    }

    .read-more-btn {
        font-size: 16px;
    }

     /* ------Company Section */
     .quot {
         height: auto;
         border-radius: 20%;
     }

     .quot-heading h2 {
         padding: 25px 0;
         font-size: 20px;
     }

     .quot-heading h3 {
         margin-left: 0em;
     }

     .quot-heading i {
         font-size: 20px;
     }

     .company {
          margin-top: 10rem;
     }
     .about-company {
         flex-direction: column;
         padding: 0 10px;
     }

     .about-company:nth-child(2) {
         flex-direction: column-reverse;
     }

     .family {
        font-size: 1.2rem;
        max-width: 400px;
     }

     #aboutVideo {
         width: 100%;
         max-width: 1550px;
         padding-left: 0rem;
         border-radius: 20px;
         margin-top: 3rem;
         justify-content: center;
         padding: 0 10px;
         align-items: center;
     }

     .vision {
         margin-top: 8rem;
     }

     .vision img {
         max-width: 1250px;
     }

     .vision-heading {
         padding-left: 0rem;
     }

     .vision-heading p {
         font-size: 1.2rem;
     }

     .values {
         margin-top: 6rem;
         margin-bottom: 8rem;
     }

     .values-heading {
         margin-top: 0rem;
     }

     .values-heading p {
         font-size: 1.2rem;
         font-family: 300;
         color: #333;
         max-width: 1050px;
     }

     .values img {
         margin-left: 0rem;
     }

     /* ------Contact Page */
     .contact-header {
         margin: 5vmin 0;
         padding-top: 5rem !important;
         margin-bottom: 10rem;
     }

     .contact {
         background: none;
     }

     .contact::before {
         background: none;
     }

     .contact-service {
         padding: 2px;
     }

     .contact-service h1 {
         font-size: 2.5rem;
     }

     .contact-service p {
         font-size: 1.2rem;
     }

     .contact-img {
        width: 100%;
     }

     .company-service {
         margin-top: 20vmin;
     }

     .company-title {
         text-align: center;
         font-size: 1.6rem;
     }

     .company-service ul li {
         margin: 10px 0;
     }

     .contact-flex {
        flex-direction: column-reverse;
     }

     .letter .news h1 {
         font-size: 2.2rem;
     }

     .letter .news p {
         font-size: 1.2rem;
        padding-bottom: 3rem;    
     }

     .subscribe-group button {
         margin-left: 5rem;
     }

}


@media screen and (max-width: 375px) {
  
    .header .header-logo {
        cursor: pointer;
        margin-left: 1rem;
        max-width: 200px ;
        width: 100%;
    }

    .header .fa-bars {
        font-size: 1.5rem;
    }

    .hero-heading {
        padding: 0 20px;
        margin-top: 5rem;
    }

    .hero-heading p {
        font-size: 1rem;
    }
    
    .hero-heading h1 {
        font-size: 1.5rem;
    }

   

    /* -----------Cloud Section */
    .cloud-sec {
        margin:10rem 0;
        padding-top: 0vh;
        margin-bottom: 2rem;
    }

    .cloud-content h1 {
        margin-top: 130px;
        font-size: 3rem;
    }

    .cloud-content p {
        font-size: 1.3rem;
    }

    .features-group-2 {
        margin-left: 0px;
        /* margin-top: 50px;
        padding-bottom: 40px; */
    }
    
    .feature-1,
    .feature-2,
    .feature-3,
    .feature-4 {
        max-width: 450px;
        height: 370px;
        padding: 20px;
    }

    .features h3 {
        font-size: 1.2rem;
    }
    
    .features ul li {
       font-size: 1.2rem;
    }

    /* -----Personalized Tech Guid */
    .section-title h1 {
        font-size: 2.8rem;
    }
    
    .section-title p {
        font-size: 1.2rem;
        padding: 5px 20px 20px 0;
    }
    
    .section-title  {
      margin-bottom: 2rem;
    }

    /* -------Item Section Home Section-3---- */
    .section-3 {
        margin: 8rem 0;
        width: 100%;
        margin-bottom: 3rem;
    }

    .sec3-header h4 {
        font-size: 18px;
    }

    .sec3-header h1 {
        font-size: 1.3rem;
        padding-bottom: 15px;
    }

    .items-sec {
        margin-top: 2rem;
    }
    
    .item-header i {
        font-size: 2.2rem;
        margin-right: 1rem;
    }
    
    .item-header h3 {
        margin-bottom: .5rem;
        margin-top: .5rem;
    }

    /* -----Section-4---Hosting-- */
    .section-4 {
        margin-bottom: 20vmin;
        margin-top: 0rem;
    }

    .hosting-header h1{
        padding-top: 2rem;
        font-size: 2.5rem;
    }

    .hosting-header p {
        opacity: 0.5;
        font-size: 1.3rem;
    }

    .card-base {
        width: 350px;
        height: 430px;
        margin: 20px;
    }

    /* -----Partner Section */
    .partner-sec {
        padding-bottom: 6rem;
    }

    .partner-heading h1 {
        font-size: 3rem;
    }
    
    .partner-heading p {
        font-size: 1.3rem;
    }

    /* ------Sec-5---Work Together---- */
    .sec-5 {
        margin-top: 2rem ;
        margin-bottom: 12rem ;
    }

    .sec-5-header h1 {
        font-size: 3rem;
    }

    .sec-5-header p {
        font-size: 1.2rem;
        padding: 0 0px;
        margin-top: 1.2rem;
        font-weight: 300;
        color: #6e6e6a;
    }

    .sec-service h3 {
        font-size: 1.3rem;
    }
    
    .sec-service p {
        padding: 5px 0px 0px 0;
        font-size: 1.2rem;
    }

    .sec-5-btn a {
        font-size: 16px;
        letter-spacing: 4px;
        padding: 15px 15px;
    }

    /* -----Footer */
    .footer-logo a {
        font-size: 2.5rem;
        padding-top: 0rem;
    }

    #footer .copyright {
       font-size: .8rem;
    }
    

    /* ----Service Page */
    .fa-cog {
        font-size: 25rem;
    }

    .service-project {
        margin-top: 10em;
    }

    .service-goal p {
        font-size: 1.6rem;
    }

    .service-page {
        padding-bottom: 5rem;
    }

    .service h1 {
        font-size: 3rem;
        padding-top: 0;
        margin-top: 0;
    }

    .service-section {
        flex-direction: column;
    }

    .service-section h2 {
        font-size: 1.2rem;
    }

    .service-info p {
        font-size: 25px;
    }

    .service-info {
        padding: 50px 20px;
    }

    .service-title i {
        font-size: 45px;
        color: #02d7dd;
        margin-left: 7rem;
    }

    .service-title2 {
        width: 100%;
    }

    .service-title2 i {
        font-size: 45px;
        color: #2a8d19;
        margin-left: 7rem;
    }

    .service-title3 {
        width: 100%;
    }

    .service-title3 i {
        font-size: 45px;
        color: #66696b;
        margin-left: 8rem;
    }

    .service-title4 {
        width: 100%;
    }

    .service-title4 i {
        font-size: 45px;
        color: #112d42;
        margin-left: 7rem;
    }

    .service-title5 {
        width: 100%;
    }

    .service-title5 i {
        font-size: 45px;
        color: #e6e22f;
        margin-left: 7rem;
    }

    .service-title6 {
        width: 100%;
    }

    .service-title6 i {
        font-size: 45px;
        color: #919088;
        margin-left: 8rem;
    }

    .service-title h1 {
        font-size: 25px;
    }

    .service-title2 h1 {
        font-size: 25px;
    }

    .service-title3 h1 {
        font-size: 25px;
    }

    .service-title4 h1 {
        font-size: 25px;
    }

    .service-title5 h1 {
        font-size: 25px;
    }

    .service-title6 h1 {
        font-size: 25px;
    }

    .page-contact {
        margin-top: 2rem;
    }

    .page-contact .container .contactForm h1 {
        font-size: 2.5rem;
    }

    .page-contact .container .contactForm .formBox .inputBox input[type="submit"] {
        max-width: 150px;
        padding: 12px;
        font-size: 18px;
        margin-left: 3.5em;
    }

    .read-more-btn {
        font-size: 16px;
    }

     /* ------Company Section */
     .quot {
         height: auto;
         border-radius: 20%;
     }

     .quot-heading h2 {
         padding: 25px 0;
         font-size: 20px;
     }

     .quot-heading h3 {
         margin-left: 0em;
     }

     .quot-heading i {
         font-size: 20px;
     }

     .company {
          margin-top: 10rem;
     }
     .about-company {
         flex-direction: column;
         padding: 0 10px;
     }

     .about-company:nth-child(2) {
         flex-direction: column-reverse;
     }

     .family {
        font-size: 1.2rem;
        max-width: 400px;
     }

     #aboutVideo {
         width: 100%;
         max-width: 1550px;
         padding-left: 0rem;
         border-radius: 20px;
         margin-top: 3rem;
         justify-content: center;
         padding: 0 10px;
         align-items: center;
     }

     .vision {
         margin-top: 8rem;
     }

     .vision img {
         max-width: 1250px;
     }

     .vision-heading {
         padding-left: 0rem;
     }

     .vision-heading p {
         font-size: 1.2rem;
     }

     .values {
         margin-top: 6rem;
         margin-bottom: 8rem;
     }

     .values-heading {
         margin-top: 0rem;
     }

     .values-heading p {
         font-size: 1.2rem;
         font-family: 300;
         color: #333;
         max-width: 1050px;
     }

     .values img {
         margin-left: 0rem;
     }

     /* ------Contact Page */
     .contact-header {
         margin: 5vmin 0;
         padding-top: 5rem !important;
         margin-bottom: 10rem;
     }

     .contact {
         background: none;
     }

     .contact::before {
         background: none;
     }

     .contact-service {
         padding: 2px;
     }

     .contact-service h1 {
         font-size: 2.5rem;
     }

     .contact-service p {
         font-size: 1.2rem;
     }

     .contact-img {
        width: 100%;
     }

     .company-service {
         margin-top: 20vmin;
     }

     .company-title {
         text-align: center;
         font-size: 1.6rem;
     }

     .company-service ul li {
         margin: 10px 0;
     }

     .contact-flex {
        flex-direction: column-reverse;
     }

     .letter .news h1 {
         font-size: 2.2rem;
     }

     .letter .news p {
         font-size: 1.2rem;
        padding-bottom: 3rem;    
     }

     .subscribe-group button {
         margin-left: 5rem;
     }

    
}

@media screen and (max-width: 361px) {
    .header .header-logo {
        font-size: 2rem;
    }

    .header .navbar ul li a {
        font-size: 1.5rem;
    }

    .header .fa-bars {
        font-size: 1.5rem;
    }

    .hero-heading {
        padding: 0 10px;
        margin-top: 2.5rem;
    }

    .hero-heading p {
        font-size: .8rem;
        max-width: 850px;
    }

    .hero-heading h1 {
        font-size: 1.2rem;
    }

    .header-btn {
        padding: .2rem .3rem;
        font-size: .7rem;
        margin-top: 0px;
    }

    /* -----------Cloud Section */
    .cloud-sec {
        margin: 0rem 0;
        padding-top: 0vh;
    }

    .cloud-content h1 {
        margin-top: 230px;
        color: #434a54;
        font-size: 3rem;
        max-width: 450px;
    }

    .cloud-content p {
        margin-top: 30px;
        margin-bottom: 60px;
        max-width: 450px;
        font-size: 1.2rem;
    }

    .feature-1,
    .feature-2,
    .feature-3,
    .feature-4 {
        max-width: 450px;
        height: 350px;
        padding: 20px;
    }

    .features h3 {
        font-size: 1.2rem;
        padding: 15px 0 15px 0;
    }

    .features ul li {
        font-size: 1rem;
    }

    /* -------Personalized Tech Guid */

    .home-offer {
        margin-top: 25vmin;
        margin-bottom: 20vmin;
    }

    .section-title h1 {
        font-size: 2.5rem;
    }

    .section-title p {
        font-size: 1.2rem;
        padding: 5px 20px 20px 0;
        margin-bottom: 2em;
    }

    .sec-service {
        padding-bottom: 8rem;
        padding-top: 2rem;
    }

    .sec-service h3 {
        font-size: 1.3rem;
    }

    .sec-service p {
        padding: 5px 20px 20px 0;
        font-size: 1.2rem;
    }

    /* -------Item Section Home Section-3---- */
    .section-3 {
        margin: 7rem 0;
    }

    .sec3-header h1 {
        font-size: 1.6rem;
        padding-bottom: 40px;
    }

    .items-sec {
        grid-row-gap: 2rem;
        margin-top: 0rem;
    }

    .items {
        margin-bottom: .2rem;
    }

    .item-header {
        margin-bottom: 0rem;
    }

    .item-header i {
        font-size: 2.2rem;
        margin-right: 1rem;
    }

    .items-sec-img-wrapper img {
        display: none;
    }


    /* -----Hosting */
    .sec-4-header h1 {
        padding-top: 1rem;
    }

    .sec-4-header p {
        font-size: 1rem;
    }

    /* ---Partner Section */
    .partner-heading p {
        font-size: 1.2rem;
    }

    /* ---Work Together */
    .sec-5 {
        margin-top: 0rem;
        margin-bottom: 20rem;
    }

    .sec-5-header p {
        font-size: 1.3rem;
    }

    .sec-5-btn a {
        right: 20%;
        font-size: 18px;
        padding: 18px 25px;
        margin-top: 2rem;
    }

    /* ----Services Page-- */
    .service h1 {
        font-size: 2rem;
    }

    /* ----Footer */
    .footer-logo a {
        font-size: 2.9rem;
        padding-top: 0rem;
        padding-bottom: 2rem;
    }

    #footer .copyright {
        font-size: 14px;
    }

     .letter .news h1 {
         font-size: 2.2rem;
     }

     .letter .news p {
         font-size: 1.2rem;
         padding-bottom: 3rem;
     }

     .subscribe-group button {
         margin-left: 5rem;
     }

       #footer .copyright {
           font-size: .7rem;
       }

       .doc-file {
           display: flex;
           flex-wrap: wrap;

       }

}


@media screen and (max-width: 360px) {
     .header .header-logo {
        font-size: 2rem;
    }

    .header .fa-bars {
        font-size: 1.5rem;
    }

    .hero-heading {
        padding: 0 10px;
        margin-top: 3.5rem;
    }

    .hero-heading p {
        font-size: .8rem;
        max-width: 850px;
        padding: 0 20px;
    }
    
    .hero-heading h1 {
        font-size: 1.2rem;
    }

    .header-btn {
        padding: .2rem .3rem;
        font-size: .7rem;
        margin-top: 0px;
    } 

    /* -----------Cloud Section */
    .cloud-sec {
        margin: 0rem 0;
        padding-top: 0vh;
    }

    .cloud-content h1 {
        margin-top: 230px;
        color: #434a54;
        font-size: 3rem;
        max-width: 450px;
    }
    
    .cloud-content p {
        margin-top: 30px;
        margin-bottom: 60px;
        max-width: 450px;
        font-size: 1.2rem;
    }

    .feature-1,
    .feature-2,
    .feature-3,
    .feature-4 {
        max-width: 450px;
        height: 350px;
        padding: 20px;
    }

    .features h3 {
        font-size: 1.2rem;
        padding: 15px 0 15px 0;
    }

    .features ul li {
       font-size: 1rem;
    }

    /* -------Personalized Tech Guid */

    .home-offer {
    margin-top: 25vmin;
    margin-bottom: 20vmin;
    }

    .section-title h1 {
        font-size: 2.5rem;
    }
    
    .section-title p {
        font-size: 1.2rem;
        padding: 5px 20px 20px 0;
        margin-bottom: 2em;
    }

    .sec-service {
        padding-bottom: 8rem;
       padding-top: 2rem;
    }

    .sec-service h3 {
        font-size: 1.3rem;
    }

    .sec-service p {
        padding: 5px 20px 20px 0;
        font-size: 1.2rem;
    } 
     
    /* -------Item Section Home Section-3---- */
    .section-3 {
        margin: 7rem 0;
    }

    .sec3-header h1 {
        font-size: 1.6rem;
        padding-bottom: 40px;
    }

    .items-sec {
        grid-row-gap: 2rem;
        margin-top: 0rem;
    }

    .items {
        margin-bottom: .2rem; 
    }

    .item-header {
        margin-bottom: 0rem;
    }

    .item-header i {
        font-size: 2.2rem;
        margin-right: 1rem;
    }

    .items-sec-img-wrapper img {
      display: none;
    } 

    /* -----Hosting */
    .section-4 {
        margin-top: 10rem;
    }

    /* ---Partner Section */
    .partner-heading p {
        font-size: 1.2rem;
    } 

    /* ---Work Together */
    .sec-5 {
        margin-top: 0rem ;
        margin-bottom: 20rem;
    }  

    .sec-5-header p {
        font-size: 1.3rem;
    }

    .sec-5-btn a {
        right: 20%;
        font-size: 18px;
        padding: 18px 25px;
        margin-top: 2rem;
    }

    /* -----Services Page */
    .service h1 {
        font-size: 1.5rem;
    }

    .serv-feature-sec {
        margin-top: 5rem;
        margin-bottom: 5rem;
    }

    .serv-feature-heading h6 {
        font-size: 1rem;
    }
    
    .serv-feature-heading p {
        font-size: 1.3rem;
    }

    .service-goal h6 {
        font-size: 1rem;
    }

    .service-goal p {
        font-size: 1.3rem;
    }

    .service-text p {
        font-size: 1.2rem;
    }

    .service-title i {
        font-size: 42px;
        margin-left: 6.8rem;
        margin-top: 8vmin;
        padding: 2px;
    }

    .service-title2 i{
        font-size: 42px;
        color: #2a8d19;
        margin-left: 6.5rem;
    }

    .service-title3 i {
        font-size: 42px;
        color: #66696b;
        margin-left: 7.5rem;
    }

    .service-title4 i {
        font-size: 42px;
        color: #112d42;
        margin-left: 6.5rem;
    }

    .service-title5 i {
        font-size: 42px;
        color: #e6e22f;
        margin-left: 6.8rem;
    }

    .service-title6 i {
        font-size: 42px;
        color: #919088;
        margin-left: 7.3rem;
    }

    /* ---Service Contact Page */

    .page-contact {
        margin-top: 2rem;
    }

    .page-contact .container .contactForm {
        padding: 50px 0px;
        margin-left: 0px;
        width: 100%;
        margin-bottom: 18vmin;
    }
    

    .page-contact .container .contactForm h1 {
        font-size: 2.5rem;
    }

    .page-contact .container .contactForm .formBox .inputBox span {
        font-size: 10px;
    }
    
    

    .page-contact .container .contactForm .formBox .inputBox input[type="submit"] {
        max-width: 150px;
        padding: 12px;
        font-size: 18px;
        margin-left: 3.2em;
    }

   

    /* ---Company Page */
    .quot {
        height: auto;
    }

    .quot-heading h2 {
        padding: 8px;
        padding-top:2em;
    }

    .quot-heading h3 {
       padding-bottom: 1.5em;
    }

    /* -----Conatact Page */
    .contact-header {
        margin: 10rem 0;
    }

    .contact .container .contactForm {
        padding: 50px 0px;
        margin-left: 0px;
        width: 100%;
    }
    .contact .container .contactForm .formBox .inputBox input[type="submit"] {
        max-width: 150px;
        padding: 12px;
        font-size: 18px;
        margin-left: 2.5em;
    }

    /* ---Subscribe */
    .letter .news h1 {
        font-size: 2.5rem;
   }

   .letter .news p {
    font-size: 1.2rem;
    margin-bottom: 8rem;
    }

    .subscribe-heading {
        font-size: 2rem;
        top: 1rem;
        text-align: center;
    }

    .subscribe-group button {
        margin-left: 5rem;
    }
    
    .subscribe {
        margin-bottom: 60vmin;
    }

    #footer .copyright {
        font-size: .7rem;
    }

    .doc-file {
        display: flex;
        flex-wrap: wrap;

    }
}

@media screen and (max-width: 321px) {
    .header .header-logo {
        /* font-size: 1rem;
    color: #535351; 
    text-decoration: none; */
        cursor: pointer;
        /* font-weight: bold; */
        margin-left: .5rem;
        max-width: 170px;
        width: 100%;
        max-height: 200px;
    }
    /* -----------Cloud Section */
    .cloud-sec {
        margin: rem 0;
        padding-top: 0vh;
        padding-bottom: 3rem;
    }

    .section-3 {
        margin-bottom: 3rem;
    }

    .features h3 {
        font-size: 1.2rem;
    }

     /* ----Hosting Section */
     .section-4 {
         margin-top: 2rem !important;
     }

     .card-base {
         width: 300px;
         height: auto;
         margin: 20px;
     }

     .img-one,
     .img-two,
     .img-three,
     .img-four {
         width: 300px;
     }

     .hosting-header h1 {
         font-size: 2rem;
     }


     .hosting-header p {
         font-size: 1.2rem;
     }

     /* ------Sec-5---Work Together---- */
     .sec-5 {
         margin-bottom: 12rem;
     }

      /* ----Services Page */
      .service-heading {
          margin-top: 12em;
      }

      .service h1 {
          font-size: 1.6rem !important;
      }

      .service-title i {
          font-size: 45px;
          color: #02d7dd;
          margin-left: 5.3rem;
      }

      .service-title2 i {
          font-size: 45px;
          color: #2a8d19;
          margin-left: 5rem;
      }

      .service-title3 i {
          font-size: 45px;
          color: #66696b;
          margin-left: 6.4rem;
      }

      .service-title4 i {
          font-size: 45px;
          color: #112d42;
          margin-left: 5rem;
      }

      .service-title5 i {
          font-size: 45px;
          color: #e6e22f;
          margin-left: 5.3rem;
      }

      .service-title6 i {
          font-size: 45px;
          color: #919088;
          margin-left: 6rem;
      }

    /* ----Company Page */
    .about-heading h1 {
       font-size: 2.7rem;
    }

    .about-heading h5 {
        font-size: 14px;
    }

    .family {
        font-size: 1.2rem;
    }
    .vision-heading {
        font-size: 3rem;
    }

    .vision-heading p {
        font-size: 1.2rem;
    }

    .values-heading p {
        font-size: 1.2rem;
    }

    .values {
        margin-bottom: 4rem;
    }

       /* ---Subscribe */
       .letter .news h1 {
        font-size: 2rem;
   }


    /* -----Footer */
    .footer-logo a {
        font-size: 2.5rem;
        padding-top: 2rem;
    }

    #footer .copyright {
        font-size: .8rem;
    }
}

@media screen and (max-width: 320px) {
   /* -----------Cloud Section */
   .cloud-sec {
       margin: rem 0;
       padding-top: 0vh;
       padding-bottom: 3rem;
   }

   /* ----Hosting Section */
   .section-3 {
       margin-bottom: 3rem;
   }

   .section-4 {
       margin-top: 2rem !important;
   }

   .card-base {
       width: 300px;
       height: auto;
       margin: 20px;
   }

   .img-one,
   .img-two,
   .img-three,
   .img-four {
       width: 300px;
   }

   .hosting-header h1 {
       font-size: 2rem;
   }


   .hosting-header p {
       font-size: 1.2rem;
   }

   /* ------Sec-5---Work Together---- */
   .sec-5 {
       margin-bottom: 12rem;
   }

   /* ----Services Page */
   .service-heading {
       margin-top: 12em;
   }

   .service h1 {
       font-size: 1.6rem !important;
   }

   .service-title i {
       font-size: 45px;
       color: #02d7dd;
       margin-left: 5.3rem;
   }

   .service-title2 i {
       font-size: 45px;
       color: #2a8d19;
       margin-left: 5rem;
   }

   .service-title3 i {
       font-size: 45px;
       color: #66696b;
       margin-left: 6.4rem;
   }

   .service-title4 i {
       font-size: 45px;
       color: #112d42;
       margin-left: 5rem;
   }

   .service-title5 i {
       font-size: 45px;
       color: #e6e22f;
       margin-left: 5.3rem;
   }

   .service-title6 i {
       font-size: 45px;
       color: #919088;
       margin-left: 6rem;
   }

   /* ----Company Page */
   .about-heading h1 {
       font-size: 2.7rem;
   }

   .about-heading h5 {
       font-size: 14px;
   }

   .family {
       font-size: 1.2rem;
   }

   .vision-heading {
       font-size: 3rem;
   }

   .vision-heading p {
       font-size: 1.2rem;
   }

   .values-heading p {
       font-size: 1.2rem;
   }

   .values {
       margin-bottom: 4rem;
   }

   /* -----Footer */
   .footer-logo a {
       font-size: 2.5rem;
       padding-top: 2rem;
   }

   #footer .copyright {
       font-size: .8rem;
   }

}