/*
Theme Name: Qtheme
Theme URI: https://afterimagedesigns.com/q_theme/
Author: Afterimage Designs
Author URI: https://afterimagedesigns.com/
Description:  The best WordPress starter theme based on the most powerful frameworks in the world: "_s" (by Automattic, the main people behind WordPress development), Twitter Bootstrap (the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web) and Font Awesome (or Fontawesome, a full suite of 675+ pictographic icons for easy scalable vector graphics on websites). This theme, like WordPress, is licensed under the GPL. You can use this theme as base for your next WordPress theme project and you are allowed to remove the link at the footer or do whatever you want. Your feedback on how we can continuously improve this WordPress Starter Theme Bootstrap will be highly appreciated. Page templates includes Right-sidebar (default page template), Left-Sidebar, Full-Width, Blank with container, Blank without container Page. Other features - Currently using Bootstrap v4.0.0 , Widgetized footer area, WooCommerce ready, Compatible with Contact Form 7, Compatible with Visual Composer, Compatible with Elementor Page Builder. This theme will be an active project which we will update from time to time. Check this page regularly for the updates.
Version: 3.3.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: q_theme
Requires at least: 4.7
Requires PHP: 5.2.4
Tested up to: 5.4
Tags: blog, custom-menu, featured-images, threaded-comments, translation-ready, right-sidebar, custom-background, e-commerce, theme-options, sticky-post, full-width-template
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
# Woocommerce
# Footer
# Marquee
# Front Page
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
body {
  margin: 0;
  -webkit-font-smoothing: auto;
  font-size:1rem !important;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
  display: block;
}

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden],
template {
  display: none;
}

a {
  background-color: transparent;
  color:#00017a;
}

a:active,
a:hover {
  outline: 0;
  color:#1873d3;
}

dfn {
  font-style: italic;
}

mark {
  background: #ff0;
  color: #000;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img {
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 1em 2.5rem;
}

hr {
  box-sizing: content-box;
  height: 0;
}

button {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}

button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  border: 0;
  padding: 0;
}

textarea {
  overflow: auto;
}

optgroup {
  font-weight: bold;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
  clear: both;
  color: #24292e;
  font-weight: 600;
  margin-top: 24px;
  margin-bottom: 15px;
}
h1 {
  font-size: 32px;
  padding-bottom: 10px;
}
h2 {
  font-size: 24px;
  padding-bottom: 0.3em;
  line-height: 1.25;
}
h3 {
  font-size: 18px;
  line-height: 25px;
}
h4 {
  font-size: 16px;
  line-height: 20px;
}
h5 {
  font-size: 14px;
  line-height: 17.5px;
}

p {
  margin-bottom: 1.5em;
}
h1.entry-title {
  font-size: 1.31rem;
  border-bottom: 1px solid #eaecef;
}
h2.entry-title {
  border-bottom: 1px solid #eaecef;
}
h3.widget-title {
  font-size: 1.2rem;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
body {
  background: #fff;
  /* Fallback for when there is no custom background color defined. */
}

img {
  height: auto;
  /* Make sure images are scaled correctly. */
  max-width: 100%;
  /* Adhere to container width. */
}

figure {
  margin: 1em 0;
  /* Extra wide images within figure tags don't overflow the content area. */
}

table {
  margin: 0 0 1.5em;
  width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
header#masthead {
  margin-bottom: 0;
  background-color: #563d7c ;
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,.05), inset 0 -1px 0 rgba(0,0,0,.1);
  border: 0;
}

.navbar-brand > a {
  color: rgba(0, 0, 0, 0.9);
  font-size: 1.1rem;
  outline: medium none;
  text-decoration: none;
  color: #fff;
  font-weight: 700;
}

.navbar-brand > a:visited, .navbar-brand > a:hover {
  text-decoration: none;
}

#page-sub-header {
  position: relative;
  padding-top: 5rem;
  padding-bottom: 0;
  text-align: center;
  font-size: 1.25rem;
  background-size: cover !important;
}

body:not(.theme-preset-active) #page-sub-header h1 {
  line-height: 1.6;
  font-size: 4rem;
  color: #563e7c;
  margin: 0 0 1rem;
  border: 0;
  padding: 0;
}

#page-sub-header p {
  margin-bottom: 0;
  line-height: 1.4;
  font-size: 1.25rem;
  font-weight: 300;
}
body:not(.theme-preset-active) #page-sub-header p {
color: #212529;
}
a.page-scroller {
  color: #333;
  font-size: 2.6rem;
  display: inline-block;
  margin-top: 2rem;
}


/* ============================================
   NAVBAR DROPDOWN MENU - LEVEL 2 & 3
   ============================================ */

/* Navbar Base - Left Aligned */
.navbar-nav {
    align-items: flex-start !important;
    justify-content: flex-start !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.navbar-nav .nav-item,
.navbar-nav .nav-link {
    text-align: left !important;
}

.navbar-nav .nav-link {
    justify-content: flex-start !important;
}

/* Menu Item with Children */
.navbar-nav .menu-item-has-children {
    position: relative;
}

/* Dropdown Menu Base Styles */
.navbar-nav .sub-menu,
.navbar-nav .dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 99999;
    min-width: 250px;
    padding: 0;
    margin: 0;
    background-color: #ffffff;
    border: 1px solid #e5e5e5;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    list-style: none;
    text-align: left !important;
}

.navbar-nav .sub-menu li,
.navbar-nav .dropdown-menu li {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: left !important;
}

.navbar-nav .sub-menu a,
.navbar-nav .dropdown-menu a {
    display: block;
    padding: 12px 20px;
    color: #333333;
    text-decoration: none;
    font-size: 14px;
    border-bottom: 1px solid #f0f0f0;
    transition: all 0.3s ease;
    text-align: left !important;
}

.navbar-nav .sub-menu a:hover,
.navbar-nav .dropdown-menu a:hover {
    background-color: #f8f9fa;
    color: #007bff;
    padding-left: 25px;
}

/* Level 3 Dropdown (Nested) */
.navbar-nav .sub-menu .menu-item-has-children,
.navbar-nav .dropdown-menu .menu-item-has-children {
    position: relative;
}

.navbar-nav .sub-menu .sub-menu,
.navbar-nav .dropdown-menu .dropdown-menu {
    left: 100%;
    top: 0;
    margin-top: -1px;
}

/* Arrow Indicators */
.navbar-nav .menu-item-has-children > a::after {
    content: '\f107';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    margin-left: 8px;
    font-size: 12px;
}

.navbar-nav .sub-menu .menu-item-has-children > a::after,
.navbar-nav .dropdown-menu .menu-item-has-children > a::after {
    content: '\f105';
    float: right;
}

/* Overflow Visible */
.bat-mainnav,
.bat-menu,
.navbar-collapse {
    overflow: visible !important;
}

/* Custom Navbar Toggler Icon - Warna Biru */
.bat-menu .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='%23003366' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.5' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

.bat-menu .navbar-toggler {
  color: #ffcc00 !important;

}

.bat-menu .navbar-toggler:hover,
.bat-menu .navbar-toggler:focus {
  color: #ffcc00 !important;
}

.bat-menu .navbar-toggler-icon:hover {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='%230056b3' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

/* ============================================
   MOBILE STYLES (max-width: 1199px)
   ============================================ */
@media (max-width: 1199px) {
    .navbar-nav .sub-menu,
    .navbar-nav .dropdown-menu {
        position: static;
        width: auto;
        background-color: #f8f9fa;
        border: 0;
        box-shadow: none;
        text-align: left !important;
    }
    
    .navbar-nav .sub-menu a,
    .navbar-nav .dropdown-menu a {
        padding: 10px 15px;
        text-align: left !important;
    }
    
    .navbar-nav .menu-item-has-children > a.dropdown-active::after {
        transform: rotate(180deg);
    }
}

/* ============================================
   DESKTOP STYLES (min-width: 1200px)
   ============================================ */
@media (min-width: 1200px) {
    /* Show dropdown on hover */
    .navbar-nav .dropdown:hover > .dropdown-menu {
        display: block !important;
    }
    
    /* Bootstrap 4 'show' class */
    .navbar-nav .dropdown.show > .dropdown-menu {
        display: block !important;
    }
    
    /* Remove transform that might interfere */
    .navbar-nav .dropdown-menu {
        transform: none !important;
        margin-top: 0 !important;
    }
}

@media screen and (min-width: 768px) {
  body:not(.theme-preset-active) #page-sub-header h1 {
    font-size: 3.750rem;
  }
  body:not(.theme-preset-active) #page-sub-header {
    font-size: 1.25rem;
  }
}
@media screen and (min-width: 992px) {
  #page-sub-header p {
    max-width: 43rem;
    margin: 0 auto;
  }
}
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
#masthead nav {
  padding-left: 0;
  padding-right: 0;
}

body:not(.theme-preset-active) #masthead .navbar-nav > li > a {
  color: #cdbfe3;
  padding: 0.5rem;
  font-weight: 500;
  font-size: 0.875rem;
}

body:not(.theme-preset-active) #masthead .navbar-nav > li > a:hover,
body:not(.theme-preset-active) #masthead .navbar-nav > li.current_page_item > a {
  color: #fff;
  font-weight: 600;
  /*background: #f9f9f9;*/
}

.navbar-brand {
  height: auto;
}

.navbar-toggle .icon-bar {
  background: #000 none repeat scroll 0 0;
}

.dropdown-menu .dropdown-toggle::after {
  border-bottom: 0.3em solid transparent;
  border-left: 0.3em solid;
  border-top: 0.3em solid transparent;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children {
    position: relative;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}
.dropdown.menu-item-has-children .dropdown.menu-item-has-children:hover>.dropdown-menu {
    display: block;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children:hover>a:after {
    border-left-color: #fff;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children.pull-left {
    float: none;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
  display: block;
}

.dropdown-item {
  line-height: 1.2;
  padding-bottom: 0.313rem;
  padding-top: 0.313rem;
}

.dropdown-menu {
  min-width: 12.500rem;
}

.dropdown .open .dropdown-menu {
  display: block;
  left: 12.250em;
  top: 0;
}

.dropdown-menu .dropdown-item {
  white-space: normal;
  background: transparent;
  line-height: 1.6;
}
.dropdown-menu .dropdown-item:hover {
  background: transparent;
}

@media screen and (min-width: 37.5em) {
  .menu-toggle {
    display: none;
  }
}
@media screen and (min-width: 769px) {
  .dropdown-menu li > .dropdown-menu {
    right: -9.875rem;
    top: 1.375rem;
  }
}
@media screen and (max-width: 991px) {
  .navbar-nav .dropdown-menu {
    border: medium none;
    margin-left: 1.250rem;
    padding: 0;
  }

  .dropdown-menu li a {
    padding: 0;
  }

  #masthead .navbar-nav > li > a {
    padding-bottom: 0.625rem;
    padding-top: 0.313rem;
  }

  .navbar-light .navbar-toggler {
    border: medium none;
    outline: none;
  }
}
.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
  margin: 0 0 1.5em;
  overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
  float: left;
  width: 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
  float: right;
  text-align: right;
  width: 50%;
}
.comment-content.card-block {
  padding: 20px;
}

.navigation.post-navigation {
  padding-top: 1.875rem;
}

.post-navigation .nav-previous a,
.post-navigation .nav-next a {
  border: 1px solid #ddd;
  border-radius: 0.938rem;
  display: inline-block;
  padding: 0.313rem 0.875rem;
  text-decoration: none;
}

.post-navigation .nav-next a::after {
  content: " \2192";
}

.post-navigation .nav-previous a::before {
  content: "\2190 ";
}

.post-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover {
  background: #eee none repeat scroll 0 0;
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  word-wrap: normal !important;
  /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}
.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  color: #21759b;
  display: block;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  height: auto;
  left: 0.313rem;
  line-height: normal;
  padding: 0.938rem 1.438rem 0.875rem;
  text-decoration: none;
  top: 0.313rem;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
  outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
  display: inline;
  float: left;
  margin-right: 1.5em;
}

.alignright {
  display: inline;
  float: right;
  margin-left: 1.5em;
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

a img.alignright {
  float: right;
  margin: 0.313rem 0 1.25rem 1.25rem;
}

a img.alignnone {
  margin: 0.313rem 1.25rem 1.25rem 0;
}

a img.alignleft {
  float: left;
  margin: 0.313rem 1.25rem 1.25rem 0;
}

a img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.wp-caption.alignnone {
  margin: 0.313rem 1.25rem 1.25rem 0;
}

.wp-caption.alignleft {
  margin: 0.313rem 1.25rem 1.25rem 0;
}

.wp-caption.alignright {
  margin: 0.313rem 0 1.25rem 1.25rem;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
  content: "";
  display: table;
  table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
  clear: both;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
  margin: 0 0 1.5em;
  font-size: 0.875rem;
  /* Make sure select elements fit in widgets. */
}
.widget select {
  max-width: 100%;
}

.widget_search .search-form input[type="submit"] {
  display: none;
}

.nav > li > a:focus,
.nav > li > a:hover {
  background-color: #eee;
  text-decoration: none;
}
.half-rule {
  width: 6rem;
  margin: 2.5rem 0;
}
.widget_categories .nav-link {
  display: inline-block;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/

#content.site-content {
  padding-bottom: 3.75rem;
  padding-top: 4.125rem;
}

.sticky .entry-title::before {
  content: '\f08d';
  font-family: "Font Awesome\ 5 Free";
  font-size: 1.563rem;
  left: -2.5rem;
  position: absolute;
  top: 0.375rem;
  font-weight: 900;
}

.sticky .entry-title {
  position: relative;
}

.single .byline,
.group-blog .byline {
  display: inline;
}

.page-content,
.entry-content,
.entry-summary {
  margin: 1.5em 0 0;
}

.page-links {
  clear: both;
  margin: 0 0 1.5em;
}

.page-template-blank-page .entry-content,
.blank-page-with-container .entry-content {
  margin-top: 0;
}

.post.hentry {
  margin-bottom: 4rem;
}

.posted-on, .byline, .comments-link {
  color: #9a9a9a;
}

.entry-title > a {
  color: inherit;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
  word-wrap: break-word;
}

.bypostauthor {
  display: block;
}

.comment-body .pull-left {
  padding-right: 0.625rem;
}

.comment-list .comment {
  display: block;
}

.comment-list {
  padding-left: 0;
}

.comments-title {
  font-size: 1.125rem;
}

.comment-list .pingback {
  border-top: 1px solid rgba(0, 0, 0, 0.125);
  padding: 0.563rem 0;
}

.comment-list .pingback:first-child {
  border: medium none;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
  /* Theme Footer (when set to scrolling) */
  display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
  display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
  border: none;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
  max-width: 100%;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
  background: #f1f1f1 none repeat scroll 0 0;
  border: 1px solid #f0f0f0;
  max-width: 96%;
  padding: 0.313rem 0.313rem 0;
  text-align: center;
}
.wp-caption img[class*="wp-image-"] {
  border: 0 none;
  height: auto;
  margin: 0;
  max-width: 100%;
  padding: 0;
  width: auto;
}
.wp-caption .wp-caption-text {
  font-size: 0.688rem;
  line-height: 1.063rem;
  margin: 0;
  padding: 0.625rem;
}

.wp-caption-text {
  text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
  margin-bottom: 1.5em;
}

.gallery-item {
  display: inline-block;
  text-align: center;
  vertical-align: top;
  width: 100%;
}
.gallery-item .gallery-columns-2 {
  max-width: 50%;
}
.gallery-item .gallery-columns-3 {
  max-width: 33.33333%;
}
.gallery-item .gallery-columns-4 {
  max-width: 25%;
}
.gallery-item .gallery-columns-5 {
  max-width: 20%;
}
.gallery-item .gallery-columns-6 {
  max-width: 16.66667%;
}
.gallery-item .gallery-columns-7 {
  max-width: 14.28571%;
}
.gallery-item .gallery-columns-8 {
  max-width: 12.5%;
}
.gallery-item .gallery-columns-9 {
  max-width: 11.11111%;
}

.gallery-caption {
  display: block;
}

/*--------------------------------------------------------------
# Plugin Compatibility
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Woocommerce
--------------------------------------------------------------*/
.woocommerce-cart-form .shop_table .coupon .input-text {
  width: 8.313rem !important;
}

.variations_form .variations .value > select {
  margin-bottom: 0.625rem;
}

.woocommerce-MyAccount-content .col-1,
.woocommerce-MyAccount-content .col-2 {
  max-width: 100%;
}

/*--------------------------------------------------------------
## Elementor
--------------------------------------------------------------*/
.elementor-page article .entry-footer {
  display: none;
}

.elementor-page.page-template-fullwidth #content.site-content {
  padding-bottom: 0;
  padding-top: 0;
}

