/*
 Theme Name:     Caravan
 Theme URI:      http://www.elegantthemes.com/gallery/divi/
 Description:    Custom Theme
 Author:         Joe Fino
 Author URI:     http://www.joefino.net
 Template:       Divi
 Version:        1.0.0
*/

@import url("../Divi/style.css");

/* =Theme customization starts here
------------------------------------------------------- */

html, body {
  text-rendering: optimizeLegibility;
}

body {
}

h1, h2, h3, h4, h5, h6 {
}

.et-social-google-plus a.icon::before {
  content: "\e09d";
}
#top-menu-nav > ul > li > a:hover {
	opacity: 1 !important;
	transition: all 0.4s ease-in-out;
	color: #a8322d !important;
}
/* Hero image with zoom animation */
.hero-image {
  position: relative;
  overflow: hidden;
}

.hero-image::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url('/wp-content/uploads/2025/05/hero.jpg'); /* Update path */
  background-size: 110%;
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: scroll;
  z-index: 0;
  animation: heroZoom 20s ease-in-out infinite alternate;
}

@keyframes heroZoom {
  0% {
    background-size: 110%;
    background-position: center top;
  }
  100% {
    background-size: 125%;
    background-position: center bottom;
  }
}

/* Main nav links styling */
.main-nav .et-menu li a {
  transition: color 0.3s ease;
}

.main-nav .et-menu li a:hover {
  color: #C24914 !important;
}

/* Right-align menu items */
.menu-right .et-menu {
  justify-content: flex-end !important;
  display: flex !important;
}

.menu-right .et-menu li {
  margin-left: 20px;
}

/* Responsive media queries (placeholders) */
@media only screen and (min-width: 768px) {}
@media only screen and (min-width: 1920px) {}
@media only screen and (max-width: 1440px) {}
@media only screen and (max-width: 1024px) {}
@media only screen and (max-width: 980px) {}
@media only screen and (max-width: 767px) {}
@media only screen and (min-width: 768px) and (max-width: 1024px) {}
@media only screen and (min-width: 320px) and (max-width: 980px) {}

/* iPhone-specific breakpoints */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) {}
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) {}
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) {}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {}