/* XX-Large screens (≥1580px) */
@media (min-width: 1580px) {
    .introblk p{ font-size: 1.875rem;} /* ≈ 30px */
     .mainblk h1 {
    font-size: 5rem; /* 80px */
  }
     .btn-default {
    font-size: 1.8rem; /* ≈ 28.8px */
  }
  #menu > li {
    font-size: 1.4rem; 
  }
     .banner .carousel-item p {
    font-size: 2rem; /* ≈ 32px */
  }
    .mainblk p {
    font-size: 2.3rem;
  }
    .contactblk .title h3 {
    font-size: 2.375rem; /* ≈ 38px */
  }
}
@media (max-width: 1600px) {
 .banner .carousel {
      width: 60%;
    }
}
@media (max-width: 1200px) {
    .introblk p{ font-size: 1.75rem;} /* ≈ 28px */
    .banner .carousel {
      width: 80%;
    }
     #menu li {
      font-size: 1rem; /* ≈ 22.4px */
    }
}
/* Hide mobile menu */
@media (min-width: 1336px) {
    .slicknav_menu {
         display:none;
      } 
    #menu li:hover > ul{
      display: flex;
      flex-wrap: wrap;
      right: 0;
   }  
    #menu li:hover > ul li ul{
       display: flex;
      flex-wrap: wrap;
      left: 0;
    }
    #menu > li{
      position: relative;
    }
    #menu > li > ul {
    display: none;
    position: absolute;
    width: 640px;
    text-align: left !important;
    }
    ul.dropdown-columns{
        left: 0 !important;
        background: #fff;
    }
    /* Two-column dropdown style */
    .dropdown-columns {
      display: flex;
      flex-wrap: wrap;
      width: 100%;
      padding: 10px 0;
    }  
    .dropdown-columns > li{
      display: flex;
      flex-direction: column; 
      width: 50%;
    }
    .dropdown-columns > li ul{
      display: flex;
      flex-direction: column;
      padding: 20px 50px 20px 20px;
    }
    .dropdown-columns > li ul li{
      font-size: 1rem; 
    }
    .dropdown-columns > li ul li a{
      color: #5b5b5b;
      border-bottom: 1px solid #00b0be;
      display: block;
      padding: 15px 0;
    }
    .dropdown-columns > li ul li a:hover{
      color: #00b0be;
    }
    .dropdown-columns div {
      padding: 20px;
      color: #000;
      border-left: 1px solid #00b0be;   
      min-height: 200px;
    }
    .dropdown-columns div p{
      width: 100%;
      color: #5b5b5b !important;
      text-align: left;
      line-height: 25px;
    }
}
/* Show mobile menu */
@media (max-width: 1335px) {
    header .logo{
      order: 1;
      width: 100%;
    }
    header .logo img{
      margin: 0 auto;
      display: block;
    }
  #menu{
      display: none;
    }
    .slicknav_menu {
      display: block;
      z-index: 9000;
      top: 20px;
      right: 20px;
      font-size: 20px;
      position: fixed;
      background: none;
      width: 100%;
    }
    .slicknav_menu .slicknav_icon-bar {
      background: #fff; !important;
      padding: 2px 6px;
    }
    .slicknav_menu .slicknav_icon {
      margin: 0;
    }
    .slicknav_menu .slicknav_menutxt {
      display: none;
    }
    .slicknav_btn {
      background: #00b0be;
      z-index: 5000;
    }
   .slicknav_menu > ul{
      height: auto !important;
      text-align: left;
      border-radius: 0;
      padding: 15px;
      position: relative;
      left: 20px;
      z-index: 4000;
      background: #ced2d8;
    }
    .slicknav_nav ul > li > ul {
      display: block;
      font-size: 1rem;
    }
    
}
/* Large screens (≥992px) */
@media (max-width: 992px) {
    .introblk p{ font-size: 1.625rem;} /* ≈ 26px */
     .mainblk h1 {
    font-size: 3rem;
  }
    .banner .carousel-item p {
    font-size: 1.4rem;
  }
    .banner .carousel {
      height: auto;
      min-height: 0;
    }
    .mainblk p {
    font-size: 2.25rem; /* ≈ 36px */
  }
     .listview .entrylist .container-fluid{
      flex-direction: column;
    }
    .listview .entrylist img,
    .listview .content {
      width: 100%;
    }
    .listview .content {
      padding-left: 0;
    }
}
/* Medium screens (≥768px) */
@media (max-width: 768px) {
    .introblk p{ font-size: 1.5rem;} /* ≈ 24px */
    .mainblk h1 {
    font-size: 2.5rem; 
  }
   .btn-default {
    font-size: 1.6rem; /* ≈ 25.6px */
  }
     header .logo img{
      width: 200px;
      height: auto;
    }
    .contactblk .title h3 {
    font-size: 2rem; /* ≈ 32px */
  }
    .animation.fourcol{
      display: grid;
      grid-template-columns: repeat(2, 1fr); /* 2 equal columns */
    }
    .banner .carousel {
      top: 10%;
      padding: 2.5rem 2.5rem 2.5rem 2.5rem;
    }
    .btn-default::before {
      width: 18px;
      height: 18px;
    }
    .subfooter ul,
    ul.list-hor{
      flex-direction: column;
    }
    .subfooter ul li::after,
    ul.list-hor li::after{
      content: "";
    }
}