.elementor-page .entry-content {
  margin-top: 0;
}

/*--------------------------------------------------------------
## Visual Composer
--------------------------------------------------------------*/
.vc_desktop article .entry-footer {
  display: none;
}

.vc_desktop #content.site-content {
  padding-bottom: 0;
  padding-top: 0;
}

.vc_desktop .entry-content {
  margin-top: 0;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
footer#colophon {
  font-size: 85%;
  text-align:center;
  background: #ffb900;
}
body:not(.theme-preset-active) footer#colophon {
  color: #99979c;
  background-color: #f7f7f7;
}
.navbar-dark .site-info {
  color: #fff;
}
.copyright {
  font-size: 0.875rem;
  margin-bottom: 0;
  text-align: center;
}

.copyright a, footer#colophon a {
  color: inherit;
}

@media screen and (max-width: 767px) {
  #masthead .navbar-nav > li > a {
    padding-bottom: 0.938rem;
    padding-top: 0.938rem;
  }
}

/*--------------------------------------------------------------
# Marquee
--------------------------------------------------------------*/
.ticker-mar {
	margin-bottom: 0px;
	margin-top: 0px;
	background-color: #f9c92d;
	color: #0C0C0C;
	width: 100%;
	height: 35px;
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 9999999;
}

.news-mar {
	
}

.news-content-mar {
	
}

/*--------------------------------------------------------------
# Custom
--------------------------------------------------------------*/
/*header*/

#header-top {
	background-color:#00017a;
    padding-top: 1rem;
    padding-bottom: 1rem;
	color:#fff;
	font-size:14px;
	border-bottom: solid 3px #ffb900;
}

#header-top .social-links {
	text-align:right;
}
#header-top .social-links ul {
	padding:0;
	list-style:none;
	margin:0;
}
#header-top .social-links ul li {
	display:inline-block;
	padding:0 5px;
}

#header-top .social-links ul li  a{
	color:#fff;
}

#header-top .date-info i {
	padding-right:10px;
}

#header-top .date-info {
	font-size: 0.89rem;
}

#main-nav ul li a {
	color:#343434 !important;
	text-transform:uppercase;
	font-weight:500;
	font-size:0.8rem !important;
}
#main-nav ul li a:hover {
	color:#00017a !important;
}

#main-navbar {
    padding-top: 1rem;
    padding-bottom: 1rem;
}


.front-content #primary {
	min-height:400px;
	position:relative;
}

.site-header .qd-search-wrap {
    display: inline-block;
    vertical-align: middle;
    width: 3%;
}
.site-header .qd-search-wrap .fa {
    color: #343434;
    cursor: pointer;
    display: inline-block;
    padding: 5px;
    border-radius: 100%;
    transition: all ease-in-out 0.4s;
    -webkit-transition: all ease-in-out 0.4s;
}
.site-header .qd-search-wrap .fa:hover {
	/*background: #1f4181;*/
	color: #00017a;
}
.site-header .qd-search {
    background: rgba(0, 0, 0, 0.75) none repeat scroll 0 0;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 99999999;
    opacity: 0;
    visibility: hidden;
    transform: scale(0.9);
	-webkit-transform: scale(0.9);
    transition: all ease-in-out 0.4s;
    -webkit-transition: all ease-in-out 0.4s;
}
.site-header .qd-search-wrap.show .qd-search {
	opacity: 1;
    visibility: visible;
	transform: scale(1);
	-webkit-transform: scale(1);
}
.site-header .qd-search .search-close {
    font-size: 30px;
    font-weight: normal;
    padding: 0;
    position: absolute;
    right: 20px;
    text-align: center;
    top: 10px;
}
.admin-bar .site-header .qd-search .search-close {
	top: 40px;
}
.site-header .qd-search-wrap .fas.fa-times {
    height: 40px;
    line-height: 40px;
    padding: 0;
    width: 40px;
	color:#fff;
	cursor:pointer;
}
.site-header .qd-search .search-form {
    left: 0;
    margin: -50px auto 0;
    position: absolute;
    right: 0;
    top: 50%;
    width: 90%;
}
.site-header .qd-search .search-form .input-wrapper {
    display: inline-block;
    width: 80%;
}

.site-header .qd-search .search-form .input-wrapper input.form-control {
	height:50px;
}
.site-header .qd-search .search-form .search-field {
    border: medium none;
    display: inline-block;
    font-size: 16px;
}
.site-header .qd-search .search-form .search-submit {
    display: inline-block;
    min-height: 50px;
    width: 14%;
    padding: 0;
	text-transform: uppercase;
	font-size: 0.8rem;
	margin-top: -5px;
}
.site-header .qd-search .search-form .search-submit:hover {
	color: #fff;
}

/*slider section*/

#slider-heroes {
	max-height:500px;
	width:100%;
	height:auto;
}


#slider-heroes img {
	width:100%;
	height:500px;
	object-fit:cover;
}
	

.slide-item .post-caption {
	padding-top: 2rem;
	padding-bottom: 2rem;
    padding-left: 2rem;
    padding-right: 2rem;
    position: absolute;
    bottom: 0;
    width: 100%;
    background: rgb(0 0 0 / 35%);
}

