/*
Theme Name: AuroraTwenty25
Text Domain: aurora.ph
Version: 1.0
Description: Custom minimalist and modern theme for AuroraPH.
Tags: custom, minimalist, modern, responsive
Author: aurora.ph Web Team
author URI: https://www.aurora.ph
*/

@font-face{
  font-family: 'SansSerifFLF';
  src: url('/fonts/SansSerifFLF.eot?#iefix') format('embedded-opentype'), url('/fonts/SansSerifFLF.woff') format('woff'), url('/fonts/SansSerifFLF.ttf')  format('truetype'), url('/fonts/SansSerifFLF.svg#SansSerifFLF') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: swap}

html, body {
      background-color:#fefbf4;
	  margin: 0;
      padding: 0;
	  overflow-x:hidden;
      /*height: 100%;*/
	  font-family:"Lato", sans-serif;font-weight:400;font-style:normal
    }
a{text-decoration:none;color:#6fa700}
a:hover{text-decoration:underline;color:#198754}
.lato-light{font-family: "Lato", sans-serif;font-weight:300;font-style: normal;}

/* Navbar styling */
.navbar {
    transition: background-color 0.3s ease-in-out;
    background-color: transparent !important;
    padding:10px 0;
}

.navbar .nav-link, 
.navbar .navbar-brand {
    /*color: white !important;*/
}

.navbar.scrolled {
    background-color: rgba(0, 55, 70, 0.95) !important; /* Semi-opaque dark blue background */
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.3);
}

.white-nav .navbar.scrolled {
    background-color: rgba(255, 250, 245, 0.95) !important; /* Semi-opaque white background */
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.3);
}

.white-nav{margin:0 0 130px 0}

.hero-section {
    position: relative; /* Establishes a positioning context for children */
    width: 100%;
    height: 100vh; /* This section always takes up 100% of the viewport height */
    overflow: hidden; /* Hide any overflow from the video within this section */
}

.aurora-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Make video container fill the hero-section */
    overflow: hidden; /* Hide any overflow from the iframe */
    /*z-index: -1;  Place behind other content */
}

.aurora-video iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: 177.77777778vh; /* 16:9 aspect ratio (16 / 9 * 100vh) */
    height: 56.25vw;    /* 9:16 aspect ratio (9 / 16 * 100vw) */
    transform: translate(-50%, -50%);
    pointer-events: none;
}
    .aurora-video .fallback {
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      z-index: -1;
    }

    .overlay {
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
      z-index: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      color: #fff;
      text-align: center;
	  text-shadow:0 4px 4px #000;
      /*padding: 20px;
      font-family: Arial, sans-serif;
      background: rgba(0, 0, 0, 0.4);  optional dark overlay */
      box-sizing: border-box;
    }

    /*.overlay h1 {
      font-size: 3em;
      margin: 0 0 20px;
    }*/
	
.overlay{text-align:center}
.overlay .input-group {margin:0 auto}
.overlay ul li a{display:block;padding:8px;margin:0 8px 0 0;text-transform:uppercase;font:normal 14pt 'SansSerifFLF';color:#fff}
.overlay ul li:last-child a{margin:0}
.overlay ul li a:hover, .overlay ul li a.active{text-decoration:none;border-bottom:1px solid #fff;color:#fff}
.overlay ul li a:hover{cursor:pointer}
.overlay .input-group {width:800px}
.overlay .form-control {font-weight:300}
#searchTabsContent{padding:30px 0 0 0}

.btn-success{background-color:#6fa700;border-color:#6fa700}
.btn-outline-success{color:#6fa700;border-color: #6fa700;}
a.btn:hover{text-decoration:none}

.custom-logo {
    width: 230px; /* Set your desired width */
    height: auto;    /* Maintain aspect ratio */
}

.navbar-expand-lg .navbar-toggler{display:block}
.navbar-expand-lg .navbar-nav{flex-direction:column}
.navbar-toggler-icon{background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")}
.white-nav .navbar-toggler-icon{background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23638b09' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")}

.offcanvas-body .navbar-nav .nav-item{margin:0 0 1px 0}
.offcanvas-body .navbar-nav .nav-link{padding:8px;font-weight:700;color:#6fa700}
.offcanvas-body .navbar-nav .nav-link:hover, .offcanvas-body .nav-item .active{background-color:#6fa700;text-decoration:none;color:#fff}

.margin-80{margin:20px 0 80px 0}
.margin-30{margin:0 0 30px 0}
.frontPage{position:relative;margin:-250px auto 0 auto}
/*h1,h2,h3,h4,h5{font-family:'Amatic SC';font-weight:600}*/
h1,h2,h3,h4,h5{font-family: "SansSerifFLF", Arial, sans-serif}
h1,h2,h3{text-transform:uppercase}
h1{font-size:64pt}
h2{font-size:44pt}
h3{font-size:32pt}
h4{font-size:24pt}
h5{font-size:18pt}
.card-body h4.card-title, .card-body h4.wp-block-heading, .col-md-9 h4{font-family:'Lato';font-size:18pt;font-weight:700}
.navbar-nav li.nav-item, .btn{font-family:'SansSerifFLF'}
/*.btn{font-weight:600}*/
.screen-reader-text{display:none}
.inputSearch, .card{background-color:#fefbf4}
.white-text{color:#fff}

.card{border-radius:8px}
.card img.nomad-badge{position:absolute;top:10px;right:10px}
.card img.thumbnail, .card img.thumbnail-rounded{width:100%;
    object-fit:cover;
    object-position:center;
}

.card img.thumbnail{
    height:200px;
	border-radius:8px 8px 0 0
}

.card img.thumbnail-rounded{
    height:350px;
	border-radius:8px
}
/*.card div a{text-decoration:none;color:#212529}*/
.card-body h4.card-title{min-height:60px;font-family:'Lato', Arial;font-weight:700}
.shadow-sm:hover{border-color:#198754}
.image-shadow{box-shadow:0 0 15px #00000040}
.carousel-caption h2, .carousel-caption p{text-shadow:0 8px 8px #000}

.line-clamp-heading {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;  
  overflow: hidden;
}

.line-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;  
  overflow: hidden;
}

footer{background-color:#08525d;padding:15px;color:#649299;font-size:12px}footer a{text-decoration:none;color:#649299}footer a:hover{color:#fff}footer ul{padding:0;margin:0;list-style:none}
footer ul li{display:inline}
footer ul li::after{content:"|"}
footer ul li.breakpoint::after{content:""}
footer ul li:last-child::after{content:""}
footer ul li a{display:inline-block;padding:0 4px}
footer ul li a:hover{text-decoration:none}
.parallax{background-attachment:fixed;background-position:center;background-repeat:no-repeat;background-size:cover;height:800px;position:relative}.parallax-caption{position:absolute;bottom:20px;left:20px;color:#fff;text-shadow:2px 2px 4px rgb(0 0 0 / .5)}.parallax-enchantment{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/coast.webp)}.parallax-2{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/sunrise.webp)}

#breadcrumbs{margin:15px 0;color:#666}#breadcrumbs ul{padding:0;margin:0;list-style:none}#breadcrumbs ul li{display:inline}#breadcrumbs a{text-decoration:none}#breadcrumbs a:hover{text-decoration:underline}#breadcrumbs .current{color:#333}

  .masthead{background-attachment:fixed;background-position:top center;background-repeat:no-repeat;background-size:auto}
  .masthead .container{position:relative;height:500px}
  .masthead .container h1{position:absolute;bottom:0;left:0}
  .hotels, .budget-accommodations{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadHotels.webp)}
  .restaurants{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadRestaurants.webp)}
  .attractions{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadAttractions.webp)}

  .aurora-province{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadAuroraProvince.webp)}
  .baler-discover-our-past-ride-our-present{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadBaler.webp)}
  .casiguran-your-journey-to-pristine-shores-begins-here{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadCasiguran.webp)}
  .dilasag-where-the-map-ends-and-adventure-begins{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadDilasag.webp)}
  .dinalungan-where-philippine-eagles-soar-and-adventures-unfold{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadDinalungan.webp)}
  .dingalan-the-batanes-of-the-east-your-scenic-escape{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadDingalan.webp)}
  .dipaculao-from-powdery-sands-to-ancient-rocks{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadDipaculao.webp)}
  .maria-aurora-where-history-towers-in-natures-embrace{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadMariaAurora.webp)}
  .san-luis-where-waterfalls-whisper-and-forests-flourish{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadSanLuis.webp)}
  .the-ultimate-guide-to-a-standout-hotel-page-on-aurora-ph{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/masthead-hotel-marketing-tips.webp)}
  .i-angat-ang-sarap-your-guide-to-a-starfish-worthy-restaurant-page-on-aurora-ph{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/masthead-restaurant-marketing-tips.webp)}
  .gabay-sa-tagumpay-how-to-make-your-aurora-attraction-shine-on-aurora-ph{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/masthead-attraction-marketing-tips.webp)}

  
  .top-hotels{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/top-hotels.webp)}
  .luxury-hotels{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/luxury-hotels.webp)}
  .family-friendly-hotels{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/family-friendly.webp)}
  .pet-friendly-hotels{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/pet-friendly.webp)}
  .events{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/events.webp)}
  .top-restaurants{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/top-restaurants.webp)}
  .top-attractions{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/top-attractions.webp)}
  .businessOwners{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadBusinessOwners.webp)}

  .masthead .container h1{margin:0;text-shadow:0 8px 8px #000;color:#fff}
  .masthead .container h1 span{display:block;font-weight:300}
  .top-hotels{background-color:#ddd}
  .content{margin:40px auto}
  .categories > li{margin:0 8px 0 0}
  .categories > li:first-child::after {
    content: '|';
    padding-left: 8px;
}
.categories li a, .categories li ul li a:hover{color:#198754}
.categories > li:first-child a, .categories > li a.active{color:#fff}
.categories li ul{background-color:#198754}
.carousel-item img{
    height: 400px;
    width: 100%;
    object-fit: cover;
    object-position: center;
	border-radius:8px 8px 0 0
}
.carousel-rounded, .carousel-rounded img{border-radius:8px}
hr{margin:40px 0;height:1px;border-width:0;color:#6fa700;background-color:#6fa700}
.card-title span{display:block;font-size:50%;font-weight:300}
.reviewer span{font-weight:300}

.card-body h2{padding:0 0 15px 0;margin:0 0 25px 0;border-bottom:1px solid #ddd}
.review-section{background:#ddd;padding:50px 0;margin:0 0 30px 0}

/**
 * --- Basic CSS for the rating stars (add to your theme's style.css) ---
 * You can put this in your theme's style.css file or enqueue it.
 * For now, I'll just include it as a suggestion.
 */

.breadcrumb {
    background: #f8f9fa;
    padding: 10px;
    border-radius: 5px;
}

.breadcrumb-item {
    display: inline;
    margin-right: 5px;
}

.breadcrumb-item a {
    text-decoration: none;
    color: #007bff;
}

.breadcrumb-item.active {
    color: #6c757d;
}

/* Small mobile */
@media (max-width: 480px) {
  /*body { font-size: 14px; }*/
h1{font-size:32pt}
h2{font-size:24pt}
h3{font-size:18pt}
h4{font-size:14pt}
h5{font-size:12pt}
.card-title {margin:15px 0}
.overlay svg{display:none}
.overlay h1{font-size:18pt}
.overlay .input-group {width:100%}
.overlay ul li a{padding:2px 6px;margin:0 1px 0 0;font:normal 10pt 'SansSerifFLF'}
#searchTabsContent{padding:15px 0 0 0;width:90%}
.input-group-lg>.btn{font-size:8pt}
.parallax{height:400px}.parallax-caption{position:absolute;bottom:20px;left:20px;color:#fff;text-shadow:2px 2px 4px rgb(0 0 0 / .5)}.parallax-enchantment{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/coast@1024.webp)}.parallax-2{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/sunrise@1024.webp)}

  .masthead{background-size:contain;}
  .masthead .container{height:400px}
.hotels, .budget-accommodations{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadHotels@1024.webp)}
.restaurants{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadRestaurants@1024.webp)}
.attractions{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadAttractions@1024.webp)}

  .aurora-province{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadAuroraProvince@1024.webp)}
  .baler-discover-our-past-ride-our-present{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadBaler@1024.webp)}
  .casiguran-your-journey-to-pristine-shores-begins-here{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadCasiguran@1024.webp)}
  .dilasag-where-the-map-ends-and-adventure-begins{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadDilasag@1024.webp)}
  .dinalungan-where-philippine-eagles-soar-and-adventures-unfold{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadDinalungan@1024.webp)}
  .dingalan-the-batanes-of-the-east-your-scenic-escape{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadDingalan@1024.webp)}
  .dipaculao-from-powdery-sands-to-ancient-rocks{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadDipaculao@1024.webp)}
  .maria-aurora-where-history-towers-in-natures-embrace{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadMariaAurora@1024.webp)}
  .san-luis-where-waterfalls-whisper-and-forests-flourish{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadSanLuis@1024.webp)}
  .the-ultimate-guide-to-a-standout-hotel-page-on-aurora-ph{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/masthead-hotel-marketing-tips@1024.webp)}
  .i-angat-ang-sarap-your-guide-to-a-starfish-worthy-restaurant-page-on-aurora-ph{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/masthead-restaurant-marketing-tips@1024.webp)}
  .gabay-sa-tagumpay-how-to-make-your-aurora-attraction-shine-on-aurora-ph{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/masthead-attraction-marketing-tips@1024.webp)}

  .restaurants{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadRestaurants@1024.webp)}
  .top-restaurants{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/top-restaurants@1024.webp)}
  .top-attractions{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/top-attractions@1024.webp)}
  .businessOwners{background-image:url(/beta/wp-content/themes/AuroraTwenty25/assets/images/mastheadBusinessOwners@1024.webp)}
.col-md-3{margin:20px 0}
  footer ul li.breakpointMobile::after{content:""}{content:""}
}

/* Tablet */
@media (min-width: 481px) and (max-width: 768px) {
  /*.container { width: 100%; }
  #auroraVideo{width:100%;height:300px;margin:0 0 40px 0}*/
  .col-md-3{width:100%}
  .margin-80{margin:0 0 40px 0}
  .col-md-3{margin:15px 0}
}

/* Desktop */
@media (min-width: 769px) and (max-width: 1200px) {
  /*.container { max-width: 960px; }*/
}

/* Large screens */
@media (min-width: 1201px) {
  /*.container { max-width: 1140px; }*/
}