/*
====================================================================
THEME: SMK Batik 1 Surakarta Portal Style
Based on template/index.html design language.
Palette : Navy #0F2C59 | Cyan #008DDA | Yellow #FFC107 | Orange #F7931E
Fonts   : Montserrat (headings) + Roboto (body)
NOTE    : This file is loaded AFTER style.css and the dynamic color
          style block, so it overrides them (later source order wins
          for equal specificity; !important used where needed).
====================================================================
*/

/* ------------------------------------------------------------------
   1. GLOBAL VARIABLES & TYPOGRAPHY
------------------------------------------------------------------ */
:root {
    --primary-navy: #0F2C59;
    --primary-cyan: #008DDA;
    --accent-yellow: #FFC107;
    --accent-orange: #F7931E;
    --bg-light: #F4F6F9;
    --text-dark: #222222;
    --text-gray: #666666;
    --border-color: #E2E8F0;
}

body {
    font-family: 'Roboto', sans-serif;
    color: var(--text-dark);
}

p {
    font-family: 'Roboto', sans-serif;
}

a {
    font-family: 'Roboto', sans-serif;
}

button {
    font-family: 'Roboto', sans-serif;
    border-radius: 4px !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Montserrat', sans-serif;
}

input,
textarea,
select,
.form-control {
    font-family: 'Roboto', sans-serif;
    border-radius: 6px !important;
}

.form-control:focus {
    border-color: #008DDA !important;
    box-shadow: 0 0 0 3px rgba(0, 141, 218, 0.12) !important;
}

/* ------------------------------------------------------------------
   2. TOP BAR (header-area)
------------------------------------------------------------------ */
.header-area {
    background: #0F2C59 !important;
    border-bottom: 2px solid #FFC107;
    padding: 10px 0;
}

.header-area .header-info {
    float: none;
    text-align: left;
}

.header-area .header-info ul.first {
    float: none;
    display: inline-block;
}

.header-info ul.first li {
    color: #E6ECF5 !important;
    font-size: 13px;
}

.header-info ul.first li i {
    color: #FFC107 !important;
}

.header-lang-social {
    text-align: right;
}

.header-lang-social .lang-right {
    float: none;
    display: inline-block;
    vertical-align: middle;
    padding-left: 0;
    margin-right: 12px;
}

.header-area .lang-right select.form-control {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    color: #fff;
    height: 32px;
    font-size: 13px;
}

.header-area .lang-right select.form-control option {
    color: #222;
}

.header-area .header-social {
    display: inline-block;
    vertical-align: middle;
}

.social-bar li a {
    color: #fff !important;
}

.social-bar li a:hover {
    color: #FFC107 !important;
}

/* ------------------------------------------------------------------
   3. HEADER / NAVBAR (menu-area)
------------------------------------------------------------------ */
#strickymenu {
    background: #fff;
    box-shadow: 0 4px 10px rgba(15, 44, 89, 0.08);
}

#strickymenu.sticky {
    box-shadow: 0 4px 14px rgba(15, 44, 89, 0.14);
}

/* Navbar as one full-width cyan band under the logo row */
#strickymenu .main-menu {
    background: #008DDA;
}

#strickymenu .main-menu > .container {
    position: relative;
}

#strickymenu .main-menu-item {
    float: none;
    display: block;
    margin-right: 0;
    height: 60px;
}

ul.nav-menu li {
    margin-left: 0;
}

ul.nav-menu li.menu-item-has-children {
    margin-right: 0;
}

ul.nav-menu li a {
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    background: transparent;
    color: #fff !important;
    padding: 0 20px;
}

#strickymenu ul.nav-menu li a {
    min-height: 60px;
}

/* Active + hover: navy block with yellow text (like reference) */
ul.nav-menu li.active > a,
ul.nav-menu li:hover > a {
    background: #0F2C59 !important;
    color: #FFC107 !important;
}

/* Keep the navbar height constant when sticky */
#strickymenu.sticky ul.nav-menu li a {
    min-height: 60px;
}

/* Desktop sticky bar: show only the cyan navbar (compact) */
@media (min-width: 992px) {
    #strickymenu.sticky > .container {
        display: none;
    }
}