.slide-item .post-caption, .slide-item .post-caption .btn-readmore a {color: #fff;}
.post-cat-list a {font-size:14px;color:#ffb900 !important;}
.post-cat-list {padding-bottom:6px;}
.slide-item .post-caption h2 {text-transform:none;font-weight:500;}
.slide-item .post-caption h2 a {color: #fff;}
.slide-item .post-caption .btn-readmore i {margin-left:5px;}

.slider-carousel .owl-nav button {
	width: 50px;
	height: 80px;
	background: #1873d3 !important;
	color: #fff !important;
	border-radius: 5px; 
}

.slider-carousel .owl-nav button:hover {
	background: #00017a !important;
}

.slider-carousel .owl-nav button.owl-prev {
	position: absolute;
	top: 35%;
	left: 5px;
}
.slider-carousel .owl-nav button.owl-next {
	position: absolute;
	top: 35%;
	right: 5px;
}

.slider-carousel .owl-nav button span {font-size:2.5rem;color:#fff;}
.slider-carousel .owl-dots {
	position: absolute;
    bottom: 0;
    width: 100%;
	text-align:center;
	padding:5px;
}
.slider-carousel .owl-dots button {
	width:10px;
	height:10px;
	background:#1873d3;
	border-radius:100px;
	margin:5px;
}
.slider-carousel .owl-dots button.active {
	background: #00017a;
}
.slider-carousel.owl-theme .owl-nav {
    margin-top: 0px !important;
}


.slider-carousel .owl-dot.active span, .slider-carousel .owl-dot:hover span {
	background-color:#00017a !important;
}

.slider-carousel .owl-dot span, .slider-carousel .owl-dot span {
	background-color:#1873d3 !important;
}

.btn.btn-primary {
	background-color:#1873d3 !important;
	border-radius:5px !important;
	border:0;
}

.btn.btn-primary:hover {
	background-color:#00017a !important;
}

/*recent post section */

#recent-posts.section-content {
	padding-top:20px;
	padding-bottom:10px;
}

#recent-posts.section-content h2.title {
	text-align:center;
	font-size:2rem !important;
	text-transform:uppercase;
	color: #00017a;
}

.posts-carousel  {
	padding:5px 0;
}

.posts-carousel .posts-list {
	padding:20px;
}

.posts-carousel .article-wrapper {
	border:solid 1px #00017a;
}

.posts-carousel .article-wrapper:hover {
	box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;
}

.posts-carousel h2.post-title {
	text-transform:none;
	text-align:left;
	font-size:1.8rem;
}

.posts-carousel  a  {color: #00017a;}
.posts-carousel  a:hover  {color: #1873d3;}
	
.posts-list .post-caption {
	padding:20px;
}

.post-excerpt-desc i {
	margin-left:5px;
}
.posts-carousel .post-meta {
	padding-top:20px;
}
.posts-carousel .post-meta, .posts-carousel .post-meta i {
	font-size:0.8rem;
}
.posts-carousel .post-meta i {
	margin-right:5px;
}
.posts-carousel .post-meta ul {
	padding:0;
	list-style:none;
}
.posts-carousel .post-meta ul li {
	display:inline-block;
	margin-right:10px;
}
.posts-carousel .post-views {display:inline-block;}

.recentposts  {
	position:relative;
}


.posts-carousel .owl-nav button.owl-prev { 
	position:absolute;
	top: 50%;
	left:0;
}

.posts-carousel .owl-nav button.owl-next { 
	position:absolute;
	top: 50%;
	right:0;
}

.posts-carousel .owl-nav button {
	width: 40px;
    height: 80px;
    background: #1873d3 !important;
    color: #fff !important;
    border-radius: 5px;
}

.posts-carousel .owl-nav button:hover {
	background: #00017a !important;
}

.posts-carousel .owl-nav button span {
	font-size: 1.8rem;
}

.recent-posts .post-thumb {
	height: 300px;
	background-position: center center;
	background-repeat: no-repeat;
	overflow: hidden;
}

/* ad banner section */
#advertising-block .ad-banner img {
	width:100%;
}

#advertising-block.section-content, #media-block.section-content {
	padding-top:20px;
	padding-bottom:20px;
}

#advertising-block figure.wp-block-image {
	border: solid 1px #00017a ;
}

/* media */
.infografis-wrapper {
	background-color:#fff;
	color:#00017a;
	border: 1px solid #00017a;
	position:relative;
	margin-bottom:30px;
}
.infografis-wrapper h3.title { 
	background-color:#ffb900;
	font-size:1.2rem;
	padding:10px;
	text-transform:uppercase;
	color: #00017a;
	margin: 0;
}

.infografis-carousel button.owl-prev { 
	position:absolute;
	top: 42%;
	left:0;
}

.infografis-carousel button.owl-next { 
	position:absolute;
	top: 42%;
	right:0;
}

.infografis-carousel .owl-nav {
    margin:0;
}

.infografis-carousel button.owl-prev span, 
.infografis-carousel button.owl-next span {
	font-size:2.5rem!important;
}

.infografis-carousel button:hover {
	background:none !important;
	color:#00017a !important;
}

.infografis-carousel .post-thumb {
	max-height: 490px;
	background-position: center center;
	background-repeat: no-repeat;
	overflow: hidden;
}

.gallery-wrapper, .services-wrapper {
	background-color:#fff;
	color:#00017a;
	border: 1px solid #00017a;
}

.gallery-wrapper h3.title, .services-wrapper h3.title {
	background-color:#ffb900;
	font-size:1.2rem;
	padding:10px;
	text-transform:uppercase;
	color: #00017a;
	margin: 0;
}

.gallery-carousel, .integrated-service-carousel {
	padding:10px 20px;
}

.gallery-carousel .post-desc-wrapper, .integrated-service-carousel .post-desc-wrapper {
	text-align:center;
	color: #fff;
	font-weight:500;
	width: 100%;
	padding: 10px;
}

.gallery-carousel .post-desc-wrapper ul {
	padding:0;
	list-style:none;
}

.gallery-carousel .post-desc-wrapper ul li {
	display:inline-block;
}

.gallery-carousel .post-desc-wrapper a {
	color:#fff;
}

.gallery-carousel .post-desc-wrapper a:hover {
	color:#fff;
}

.gallery-carousel .post-desc-wrapper .post-title {
	text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    text-shadow: 0 0 black;
}

.gallery-carousel .gallery-list {
	position:relative;
}

.gallery-carousel .post-desc-wrapper, .integrated-service-carousel .post-desc-wrapper {
	position:absolute;
	bottom:0;
}

.gallery-carousel button:hover {
	background:none !important;
	color:#00017a !important;
}
.gallery-carousel button.owl-prev { 
	position:absolute;
	top: 30%;
	left:0;
}

.gallery-carousel button.owl-next { 
	position:absolute;
	top: 30%;
	right:0;
}

.gallery-carousel button.owl-prev span {
	font-size:2.5rem!important;
}

.gallery-carousel button.owl-next span {
	font-size:2.5rem!important;
}

.services-wrapper {
	margin:30px 0;
}

.integrated-service-carousel .post-desc-wrapper {
	background: rgb(0 1 122 / 70%);
}
.integrated-service-carousel .post-desc-wrapper a {
	text-transform:uppercase;
	color:#fff;
}

.integrated-service-carousel button:hover {
	background:none !important;
	color:#00017a !important;
}
.integrated-service-carousel button.owl-prev { 
	position:absolute;
	top: 30%;
	left:0;
}

.integrated-service-carousel button.owl-next { 
	position:absolute;
	top: 30%;
	right:0;
}

.integrated-service-carousel button.owl-prev span,
.integrated-service-carousel button.owl-next span {
	font-size:2.5rem!important;
}

	
/*footer */
#footer-widget {
	background-color: #00017a;
	padding: 40px 20px;
	color: #fff;
}

#footer-widget h3 {
	font-size:1.8rem !important;
	text-transform:uppercase;
	color:#ffb900;
}

#footer-widget ul#menu-footer-menu li a {
	text-transform:uppercase;
	color:#fff;
	padding:5px 0;
}

#footer-widget ul#menu-footer-menu li a:hover, #footer-widget ul#menu-footer-menu li a:focus {
	color:#ffb900;
	text-decoration:underline;
	background:none;
}

#footer-widget ul#menu-footer-menu li a::before {
	content:">";
	margin-right:5px;

}

/* Page */
#header-page {
	position:relative;
	width:100%;
}

#content-page {
	position:relative;
	width:100%;
	padding:40px 0;
}

