:root{
    --green:#8bc34a;
    --text-dark:#333;
    --gray-band:#9e9e9e;
    --link-blue:#2e6da4;
    --header-link:#8d8d8d;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  body{font-family:Arial, Helvetica, sans-serif; color:var(--text-dark); background:#fff;}
  a{text-decoration:none;color:inherit;}

  /* Header */
  header{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 40px; border-bottom:1px solid #eee;
  }
  .logo{display:flex; align-items:center; gap:10px;}

  .logo-text{font-size:13px;line-height:1.3;color:#555;}
  .logo-text strong{display:block;font-size:14px;color:#333;}
  nav{display:flex;gap:28px;font-size:14px;color:var(--header-link);}
  nav a{white-space:nowrap;}
  nav a:hover{color:#333;}

  /* Hero gallery */
  .gallery{
    display:grid;
    grid-template-columns: 1fr 1.6fr 1.6fr 1fr;
    grid-template-rows: 220px 220px;
    gap:4px;
  }
  .ph{
    position:relative;
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-size:13px;text-align:center;overflow:hidden;
  }
  .ph span{position:relative;z-index:1;padding:6px;opacity:.85;}
  .ph1{background:linear-gradient(135deg,#e8e0d0,#c9bfa5);grid-row:1;grid-column:1;}
  .ph5{background:linear-gradient(135deg,#3a4a63,#1f2a3d);grid-row:2;grid-column:1;}
  .ph2{background:linear-gradient(135deg,#5a5a5a,#2b2b2b);grid-row:1;grid-column:2;position:relative;}
  .ph2 .caption{
    position:absolute;bottom:0;left:0;right:0;
    background:rgba(0,0,0,.55); color:#fff;
    padding:18px 20px; font-size:19px; font-weight:600; line-height:1.35; text-align:left;
  }
  .ph6{background:linear-gradient(135deg,#7a6b56,#4a3f31);grid-row:2;grid-column:2;}
  .ph3{background:linear-gradient(135deg,#b7cad6,#e9eef1);grid-row:1 / span 2;grid-column:3;}
  .ph4{background:linear-gradient(135deg,#cfd6da,#9aa5ab);grid-row:1;grid-column:4;}
  .ph7{background:linear-gradient(135deg,#3f6b52,#264533);grid-row:2;grid-column:4;}



	  .hero-swiper{
    width:100%;
    height:520px;
  }
  .post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
  
  
  @media (max-width:700px){
    .hero-swiper{height:360px;}
  }
  
  
 
  .slide{
    position:relative;
    width:100%;height:100%;
    display:flex;align-items:center;
    background-size:cover;
    background-position:center;
    overflow:hidden;
  }
 
  /* placeholder photo backgrounds — replace with real background-image: url(...) */
  /*.slide1{ background-image: linear-gradient(120deg,#c98a5e 0%,#e8b98a 25%,#7a4a30 50%,#f0c9a0 75%,#8a5a3a 100%); }
  .slide2{ background-image: linear-gradient(120deg,#4a6b8a 0%,#8ab0d0 40%,#2e4a63 70%,#a8c8e0 100%); }
  .slide3{ background-image: linear-gradient(120deg,#5a8a5a 0%,#9ac89a 40%,#2e4a2e 70%,#c0e0b8 100%); }*/
  
  .slide1{
	  background:url(../images/slide-pic-1.jpg) no-repeat;
	  background-size:cover;
  }
  .slide2{
	  background:url(../images/slide-pic-2.jpg) no-repeat;
	  background-size:cover;
  }
   .slide3{
	  background:url(../images/slide-pic-3.jpg) no-repeat;
	  background-size:cover;
  }
 
  .caption-box{
    position:relative;
    z-index:2;
    background:rgba(0,0,0,.5);
    color:#fff;
    padding:34px 40px;
    max-width:560px;
    margin-left:6%;
    font-size:26px;
    line-height:1.4;
    font-weight:400;
  }
 



  /* Mission icons */
  .mission{
    display:flex; justify-content:center; gap:120px;
    padding:60px 20px 70px; flex-wrap:wrap;
  }
  .mission-item{max-width:280px; text-align:center;}
  .icon-circle{
    width:70px;height:70px;border-radius:50%;
    border:2px solid var(--green);
    display:flex;align-items:center;justify-content:center;
    margin:0 auto 18px; color:var(--green); font-size:26px;
  }
  .mission-item h3{
    font-size:14px; letter-spacing:1px; color:#2e6da4; font-weight:600; margin-bottom:14px;
  }
  .mission-item p{font-size:13px; line-height:1.6; color:#555;}

  /* Quote band */
  .quote-band{
    background:var(--gray-band); color:#fff; text-align:center;
    padding:60px 30px; font-size:20px; line-height:1.7; font-weight:300;
  }
  .quote-band p{max-width:900px; margin:0 auto;}

  /* Content section */
  .content-wrap{
    display:grid; grid-template-columns: 2fr 1fr; gap:40px;
    max-width:1200px; margin:50px auto; padding:0 30px;
  }
  .content-box{
    background:#f4f4f4; padding:35px; box-shadow:4px 4px 12px rgba(0,0,0,.15);
  }
  .content-box p{font-size:13.5px; line-height:1.8; color:#444; margin-bottom:16px;}
  .content-box p:last-child{margin-bottom:0;}

  .sidebar h4{font-size:15px; letter-spacing:1px; color:#333; margin-bottom:18px;}
  .sidebar a{
    display:block; color:var(--link-blue); font-size:13.5px; line-height:1.6; margin-bottom:14px;
  }
  .sidebar a:hover{text-decoration:underline;}
  .thumb{
    width:60px;height:50px;background:linear-gradient(135deg,#6b7b6b,#33402f);
    margin-bottom:6px;
  }

  /* Video */
  .video-wrap{max-width:1200px; margin:0 auto 60px; padding:0 30px;}
  .video-card{
    position:relative; max-width:700px; height:280px;
    background:linear-gradient(135deg,#3a4a3a,#1c231c);
    display:flex; flex-direction:column; justify-content:space-between;
    color:#fff; overflow:hidden;
  }
  .video-top{
    display:flex; align-items:center; gap:10px; padding:12px 16px;
    background:rgba(0,0,0,.25); font-size:12px;
  }
  .video-badge{
    background:#000;color:#fff;font-size:9px;font-weight:bold;
    padding:4px 6px; text-align:center; line-height:1.1;
  }
  .video-title{font-weight:600; font-size:38px; text-transform:uppercase; padding:0 20px; line-height:1.15;}
  .video-bottom{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 20px; background:rgba(0,0,0,.2);
  }
  .play-btn{
    width:60px;height:44px;background:#ff0000;border-radius:6px;
    display:flex;align-items:center;justify-content:center;
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  }
  .play-btn::after{
    content:""; border-style:solid; border-width:10px 0 10px 16px;
    border-color:transparent transparent transparent #fff; margin-left:3px;
  }
  .watch-btn{
    background:rgba(0,0,0,.6); color:#fff; font-size:12px; padding:6px 12px;
    border-radius:3px; display:flex; align-items:center; gap:6px;
  }

  /* Footer */
  footer{
    background:#3a3a3a; color:#ccc; text-align:center; padding:40px 20px;
    font-size:12.5px;
  }
  footer .rule{
    width:60px;height:1px;background:#666;margin:0 auto 20px;
  }
  footer a{color:#ccc;}
  
    /* about Page banner */
  .page-banner{
    background:var(--gray-band); color:#fff; text-align:center;
    padding:70px 20px 60px;
  }
  .page-banner h1{
    font-size:34px; font-weight:400; letter-spacing:2px; margin-bottom:18px;
  }
  .breadcrumb{font-size:14px;}
  .breadcrumb a{color:#fff;}
  .breadcrumb span{margin:0 8px; opacity:.8;}

  /* Content */
  .content-wrap{
    display:grid; grid-template-columns: 2fr 1fr; gap:40px;
    max-width:1200px; margin:60px auto; padding:0 30px;
  }

  .card{
    background:#fff; border:1px solid #eee;
    box-shadow:2px 4px 14px rgba(0,0,0,.12);
    padding:35px 40px; margin-bottom:35px;
  }
  .card h2{
    font-size:26px; font-weight:400; color:#333; margin-bottom:14px;
  }
  .card hr{
    border:none; border-top:1px solid #ddd; margin-bottom:20px;
  }
  .card ul{
    list-style:circle; padding-left:22px;
  }
  .card ul li{
    font-size:14.5px; line-height:1.7; color:#444; margin-bottom:14px;
  }
  .card ul li:last-child{margin-bottom:0;}

  .sidebar h4{font-size:15px; letter-spacing:1px; color:#333; margin-bottom:18px;}
  .sidebar a{
    display:block; color:var(--link-blue); font-size:13.5px; line-height:1.6; margin-bottom:14px;
  }
  .sidebar a:hover{text-decoration:underline;}
  .thumb{
    width:100px;height:70px;background:linear-gradient(135deg,#6b7b6b,#33402f);
    margin-bottom:10px;
  }

  /* Footer */
  footer{
    background:#3a3a3a; color:#ccc; text-align:center; padding:40px 20px;
    font-size:12.5px;
  }
  footer .rule{
    width:60px;height:1px;background:#666;margin:0 auto 20px;
  }
  footer a{color:#ccc;}
  
  
  
  
  :root{
    --link-blue:#2e6da4;
    --header-link:#8d8d8d;
    --gray-band:#9a9a9a;
    --green:#8bc34a;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  body{font-family:Arial, Helvetica, sans-serif; color:#333; background:#fff;}
  a{text-decoration:none;color:inherit;}

  /* Header */
  header{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 40px; border-bottom:1px solid #eee;
  }
  .logo{display:flex; align-items:center; gap:10px;}
  .logo-badge{
    display:flex;align-items:center;justify-content:center;
    font-weight:bold;color:#d6538c;font-size:18px;letter-spacing:1px;
  }
  .logo-text{font-size:13px;line-height:1.3;color:#555;}
  .logo-text strong{display:block;font-size:14px;color:#333;}
  nav{display:flex;gap:28px;font-size:14px;color:var(--header-link);}
  nav a:hover{color:#333;}

  /* Page banner */
  .page-banner{
    background:var(--gray-band); color:#fff; text-align:center;
    padding:70px 20px 60px;
  }
  .page-banner h1{
    font-size:34px; font-weight:400; letter-spacing:2px; margin-bottom:18px;
  }
  .breadcrumb{font-size:14px;}
  .breadcrumb a{color:#fff;}
  .breadcrumb span{margin:0 8px; opacity:.8;}

  /* Content */
  .content-wrap{
    display:grid; grid-template-columns: 2fr 1fr; gap:40px;
    max-width:1200px; margin:60px auto; padding:0 30px;
  }

  .main h2{
    font-size:28px; font-weight:400; color:#4a4a4a; margin-bottom:22px;
  }
  .main .intro{
    font-size:14.5px; font-weight:bold; line-height:1.7; color:#333; margin-bottom:30px;
  }

  .field{margin-bottom:26px;}
  .field label{
    display:block; font-size:14.5px; color:#333; margin-bottom:8px;
  }
  .field input[type="text"],
  .field input[type="email"],
  .field textarea{
    width:100%;
    background:#f5f5f5;
    border:1px solid #ddd;
    padding:10px 12px;
    font-size:14px;
    font-family:inherit;
    color:#333;
  }
  .field input:focus,
  .field textarea:focus{
    outline:1px solid #8bc34a;
    background:#fff;
  }
  .field textarea{
    height:180px;
    resize:vertical;
  }

  .send-btn{
    background:#fff;
    border:1px solid var(--green);
    color:var(--green);
    padding:10px 34px;
    font-size:14px;
    cursor:pointer;
    transition:background .2s, color .2s;
  }
  .send-btn:hover{
    background:var(--green);
    color:#fff;
  }

  .form-note{
    margin-top:16px;
    font-size:13.5px;
    color:#2e6da4;
    display:none;
  }
  .form-note.show{display:block;}

  .sidebar h4{font-size:15px; letter-spacing:1px; color:#333; margin-bottom:18px;}
  .sidebar a{
    display:block; color:var(--link-blue); font-size:13.5px; line-height:1.6; margin-bottom:14px;
  }
  .sidebar a:hover{text-decoration:underline;}
  .thumb{
    width:100px;height:70px;background:linear-gradient(135deg,#6b7b6b,#33402f);
    margin-bottom:10px;
  }

  /* Footer */
  footer{
    background:#3a3a3a; color:#ccc; text-align:center; padding:40px 20px;
    font-size:12.5px;
  }
  footer .rule{
    width:60px;height:1px;background:#666;margin:0 auto 20px;
  }
  footer a{color:#ccc;}
	
	 :root{
    --link-blue:#2e6da4;
    --header-link:#8d8d8d;
    --gray-band:#9a9a9a;
    --green:#8bc34a;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  body{font-family:Arial, Helvetica, sans-serif; color:#333; background:#fff;}
  a{text-decoration:none;color:inherit;}

  /* Header */
  header{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 40px; border-bottom:1px solid #eee;
  }
  .logo{display:flex; align-items:center; gap:10px;}
  .logo-badge{
    width:136px;height:56px;
    display:flex;align-items:center;justify-content:center;
    font-weight:bold;color:#d6538c;font-size:18px;letter-spacing:1px;
  }
  .logo-text{font-size:13px;line-height:1.3;color:#555;}
  .logo-text strong{display:block;font-size:14px;color:#333;}
  nav{display:flex;gap:26px;font-size:14px;color:var(--header-link);}
  nav a:hover{color:#333;}

  /* Page banner */
  .page-banner{
    background:var(--gray-band); color:#fff; text-align:center;
    padding:70px 20px 60px;
  }
  .page-banner h1{
    font-size:34px; font-weight:400; letter-spacing:2px; margin-bottom:18px;
  }
  .breadcrumb{font-size:14px;}
  .breadcrumb a{color:#fff;}
  .breadcrumb span{margin:0 8px; opacity:.8;}

  /* Content */
  .content-wrap{
    display:grid; grid-template-columns: 2fr 1fr; gap:40px;
    max-width:1200px; margin:50px auto; padding:0 30px;
  }

  .post{
    border:1px solid #eee;
    box-shadow:1px 2px 8px rgba(0,0,0,.08);
    margin-bottom:30px;
    overflow:hidden;
  }
  .post-img{
    width:100%; height:340px;
    background-size:cover; background-position:center;
  }
  .post-body{padding:26px 30px 24px;}
  .post h2{
    font-size:20px; font-weight:400; color:#4a6a8a; margin-bottom:8px;
  }
  .post h2:hover{color:#2e4a63;}
  .post-meta{
    font-size:12px; color:#999; margin-bottom:12px;
  }
  .post-meta a{color:var(--link-blue);}
  .post-meta .divider{
    display:inline-block; border-top:1px solid #e2e2e2; width:100%; margin-top:10px;
  }
  .post-excerpt{
    font-size:14px; line-height:1.7; color:#444; margin-bottom:20px;
  }
  .post-footer{
    display:flex; align-items:center; justify-content:space-between;
  }
  .read-more{
    display:inline-block;
    border:1px solid var(--green);
    color:var(--green);
    padding:9px 22px;
    font-size:13.5px;
    background:#fff;
    transition:background .2s, color .2s;
  }
  .read-more:hover{background:var(--green); color:#fff;}
  .comment-count{
    width:34px;height:34px;border-radius:50%;
    border:1px solid #ccc;
    display:flex;align-items:center;justify-content:center;
    font-size:12px; color:#555;
  }

  /* Pagination */
  .pagination{
    display:flex; gap:6px; margin:20px 0 60px;
  }
  .pagination a{
    width:34px;height:34px;
    display:flex;align-items:center;justify-content:center;
    border:1px solid #eee;
    font-size:13px; color:var(--link-blue);
  }
  .pagination a.active{
    background:#4a4a4a; color:#fff; border-color:#4a4a4a;
  }
  .pagination a:hover:not(.active){background:#f2f2f2;}

  /* Sidebar */
  .sidebar h4{font-size:15px; letter-spacing:1px; color:#333; margin-bottom:18px;}
  .sidebar a{
    display:block; color:var(--link-blue); font-size:13.5px; line-height:1.6; margin-bottom:14px;
  }
  .sidebar a:hover{text-decoration:underline;}
  .thumb{
    width:100px;height:70px;background:linear-gradient(135deg,#6b7b6b,#33402f);
    margin-bottom:10px;
  }

  /* Footer */
  footer{
    background:#3a3a3a; color:#ccc; text-align:center; padding:40px 20px;
    font-size:12.5px;
  }
  footer .rule{
    width:60px;height:1px;background:#666;margin:0 auto 20px;
  }
  footer a{color:#ccc;}
  
  
  /* blog detail page */
	
	/* Header Section */
        .blog-header {
            background-color: #8a8a8a;
            color: #ffffff;
            padding: 60px 40px 40px;
            text-align: center;
        }
 
        .breadcrumb-nav {
            font-size: 12px;
            font-weight: 300;
            margin-bottom: 20px;
            letter-spacing: 0.5px;
        }
 
        .breadcrumb-nav a {
            color: #ffffff;
            text-decoration: none;
            opacity: 0.8;
            transition: opacity 0.3s ease;
        }
 
        .breadcrumb-nav a:hover {
            opacity: 1;
        }
 
        .blog-title {
            font-size: 28px;
            font-weight: 600;
            line-height: 1.4;
            margin-bottom: 15px;
            letter-spacing: -0.5px;
        }
 
        .blog-date {
            font-size: 14px;
            font-weight: 300;
            letter-spacing: 0.5px;
        }
 
        /* Main Content Area */
        .blog-container {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 50px;
            max-width: 1400px;
            margin: 0 auto;
            padding: 60px 40px;
        }
 
        /* Left Column - Article */
        .blog-content {
            line-height: 1.8;
        }
 
        .blog-intro {
            font-size: 16px;
            font-weight: 300;
            color: #555;
            margin-bottom: 30px;
            line-height: 1.8;
        }
 
        .blog-section {
            margin-bottom: 40px;
        }
 
        .section-title {
            font-size: 18px;
            font-weight: 600;
            color: #151515;
            margin-bottom: 15px;
            margin-top: 30px;
        }
 
        .blog-text {
            font-size: 14px;
            font-weight: 300;
            line-height: 1.8;
            color: #444;
            margin-bottom: 15px;
            text-align: justify;
        }
 
        .blog-text strong {
            font-weight: 500;
            color: #151515;
        }
 
        .blog-figure {
            margin: 40px 0;
            text-align: center;
        }
 
        .blog-figure img {
            max-width: 100%;
            height: auto;
            border-radius: 4px;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
        }
 
        .figure-caption {
            font-size: 12px;
            font-weight: 300;
            color: #888;
            margin-top: 12px;
            font-style: italic;
        }
 
        .blog-quote {
            padding: 20px;
            background-color: #f5f5f5;
            border-left: 4px solid #151515;
            margin: 30px 0;
            font-size: 14px;
            font-weight: 300;
            line-height: 1.8;
            color: #555;
        }
 
        .blog-list {
            margin: 20px 0 20px 20px;
            font-size: 14px;
            font-weight: 300;
            line-height: 1.8;
        }
 
        .blog-list li {
            margin-bottom: 10px;
            color: #444;
        }
 
        .read-more-link {
            color: #2563eb;
            text-decoration: none;
            font-weight: 400;
            transition: color 0.3s ease;
        }
 
        .read-more-link:hover {
            color: #151515;
            text-decoration: underline;
        }
 
        /* Right Sidebar */
        .blog-sidebar {
            position: sticky;
            top: 40px;
        }
 
        .sidebar-title {
            font-size: 16px;
            font-weight: 600;
            color: #151515;
            margin-bottom: 30px;
            border-bottom: 2px solid #151515;
            padding-bottom: 15px;
        }
 
        .blog-card {
            margin-bottom: 30px;
            background-color: #f9f9f9;
            border-radius: 4px;
            overflow: hidden;
            transition: all 0.3s ease;
        }
 
        .blog-card:hover {
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
        }
 
        .blog-card-image {
            width: 100%;
            height: 180px;
            object-fit: cover;
            display: block;
        }
 
        .blog-card-content {
            padding: 20px;
        }
 
        .blog-card-title {
            font-size: 14px;
            font-weight: 500;
            color: #151515;
            margin-bottom: 10px;
            line-height: 1.4;
        }
 
        .blog-card-date {
            font-size: 12px;
            font-weight: 300;
            color: #888;
        }
 
        .blog-card-link {
            display: inline-block;
            margin-top: 10px;
            color: #2563eb;
            text-decoration: none;
            font-size: 12px;
            font-weight: 400;
            transition: color 0.3s ease;
        }
 
        .blog-card-link:hover {
            color: #151515;
        }
		img{
			max-width:100%;
		}
		.post-byline {
			display: flex;
			margin-bottom: 10px;
			border-bottom: 1px solid #dadada;
			padding-bottom: 10px;
			font-size: 13px;
			gap: 20px;
		}
		.blog-next-prev {
			display: flex;
			justify-content: space-between;
		}
		ul{
			margin-left:50px;
		}
		.italic{
			font-style:italic;
		}
		strong, .strong {
			font-weight: 700;
		}
		.blog-intro a{
			color:blue;
		}
		
		
		
		
		.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width: 28px;
  height: 21px;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
}

.nav-toggle .bar {
  display: block;
  height: 3px;
  width: 100%;
  background: #333;
  border-radius: 2px;
  transition: transform .3s ease, opacity .3s ease;
}

/* X animation when open */
.nav-toggle.active .bar:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.nav-toggle.active .bar:nth-child(2) { opacity: 0; }
.nav-toggle.active .bar:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }
		
		
		
		
 
        /* Responsive */
        @media (max-width: 1200px) {
            .blog-container {
                gap: 40px;
                padding: 50px 30px;
            }
 
            .blog-title {
                font-size: 24px;
            }
        }
	
  
  /* blog detail page */
  
  
  
  
  
   @media (max-width: 1000px) {
		section.video-wrap iframe {
			width: 100%;
		}
            .blog-container {
                grid-template-columns: 1fr;
                gap: 40px;
            }
 
            .blog-sidebar {
                position: static;
            }
 
            .blog-header {
                padding: 50px 30px 30px;
            }
 
            .blog-title {
                font-size: 22px;
            }
 
            .section-title {
                font-size: 16px;
            }
 
            .blog-text {
                font-size: 13px;
            }
        }
  

  @media (max-width:900px){
	  nav.open {
		display: flex;
		flex-direction: column;
		width: 100%;
        padding-top: 30px;
        padding-bottom: 39px;
	}

	header {
		flex-direction: column;
	}
	.nav-toggle {
        display: flex;
        position: absolute;
        right: 18px;
        top: 35px;
    }
	   
	    nav.open { display: flex; }
    nav{display:none;}
    .content-wrap{grid-template-columns:1fr;}
    .post-img{height:220px;}
  }




  @media (max-width:900px){
    nav{display:none;}
    .content-wrap{grid-template-columns:1fr;}
  }

  @media (max-width:900px){
    nav{display:none;}
    .gallery{grid-template-columns:1fr 1fr; grid-template-rows:repeat(4,160px);}
    .ph3{grid-row:auto; grid-column:auto;}
    .content-wrap{grid-template-columns:1fr;}
    .mission{gap:40px;}
  }
  
   @media (max-width:700px){
	.blog-header {
                padding: 40px 20px 25px;
            }
 
            .blog-title {
                font-size: 20px;
                margin-bottom: 10px;
            }
 
            .blog-container {
                padding: 40px 20px;
            }
 
            .blog-text {
                font-size: 13px;
                text-align: left;
            }
 
            .section-title {
                font-size: 15px;
                margin-top: 25px;
                margin-bottom: 12px;
            }
 
            .blog-intro {
                font-size: 14px;
                margin-bottom: 20px;
            }
 
            .blog-card-image {
                height: 150px;
            }
  .caption-box{font-size:18px; padding:20px 24px; max-width:80%; margin-left:5%;}
  }
  
  
  
  
  
   @media (max-width: 480px) {
            .blog-header {
                padding: 30px 15px 20px;
            }
 
            .blog-title {
                font-size: 18px;
            }
 
            .blog-container {
                padding: 30px 15px;
                gap: 30px;
            }
 
            .blog-text {
                font-size: 12px;
            }
 
            .section-title {
                font-size: 14px;
            }
 
            .sidebar-title {
                font-size: 14px;
            }
 
            .blog-card-title {
                font-size: 13px;
            }
        }
  
  
  
 
  /* Swiper nav arrows */
  .swiper-button-next, .swiper-button-prev{
    color:rgba(255,255,255,.75);
  }
  .swiper-button-next:hover, .swiper-button-prev:hover{
    color:#fff;
  }
  .swiper-pagination-bullet{
    background:#fff;
    opacity:.6;
  }
  .swiper-pagination-bullet-active{
    opacity:1;
    background:#8bc34a;
  }