.btn-header-deluxe-button {
    border: 2px solid var(--info);
    background-color: #f8fafb;
    color: black;
    padding: 5px 10px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
  }
  .active-btn-header-deluxe-button {
    background-color: #FF5C00;
    border: 2px solid #FF5C00;
    color: var(--light) !important;
  }
  .btn-header-deluxe-button {
    border: 2px solid var(--info);
    background-color: #f8fafb;
    color: black;
    padding: 5px 10px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
  }
  .active-btn-header-deluxe-button {
    background-color: #FF5C00;
    border: 2px solid #FF5C00;
    color: var(--light) !important;
  }
  .btn-header-standard-button {
    border: 2px solid var(--info);
    background-color: #f8fafb;
    color: black;
    padding: 5px 10px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
  }
  .active-btn-header-standard-button {
    background-color: #FF5C00;
    border: 2px solid #FF5C00;
    color: var(--light) !important;
  }

  /* silk route card - 2 */

  .btn-header-new-middle {
    border: 2px solid var(--info);
    background-color: transparent;
    color: #010a14;
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
  }
  .active-btn-header-new-middle {
    background-color: var(--info) !important;
    color: white !important;
  }
  .btn-header-deluxe-button {
    border: 2px solid var(--info);
    background-color: #f8fafb;
    color: black;
    padding: 5px 10px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
  }
  .active-btn-header-deluxe-button {
    background-color: #FF5C00;
    border: 2px solid #FF5C00;
    color: var(--light) !important;
  }
  .btn-header-deluxe-button-middle {
    border: 2px solid var(--info);
    background-color: #f8fafb;
    color: black;
    padding: 5px 10px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
  }
  .active-btn-header-deluxe-button-middle {
    background-color: #FF5C00;
    border: 2px solid #FF5C00;
    color: var(--light) !important;
  }
  .btn-header-standard-button-middle {
    border: 2px solid var(--info);
    background-color: #f8fafb;
    color: black;
    padding: 5px 10px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
  }
  .active-btn-header-standard-button-middle {
    background-color: #FF5C00;
    border: 2px solid #FF5C00;
    color: var(--light) !important;
  }
  

  /* new */
  .btn-header-new-footer {
    border: 2px solid var(--info);
    background-color: transparent;
    color: #010a14;
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
  }
  .active-btn-header-new-footer {
    background-color: var(--info) !important;
    color: white !important;
  }
  .btn-header-deluxe-button {
    border: 2px solid var(--info);
    background-color: #f8fafb;
    color: black;
    padding: 5px 10px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
  }
  .active-btn-header-deluxe-button {
    background-color: #FF5C00;
    border: 2px solid #FF5C00;
    color: var(--light) !important;
  }
  .btn-header-deluxe-button-footer {
    border: 2px solid var(--info);
    background-color: #f8fafb;
    color: black;
    padding: 5px 10px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
  }
  .active-btn-header-deluxe-button-footer {
    background-color: #FF5C00;
    border: 2px solid #FF5C00;
    color: var(--light) !important;
  }
  .btn-header-standard-button-footer {
    border: 2px solid var(--info);
    background-color: #f8fafb;
    color: black;
    padding: 5px 10px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
  }
  .active-btn-header-standard-button-footer {
    background-color: #FF5C00;
    border: 2px solid #FF5C00;
    color: var(--light) !important;
  }

  @media (max-width: 768px) {
    .custom-grid > div {
        flex: 0 0 50%; 
        max-width: 50%;
    }
}

@media (max-width: 480px) {
    .custom-grid > div {
        flex: 0 0 100%; 
        max-width: 100%;
    }
}
/* popup silk route css */
@media (max-width:768px) {
  .popup-buttongroup{
      padding-top: 10px;
      padding-bottom: 10px;
  }
  .btn-header-new{
      padding: 5px 10px;
  }
  .btn-header-new-middle{
      padding: 5px 10px;
  }
  .btn-header-new-footer{
    padding: 5px 10px;
}

}