#content-page h3.entry-title {
	color: #343434;
    font-weight: 500;
    padding-bottom: 10px;
    border-bottom: 1px solid #ccc;
}


#content-page #secondary #rpwwt-recent-posts-widget-with-thumbnails-1 {
	border: 1px solid #00017a;
}


.header-cover {
	position: relative;
	z-index: 10;
	width: 100%;
	height: 250px;
}

.header-cover h2 {
	color:#FFF !important;
	border-bottom:0;
	text-transform: uppercase;
	font-weight: 700;
}

.breadcrumb-area {
	padding:10px 0;
	background:#ffb900;
	color:#00017a;
	font-size:1rem;
}

.breadcrumb-area #breadcrumbs {font-size:0.8rem;width:100%;}
.breadcrumb-area #breadcrumbs a {color:#00017a;}
.breadcrumb-area #breadcrumbs a:hover {color:#1873d3;}

#content-page #rpwwt-recent-posts-widget-with-thumbnails-1 h2.widgettitle {
		background-color: #ffb900;
	    font-size: 1.2rem;
	    padding: 10px;
	    text-transform: uppercase;
	    color: #00017a;
	    margin: 0;
}

#content-page #rpwwt-recent-posts-widget-with-thumbnails-1 ul {
	padding:20px;
}

#content-page #rpwwt-recent-posts-widget-with-thumbnails-1 ul li a {color:#00017a;}
#content-page #rpwwt-recent-posts-widget-with-thumbnails-1 ul li a:hover {color:#1873d3;}

#content-page .post-thumbnail {padding:20px 0;}
#content-page .featured_caption {padding:10px 0;}
#content-page .addtoany_content {padding-top:40px;}

#content-page .post-meta {
	padding-top:5px;
}
#content-page .post-meta, #content-page .post-meta i {
	font-size:0.8rem;
}
#content-page .post-meta i {
	margin-right:5px;
}
#content-page .post-meta ul {
	padding:0;
	list-style:none;
}
#content-page .post-meta ul li {
	display:inline-block;
	margin-right:10px;
}
#content-page .post-views {display:inline-block;}

/* archive berita */

.category-berita .posts-list, .gallery-infografis-page .posts-list,
.gallery-foto-page .posts-list, .gallery-video-page .posts-list  {
	margin-bottom:40px;
	margin-top:40px;
}

.category-berita .post.hentry {
    margin-bottom: 0;
}

.category-berita .article-wrapper, .gallery-infografis-page .article-wrapper,
.gallery-foto-page .article-wrapper, .gallery-video-page .article-wrapper {
	border:solid 1px #00017a;
}

.category-berita .article-wrapper:hover, .gallery-infografis-page .article-wrapper:hover,
.gallery-foto-page .article-wrapper:hover {
	box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;
}

.category-berita h2.post-title {
	text-transform:none;
	text-align:left;
	font-size:1.8rem;
}