/* SPMB call-to-action button on the right of the navbar */
.btn-spmb {
    position: absolute;
    top: 50%;
    right: 55px;
    transform: translateY(-50%);
    display: inline-block;
    background: #FFC107;
    color: #0F2C59 !important;
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    padding: 12px 22px;
    border-radius: 6px;
    white-space: nowrap;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.btn-spmb i {
    margin-right: 7px;
}

.btn-spmb:hover {
    background: #F7931E;
    color: #fff !important;
}

/* Hide the CTA inside the mobile meanmenu drawer */
.mean-container .mean-nav .btn-spmb {
    display: none !important;
}

/* Trim the navbar on smaller desktops so items never overlap the CTA */
@media (min-width: 992px) and (max-width: 1199px) {
    #strickymenu ul.nav-menu li a {
        padding: 0 12px;
        font-size: 12px;
    }

    .btn-spmb {
        padding: 10px 16px;
        font-size: 12px;
    }
}

ul.nav-menu li ul li a {
    background: #0F2C59 !important;
    color: #fff !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

ul.nav-menu li ul li:hover > a {
    background: #008DDA !important;
    color: #fff !important;
}

ul.nav-menu li ul li:first-child {
    border-top: 3px solid #FFC107;
}

/* Search */
.searchbar .search-button {
    color: #fff;
}

.searchbar .search-button:hover {
    color: #FFC107 !important;
}

.searchbar .input-search {
    background: #0F2C59 !important;
    border-radius: 6px !important;
}

.searchbar .input-search span.input-group-btn {
    background: transparent !important;
}

.searchbar .input-search .btn {
    background: #FFC107 !important;
    color: #0F2C59 !important;
    border-radius: 0 4px 4px 0 !important;
}

/* ------------------------------------------------------------------
   4. SLIDER / HERO
------------------------------------------------------------------ */
.bg-slider {
    background: linear-gradient(100deg, rgba(15, 44, 89, 0.92) 0%, rgba(0, 141, 218, 0.62) 55%, rgba(15, 44, 89, 0.45) 100%) !important;
}

.text-animated h1 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.35);
}

.text-animated li a {
    background: #FFC107 !important;
    border-color: #FFC107 !important;
    color: #0F2C59 !important;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 4px;
}

.text-animated li a:hover {
    background: #F7931E !important;
    border-color: #F7931E !important;
    color: #fff !important;
}

.text-animated li:last-child a {
    background: transparent !important;
    border-color: #fff !important;
    color: #fff !important;
}

.text-animated li:last-child a:hover {
    background: #fff !important;
    border-color: #fff !important;
    color: #0F2C59 !important;
}

.slider-one .owl-nav .owl-prev,
.slider-one .owl-nav .owl-next {
    background: #008DDA !important;
    border-color: #008DDA !important;
    border-radius: 4px;
}

.slider-one .owl-nav .owl-prev:hover,
.slider-one .owl-nav .owl-next:hover {
    background: #FFC107 !important;
    border-color: #FFC107 !important;
    color: #0F2C59 !important;
}

/* ------------------------------------------------------------------
   5. SECTION HEADLINES
------------------------------------------------------------------ */
.headline h2,
.headline-left h2 {
    font-family: 'Montserrat', sans-serif;
    color: #0F2C59;
    letter-spacing: 0.5px;
}

.headline h2:after {
    content: '';
    display: block;
    width: 70px;
    height: 4px;
    margin: 14px auto 0;
    background: #008DDA;
    border-radius: 2px;
}

.headline.hl-left h2:after {
    margin-left: 0;
}

.headline.hl-white h2:after {
    background: #FFC107;
}

.headline-left h2:after {
    content: '';
    display: block;
    width: 70px;
    height: 4px;
    margin-top: 14px;
    background: #008DDA;
    border-radius: 2px;
}

.headline-left.hl-white h2:after {
    background: #FFC107;
}

.headline h3 {
    font-family: 'Roboto', sans-serif;
    color: #666;
}

.headline.hl-white h3 {
    color: rgba(255, 255, 255, 0.85) !important;
}

