/**
 * Responsive styles for screens up to 320px
 */
@media (max-width: 320px) {
  /* ... (styles for smaller screens) ... */

  /**
    header
    */
    .header .menuhome{
      font-size: 15px;
      color: silver;
      margin-left: 10px;
    }
  
    .navbar-item:hover .dropdown-content{
      display: none;
    }
  
    .nested-dropdown:hover .nested-dropdown-content {
      display: none;
    }
  

    .header .dropdown-content #hover-underline{
      display: none;
    }
  .header {
    padding-top: 10px;
  }

  /**
        hero
      */

  .hero .hero-btn {
    display: none;
  }

  .hero .hero-title {
    margin-top: 10vh;
    font-size: 2.5rem !important;
    height: 0;
  }

  .hero .hero-text {
    font-size: 10px !important;
    padding-top: 10vh;
  }

  /**
services
*/

  .services h2 {
    font-size: 2.5rem !important;
    width: 100%;
    height: 0vh;
  }

  .services p {
    font-size: 10px !important ;
    gap: 2px !important;
  }

  .services .slogan h2 {
    font-size: 1.5rem !important;
  }
  .services .container {
    display: block !important;
  }

  .services .container .vision h2 {
    padding-top: 10vh !important;
  }

  .services .container .mission h2 {
    padding-top: 10vh !important;
  }

  .services .mission {
    margin-left: 0%;
  }

  /**
  iso
  */

  .iso h2 {
    font-size: 20px;
  }

  .iso-img {
    padding-left: 10%;
}

.iso-img img {
  height: 50vh;
  width: 100%;
}


  /**
footer
*/

  .footer-brand {
    text-align: center;
    padding-left: 0% !important;
    padding-right: 0% !important;
  }

  .footer-brand #body-4 {
    margin-left: 5%;
    width: 90%;
    font-size: 14px;
  }

  .footer-brand #body-3 {
    font-size: 14px;
  }

  .footer-brand #body-2 {
    font-size: 14px;
  }
}

@media screen and (min-width: 321px) and (max-width: 380px) {
  /* ... (styles for screens between 321px and 425px) ... */

  /**
header
*/

.header .menuhome{
  font-size: 15px;
  color: silver;
  margin-left: 10px;
}

  
.navbar-item:hover .dropdown-content{
  display: none;
}

.nested-dropdown:hover .nested-dropdown-content {
  display: none;
}

.header .dropdown-content #hover-underline{
  display: none;
}
  .header {
    padding-top: 10px;
  }

  /**
    hero
    */

  .hero .hero-title {
    margin-top: 5vh;
    height: 0vh;
    font-size: 3rem !important;
  }

  .hero .hero-text {
    padding-top: 10vh;
    text-align: center;
    font-size: 10.5px;
  }
  .hero .hero-btn {
    right: 0% !important;
    bottom: 0vh !important;
  }

  /**
    services
    */

  .services h2 {
    font-size: 3rem !important;
    width: 100%;
    height: 0vh;
  }

  .services p {
    font-size: 12px !important ;
  }

  .services .slogan h2 {
    font-size: 1.5rem !important;
  }
  .services .container {
    display: block !important;
  }

  .services .container .vision h2 {
    padding-top: 10vh !important;
  }

  .services .container .mission h2 {
    padding-top: 10vh !important;
  }

  .services .vision {
    height: 80vh;
  }

  .services .mission {
    margin-left: 0%;
  }

  /**
  iso
  */
  .iso h2 {
    font-size: 20px;
  }

  .iso-img {
    padding-left: 10%;
  }

  .iso-img img {
    height: 50vh;
    width: 100%;
}

   /**
  footer
  */

  .footer-brand #body-4 {
    font-size: 15px;
  }

  .footer-brand #body-2 {
    font-size: 15px;
  }

  .footer-brand #body-3 {
    font-size: 15px;
  }
}

/**
   * Responsive styles for screens up to 430px
   */
@media screen and (min-width: 381px) and (max-width: 430px) {
  /* ... (styles for smaller screens) ... */

  /**
header
*/
.header .menuhome{
  font-size: 15px;
  color: silver;
  margin-left: 10px;
}

.header .dropdown-content #hover-underline{
  display: none;
}

  
.navbar-item:hover .dropdown-content{
  display: none;
}