.category-berita a, .gallery-infografis-page a, .gallery-foto-page a, .gallery-video-page a  {color: #00017a;}
.category-berita a:hover, .gallery-infografis-page a:hover, .gallery-foto-page a:hover, .gallery-video-page a:hover {color: #1873d3;}
	
.category-berita  .posts-list .post-caption, .gallery-infografis-page .posts-list .post-caption,
.gallery-foto-page .posts-list .post-caption {
	padding:20px;
}

.category-berita  .post-excerpt-desc i {
	margin-left:5px;
}
.category-berita .post-meta {
	padding-top:20px;
}
.category-berita  .post-meta, .category-berita .post-meta i {
	font-size:0.8rem;
}
.category-berita  .post-meta i {
	margin-right:5px;
}
.category-berita .post-meta ul {
	padding:0;
	list-style:none;
}
.category-berita  .post-meta ul li {
	display:inline-block;
	margin-right:10px;
}
.category-berita  .post-views {display:inline-block;}

/* archive infografis */
.infografis-carousel .post-thumb {
	height: 622px;
	background-position: center center;
	background-repeat: no-repeat;
	overflow: hidden;
}

/* archive gallery */

.gallery-infografis-page h2.page-title, .gallery-foto-page h2.page-title,
.gallery-video-page h2.page-title {
	color: #00017a;
    font-family: "Montserrat", Sans-serif;
    font-size: 2.3rem;
    text-transform: uppercase;
}
.gallery_cat-video iframe {width:100% !important;height:400px;}


/* contact us form */

.grup-1 p, .grup-2 p {position:relative;margin-bottom:0;}
.grup-3 p {position:relative;margin-bottom:0;}
.grup-1 i, .grup-2 i, .grup-3 i {position:absolute;right:0;padding:15px;z-index:1;}
.grup-3 span textarea {width:100%;border-radius: 0;border: 2px solid #ccc;}
.grup-3 select {padding:15px;}
.grup-1 label, .grup-2 label, .grup-3 label {display:none;}

.wpcf7 form>div, .wpcf7 form>p {
    margin-bottom: 0px !important;
}

select.fpp-jenis-layanan, label.fpp-scanfoto, label.fpp-filependukung {font-size:12px;}


::-webkit-input-placeholder {
  font-size: 12px;
}
::-moz-placeholder {
  font-size: 12px;
}
:-ms-input-placeholder {
  font-size: 12px;
}
::placeholder {
  font-size: 12px;
}

.eael-ext-scroll-to-top-wrap .eael-ext-scroll-to-top-button {
	bottom: 15px;
	    left: 15px;
	    width: 50px;
	    height: 50px;
	    z-index: 9999;
	    opacity: 0.8;
	    background-color:#00017a !important;
	    border-radius: 5px;
}


/*--------------------------------------------------------------
# Media Query
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Notebook
--------------------------------------------------------------*/
@media only screen and (max-width: 1280px) {
  html {
    font-size: 95%;
  }
}

@media screen and (max-width: 1199px) {
  .navbar-dark .dropdown-item {
    color: #fff;
  }
  .navbar-nav .dropdown-menu {
    background: transparent;
    box-shadow: none;
    border: none;
  }
}
/*--------------------------------------------------------------
## Netbook
--------------------------------------------------------------*/
@media only screen and (max-width: 1024px) {
  html {
    font-size: 90%;
  }
}
/*--------------------------------------------------------------
## iPad
--------------------------------------------------------------*/
@media only screen and (max-width: 960px) {
  html {
    font-size: 85%;
  }
}
/*--------------------------------------------------------------
## iPad
--------------------------------------------------------------*/
@media only screen and (max-width: 768px) {
  html {
    font-size: 80%;
  }
}
/*--------------------------------------------------------------
## iPad
--------------------------------------------------------------*/
@media only screen and (max-width: 480px) {
  html {
    font-size: 75%;
  }
}


/* === Grid Berita Rapi & Equal Height === */
.posts-carousel .posts-list,
.category-berita .posts-list {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
  justify-content: center;
}

.posts-carousel .article-wrapper,
.category-berita .article-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  flex: 1 1 calc(33.333% - 25px); /* 3 kolom di desktop */
  box-sizing: border-box;
  border: 1px solid #00017a;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  transition: all 0.3s ease;
}

/* Hover effect: bayangan lembut & sedikit naik */
.posts-carousel .article-wrapper:hover,
.category-berita .article-wrapper:hover {
  transform: translateY(-8px);
  box-shadow: rgba(0, 1, 122, 0.2) 0px 8px 20px;
  border-color: #1873d3;
}

/* Gambar responsif dan proporsional */
.posts-carousel .recent-posts .post-thumb,
.category-berita .recent-posts .post-thumb {
  height: 300px;
  width: 100%;
  background-size: cover;
  background-position: center center;
}

/* Judul */
.posts-carousel h2.post-title,
.category-berita h2.post-title {
  font-size: 1.4rem;
  font-weight: 700;
  color: #00017a;
  line-height: 1.4em;
  min-height: 3.5em;
  margin-bottom: 6px;
  transition: color 0.3s ease;
}

.posts-carousel h2.post-title:hover,
.category-berita h2.post-title:hover {
  color: #1873d3;
}

/* Deskripsi / excerpt */
.posts-carousel .post-excerpt-desc,
.category-berita .post-excerpt-desc {
  flex-grow: 1;
  color: #333;
  font-size: 0.95rem;
}

/* Metadata (tanggal, views, dsb) */
.posts-carousel .post-meta,
.category-berita .post-meta {
  font-size: 0.85rem;
  color: #666;
  padding: 10px 0;
  border-top: 1px solid #eee;
}

/* Tombol "Baca Selengkapnya" */
.posts-carousel .post-excerpt-desc a,
.category-berita .post-excerpt-desc a {
  color: #1873d3;
  font-weight: 600;
  transition: all 0.3s ease;
}

.posts-carousel .post-excerpt-desc a:hover,
.category-berita .post-excerpt-desc a:hover {
  color: #00017a;
  text-decoration: underline;
}

/* Responsif untuk tablet dan HP */
@media (max-width: 991px) {
  .posts-carousel .article-wrapper,
  .category-berita .article-wrapper {
    flex: 1 1 calc(50% - 25px); /* 2 kolom di tablet */
  }
}

@media (max-width: 600px) {
  .posts-carousel .article-wrapper,
  .category-berita .article-wrapper {
    flex: 1 1 100%; /* 1 kolom di HP */
  }
}

/* === Card Berita Sejajar Equal Height === */
.posts-carousel .owl-item,
.category-berita .posts-list {
  display: flex !important;
}

.posts-carousel .article-wrapper,
.category-berita .article-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  min-height: 420px; /* atur sesuai kebutuhan */
  box-sizing: border-box;
  border: 1px solid #00017a;
  border-radius: 8px;
  background: #fff;
  padding: 20px;
  transition: all 0.3s ease;
}

/* Hover */
.posts-carousel .article-wrapper:hover,
.category-berita .article-wrapper:hover {
  transform: translateY(-8px);
  box-shadow: rgba(0, 1, 122, 0.2) 0px 8px 20px;
}

/* Pastikan gambar tidak mengganggu tinggi */
.posts-carousel .post-thumb {
  height: 200px;
  background-size: cover;
  background-position: center;
  border-bottom: 1px solid #eee;
  flex-shrink: 0;
}

/* Isi utama fleksibel */
.posts-carousel .post-caption,
.category-berita .post-caption {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Teks dan tombol baca selengkapnya di bawah */
.posts-carousel .post-excerpt-desc,
.category-berita .post-excerpt-desc {
  flex-grow: 1;
  margin-bottom: 10px;
}

.posts-carousel .post-meta,
.category-berita .post-meta {
  margin-top: auto;
  padding-top: 10px;
  font-size: 0.85rem;
  border-top: 1px solid #eee;
  color: #666;
}

/* Responsif */
@media (max-width: 991px) {
  .posts-carousel .article-wrapper,
  .category-berita .article-wrapper {
    min-height: 380px;
  }
}
@media (max-width: 600px) {
  .posts-carousel .article-wrapper,
  .category-berita .article-wrapper {
    min-height: auto;
  }
}

.posts-carousel .article-wrapper,
.category-berita .article-wrapper {
  transition: all 0.3s ease;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: #fff;
  border: 1px solid #00017a;
  border-radius: 8px;
  padding: 20px;
}

.posts-carousel .article-wrapper:hover,
.category-berita .article-wrapper:hover {
  transform: translateY(-8px);
  box-shadow: rgba(0, 1, 122, 0.2) 0px 8px 20px;
}


/* ============================================================
   HEADER GAYA BALAI AIR TANAH (Final Polished Version)
   ============================================================ */

/* === FONT & DASAR === */
body {
  font-family: 'Montserrat', sans-serif;
  color: #001f6b;
}

/* === BAR ATAS: TANGGAL + SOSIAL === */
.bat-topbar {
  background-color: #001f6b;
  color: #fff;
  font-size: 14px;
  padding: 6px 0;
  border-bottom: 3px solid #ffcc00;
}

.bat-topbar .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.bat-topbar i {
  color: #ffcc00;
  margin-right: 6px;
}

.bat-social a {
  color: #fff;
  margin-left: 12px;
  transition: color 0.3s;
}
.bat-social a:hover {
  color: #ffcc00;
}

/* === LOGO & MENU === */
.bat-mainnav {
  background: #fff;
  border-bottom: 2px solid #ffcc00;
  padding: 10px 0;
  position: sticky;
  top: 0;
  z-index: 999;
  transition: all 0.3s ease;
}

.bat-mainnav.sticky-active {
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* Container layout */
.bat-mainnav .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

/* Logo */
.bat-logo img {
  height: 65px;
  width: auto;
  transition: transform 0.3s ease;
}
.bat-logo img:hover {
  transform: scale(1.03);
}

/* === MENU === */
.bat-menu {
  flex-grow: 1;
  text-align: right;
}

.bat-menu ul.navbar-nav {
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
}

.bat-menu ul.navbar-nav > li > a {
  color: #001f6b !important;
  font-weight: 600;
  font-size: 15px;
  padding: 20px 16px !important;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  transition: all 0.3s ease;
}

.bat-menu ul.navbar-nav > li > a:hover {
  color: #ffcc00 !important;
}

/* === DROPDOWN MENU === */
.bat-menu .dropdown-menu {
  border-radius: 6px;
  border: none;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
  margin-top: 0;
}

.bat-menu .dropdown-menu a {
  color: #001f6b !important;
  font-weight: 500;
  border-bottom: 1px solid #f0f0f0;
  padding: 10px 15px !important;
  transition: background 0.3s;
}

.bat-menu .dropdown-menu a:hover {
  background: #f2f5ff;
  color: #003399 !important;
}

/* === SEARCH === */
.bat-search {
  margin-left: 20px;
  position: relative;
}
.bat-search i {
  font-size: 18px;
  color: #001f6b;
  cursor: pointer;
  transition: color 0.3s;
}
.bat-search i:hover {
  color: #ffcc00;
}
.bat-search form {
  display: none;
  position: absolute;
  top: 35px;
  right: 0;
  background: #fff;
  border: 1px solid #ccc;
  padding: 6px 10px;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.bat-search.active form {
  display: block;
}
.bat-search input[type="search"] {
  border: 1px solid #ddd;
  padding: 5px 8px;
  border-radius: 3px;
  width: 180px;
  font-size: 14px;
}
.bat-search button {
  background: #001f6b;
  color: #fff;
  border: none;
  padding: 5px 10px;
  border-radius: 3px;
  cursor: pointer;
}
.bat-search button:hover {
  background: #ffcc00;
  color: #001f6b;
}

/* === BAR PENGUMUMAN === */
.bat-announcement {
  background-color: #001f6b;
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  padding: 6px 0;
}

.bat-announcement .bat-container {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: flex-start;
}

.bat-label {
  background: #ffcc00;
  color: #001f6b;
  padding: 4px 10px;
  font-weight: 700;
  border-radius: 2px;
}

/* === RESPONSIVE === */
@media (max-width: 992px) {
  .bat-mainnav .container {
    flex-direction: row; /* Tetap horizontal, jangan column */
    align-items: center;
    justify-content: space-between;
    gap: 15px;
  }

  .bat-logo {
    flex-shrink: 0; /* Logo tidak mengecil */
  }

  .bat-logo img {
    height: 50px; /* Ukuran lebih kecil untuk mobile */
    max-width: 200px; /* Batasi lebar maksimal */
  }

  .bat-menu {
    flex: 0 0 auto; /* Menu tidak grow, ukuran sesuai konten */
    text-align: center;
    margin-top: 0; /* Hapus margin top */
    order: 2; /* Urutan: logo, menu, search */
  }

  .bat-menu .navbar-toggler {
    padding: 5px 10px;
    border: 1px solid #001f6b;
    border-radius: 4px;
  }

  .bat-menu ul.navbar-nav {
    margin-top: 10px;
  }

  .bat-menu ul.navbar-nav > li > a {
    padding: 10px 12px !important;
    font-size: 14px;
  }

  .bat-search {
    flex: 0 0 auto; /* Search tidak grow */
    margin-top: 0; /* Hapus margin top */
    margin-left: 10px; /* Spacing dari menu */
    order: 3; /* Urutan terakhir */
  }

  .bat-search i {
    font-size: 20px;
  }
}


/* === DROPDOWN AKTIF & HOVER DENGAN GAYA PUPR === */
.bat-menu .dropdown-menu a {
  color: #001f6b !important;
  font-weight: 600;
  border-left: 4px solid transparent;
  border-bottom: 1px solid #f0f0f0;
  padding: 10px 18px !important;
  transition: all 0.3s ease;
}

/* Saat hover atau klik (active/focus) */
.bat-menu .dropdown-menu a:hover,
.bat-menu .dropdown-menu a:focus,
.bat-menu .dropdown-menu a:active {
  background: #ffcc00 !important;
  color: #001f6b !important;
  border-left: 4px solid #001f6b !important;
}

/* Opsional: ubah menu utama aktif juga berwarna kuning */
.bat-menu ul.navbar-nav > li.current-menu-item > a,
.bat-menu ul.navbar-nav > li.current-menu-ancestor > a {
  color: #ffcc00 !important;
}

/* === EFEK BAYANGAN HALUS (GAYA PUPR) === */
.bat-menu .dropdown-menu {
  border-radius: 6px;
  border: none;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  transition: all 0.3s ease;
  margin-top: 0;
  overflow: hidden;
}

/* Saat menu dropdown muncul, tambah sedikit efek naik */
.bat-menu .dropdown-menu.show {
  transform: translateY(2px);
  animation: dropdownFade 0.25s ease;
}

/* Animasi lembut saat dropdown muncul */
@keyframes dropdownFade {
  from {
    opacity: 0;
    transform: translateY(-5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Hover atau klik submenu */
.bat-menu .dropdown-menu a:hover,
.bat-menu .dropdown-menu a:focus,
.bat-menu .dropdown-menu a:active {
  background: #ffcc00 !important;
  color: #001f6b !important;
  border-left: 4px solid #001f6b !important;
}

/* Tambahan: beri sedikit jarak antar submenu */
.bat-menu .dropdown-menu a {
  padding: 12px 20px !important;
}

.bat-menu .dropdown-menu a:hover {
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
}


/* === ANIMASI HIGHLIGHT BAR KUNING (EFEK PUPR) === */

/* Wrapper nav menu untuk posisi relatif */
.bat-menu ul.navbar-nav {
  position: relative;
}

/* Buat pseudo-elemen untuk garis animasi */
.bat-menu ul.navbar-nav::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  width: 0;
  background-color: #ffcc00;
  transition: all 0.3s ease;
}

/* Efek hover tiap item menu */
.bat-menu ul.navbar-nav > li {
  position: relative;
}

/* Garis muncul di bawah item di-hover */
.bat-menu ul.navbar-nav > li:hover > a {
  color: #ffcc00 !important;
}

/* Garis bergerak dinamis */
.bat-menu ul.navbar-nav > li:hover::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #ffcc00;
  transition: width 0.3s ease;
}

/* Saat hover keluar, garis hilang pelan */
.bat-menu ul.navbar-nav > li::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background-color: #ffcc00;
  transition: width 0.3s ease;
}

/* Saat item aktif (halaman saat ini) tetap ada garis kuning */
.bat-menu ul.navbar-nav > li.current-menu-item::after,
.bat-menu ul.navbar-nav > li.current-menu-ancestor::after {
  width: 100%;
  background-color: #ffcc00;
}



/* === HEADER PUPR STYLE === */
body {
  font-family: 'Montserrat', sans-serif;
}

/* BAR ATAS */
.bat-topbar {
  background: #001f6b;
  color: #fff;
  font-size: 14px;
  padding: 6px 0;
  border-bottom: 3px solid #ffcc00;
}
.bat-topbar i {
  color: #ffcc00;
  margin-right: 6px;
}
.bat-social a {
  color: #fff;
  margin-left: 12px;
  transition: color .3s;
}
.bat-social a:hover {
  color: #ffcc00;
}

/* MAINNAV */
.bat-mainnav {
  background: #fff;
  border-bottom: 2px solid #ffcc00;
  padding: 10px 0;
}
.bat-logo img {
  height: 65px;
  width: auto;
}

/* MENU UTAMA */
.bat-menu ul.navbar-nav > li > a {
  color: #001f6b !important;
  font-weight: 700;
  text-transform: uppercase;
  padding: 20px 18px !important;
  transition: all 0.3s ease;
  position: relative;
}
.bat-menu ul.navbar-nav > li > a:hover {
  color: #ffcc00 !important;
}
.bat-menu ul.navbar-nav > li::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 3px;
  background-color: #ffcc00;
  transition: all 0.3s ease;
  transform: translateX(-50%);
}
.bat-menu ul.navbar-nav > li:hover::after {
  width: 60%;
}

/* PENGUMUMAN */
.bat-announcement {
  background: #001f6b;
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  padding: 5px 0;
}
.bat-label {
  background: #ffcc00;
  color: #001f6b;
  padding: 4px 10px;
  font-weight: 700;
  border-radius: 2px;
  margin-right: 10px;
}

/* === SEARCH OVERLAY === */
.bat-search i {
  font-size: 18px;
  color: #001f6b;
  cursor: pointer;
  transition: color 0.3s ease;
}
.bat-search i:hover { color: #ffcc00; }

.bat-search-overlay {
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 31, 107, 0.95);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
  z-index: 9999;
}
.bat-search-overlay.active {
  opacity: 1;
  visibility: visible;
}
.overlay-content {
  position: relative;
  width: 90%;
  max-width: 600px;
}
.overlay-content form {
  display: flex;
  align-items: center;
  background: #fff;
  border-radius: 50px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  animation: fadeInUp 0.4s ease;
}
.overlay-content input {
  flex: 1;
  border: none;
  outline: none;
  padding: 18px 24px;
  font-size: 18px;
  color: #001f6b;
  font-weight: 600;
  border-radius: 50px 0 0 50px;
}
.overlay-content button {
  background: #ffcc00;
  border: none;
  padding: 16px 22px;
  border-radius: 0 50px 50px 0;
  cursor: pointer;
  color: #001f6b;
  font-size: 18px;
  transition: background 0.3s ease;
}
.overlay-content button:hover {
  background: #f8d43f;
}
.close-search {
  position: absolute;
  top: -60px;
  right: 0;
  background: none;
  border: none;
  color: #fff;
  font-size: 28px;
  cursor: pointer;
  transition: color 0.3s ease;
}
.close-search:hover {
  color: #ffcc00;
}
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .bat-menu ul.navbar-nav > li > a {
    padding: 12px 10px !important;
    font-size: 14px;
  }
}


/* --- NAV MENU UNDERLINE FIX (BOOTSTRAP 5 VERSION) --- */
.navbar-nav .nav-link {
  position: relative;
  display: inline-block;
  padding-bottom: 6px; /* beri ruang antara teks dan garis */
  color: #1a1a1a; /* sesuaikan warna teks */
  text-decoration: none;
}

.navbar-nav .nav-link::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 0;
  height: 2px;
  background-color: #ffcc00; /* warna garis kuning */
  transition: all 0.3s ease;
  transform: translateX(-50%);
}

.navbar-nav .nav-link:hover::after,
.navbar-nav .nav-item.current-menu-item .nav-link::after {
  width: 60%; /* panjang garis aktif */
}

/* ============================================
   BERITA TERKINI - Recent Posts Section
   ============================================ */

#recent-posts {
    padding: 40px 0;
}

