@media only screen and (min-width:992px) and (max-width:1199px) {
	.search-forum {
		left: -250px
	}

	.main-menu ul li a {
		padding: 33px 10px
	}

	.slider-text {
		padding: 0 20px;
		width: 991px
	}

	.slider-text h1 {
		font-size: 48px
	}

	.about-text h2 {
		font-size: 22px
	}

	.gallery-overlay-text h2 {
		font-size: 14px
	}

	.blog2-feature-text h2 a {
		font-size: 16px
	}

	.about-tab li a {
		width: 100px
	}
}

@media only screen and (min-width:768px) and (max-width:991px) {
	body {
		font-size: 15px;
		line-height: 24px
	}

	h1 {
		font-size: 22px
	}

	h2 {
		font-size: 18px
	}

	h3 {
		font-size: 16px
	}

	.logo {
		text-align: center;
		padding-top: 40px
	}

	.main-menu ul li a {
		padding: 34px 12px
	}

	.header-left {
		text-align: center
	}

	.main-menu {
		text-align: center
	}

	.header-right::before {
		left: -50%
	}

	.no-padding-left {
		padding-left: 15px
	}

	.no-padding-right {
		padding-right: 0
	}

	.search-forum {
		left: -218px
	}

	.slider-text {
		width: 767px
	}

	.slider-text h1 {
		font-size: 36px
	}

	.about-us-img {
		margin-bottom: 20px
	}

	.about-us-img img {
		width: 100%;
		margin-bottom: 30px
	}

	.all-patner.owl-carousel.owl-theme img {
		padding: 50px
	}

	.team-sec .col-lg-3.col-md-3.col-sm-6.col-xs-12:nth-child(2n+1) {
		clear: both
	}

	.all-founder {
		margin-top: 40px
	}

	.about-tab-sec {
		margin-bottom: 40px
	}

	.project-gallery .inner {
		width: 50%
	}

	.footer-recent-news {
		margin-bottom: 30px
	}

	.counting_sl {
		margin: 40px 0
	}

	.single-blog2 .col-md-7.no-padding-right {
		padding-left: 0;
		margin-top: 20px;
		margin-bottom: 20px
	}

	.all-blog2-feature .owl-controls {
		margin-top: 20px;
		transform: translateX(-50%);
		text-align: center;
		position: relative;
		left: 50%
	}

	.blog2-recent-news {
		margin-top: 40px
	}

	.faq-sec {
		margin-bottom: 40px
	}

	.hd-search-field form {
		width: 140px
	}

	.home2.header-right::before {
		left: -50%
	}

	.sidebar {
		margin-top: 40px
	}

	.project-details-img img {
		width: 100%;
		margin-bottom: 30px
	}

	.why-choose-us-tab {
		margin-bottom: 40px
	}

	.update-cart-left input[type=text] {
		width: 200px
	}

	.payment-method {
		padding-left: 15px;
		margin-top: 30px
	}

	.donate-amount {
		margin-bottom: 30px
	}

	.sidebar {
		margin-top: 40px
	}

	.product-text h2 a {
		font-size: 16px
	}

	.product-meta .add-to-cart a {
		padding: 10px
	}

	.add-to-rating a i {
		font-size: 12px
	}
}

@media only screen and (max-width:767px) {
	body {
		font-size: 14px;
		line-height: 24px
	}

	h1 {
		font-size: 22px
	}

	h2 {
		font-size: 18px
	}

	h3 {
		font-size: 16px
	}

	.slider-text {
		width: 100%
	}

	.about-us-img {
		margin-bottom: 20px
	}

	.service-item .inner {
		width: 100%
	}

	.all-testimonial.owl-theme .owl-dots .owl-dot span,
	.all-blog2-feature.owl-theme .owl-dots .owl-dot span {
		top: -3px
	}

	.no-padding {
		padding: 15px
	}
}

@media only screen and (min-width:0px) and (max-width:767px) {
	body {
		font-size: 14px;
		line-height: 24px
	}

	h1 {
		font-size: 22px
	}

	h2 {
		font-size: 18px
	}

	h3 {
		font-size: 16px
	}

	.why-choose-us-tab {
		margin-bottom: 40px
	}

	.project-details-img img {
		width: 100%;
		margin-bottom: 30px
	}

	.product-thumb img {
		width: 100%
	}

	.header-left {
		text-align: center;
		padding-top: 64px
	}

	.header-right::before {
		left: -50%
	}

	.slider-text {
		padding: 0 30px
	}

	.hd-sec {
		padding-top: 24px;
		position: relative
	}

	.logo {
		text-align: center;
		margin: 20px 0
	}

	.counting_sl {
		margin: 40px 0
	}

	.about-us-img img {
		width: 100%;
		margin-bottom: 30px
	}

	.site-search {
		display: inline-block;
		padding: 0 20px;
		position: absolute;
		transform: translateX(-50%);
		left: 50%
	}

	.site-search:hover .search-forum {
		visibility: visible;
		transition: all .4s ease 0s;
		top: 0;
		opacity: 1
	}

	.mean-nav li a i {
		display: none
	}

	.slider-text h1 {
		font-size: 34px
	}

	.search-forum {
		left: 50%;
		transform: translateX(-50%)
	}

	.slider-text li a {
		margin-bottom: 20px
	}

	.breadcrumb-list {
		text-align: center
	}

	.breadcrumb-right {
		text-align: center
	}

	.breadcrumb-right span {
		float: none
	}

	.pagehding-sec {
		padding: 80px 0
	}

	.page-heading h1 {
		font-size: 28px
	}

	.simplefilter {
		margin-top: 40px
	}

	.shorttitle {
		background: #4cc700 none repeat scroll 0 0;
		display: block;
		margin-bottom: 40px;
		padding: 20px
	}

	#navbarfiltr.navbar-collapse {
		border: 0;
		box-shadow: none
	}

	.navbarsort .navbar-toggle {
		background: #292929 none repeat scroll 0 0;
		margin-top: 15px
	}

	.navbarsort .navbar-toggle .icon-bar {
		background: #fff
	}

	.shorttitle h2 {
		color: #fff;
		text-transform: uppercase;
		margin-bottom: 0;
		display: inline-block;
		margin-left: 10px
	}

	#navbar li {
		display: inline-block;
		width: 100%
	}

	#navbar ul li a {
		padding: 6px 9px
	}

	.simplefilter li {
		display: inline-block;
		width: 100%;
		margin-bottom: 10px
	}

	.navbarsort {
		display: block
	}

	.contact-field.contact-form,
	.map-sec {
		float: none;
		width: 100%
	}

	.no-padding-left {
		padding-left: 15px
	}

	.no-padding-right {
		padding-right: 15px
	}

	.about-us-img img {
		width: 100%;
		margin-bottom: 30px
	}

	.all-patner.owl-carousel.owl-theme img {
		padding: 50px
	}

	.all-founder {
		margin-top: 40px
	}

	.about-tab-sec {
		margin-bottom: 40px
	}

	.project-gallery .inner {
		width: 50%
	}

	.footer-recent-news {
		margin-bottom: 30px
	}

	.team-member-thumb img {
		width: 100%
	}

	.footer-sec .col-md-5.col-sm-6 {
		padding: 0;
		margin-bottom: 40px
	}

	.footer-recent-news {
		margin-top: 40px
	}

	.why-choose-inner {
		width: 100%
	}

	.counting_sl {
		margin: 40px 0
	}

	.single-blog2 .col-md-7.no-padding-right {
		padding-left: 0;
		margin-top: 20px;
		margin-bottom: 20px
	}

	.all-blog2-feature .owl-controls {
		margin-top: 20px;
		transform: translateX(-50%);
		text-align: center;
		position: relative;
		left: 50%
	}

	.blog2-recent-news {
		margin-top: 40px
	}

	.faq-sec {
		margin-bottom: 40px
	}

	.service2-inner {
		margin-bottom: 50px
	}

	.why-choose-us-tab {
		margin-bottom: 40px
	}

	.login-form.billing-form {
		padding-left: 15px;
		margin-top: 30px
	}

	.update-cart-left {
		text-align: center;
		margin-bottom: 20px
	}

	.update-cart-right {
		text-align: center
	}

	.payment-method {
		padding-left: 15px;
		margin-top: 30px
	}

	.payment-gateway {
		margin-top: 30px;
		position: none;
		top: 0
	}
}