/* ------------------------------------------------------------------
   6. ABOUT / PROGRESS / VIDEO
------------------------------------------------------------------ */
.about-tab:before {
    background: linear-gradient(135deg, rgba(15, 44, 89, 0.9) 0%, rgba(0, 141, 218, 0.75) 100%) !important;
    opacity: 1 !important;
}

.progress-gallery .progress-bar {
    background: #E2E8F0;
    border-radius: 10px;
}

.progress-gallery .bar-container .progress .progress-bar-custom {
    background: #008DDA !important;
    border-radius: 10px;
}

.progress-gallery .bar-container .percentage-show {
    color: #0F2C59;
    font-weight: 700;
}

.video-button span {
    border-left-color: #008DDA !important;
}

/* ------------------------------------------------------------------
   7. WHY CHOOSE / FEATURE
------------------------------------------------------------------ */
.choose-item {
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(15, 44, 89, 0.12);
}

.choose-item:before {
    background: linear-gradient(160deg, rgba(15, 44, 89, 0.92) 0%, rgba(0, 141, 218, 0.78) 100%) !important;
}

.choose-item:hover:before {
    opacity: 1 !important;
}

.choose-icon i {
    color: #FFC107;
}

.choose-text p {
    color: #E7F1FB;
}

.feature-icon i {
    background: #008DDA !important;
    border-color: #008DDA !important;
}

.feature-two .feature-icon i {
    border-radius: 6px 0 0 6px !important;
}

.feature-two .feature-icon img {
    border-radius: 6px 0 0 6px !important;
}

.feature-text {
    background: #fff !important;
    border: 1px solid #E2E8F0 !important;
}

.feature-two .feature-text {
    border-radius: 0 6px 6px 0;
}

.feature-item:hover .feature-text {
    background: #0F2C59 !important;
    border-color: #0F2C59 !important;
    color: #fff !important;
}

.feature-item:hover .feature-text h4 {
    color: #FFC107 !important;
}

.feature-item:hover .feature-icon i {
    background: #FFC107 !important;
    color: #0F2C59 !important;
    border-color: #FFC107 !important;
}

.feature-item:hover .feature-icon img {
    background: #FFC107 !important;
    border-color: #FFC107 !important;
}

/* ------------------------------------------------------------------
   8. SERVICES
------------------------------------------------------------------ */
.services-item {
    background: #fff;
    border: 1px solid #E2E8F0 !important;
    border-bottom: 4px solid #008DDA !important;
    border-radius: 6px;
    overflow: hidden;
}

.services-item:hover {
    box-shadow: 0 10px 24px rgba(15, 44, 89, 0.14);
    transform: translateY(-5px);
    border-bottom-color: #FFC107 !important;
}

.services-text {
    background: #fff !important;
}

.services-item:hover .services-text {
    background: #fff !important;
}

.services-text h3 a {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    color: #0F2C59;
}

.services-text a:hover {
    color: #008DDA !important;
}

/* ------------------------------------------------------------------
   9. COUNTER
------------------------------------------------------------------ */
.bg-counterup {
    background: linear-gradient(135deg, rgba(15, 44, 89, 0.94) 0%, rgba(0, 141, 218, 0.8) 100%) !important;
    opacity: 1 !important;
}

.counter-item {
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 6px;
}

.counter-item:before,
.counter-item:after {
    background: #FFC107 !important;
}

.counter-item i {
    color: #FFC107;
}

/* ------------------------------------------------------------------
   10. PORTFOLIO
------------------------------------------------------------------ */
.portfolio-menu li:hover,
.portfolio-menu li.filtr-active {
    color: #008DDA !important;
}

.portfolio-menu li.filtr-active {
    border-bottom-color: #008DDA !important;
}

.portfolio-menu li.filtr-active:before {
    border-color: #008DDA transparent transparent !important;
}

.portfolio-group {
    background: #fff;
    border: 1px solid #E2E8F0;
    border-radius: 6px;
    overflow: hidden;
}

.portfolio-bg {
    background: linear-gradient(135deg, rgba(15, 44, 89, 0.9) 0%, rgba(0, 141, 218, 0.82) 100%) !important;
}

.portfolio-text h3 a:hover {
    color: #008DDA !important;
}

