/* ========================================================================
   Responsive Styles - Cleaned
   Keeps all existing class names (spacing-*, res-*, etc.)
   ======================================================================== */

/* =================== Wide Screens =================== */
@media only screen and (min-width: 1801px) {
  .ttm-left-span .ttm-col-wrapper-bg-layer { margin-left: -500px }
  .ttm-right-span .ttm-col-wrapper-bg-layer { margin-right: -500px }
}

@media only screen and (max-width: 1800px) and (min-width: 1601px) {
  .ttm-left-span .ttm-col-wrapper-bg-layer { margin-left: -400px }
  .ttm-right-span .ttm-col-wrapper-bg-layer { margin-right: -400px }
  .spacing-11 { margin-left: -230px }
}

@media only screen and (max-width: 1600px) and (min-width: 1401px) {
  .ttm-left-span .ttm-col-wrapper-bg-layer { margin-left: -300px }
  .ttm-right-span .ttm-col-wrapper-bg-layer { margin-right: -300px }
  .spacing-11 { margin-left: -110px }
}

@media only screen and (max-width: 1400px) and (min-width: 1171px) {
  .ttm-left-span .ttm-col-wrapper-bg-layer { margin-left: -200px }
  .ttm-right-span .ttm-col-wrapper-bg-layer { margin-right: -200px }
  .spacing-11 { margin-left: -15px }
  .banner-slider.slick_slider:hover .slick-next,
  .banner-slider.slick_slider:hover .slick-prev { opacity: 0 }
}

@media only screen and (max-width: 1280px) {
  .slick_slider .slick-arrow { display: none; visibility: hidden }
}

/* =================== Desktops ≥1200px =================== */
@media only screen and (min-width: 1200px) {
  .ttm-stickable-header.fixed-header {
    z-index: 111;
    background: #fff;
    box-shadow: 0 13px 25px -12px rgba(0,0,0,.25);
  }
  .fixed-header {
    position: fixed!important;
    top: 0; left: 0; width: 100%; z-index: 9;
  }
  .ttm-header-style-01 .site-header-menu .ttm-stickable-header.fixed-header .site-navigation { margin-top: 0 }
  .ttm-header-style-01 .ttm-stickable-header.fixed-header .site-navigation-content {
    position: unset; content: unset; box-shadow: unset;
  }
  .ttm-header-style-01 #site-header-menu .site-navigation ul.menu>li>a { padding: 40px 8px }
  .ttm-header-style-01 #site-header-menu .ttm-stickable-header.fixed-header .site-navigation ul.menu>li>a { padding: 35px 8px }

  .ttm-header-style-02 .site-branding { padding: 5px 0; margin: auto }
  .ttm-header-style-02 #site-header-menu .site-header-menu-inner { border-top: 1px solid #eaecf2 }
  .ttm-header-style-02 #site-header-menu .site-navigation ul.menu>li>a {
    padding: 15px 16px; text-transform: uppercase;
  }
  .ttm-header-style-02 #site-header-menu .site-navigation ul.menu>li:not(:last-child)>a:before {
    content: ""; position: absolute; height: 20px; width: 1px; right: -6px; top: 50%;
    transform: translateY(-50%); background: rgba(19,29,59,.08);
  }
  .ttm-header-style-02 .header_search .header_search_content { right: 200px }

  /* Style 03 */
  header.ttm-header-style-03,
  header.ttm-header-style-04 {
    position: absolute; z-index: 2; width: 100%; box-shadow: none;
  }
  header.ttm-header-style-03 .top_bar,
  header.ttm-header-style-04 .top_bar,
  header.ttm-header-style-03 .top_bar_contact_item,
  header.ttm-header-style-04 .top_bar_contact_item {
    height: 116.5px; line-height: 116.5px;
  }
  .ttm-header-style-03 .site-branding { position: absolute; left: 0; top: -80px }
  .ttm-header-style-03 #site-header-menu .site-navigation:after,
  .ttm-header-style-04 #site-header-menu .site-navigation:after {
    display: block; width: 92%; left: 4%; position: absolute; content: "";
    top: 13px; z-index: -1; height: 100%; margin: 0 auto; opacity: .8;
  }
  .ttm-header-style-03 #site-header-menu .site-navigation ul.menu,
  .ttm-header-style-04 #site-header-menu .site-navigation ul.menu { padding-left: 15px }
  .ttm-header-style-03 #site-header-menu .site-navigation ul.menu>li>a,
  .ttm-header-style-04 #site-header-menu .site-navigation ul.menu>li>a { padding: 25px 19px }
  .ttm-header-style-03 .header_btn a.ttm-btn,
  .ttm-header-style-04 .header_btn a.ttm-btn { padding: 24px 42px 23px }
  .ttm-header-style-03 .header_search .header_search_content,
  .ttm-header-style-04 .header_search .header_search_content { right: 230px }
  .ttm-header-style-04 #site-header-menu .site-navigation ul.menu>li.active>a:before,
  .ttm-header-style-04 #site-header-menu .site-navigation ul.menu>li:hover>a:before {
    content: ''; position: absolute; bottom: 14px; left: 0; right: 0;
    width: 60%; margin: 0 auto; height: 3px;
    transition: transform .5s cubic-bezier(.2,1,.3,1);
  }
  .ttm-header-style-04 #site-header-menu .site-navigation ul.menu>li.active>a:after,
  .ttm-header-style-04 #site-header-menu .site-navigation ul.menu>li:hover>a:after {
    content: ''; position: absolute; bottom: 17px; left: 0; right: 0; margin: auto;
    border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid #fff;
  }
}