@media only screen and (min-width:0px) and (max-width:659px) {
	.gallery-overlay-text {
		width: 100%;
		top: 20%;
		position: absolute;
		transform: translateY(-50%)
	}

	.gallery-overlay {
		background-image: none;
		background-color: rgba(76, 199, 4, .75)
	}

	.gallery-button a i {
		font-size: 18px;
		width: 40px;
		height: 40px;
		line-height: 40px
	}
}

@media only screen and (min-width:0px) and (max-width:459px) {
	.about-tab li {
		width: 100%
	}

	.about-tab li a {
		margin-bottom: 20px;
		width: 100%
	}
}

@media only screen and (min-width:0px) and (max-width:470px) {
	.all-patner.owl-carousel.owl-theme img {
		padding: 5px
	}
}

@media only screen and (min-width:0px) and (max-width:550px) {}

@media only screen and (min-width:0px) and (max-width:480px) {
	.post-tags {
		display: inline-block;
		float: none;
		width: 100%
	}
}

@media only screen and (min-width:0px) and (max-width:390px) {
	.sec-title h1 {
		font-size: 28px
	}

	.service2-thumb {
		margin-right: 26px
	}

	.service2-inner {
		margin-bottom: 60px
	}
}

@media only screen and (min-width:0px) and (max-width:359px) {
	.service2-inner .media-left {
		padding-right: 0;
		width: 400px
	}

	.service2-thumb {
		margin-right: 0;
		width: 100%
	}

	.service2-thumb img {
		width: 100%
	}

	.service2-sec .media-body {
		float: left;
		text-align: left;
		width: 100%
	}

	.service2-content {
		position: relative;
		top: 0;
		transform: none;
		margin-top: 20px
	}

	.service2-thumb-icon {
		height: 50px;
		left: 50%;
		position: relative;
		right: 0;
		transform: translateX(-50%);
		width: 50px;
		bottom: 25px
	}

	.commentar-sec img {
		margin-bottom: 20px
	}
}

@media (max-width: 767px) {

	.header-top .header-left ul,
	.header-top .header-right ul {
		text-align: center;
	}

	.logo {
		text-align: center;
		margin-bottom: 10px;
	}

	.menu {
		width: 100% !important;
	}
}

/* Force mobile menu toggle on phones & tablets */
@media (max-width: 992px) {
    .navbar-toggler {
        display: block !important;
    }
    .navbar-collapse {
        display: none !important;
    }
}

/* When menu is opened */
@media (max-width: 992px) {
    .navbar-collapse.show {
        display: block !important;
    }
}
/* FIX for missing mobile menu toggle */
@media (max-width: 991px) {
    .menu-toggle {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: absolute;
        right: 20px;
        top: 30px;
        z-index: 9999;
    }

    /* Hide the desktop menu on mobile */
    .mainmenu {
        display: none !important;
    }
}
/* FORCE HAMBURGER ICON INTO PROPER POSITION */
@media (max-width: 991px) {

    /* Hide desktop menu */
    .main-menu ul {
        display: none !important;
    }

    /* Fix hamburger position */
    .meanmenu-reveal {
        display: block !important;
        position: absolute !important;
        right: 10px !important;
        top: 110px !important;    /* 🔥 THIS IS THE CRITICAL FIX */
        z-index: 99999 !important;
    }

    /* Ensure mean menu container wraps correctly */
    .menu {
        position: relative !important;
    }
}
/* ========= MOBILE MENU FIX (logo left, hamburger right) =========
   Paste this at the VERY BOTTOM of main.css (or responsive.css)
   This forces the desktop menu to hide under 992px and places
   the logo and the meanmenu hamburger on one row. */