.project-carousel .owl-nav .owl-prev,
.project-carousel .owl-nav .owl-next {
    background: #008DDA !important;
    border-radius: 4px;
}

.project-carousel .owl-nav .owl-prev:hover,
.project-carousel .owl-nav .owl-next:hover {
    background: #0F2C59 !important;
}

/* ------------------------------------------------------------------
   11. BOOKING & FAQ
------------------------------------------------------------------ */
.booking-area:before {
    background: linear-gradient(160deg, rgba(15, 44, 89, 0.96) 0%, rgba(15, 44, 89, 0.85) 100%) !important;
    opacity: 1 !important;
}

.bg-booking {
    background-color: rgba(15, 44, 89, 0.55) !important;
    opacity: 1 !important;
}

.booking-form input:focus,
.booking-form textarea:focus {
    border-color: #008DDA !important;
}

.booking-form button[type="submit"] {
    background: #FFC107 !important;
    color: #0F2C59 !important;
    border-radius: 4px !important;
    font-weight: 700;
}

.booking-form button[type="submit"]:hover {
    background: #F7931E !important;
    color: #fff !important;
}

.form-button .btn {
    background: #FFC107 !important;
    border-color: #FFC107 !important;
    color: #0F2C59 !important;
    border-radius: 4px !important;
    font-weight: 700;
}

.form-button .btn:hover,
.form-button .btn2:hover {
    background: #F7931E !important;
    border-color: #F7931E !important;
    color: #fff !important;
}

.faq-header button.faq-button {
    background: #008DDA !important;
    color: #fff !important;
}

.faq-header button.faq-button.collapsed {
    background: #fff !important;
    color: #0F2C59 !important;
}

.faq-header button.faq-button.collapsed:hover {
    background: #FFC107 !important;
    color: #0F2C59 !important;
}

.faq-body {
    background: #fff !important;
}

/* ------------------------------------------------------------------
   12. TEAM
------------------------------------------------------------------ */
.team-item {
    background: #fff;
    border: 1px solid #E2E8F0;
    border-radius: 6px;
    overflow: hidden;
}

.team-text {
    background: #0F2C59 !important;
}

.team-text a:hover {
    color: #FFC107;
}

.team-social li a:hover {
    background: #FFC107 !important;
    color: #0F2C59 !important;
    border-top-color: #FFC107 !important;
    border-bottom-color: #FFC107 !important;
}

.team-carousel .owl-nav .owl-prev,
.team-carousel .owl-nav .owl-next {
    background: #008DDA !important;
    border-radius: 4px;
}

.team-carousel .owl-nav .owl-prev:hover,
.team-carousel .owl-nav .owl-next:hover {
    background: #0F2C59 !important;
}

.team-detail-text ul li a {
    background: #008DDA !important;
}

.team-detail-text ul li a:hover {
    background: #0F2C59 !important;
}

.team-info ul li span {
    color: #008DDA !important;
}

/* ------------------------------------------------------------------
   13. PRICING
------------------------------------------------------------------ */
.price-item {
    background: #fff;
    border: 1px solid #E2E8F0;
    border-radius: 6px;
    box-shadow: 0 2px 10px rgba(15, 44, 89, 0.08);
}

.price-header i {
    background: #008DDA !important;
}

.price-item:hover .price-header i {
    background: #FFC107 !important;
    color: #0F2C59 !important;
}

.price-body li {
    border-bottom: 1px solid #E2E8F0;
}

.button-df a {
    background: #008DDA !important;
    border-radius: 4px;
}

.button-df a:hover {
    background: #0F2C59 !important;
}

/* ------------------------------------------------------------------
   14. TESTIMONIAL
------------------------------------------------------------------ */
.bg-testimonial {
    background: linear-gradient(135deg, rgba(15, 44, 89, 0.92) 0%, rgba(0, 141, 218, 0.75) 100%) !important;
    opacity: 1 !important;
}

.testimonial-item {
    border-radius: 6px;
}

.testimonial-carousel .owl-dots .owl-dot {
    background: rgba(255, 255, 255, 0.45) !important;
}

.testimonial-carousel .owl-dots .owl-dot.active {
    background: #FFC107 !important;
}