/* =================== Tablets & Below =================== */
@media all and (max-width: 1199px) {
  .fbar-main, .top_bar, .header_extra, .widget_info { display: none!important; visibility: hidden }
  header .container, .banner-slider .container, .element-row .container,
  .sidebar .container, .ttm-page-title-row .container, .ttm-row .container,
  .ttm-row .container-fluid, footer .container { max-width: 100%; padding: 0 }
  .site-branding { text-align: center }
  #site-header-menu .site-header-menu-inner { height: 80px; line-height: 80px; background: #fff }
  .spacing-11 { margin-left: 15px }
  .row-title.style1 h2.title:before { left: 30px }
}

/* Sidebar & Tabs for ≥992px */
@media (min-width: 992px) {
  .sidebar.ttm-sidebar-right .content-area { padding-right: 30px }
  .sidebar .sidebar-right, .sidebar.ttm-sidebar-left .content-area { padding-left: 30px }
  .sidebar .sidebar-left { margin-top: -30px; margin-right: 15px }
  .ttm-tabs.ttm-tab-style-classic ul.tabs { display: flex; width: 100% }
}

/* =================== Laptops (992–1199px) =================== */
@media only screen and (max-width: 1199px) and (min-width: 992px) {
  ul.ttm-coursedetails-box { display: block }
  ul.ttm-coursedetails-box li:not(:last-child):after { content: unset }
  .banner-slider.slick_slider:hover .slick-next,
  .banner-slider.slick_slider:hover .slick-prev { opacity: 0 }
}

/* =================== Tablets <992px =================== */
@media (max-width: 991px) {
  .featured-imagebox img, .ttm_single_image-wrapper img { display: block; margin: 0 auto }
  .section-title.style1, .section-title.style2 { margin-bottom: 20px }
  .page-title-heading h2 { font-size: 23px; font-weight: 400 }
  .ttm-page-title-row-inner .row { color: #fff; min-height: 100px }
  h1 { font-size: 50px; line-height: 55px } h2 { font-size: 36px } h3 { font-size: 32px }
  h4 { font-size: 24px } h5 { font-size: 19px } h6 { font-size: 17px }
  .ttm-row { padding: 20px 0!important }
  .spacing-5 { padding: 40px 15px; margin-top: 0 }
  .spacing-11 { margin-left: 15px }
  #map { height: 264px }
}

/* =================== Mobiles <768px =================== */
@media (max-width: 767px) {
  .section-title h2.title { font-size: 18px; line-height: 35px }
  .row-title h2.title { font-size: 20px; line-height: 55px }
  .ttm-tabs.tabs-style-01 ul.tabs { display: block }
  .ttm-tabs.tabs-style-01 ul.tabs li { margin: 15px 0 0 }
  .ttm-tabs.tabs-style-01 ul.tabs li a { padding: 11px 15px; font-size: 17px }
}

/* =================== Small Mobiles =================== */
@media (max-width: 575px) {
  .second-footer .widget-area { margin: 30px 0 0 }
  .second-footer .widget-area:nth-child(1) { margin-top: 50px }
  .copyright, .copyright .social-icons { text-align: center; margin: 0 auto; display: block!important }
  .comment-body { padding: 20px 15px }
  .comment-author { margin-left: -125px }
  .comment-list .children { margin-left: 15px }
}

@media (max-width: 555px) {
  .featured-imagebox-event { margin-bottom: 10px }
  .site-branding img { max-height: 60px; width: 300px }
}

@media only screen and (max-width: 480px) {
  .first-footer .featured-icon-box.icon-align-before-content .featured-icon i { font-size: 38px }
  .first-footer .featured-icon-box.icon-align-before-content .featured-title h5 { font-size: 22px }
  .first-footer .newsletter-form button[type=submit] {
    position: unset; margin: 15px auto 0; display: block; text-align: center;
  }
  .ttm-fid.inside.style3 { padding-left: 70px }
  .ttm-fid.inside.style3 .ttm-fid-title { font-size: 24px }
  .ttm-fid.inside.style3 h4.ttm-fid-inner { font-size: 32px }
  .spacing-5 { padding: 20px 15px 10px 20px; height: auto; margin-top: 0 }
}

@media only screen and (max-width: 420px) {
  .ttm-fid.inside.style3 { padding: 0 20px 0 60px; min-height: 32% }
  .ttm-fid.inside.style3 .ttm-fid-title { font-size: 20px }
  .ttm-fid.inside.style3 h4.ttm-fid-inner { font-size: 28px; padding-top: 10px }
  .featured-title h5 { font-size: 20px; line-height: 20px; margin-bottom: 5px; font-weight: 400 }
}

@media only screen and (max-width: 360px) {
  .ttm-fid.inside.style3 { padding: 0 17px 0 50px; min-height: 32% }
  .ttm-fid.inside.style3 .ttm-fid-title { font-size: 18px }
  .ttm-fid.inside.style3 h4.ttm-fid-inner { font-size: 24px; padding-top: 5px }
  .site-branding img { max-height: 60px; width: 300px }
  .sub, .sub1, .sub2 { -webkit-columns: 1 }
}

/* Container size for desktops */
@media (min-width: 1200px) {
  .container-ex { max-width: 1320px }
}