.nested-dropdown:hover .nested-dropdown-content {
  display: none;
}

  .header {
    padding-top: 5px;
  }

  /**
    hero
    */

  .hero .hero-title {
    margin-top: 0vh;
    height: 0vh;
    font-size: 3rem !important;
  }

  .hero .hero-text {
    padding-top: 10vh;
    text-align: center;
    font-size: 11px;
  }

  /**
    services
    */

  .services h2 {
    font-size: 3rem !important;
    width: 100%;
    height: 0vh;
  }

  .services p {
    font-size: 12px !important ;
  }

  .services .slogan h2 {
    font-size: 1.5rem !important;
  }
  .services .container {
    display: block !important;
  }

  .services .container .vision h2 {
    padding-top: 10vh !important;
  }

  .services .container .mission h2 {
    padding-top: 10vh !important;
  }

  .services .vision {
    height: 80vh;
  }

  .services .mission {
    margin-left: 0%;
  }
  /**
  iso
  */

  .iso h2 {
    font-size: 20px;
  }

  .iso-img {
    padding-left: 10%;
}


  .iso-img img {
    height: 50vh;
    width: 100%;
}
}

/**
   * Responsive styles for screens up to 770px
   */
@media screen and (min-width: 426px) and (max-width: 770px) {
  /* ... (styles for smaller screens) ... */

  /**
hero
*/
.header .menuhome{
  font-size: 15px;
  color: silver;
  margin-left: 10px;
}

.header .dropdown-content #hover-underline{
  display: none;
}

  
.navbar-item:hover .dropdown-content{
  display: none;
}

.nested-dropdown:hover .nested-dropdown-content {
  display: none;
}

  .hero .hero-title {
    margin-top: 0vh;
    height: 0vh;
    font-size: 3rem !important;
  }

  .hero .hero-text {
    padding-top: 10vh;
    text-align: center;
    font-size: 11px;
  }

  /**
services
*/
  .services h2 {
    font-size: 3rem !important;
    width: 100%;
    height: 0vh;
  }

  .services p {
    font-size: 12px !important ;
  }

  .services .slogan h2 {
    font-size: 2rem !important;
  }

  .services .container .vision h2 {
    padding-top: 5vh !important;
  }

  .services .container .mission h2 {
    padding-top: 0vh !important;
  }

  .services .vision {
    height: 100vh;
  }

  .services .mission {
    height: 100vh;
  }

  /**
  iso
  */

  .iso h2 {
    font-size: 30px;
}

.iso img {
  height: 100%;
}


}

/**
   * Responsive styles for screens up to 1024px
   */
@media screen and (min-width: 770px) and (max-width: 1024px) {
  /* ... (styles for smaller screens) ... */

  /**
hero
*/
.header .menuhome{
  font-size: 15px;
  color: silver;
  margin-left: 10px;
}

.header .dropdown-content #hover-underline{
  display: none;
}


  .hero .hero-title {
    margin-top: 5vh;
    height: 0vh;
    font-size: 5rem !important;
  }

  .hero .hero-text {
    padding-top: 10vh;
    text-align: center;
    font-size: 17px;
  }

  /**
services
*/
  .services h2 {
    font-size: 4rem !important;
    width: 100%;
    height: 0vh;
  }

  .services p {
    font-size: 18px !important ;
  }

  .services .slogan h2 {
    font-size: 2.8rem !important;
  }

  .services .container .vision h2 {
    font-size: 5rem !important;
    padding-top: 0vh !important;
  }

  .services .container .vision p {
    font-size: 18px !important;
  }

  .services .container .mission h2 {
    font-size: 5rem !important;
    padding-top: 0vh !important;
  }

  .services .container .mission p {
    font-size: 18px !important;
  }

  .services .vision {
    height: 100vh;
  }

  .services .mission {
    height: 100vh;
  }

  /**
  iso
  */

  .iso img {
    height: 100%;
}
}


@media screen and (min-width: 1030px) and (max-width: 1440px) {

  /**
  header
  */

  .header .menuhome{
    display: none;
  }

}


@media screen and (min-width: 1441px) and (max-width: 2560px) {
  .header .menuhome{
    display: none;
  }
}