/* new 11-11 darjeeling csss */
.btn-header-new-darjeeling {
  border: 2px solid var(--info);
  background-color: transparent;
  color: #010a14;
  padding: 10px 20px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-new-darjeeling {
  background-color: var(--info) !important;
  color: white !important;
}
.btn-header-new-darjeeling-header {
  border: 2px solid var(--info);
  background-color: transparent;
  color: #010a14;
  padding: 10px 20px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-new-darjeeling-header {
  background-color: var(--info) !important;
  color: white !important;
}
.btn-header-new-darjeeling-middle {
  border: 2px solid var(--info);
  background-color: transparent;
  color: #010a14;
  padding: 10px 20px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-new-darjeeling-middle {
  background-color: var(--info) !important;
  color: white !important;
}
.btn-header-new-darjeeling-footer {
  border: 2px solid var(--info);
  background-color: transparent;
  color: #010a14;
  padding: 10px 20px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-new-darjeeling-footer {
  background-color: var(--info) !important;
  color: white !important;
}
.btn-header-deluxe-darjeeling {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-deluxe-darjeeling {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-deluxe-darjeeling-header {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-deluxe-darjeeling-header {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-deluxe-darjeeling-footer {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-deluxe-darjeeling-footer {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-deluxe-button-darjeeling {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-deluxe-button-darjeeling {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-standard-button-darjeeling {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-standard-button-darjeeling {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-deluxe-button-darjeeling-header {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-deluxe-button-darjeeling-header {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-standard-button-darjeeling-header {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-standard-button-darjeeling-header {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-deluxe-darjeeling-middle {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-deluxe-darjeeling-middle {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-deluxe-button-darjeeling-middle {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-deluxe-button-darjeeling-middle {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-standard-button-darjeeling-middle {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-standard-button-darjeeling-middle {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-standard-button-darjeeling-middle {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-standard-button-darjeeling-middle {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-deluxe-button-darjeeling-footer {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-deluxe-button-darjeeling-footer {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}
.btn-header-standard-button-darjeeling-footer {
  border: 2px solid var(--info);
  background-color: #f8fafb;
  color: black;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.3s ease, color 0.3s ease;
  cursor: pointer;
}
.active-btn-header-standard-button-darjeeling-footer {
  background-color: #FF5C00;
  border: 2px solid #FF5C00;
  color: var(--light) !important;
}

@media (max-width:768px) {
 .popup-content-new-read-darjeeling{
  width: 90%;
  }
.btn-header-new-darjeeling {
  padding: 5px 10px;
}
.btn-header-new-darjeeling-header{
  padding: 5px 10px;
}
.btn-header-new-darjeeling-middle{
  padding: 5px 10px;
}
.btn-header-new-darjeeling-footer {
  padding: 5px 10px;
}
.close-new-read-header, .close-new-read {
  position: relative;
  float: right;
  font-size: 30px;
  /* font-weight: bold;
  cursor: pointer; */
  bottom: 25px;
  right: 10px;
}
.close-new{
  bottom: 11px;
    right: 5px;
}
.close-new-middle{
  bottom: 11px;
    right: 5px;
}
.close-new-footer{
  bottom: 11px;
  right: 5px
}
}
@media (max-width:480px) {
  .popup-content-new-read-darjeeling{
    width: 95%;
    padding: 10px;
  }
  .close-new{
    bottom: 7px;
      right: 3px;
      font-size: 24px;
  }
  .close-new-middle{
    bottom: 7px;
      right: 3px;
      font-size: 24px;
  }
  .close-new-footer{
    bottom: 7px;
      right: 3px;
      font-size: 24px;
  }
  .close-new-read,
  .close-new-read-header,
  .close-new-read-middle,
  .close-new-read-footer{
    bottom: 7px;
      right: 3px;
      font-size: 24px;
  }
}
@media (max-width: 992px) {
  .popup-content-new-read-darjeeling{
    width: 85%; 
    max-width: 800px; 
  }
}