.testimonial-grid .testimonial-description p:before,
.testimonial-two-carousel .testimonial-description p:before {
    background: #008DDA !important;
}

/* ------------------------------------------------------------------
   15. BLOG / NEWS CARDS
------------------------------------------------------------------ */
.blog-item {
    background: #fff;
    border: 1px solid #E2E8F0;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(15, 44, 89, 0.05);
}

.blog-text {
    background: #fff !important;
}

.blog-item h3 a {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    color: #0F2C59;
}

.blog-item h3 a:hover {
    color: #008DDA !important;
}

.blog-item span i {
    color: #008DDA !important;
}

.blog-author {
    background: #F4F6F9;
    border-top: 1px solid #E2E8F0;
}

.blog-author li a i {
    color: #008DDA !important;
}

.blog-author li a:hover {
    color: #008DDA !important;
}

.blog-author li.blog-button a {
    background: #008DDA !important;
}

.blog-author li.blog-button a:hover {
    background: #0F2C59 !important;
}

.blog-author li.blog-button i {
    color: #fff !important;
}

.blog-carousel .owl-nav .owl-prev,
.blog-carousel .owl-nav .owl-next {
    background: #008DDA !important;
    border-radius: 4px;
}

.blog-carousel .owl-nav .owl-prev:hover,
.blog-carousel .owl-nav .owl-next:hover {
    background: #0F2C59 !important;
}

.blog-one-text h3 a:hover {
    color: #008DDA !important;
}

.blog-one-text ul li i,
.single-blog ul li i {
    color: #008DDA !important;
}

.recent-text a:hover {
    color: #008DDA !important;
}

/* ------------------------------------------------------------------
   16. CTA (call-us)
------------------------------------------------------------------ */
.call-us:before {
    background: linear-gradient(135deg, rgba(15, 44, 89, 0.95) 0%, rgba(0, 141, 218, 0.85) 100%) !important;
    opacity: 1 !important;
}

.call-text h3 {
    font-family: 'Montserrat', sans-serif;
}

.call-us .button a {
    background: #FFC107 !important;
    border-color: #FFC107 !important;
    color: #0F2C59 !important;
    border-radius: 4px;
    font-weight: 700;
}

.call-us .button a:hover {
    background: #F7931E !important;
    color: #fff !important;
}

/* ------------------------------------------------------------------
   17. FOOTER
------------------------------------------------------------------ */
.footer-area {
    background: #0F2C59 !important;
    border-top: 5px solid #FFC107;
}

.footer-item {
    color: #D1D5DB !important;
}

.footer-item h3 {
    color: #FFC107 !important;
    font-family: 'Montserrat', sans-serif;
}

.footer-item h3:before,
.footer-item h3:after {
    background: #FFC107 !important;
}

.footer-item p,
.footer-item a {
    color: #D1D5DB !important;
}

.footer-item ul li a:before {
    color: #FFC107 !important;
}

.footer-item ul li a:hover,
.footer-recent-text a:hover {
    color: #FFC107 !important;
}

.footer-address-item .icon {
    color: #FFC107;
}

.footer-item .form-control {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    color: #fff;
}

.footer-item .form-control::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

.footer-item .btn {
    background: #FFC107 !important;
    border: 1px solid #FFC107 !important;
    color: #0F2C59 !important;
}

.footer-item span.input-group-btn {
    background: transparent !important;
}

.footer-item .input-group .btn {
    height: 48px;
    line-height: 1.2;
}

.footer-item .btn:hover {
    background: #F7931E !important;
    border-color: #F7931E !important;
    color: #fff !important;
}

.footer-item ul.footer-social li a {
    background: transparent !important;
    border: 1px solid #FFC107 !important;
    color: #FFC107 !important;
}

.footer-item ul.footer-social li a:hover {
    background: #FFC107 !important;
    border-color: #FFC107 !important;
    color: #0F2C59 !important;
}

.footer-bottom {
    background: #0A1F40 !important;
}