@media only screen and (max-width: 991px) {

  /* make the menu area a flex row so logo and hamburger sit on same line */
  .hd-sec .container > .row {
    align-items: center;
  }

  .menu {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important; /* needed so meanmenu injects inside and we can position elements */
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Logo stays left */
  .logo {
    padding: 8px 0 !important;
    margin: 0 !important;
    width: auto !important;
  }
  .logo img {
    max-height: 50px !important; /* adjust if you want it smaller */
    height: auto;
    width: auto;
  }

  /* Force hide the original desktop UL so MeanMenu can take over */
  .main-menu,
  .main-menu ul {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    line-height: 0 !important;
  }

  /* When MeanMenu injects .mean-container/.mean-bar, make it visible and aligned */
  .mean-container { width: 100% !important; }
  .mean-container .mean-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important; /* hamburger placed to the right */
    background: transparent !important;
    padding: 0 10px !important;
    height: auto !important;
    position: relative !important;
    z-index: 99999 !important;
  }

  /* Ensure the hamburger (reveal) is visible and sits on the right */
  a.meanmenu-reveal {
    display: block !important;
    order: 2;
    margin: 6px 0 !important;
    padding: 8px 10px !important;
    cursor: pointer;
    text-decoration: none;
    color: #ffffff !important;
    background: transparent !important;
    border: none !important;
    font-size: 0 !important; /* hide text fallback; we'll style spans */
    z-index: 100000 !important;
  }

  /* Style the three-bar icon inside the reveal (MeanMenu default uses spans) */
  a.meanmenu-reveal span {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    background: #ffffff !important;
    margin: 4px 0 !important;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
  }

  /* Ensure the mean-nav (mobile list) appears below and full width when opened */
  .mean-container nav.mean-nav {
    width: 100% !important;
    order: 3;
    margin-top: 8px !important;
  }
  .mean-nav ul {
    display: none; /* meanmenu toggles this; keep default hidden until opened */
    width: 100% !important;
    background: #0000AE !important; /* matches header color; change if needed */
  }
  .mean-nav ul li a {
    display: block !important;
    padding: 12px 20px !important;
    color: #fff !important;
    font-weight: 600 !important;
    text-transform: capitalize !important;
  }

  /* Make sure nothing covers the hamburger */
  .hd-sec,
  .header-top {
    z-index: 10;
    position: relative;
  }

  /* Safety: override any accidental display rules from other CSS */
  .main-menu, .main-menu * { pointer-events: none; }

  /* If the meanmenu reveal still hides because of other CSS, force show */
  .meanmenu-reveal,
  .mean-container .mean-bar,
  .mean-container .mean-bar a.meanmenu-reveal {
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* A small improvement for very small screens: reduce padding */
@media only screen and (max-width: 480px) {
  .logo img { max-height: 42px !important; }
  a.meanmenu-reveal span { width: 18px !important; }
}
/* ===== FORCE SHOW MEANMENU HAMBURGER ===== */
.meanmenu-reveal,
.meanmenu-reveal span {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 999999 !important;
    position: absolute !important;
    right: 15px !important;
    top: 15px !important;
}

/* Fix conflict: some themes hide mean-nav container */
.mean-container .mean-bar {
    display: block !important;
    z-index: 999999 !important;
    position: relative !important;
}

/* Hide desktop menu on mobile */
@media (max-width: 991px) {
    .main-menu ul {
        display: none !important;
    }
}
/* ================================
   FINAL FIXED HAMBURGER + MOBILE MENU
   Standard Layout (Logo Left, Menu Right)
   ================================ */

@media (max-width: 991px) {

    /* Ensure desktop menu stays hidden */
    .main-menu ul {
        display: none !important;
    }

    /* Fix MeanMenu hamburger position */
    .meanmenu-reveal {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: auto !important;
        height: auto !important;

        position: absolute !important;
        top: 20px !important;   /* FIXED (previously 110px!) */
        right: 20px !important;

        z-index: 100000 !important;
        background: transparent !important;
        border: none !important;
        font-size: 0 !important;
    }

    .meanmenu-reveal span {
        background: #ffffff !important;
        width: 22px !important;
        height: 2px !important;
        margin: 4px 0 !important;
        display: block !important;
    }

    /* Layout fixes */
    .hd-sec .container > .row {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    .logo {
        margin: 0 !important;
        padding: 10px 0 !important;
    }

    .logo img {
        max-height: 50px !important;
        height: auto !important;
    }

    /* Prevent menu conflict */
    .main-menu,
    .main-menu ul,
    .main-menu * {
        display: none !important;
        visibility: hidden !important;
    }

    /* MeanMenu container alignment */
    .mean-container .mean-bar {
        background: transparent !important;
        padding: 0 !important;
        height: auto !important;
        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
        position: relative !important;
    }

    .mean-container nav.mean-nav {
        margin-top: 10px !important;
    }

    .mean-nav ul {
        background: #0000AE !important;
        width: 100% !important;
    }

    .mean-nav ul li a {
        color: #fff !important;
        padding: 12px 20px !important;
        font-weight: 600 !important;
        text-transform: capitalize !important;
        border-bottom: 1px solid rgba(255,255,255,0.2);
    }
}