/* IST Mobile Responsive CSS */
.mobile-menu-toggle { display: none; }

@media (max-width: 767px) {
  html, body, #top, #top-wrapper, #content, #footer, .container {
    max-width: 100vw !important; overflow-x: hidden !important;
  }
  .container {
    width: auto !important; padding: 0 15px !important;
  }
  #top-content .container { position: relative; }
  #logo { max-width: 55% !important; height: auto; margin: 15px 0 10px !important; }
  .mobile-menu-toggle {
    display: block !important; position: absolute !important; top: 15px !important; right: 10px !important;
    z-index: 9999; background: #2d3748 !important; color: #fff !important; border: none !important;
    border-radius: 6px !important; font-size: 22px !important; padding: 8px 14px !important;
    cursor: pointer; width: auto !important; min-height: auto !important; line-height: 1 !important;
  }
  #menu { display: none !important; width: 100% !important; clear: both; border-top: 1px solid #4a5568; margin-top: 10px; }
  #menu.mobile-active { display: block !important; }
  #menu.mobile-active #menu-right, #menu.mobile-active #menu-content { width: 100% !important; float: none; padding: 0; }
  #menu.mobile-active .nav { width: 100% !important; float: none; }
  #menu.mobile-active .nav > li { float: none !important; width: 100% !important; border-bottom: 1px solid #4a5568; background: #2d3748; }
  #menu.mobile-active .nav > li > a { display: block; padding: 14px 16px; color: #e2e8f0; font-size: 15px; text-decoration: none; }
  #menu.mobile-active .nav .sub-menu { display: none; position: static; box-shadow: none; background: #1a202c; padding: 0 !important; border: none; border-radius: 0; }
  #menu.mobile-active .nav .sub-menu.open { display: block; }
  #menu.mobile-active .nav .sub-menu li { border-bottom: 1px solid #4a5568; }
  #menu.mobile-active .nav .sub-menu li a { display: block; padding: 12px 16px 12px 28px; color: #a0aec0; font-size: 14px; }
  #menu.mobile-active #social-icons { display: none; }
  #left-area, #sidebar { width: 100% !important; float: none; clear: both; }
  img { max-width: 100% !important; height: auto; }
  .footer-widget { width: 100% !important; margin: 0 0 30px !important; float: none; }
  #featured { width: 100% !important; height: auto !important; min-height: 180px !important; overflow: hidden; }
  #featured .slide { width: 100% !important; height: auto !important; }
  #featured .slide img { width: 100% !important; height: auto !important; }
  body { font-size: 16px !important; }
  h1 { font-size: 24px !important; }
  h2 { font-size: 20px !important; }
  h3 { font-size: 17px !important; }
  .button, .et_pb_button, input[type="submit"], button { min-height: 48px !important; font-size: 16px !important; padding: 14px 20px !important; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .container { width: 96% !important; padding: 0 2% !important; }
  #left-area { width: 65% !important; }
  #sidebar { width: 30% !important; }
  img { max-width: 100% !important; height: auto; }
}