
   :root {
       --primary-color: #0069d9;
       --secondary-color: #388e3c;
       --secondary-dark-color: #2e7d32;
       --text-color: #555;
       --background-color: #f1f8e9;
       --footer-background-color: #f8f9fa;
       --overlay-opacity: 0.4;
   }

   body {
       font-family: 'Roboto', sans-serif;
   }

   /* Main Header Style */
   .navbar-brand {
       color: var(--primary-color) !important;
       font-size: 1.75rem;
       font-weight: 700;
   }

   /* Separator Section Styling */
   .separator {
       position: relative;
       height: 400px; /* Maximum height */
       overflow: hidden;
       margin: 0 15%;
   }

   .separator-image {
       width: 100%;
       height: 100%;
       object-fit: cover; /* Ensures the image covers the area without distortion */
       object-position: center; /* Centers the image */
   }

   .separator::after {
       content: '';
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background: var(--primary-color);
       opacity: var(--overlay-opacity);
   }

   /* Custom Navbar Links */
   .nav-link {
       color: var(--text-color) !important;
       margin-right: 15px;
   }

   .nav-link:hover {
       color: var(--secondary-color) !important;
   }

   /* Custom Button Styles */
   .btn-success {
       background-color: var(--secondary-color);
       border-color: var(--secondary-color);
   }

   .btn-success:hover {
       background-color: var(--secondary-dark-color);
       border-color: var(--secondary-dark-color);
   }

   /* Subscribe Section Styling */
   .subscribe-section {
       background-color: var(--background-color);
   }

   /* Card Hover Effect */
   .card {
       transition: transform 0.2s;
   }

   .card:hover {
       transform: scale(1.02);
   }

    /* Post Styles */
    .post-image img {
        max-width: 100%;
        height: auto;
        max-height: 400px; /* Adjust as needed */
        margin: 20px 0;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

   /* Footer Styling */
   footer {
       background-color: var(--footer-background-color);
       padding: 20px 0;
   }