body {
  font-family: "Cormorant Garamond", serif;
  color: #645452; /* Title color */
  font-size: 1.5rem; /* Font size (adjust as needed) */
  text-align: center; /* Center alignment */

}
p{
  line-height: 1.7em;
  margin-bottom: 30px; /* between paragraphs */ 
}
.frame-1 {
  background-image: url("background4.jpg"); /* Replace with your actual image path */
  background-size: contain; /* Ensures the entire image is visible */
  background-repeat: no-repeat; /* Prevents the image from repeating */
  height: auto; /* Allows the height to adjust based on the aspect ratio */
  aspect-ratio: 4 / 3; /* Optional: Set a default aspect ratio */
}
.frame-1 img {
  position: sticky;
  top: 40%;
  left: 50%;
  max-width: 400px;
  transform: translate(-50%, -50%);
  height: auto;
}
.title-class {
  font-family: "Bodoni FLF", serif; /* Font family */
  color: #645452; /* Title color */
  text-align: center; /* Center alignment */
  font-size: 3rem; /* Font size (adjust as needed) */
  font-weight: 700; /* Bold font weight for emphasis */
  letter-spacing: 0.05em; /* Slight spacing for readability */
  margin: 1rem 0; /* Add spacing around the title */
  line-height: 1.5; /* Comfortable line height for multi-line titles */
}
.padding_class {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/* Contact Bar */
.contact-bar {
  background: #fffaf0; /* Match your theme */
  padding: 10px 0;
  border-bottom: 1px solid #e0e0e0; /* Subtle separation */
  position: relative; /* Normal flow */
  z-index: 100; /* Still above content but not fixed */
}

/* Social Icons in Bar */
.contact-bar .social-icons {
  display: flex;
  justify-content: center;
  gap: 25px;
  margin: 0 auto;
}

.contact-bar .social-icons a {
  color: #645452;
  font-size: 20px;
  text-decoration: none;
  transition: all 0.3s ease;
  padding: 5px;
}

.contact-bar .social-icons a:hover {
  color: #979094;
  transform: translateY(-15px);
}

.frame-2 {
  background-color: #fffaf0;
  padding: 50px 20px;
}
.frame-2 .row {
  align-items: center;
}
.frame-2 video {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}
.limited-width {
  max-width: 800px; /* Adjust this value to suit your needs */
  margin: 0 auto; /* Center the image horizontally */
}
.frame-3 {
  padding: 50px 20px;
}
.frame-3 video {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}
.carousel-inner img {
  width: 100%;
  height: auto;
}
.package-frame {
  padding: 50px 20px;
}
.contact-frame {
  background-color: #fffaf0;
  padding: 50px 20px;
}

/* Blog Post Title */
.blog-title {
  font-family: "Bodoni FLF", serif;
  color: #645452;
  text-align: center;
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 1rem;
  letter-spacing: 0.05em;
  line-height: 1.2;
}

/* Blog Post Body */
.blog-body {
  font-family: "Arial", sans-serif;
  color: #333333;
  font-size: 1.125rem;
  line-height: 1.8;
  margin-bottom: 1.5rem;
  text-align: justify;
}

/* Blog Post Date */
.blog-date {
  font-family: "Arial", sans-serif;
  font-size: 0.875rem;
  font-style: italic;
  color: #999999;
  margin-bottom: 1rem;
  text-align: right;
}

/* Blog Post Author */
.blog-author {
  font-family: "Arial", sans-serif;
  font-size: 1rem;
  font-weight: bold;
  color: #645452;
  margin-bottom: 1rem;
}

/* Blog Post Container */
.blog-container {
  background-color: #fffaf0;
  border: 1px solid #e0e0e0;
  padding: 2rem;
  margin: 2rem 0;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* Responsive Design for Blog Post */
@media (max-width: 1024px) {

  .blog-title {
    font-size: 2rem;
  }

  .blog-body {
    font-size: 1rem;
  }

  .blog-date,
  .blog-author {
    font-size: 0.875rem;
  }
  body {
    font-size: 1.2rem; /* Slightly smaller font size */
  }
  .frame-1 img {
    top: 25%;
    max-width: 280px;
  }
  .title-class {
    font-size: 2rem; /* Font size (adjust as needed) */
  }
}

@media (max-width: 767px) {
 
    body {
    font-size: 1.1rem; /* Slightly smaller font size */
  }
  .frame-1 img {
    top: 50%;
    max-width: 200px;
  }
  .title-class {
    font-size: 1.5rem; /* Font size (adjust as needed) */
  }

@media (max-width: 450px) {
    .row.no-gutters {
        margin: 0; /* Remove default row margin */
      }
      
    .blog-container{
        padding: 1rem;
        margin: .2rem 0;
    }
    body {
      font-size: 1rem; /* Slightly smaller font size */
    }
    .frame-1 img {
      top: 50%;
      max-width: 150px;
    }
    .title-class {
      font-size: 1.4rem; /* Font size (adjust as needed) */
    }
}