#recent-posts .title {
    font-size: 28px;
    font-weight: 700;
    color: #007bff;
    margin-bottom: 30px;
    text-align: center;
}

/* Posts Carousel Container */
#recent-posts .posts-carousel {
    position: relative;
}

/* Post Item Card */
#recent-posts .posts-list,
#recent-posts .post-item {
    padding: 0 10px;
}

#recent-posts .article-wrapper {
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: all 0.3s ease;
    min-height: 620px !important; /* Tingkatkan tinggi minimum */
}

#recent-posts .article-wrapper:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

/* Post Thumbnail - Fixed Height */
#recent-posts .post-thumb {
    width: 100%;
    height: 280px;
    overflow: hidden;
    position: relative;
    flex-shrink: 0;
}

#recent-posts .post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.3s ease;
}

#recent-posts .article-wrapper:hover .post-thumb img {
    transform: scale(1.05);
}

/* Post Caption - Flex Container */
#recent-posts .post-caption {
    padding: 15px;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 280px; /* Space untuk konten */
}

/* Post Category */
#recent-posts .post-cat {
    margin-bottom: 10px;
}

#recent-posts .post-cat-list {
    font-size: 12px;
    line-height: 1.4;
}

#recent-posts .post-cat-list a {
    color: #ff6b35;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 500;
    margin-right: 5px;
}

#recent-posts .post-cat-list a:hover {
    color: #007bff;
    text-decoration: underline;
}

/* Post Title - DIPERKECIL */
#recent-posts .post-title {
    font-size: 16px !important; /* Diperkecil dari default h2 */
    line-height: 1.4 !important;
    font-weight: 600;
    margin: 0 0 12px 0 !important;
    color: #333;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* Maksimal 3 baris */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 0;
}

#recent-posts .post-title a {
    color: #333;
    text-decoration: none;
    transition: color 0.3s ease;
}

#recent-posts .post-title a:hover {
    color: #007bff;
}

/* Post Excerpt/Description - TAMPILKAN */
#recent-posts .post-excerpt-desc {
    font-size: 14px;
    line-height: 1.6;
    color: #666;
    margin-bottom: 15px;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 4; /* Maksimal 4 baris */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 120px; /* Pastikan ada space */
}

#recent-posts .post-excerpt-desc .btn-links {
    display: inline-block;
    margin-top: 8px;
    color: #007bff;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.3s ease;
}

#recent-posts .post-excerpt-desc .btn-links:hover {
    color: #0056b3;
    text-decoration: underline;
}

#recent-posts .post-excerpt-desc .btn-links i {
    margin-left: 5px;
    font-size: 11px;
}

/* Post Meta */
#recent-posts .post-meta {
    margin-top: auto; /* Push ke bawah */
    padding-top: 12px;
    border-top: 1px solid #f0f0f0;
}

#recent-posts .post-meta-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    font-size: 12px;
    color: #999;
}

#recent-posts .post-meta-list li {
    display: flex;
    align-items: center;
    gap: 5px;
}

#recent-posts .post-meta-list i {
    font-size: 11px;
}

/* Owl Carousel Navigation untuk Posts */
#recent-posts .posts-carousel .owl-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    display: flex;
    justify-content: space-between;
    pointer-events: none;
    margin-top: 0;
}

#recent-posts .posts-carousel .owl-nav button {
    pointer-events: all;
    background: rgba(0, 123, 255, 0.8) !important;
    color: #fff !important;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    font-size: 18px;
    transition: all 0.3s ease;
    margin: 0;
}

#recent-posts .posts-carousel .owl-nav button:hover {
    background: #007bff !important;
    transform: scale(1.1);
}

#recent-posts .posts-carousel .owl-nav button.owl-prev {
    left: -20px;
}

#recent-posts .posts-carousel .owl-nav button.owl-next {
    right: -20px;
}

/* Owl Carousel Dots */
#recent-posts .posts-carousel .owl-dots {
    text-align: center;
    margin-top: 20px;
}

#recent-posts .posts-carousel .owl-dots .owl-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ddd;
    margin: 0 5px;
    transition: all 0.3s ease;
}

#recent-posts .posts-carousel .owl-dots .owl-dot.active {
    background: #007bff;
    width: 30px;
    border-radius: 6px;
}

/* Responsive - Tablet */
@media (max-width: 1199px) {
    #recent-posts .article-wrapper {
        min-height: 450px;
    }
    
    #recent-posts .post-caption {
        min-height: 250px;
    }
    
    #recent-posts .post-title {
        font-size: 15px !important;
        -webkit-line-clamp: 2;
    }
    
    #recent-posts .post-excerpt-desc {
        -webkit-line-clamp: 3;
        min-height: 75px;
    }
}

/* Responsive - Mobile */
@media (max-width: 768px) {
    #recent-posts {
        padding: 30px 0;
    }
    
    #recent-posts .title {
        font-size: 24px;
        margin-bottom: 20px;
    }
    
    #recent-posts .article-wrapper {
        min-height: 420px;
    }
    
    #recent-posts .post-caption {
        padding: 12px;
        min-height: 220px;
    }
    
    #recent-posts .post-title {
        font-size: 15px !important;
        -webkit-line-clamp: 2;
        margin-bottom: 6px !important;
    }
    
    #recent-posts .post-excerpt-desc {
        font-size: 13px;
        -webkit-line-clamp: 3;
        min-height: 65px;
        margin-bottom: 12px;
    }
    
    #recent-posts .post-thumb {
        height: 180px;
    }
    
    #recent-posts .posts-carousel .owl-nav button {
        width: 35px;
        height: 35px;
        font-size: 16px;
    }
    
    #recent-posts .posts-carousel .owl-nav button.owl-prev {
        left: -15px;
    }
    
    #recent-posts .posts-carousel .owl-nav button.owl-next {
        right: -15px;
    }
}

@media (max-width: 576px) {
  .bat-mainnav .container {
    gap: 8px;
    padding: 8px 10px;
  }

  .bat-logo img {
    height: 40px;
    max-width: 150px;
  }

  .bat-menu .navbar-toggler {
    padding: 5px 10px;
  }

  .bat-menu .navbar-toggler-icon {
    width: 18px;
    height: 18px;
  }

  .bat-search i {
    font-size: 18px;
    padding: 6px;
  }
}
/*
     FILE ARCHIVED ON 05:31:09 Feb 16, 2026 AND RETRIEVED FROM THE
     INTERNET ARCHIVE ON 08:48:10 Jun 03, 2026.
     JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.

     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
     SECTION 108(a)(3)).
*/
/*
playback timings (ms):
  capture_cache.get: 0.412
  captures_list: 0.522
  exclusion.robots: 0.057
  exclusion.robots.policy: 0.048
  esindex: 0.011
  cdx.remote: 10.461
  LoadShardBlock: 595.318 (3)
  PetaboxLoader3.datanode: 257.533 (4)
  PetaboxLoader3.resolve: 94.976 (2)
  load_resource: 70.214
*/