.footer-menu {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.footer-menu ul li a:hover {
    color: #FFC107 !important;
}

.copy-text p {
    color: #9CA3AF !important;
}

/* Scroll top */
.scroll-top {
    background: #FFC107 !important;
    color: #0F2C59 !important;
    border-radius: 4px;
}

.scroll-top:hover {
    background: #F7931E !important;
    color: #fff !important;
}

/* ------------------------------------------------------------------
   18. INNER PAGE BANNERS
------------------------------------------------------------------ */
.banner-slider .bg {
    background: linear-gradient(135deg, rgba(15, 44, 89, 0.92) 0%, rgba(0, 141, 218, 0.75) 100%) !important;
    opacity: 1 !important;
}

.banner-text h1 {
    font-family: 'Montserrat', sans-serif;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.35);
}

/* ------------------------------------------------------------------
   19. SIDEBARS / MISC (inner pages)
------------------------------------------------------------------ */
.headstyle h4 {
    font-family: 'Montserrat', sans-serif;
    color: #0F2C59;
}

.headstyle h4:before,
.headstyle h4:after {
    background: #008DDA !important;
}

.sidebar-item {
    background: #fff;
    border: 1px solid #E2E8F0;
    border-top: 4px solid #0F2C59;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(15, 44, 89, 0.06);
}

.sidebar-item h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    color: #0F2C59;
}

.sidebar-item h3:before,
.sidebar-item h3:after {
    background: #008DDA !important;
}

.sidebar-item button {
    background: #008DDA !important;
    border-color: #008DDA !important;
    border-radius: 0 4px 4px 0 !important;
}

.sidebar-item button:hover {
    background: #0F2C59 !important;
    border-color: #0F2C59 !important;
}

.sidebar-item ul li a:hover {
    color: #008DDA !important;
}

.service-sidebar-item ul li a:hover {
    color: #008DDA !important;
}

.portfolio-details ul li span {
    color: #008DDA !important;
}

.event-item {
    background: #fff;
    border: 1px solid #E2E8F0;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(15, 44, 89, 0.05);
}

li.event-header-left i {
    color: #008DDA !important;
}

.event-contact-item {
    background: #008DDA !important;
    border-radius: 6px;
}

.event-contact-item:hover {
    background: #fff !important;
    border: 1px solid #E2E8F0;
}

.event-contact-item:hover .event-contact-icon {
    color: #008DDA !important;
    border-color: #008DDA !important;
}

.gallery-bg {
    background: linear-gradient(135deg, rgba(15, 44, 89, 0.9) 0%, rgba(0, 141, 218, 0.8) 100%) !important;
}

/* ------------------------------------------------------------------
   20. BUTTONS / FORM CONTROLS / SEARCH GROUP
------------------------------------------------------------------ */
span.input-group-btn {
    background: #008DDA !important;
}

.contact-icon {
    color: #008DDA !important;
}

.contact-item:hover .contact-icon {
    background: #008DDA !important;
    border-color: #008DDA !important;
    color: #fff !important;
}

.contact-form .btn {
    background: #008DDA !important;
    border-color: #008DDA !important;
}

.contact-form .btn:hover {
    background: #0F2C59 !important;
    border-color: #0F2C59 !important;
}

/* ------------------------------------------------------------------
   21. MOBILE MEAN MENU
------------------------------------------------------------------ */
.mean-container .mean-bar,
.mean-bar {
    background: #0F2C59 !important;
}

.mean-container .mean-nav ul li a {
    background: #0F2C59 !important;
    color: #fff !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.mean-container .mean-nav ul li a:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #FFC107 !important;
}

/* ------------------------------------------------------------------
   22. RESPONSIVE
------------------------------------------------------------------ */
@media (max-width: 991px) {
    .header-area .header-info {
        text-align: center;
        margin-bottom: 6px;
    }

    .header-lang-social {
        text-align: center;
    }

    .header-lang-social .lang-right {
        margin: 0 8px 0 0;
    }

    #strickymenu .main-menu {
        background: transparent !important;
    }

    .heading-info {
        float: none;
    }

    ul.nav-menu li {
        margin-left: 0;
    }
}

@media (max-width: 575px) {
    .header-area .lang-right select.form-control {
        width: 100%;
    }

    .headline h2 {
        font-size: 26px;
    }
}