/* Optional: stack table rows on mobile */
@media (max-width: 600px) {
  table.tbldata,
  table.tbldata thead,
  table.tbldata tbody,
  table.tbldata th,
  table.tbldata td,
  table.tbldata tr {
    display: block;
    width: auto !important;
    min-width: auto !important;
  }

  table.tbldata thead {
    display: none; /* hide headers */
  }
  table.tbldata th, 
  table.tbldata td {
    font-size: 1.1rem;  
  }
  table.tbldata td {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 8px;
  }

  table.tbldata td::before {
    content: attr(data-label);
    font-weight: 800;
    flex: 0 0 120px;   /* fixed width for all labels */
    min-width: 120px; /* ensures they don’t shrink */
    text-align: left; 
    padding: 5px;
    margin-right: 10px;
    background-color: #00b0be;
    color: #fff;
  } 
}

/* Small screens (≥576px) */
@media (max-width: 576px) {
    .introblk p{ font-size: 1.375rem;} /* ≈ 22px */
    .mainblk h1,
    .mainblk-sub h1{
    font-size: 2.5rem; /* 40px */
  }
     .btn-default {
    font-size: 1.4rem; /* ≈ 22px */
  }
    .banner .carousel-item p {
    font-size: 1rem; 
  }
    .mainblk p {
    font-size: 1.5rem; /* ≈ 24px */
  }
    .contactblk .title h3 {
    font-size: 1.75rem; /* ≈ 28px */
  }
    footer ul,
    footer ul li{
      display: block;
    }
    footer ul li::after{
      content: '';
    }
    
}

/* FONT SIZES */
@media (min-width: 576px) {  /* small tablets */
  .mainblk h1,
  .mainblk-sub h1{
    font-size: 2.5rem; /* ~40px */
  }
  .btn-default {
    font-size: 1.3rem; /* ~17.6px */
  }
   .mainblk-sub .intro p {
    font-size: 2rem; 
  }
  p.subintro { font-size: 2rem; } 
}

@media (min-width: 768px) {  /* tablets */
  .mainblk h1,
  .mainblk-sub h1{
    font-size: 3rem; /* ~48px */
  }
  .btn-default {
    font-size: 1.5rem; /* ~18.4px */
  }
  .mainblk-sub .intro p {
    font-size: 2.2rem; /* ~32px */
  }
  p.subintro { font-size: 2.4rem; }
}

@media (min-width: 992px) {  /* small laptops */
  .mainblk h1,
  .mainblk-sub h1{
    font-size: 3.5rem; /* ~56px */
  }
  .btn-default {
    font-size: 1.6rem; /* ~19.2px */
  }
  .mainblk-sub .intro p {
    font-size: 2.4rem; /* ~38px */
  }
  p.subintro { font-size: 2.8rem; }
}

@media (min-width: 1200px) { /* desktops */
  .mainblk h1,
  .mainblk-sub h1{
    font-size: 4rem; /* ~64px */
  }
    .btn-default {
    font-size: 1.8rem; /* ~19.2px */
  }
   .mainblk-sub .intro p {
    font-size: 2.8rem; /* ~45px (your original) */
  }
  p.subintro { font-size: 3.2rem; }
}

@media (min-width: 1700px){
  header .logo img{
    width: 350px;
  }
}




