/*
Theme Name:
Theme URI:
Author:
Author URI:
Description:
Version:2024.01
*/
@charset "utf-8";
/* CSS Document */

::selection {
  color:var(--bs-white);
  background:var(--bs-primary);
}

#page{ overflow:hidden;}
.full-img { position:relative;}
.full-img img{ width:100%; height:auto; position:relative; z-index:2;}
.ratio .full-img{min-width:initial; position:absolute; top:0; right:0; bottom:0; left:0; overflow:hidden; flex:0 0 auto; display:flex;}
.ratio .full-img img{flex:1 1 auto; align-self:center; justify-self:center; object-fit:cover; height:100%; min-width:100%; width:auto;}
.image-fit{min-width:initial; position:relative; overflow:hidden; flex:0 0 auto; display:flex;}
.image-fit img{flex:1 1 auto; align-self:center; justify-self:center; object-fit:cover; height:100%; min-width:100%; width:auto;}
.content-mb-30 h1, .content-mb-30 h2, .content-mb-30 h3, .content-mb-30 h4, .content-mb-30 h5, .content-mb-30 h6, .content-mb-30 p, .content-mb-30 ul, .content-mb-30 ol{ margin-bottom:30px;}
.content-mb-20 h1, .content-mb-20 h2, .content-mb-20 h3, .content-mb-20 h4, .content-mb-20 h5, .content-mb-20 h6, .content-mb-20 p, .content-mb-20 ul, .content-mb-20 ol{ margin-bottom:20px;}
.content-mb-24 h1, .content-mb-24 h2, .content-mb-24 h3, .content-mb-24 h4, .content-mb-24 h5, .content-mb-24 h6, .content-mb-24 p, .content-mb-24 ul, .content-mb-24 ol{ margin-bottom:24px;}
.content-mb-16 h1, .content-mb-16 h2, .content-mb-16 h3, .content-mb-16 h4, .content-mb-16 h5, .content-mb-16 h6, .content-mb-16 p, .content-mb-16 ul, .content-mb-16 ol{ margin-bottom:16px;}
.content-mb-10 h1, .content-mb-10 h2, .content-mb-10 h3, .content-mb-10 h4, .content-mb-10 h5, .content-mb-10 h6, .content-mb-10 p, .content-mb-10 ul, .content-mb-10 ol{ margin-bottom:10px;}
h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong{ font-weight: 800;}

.color-fff{ color:var(--bs-white);}
.title-uppercase h1, .title-uppercase h2, .title-uppercase h3, .title-uppercase h4, .title-uppercase h5, .title-uppercase h6{ text-transform:uppercase;}
.title-primary h1, .title-primary h2, .title-primary h3, .title-primary h4, .title-primary h5, .title-primary h6{ color:var(--bs-primary);}
.title-secondary h1, .title-secondary h2, .title-secondary h3, .title-secondary h4, .title-secondary h5, .title-secondary h6{ color:var(--bs-secondary);}
.title-dark h1, .title-dark h2, .title-dark h3, .title-dark h4, .title-dark h5, .title-dark h6, .color-000{ color:#16243d;}

.pre-header{ background-color: var(--bs-green); color: var(--bs-white);}
.pre-header .counter{ display: flex; align-items: center;}
.pre-header .counter strong{ text-transform: uppercase;}
.pre-header .counter .time-box{ background-color: #1a9c59; height: 60px; display: flex; align-items: center; padding: 0 16px; text-transform: uppercase; color: rgba(255,255,255,0.5); margin-left: 10px;}
.pre-header .counter .time-box strong{ margin-right: 3px; color: var(--bs-white);}
.pre-header .social{ margin-left: auto; display: flex; align-items: center;}
.pre-header .social a{ color: var(--bs-white); text-decoration: none; font-size: 20px;}
.pre-header .social a + a{ margin-left: 16px;}

.post-header{ background-color: var(--bs-white); -moz-transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease;}
.post-header .container{ height: 116px; display: flex; align-items: center; -moz-transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease;}
.post-header.scroll-to-fixed-fixed{box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;}
.post-header.scroll-to-fixed-fixed .container{ height: 80px;}

.page-banner{ position: relative; background-color: #000; color: var(--bs-white); z-index: 1;}
.page-banner .container{ height: 284px; display: flex; align-items: center; justify-content: flex-start; text-align: left;}
.page-banner .container h1{font-family: "Poppins", sans-serif; text-transform: uppercase;}
.page-banner .image-fit{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1;}
.page-banner .image-fit img{ opacity: 0.5;}
.project-orange-banner .container{ height: auto; justify-content: center; text-align: center; padding-top: 76px; padding-bottom: 116px; flex-direction: column;}
.project-orange-banner .container h1{text-shadow: 0 5px 5px rgba(0,0,0,0.5);}

.section{ position: relative; z-index: 1; background-position: center center; background-size: cover; background-repeat: no-repeat; padding: 100px 0;}
.section-bg-p{ background-image: url(/img/2025/patter-bg.jpg); background-size: auto; background-repeat: repeat; background-position: center;}

.contact-page-form .form-control, .contact-page-form .form-control:focus{ background-color: #f2f5f9; border-color: #f2f5f9; box-shadow: none; border-radius: 0; padding: 1rem}
.contact-page-form .input-group-text{background-color: #f2f5f9; border-color: #f2f5f9; box-shadow: none; border-radius: 0; color: #b5b7b9;}
.contact-page-form textarea.form-control{ height: 150px;}
.contact-page-form textarea.form-control + .input-group-text{  align-items: flex-start; padding-top: 1rem;}
.contact-address address{ margin: 0; padding-left: 20px; border-left: 5px solid var(--bs-green);}
.map {height: 420px; position: relative; width: 100%;}
.map .map-inner { bottom: 0; left: 0; position: absolute; top: 0; width: 100%;}
.map .map-inner iframe { height: 100%;  width: 100%;}

.footer{ background-color: #1a452f; background-image: url(/img/2025/footer-bg.png); color: #b3bfb9; font-size: 15px;}
.footer a{ color: #b3bfb9; text-decoration: none;}
.footer a:hover{ color: var(--bs-white); text-decoration: none;}
.footer-top{ padding: 40px 0;}
.footer-top h5{ color: var(--bs-white);}
.footer-top .social{ margin-left: auto; display: flex; align-items: center;}
.footer-top .social a{ color: var(--bs-white); text-decoration: none; font-size: 20px;}
.footer-top .social a + a{ margin-left: 24px;}
.footer-box .d-flex + .d-flex{ margin-top: 20px;}
.footer-box .d-flex i{ color: #4b7260;}
.footer-box ul.menu{ padding: 0; display: flex; flex-direction: column; list-style: none; gap: 8px;}
.footer-bottom{ padding: 20px 0; text-align: center; background-color: #173827; color: #b3bfb9; font-size: 14px;}


.donate-list .item{ background-color: var(--bs-white); background-image: url(/img/2025/donate-icon.png); background-position: 40px center; background-repeat: no-repeat; border-radius: 20px; border: 1px solid #f2f3f3; box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px; padding: 30px 30px 30px 120px; color: var(--bs-dark); display: flex; align-items: center; gap: 20px; text-align: left;}
.donate-list .item + .item{ margin-top: 30px;}
.event-calendar{ background-color: var(--bs-white); border-radius: 16px; box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;}

.center-image{ margin: 0 auto; width: 100%; max-width: 312px; overflow: hidden; border: 4px solid var(--bs-white); border-radius: 50%; box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px; position: relative; z-index: 100; top: -80px;}

.radio-style{ margin-top: 16px;}
.radio-style input[type=radio]{ display: none;}
.radio-style input[type=radio] + label{ background-color: #f2f5f9; background-image: url(/img/2025/uncheck.png); background-position: 16px center; background-repeat: no-repeat; padding: 20px 20px 20px 48px; color: #000; font-size: 14PX; display: flex; align-items: center; cursor: pointer;}
.radio-style input[type=radio] + label span{ margin-left: auto;}
.radio-style input[type=radio]:checked + label{ background-color: #dafae9; background-image: url(/img/2025/check.png);}

.management-names .item + .item{margin-top: 16px;}
.management-names .item {font-size: 28px; color: var(--bs-dark);}
.management-names .item .head-name{ background-image: url(/img/2025/donate-icon.png); background-position: 20px center; background-repeat: no-repeat; background-size: 44px; background-color: var(--bs-white); box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;  font-weight: 700; padding: 24px 24px 24px 80px; border-radius: 6px;}
.management-names .item .head-name.no-bg{ background-color: transparent; border-radius: 0; box-shadow: none;}
.management-names .item .head-name.gray-bg{ background-color: #f9fafa;}
.management-names .item .head-name strong{ font-weight: 800; color: var(--bs-green);}
.management-names .item .asst-name{ padding-left: 120px; padding-top: 24px;}
.management-names .item .names{ padding: 32px; background-color: var(--bs-white); box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; margin-left: 120px; margin-top: 24px;}

.timeline-section .item{ position: relative;}
.timeline-section .item [class*=col-]{ display: flex; flex-direction: column; gap: 16px;}
.timeline-section .item [class*=col-] h3{ margin-bottom: 0;}
.timeline-section .item [class*=col-] .date{ display: flex;}
.timeline-section .item time{ background-color: #b77a3e; display: inline-block; font-weight: 700; color: var(--bs-white); position: relative; padding: 2px 10px}
.timeline-section .item time:after{ top: 100%; position: absolute; content: '';}
.timeline-section .item:nth-child(odd) time{ border-radius: 5px 5px 0 5px;}
.timeline-section .item:nth-child(odd) time:after{width: 0; height: 0; border-top: 10px solid #b77a3e; border-left: 10px solid transparent; right: 0;}
.timeline-section .item:nth-child(even) time{ border-radius: 5px 5px 5px 0;}
.timeline-section .item:nth-child(even) time:after{width: 0; height: 0; border-top: 10px solid #b77a3e; border-right: 10px solid transparent; left: 0;}
.timeline-section .item .icon{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%);}
.timeline-section .item:nth-child(odd) [class*=col-], .timeline-section .item:nth-child(odd) [class*=col-] .date{ justify-content: flex-end; text-align: right;}
.timeline-section .item:nth-child(even) .row{ justify-content: flex-end;}
.timeline-section:after{ background: url(/img/2025/line.png); width: 4px; height: 100%; left: 50%; margin-left: -2px; content: ''; z-index: 1; position: absolute; top: 0;}
.section-shadow{box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; z-index: 2;}

.BannerSlider{ text-align: center; color: var(--bs-white);}
.BannerSlider .container{ height: 900px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px;}
.BannerSlider .image-fit{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1;}
.BannerSlider .image-fit:before{ background-color: rgba(0,0,0,0.4); position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; content: '';}
.BannerSlider .container h2{ text-transform: uppercase; font-weight: 900; text-shadow: 0 5px 5px rgba(0,0,0,0.5); margin-bottom: 0;}

.timing-section{ background-image: url(/img/2025/w1-bg.jpg); position: relative; padding-top: 40px; color: var(--bs-white); text-align: center;}
.timing-section:after{ height: 50px; left: 0; right: 0; bottom: 0; z-index: 1; background-image: url(/img/2025/patter-bg.jpg); content: ''; position: absolute;}
.timing-section .time-box{ border-radius: 10px; overflow: hidden; background-color: #274133; -moz-transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease;}
.timing-section .time-box:hover{ background-color: var(--bs-green);}
.timing-section .time-box h6{ background-color: rgba(255,255,255,0.2); border: 10px; height: 50px; font-weight: 500;; margin: 0; display: flex; align-items: center; justify-content: center;}
.timing-section .time-box .content{ padding: 32px 20px;}
.timing-section .time-box .content time{ display: inline-flex; justify-content: center; align-items: center; font-weight: 700; height: 40px; padding: 0 20px; border-radius: 6px; background-color: var(--bs-green);-moz-transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease;}
.timing-section .time-box .content h4{ margin-bottom: 20px;}
.timing-section .time-box:hover time{ background-color: #011e0f;}

.home-w1 h3{ font-weight: 400; color: var(--bs-dark); margin: 0;}
.home-w1 h1{ color: var(--bs-green);}
.home-w1 h4{ padding: 24px; border-radius: 10px; background-color: #f9f9f9;  font-weight: 400;}
.home-w1 h4 span{ display: block; color: var(--bs-green); font-weight: 700;}
.home-w1 h5{color: var(--bs-dark); display: flex; align-items: center; gap: 12px;}

.home-w1{ padding-bottom: 200px;}

.w2{ background-image: url(/img/2025/w2-bg.jpg); color: var(--bs-white);}
.w2 address{ font-weight: 500; display: flex; align-items: center; gap: 8px;}
.w2 address i{ color: #52c79d; font-size: 16px;}
.w2 h3{ color: #52c79d;}
.w2 ul{ margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 5px; justify-content: flex-start;}
.w2 ul li{ padding-left: 16px; background-image: url(/img/2025/dot.png); background-position: left center; background-repeat: no-repeat;}
.w2 .content{ padding-top: 48px; padding-bottom: 48px;}
.w2 .image{ width: 33.33333%; position: absolute; right: 0; bottom: -40px;}

.event-section, .contact-section{ background-color: #e5ebe6;}
.event-item{ background-color: var(--bs-white); border-radius: 16px; padding: 32px; display: flex; flex-direction: column; gap: 24px;}
.event-item time{ background-image: url(/img/2025/tag.png); height: 35px; width: 140px; color: var(--bs-white); font-size: 14px; display: flex; align-items: center; justify-content: center;}
.event-item address{ font-weight: 500; display: flex; align-items: center; gap: 8px;}
.event-item i{ color: #52c79d; font-size: 16px;}
.event-item ul{ margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 5px; justify-content: flex-start;}
.EventSlider{ margin-left: 12px; margin-left: -12px;;}
.EventSlider .item{ padding-left: 12px; padding-right: 12px;}
.EventSlider .slick-dots{ margin-left: auto; margin-right: auto; width: 250px; background-color: var(--bs-white); border-radius: 20px; display: flex; flex-wrap: wrap; padding: 0;}
.EventSlider .slick-dots li{flex: 1 1 auto; margin: 0;}
.EventSlider .slick-dots li button{ background-color: var(--bs-white); border-radius: 20px; height: 10px; width: 100%; margin: 0;}
.EventSlider .slick-dots li.slick-active button{height: 10px; background-color: var(--bs-orange);  width: 100%;}

.post-item { background-color: var(--bs-white); box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;}
.post-item .ratio{ border-bottom: 4px solid #53c99f;}
.post-item time{ color: var(--bs-white); position: absolute; bottom: 4px; left: 0; padding: 4px 12px; border-radius: 0 12px 0 0; z-index: 100; background-color: #53c99f;}
.post-item { font-size: 14px;}
.post-item .link{ color: var(--bs-orange); text-decoration: none; font-size: 16px; font-weight: 500; display: inline-flex; align-items: center; gap: 6px;}
.post-item .content{ padding: 32px;}
.PostSlider .item{ padding-bottom: 12px;}

.contact-section .form-control, .contact-section .form-control:focus{ background-color: var(--bs-white); border-color: var(--bs-white); box-shadow: none; border-radius: 0; padding: 1rem}
.contact-section .input-group-text{background-color: var(--bs-white); border-color: var(--bs-white); box-shadow: none; border-radius: 0; color: #b5b7b9;}
.contact-section textarea.form-control{ height: 150px;}
.contact-section textarea.form-control + .input-group-text{  align-items: flex-start; padding-top: 1rem;}

@media (min-width:320px) {
h1, .h2-48 h2{ font-size:calc(2.1875rem + ((1vw - 3.2px) * 0.8125));}
h2, .page-banner .container h1{font-size:calc(1.875rem + ((1vw - 3.2px) * 0.625));}
h3{font-size:calc(1.5rem + ((1vw - 3.2px) * 0.5));}
h4{font-size:calc(1.1875rem + ((1vw - 3.2px) * 0.3125));}
h5{font-size:calc(1.0625rem + ((1vw - 3.2px) * 0.1875));}
.font-18{font-size:calc(1rem + ((1vw - 3.2px) * 0.125));}
.font-20{font-size:calc(1rem + ((1vw - 3.2px) * 0.25));}
.font-24{font-size:calc(1rem + ((1vw - 3.2px) * 0.5));}
.BannerSlider .container h2{font-size: calc(2rem + ((1vw - 3.2px) * 4.2593));}
}

@media (min-width:1400px) {
h1, .h2-48 h2{font-size:48px;}
h2, .page-banner .container h1{font-size:40px;}
h3{font-size:32px;}
h4{font-size:24px;}
h5{font-size:20px;}
.font-18{font-size:18px;}
.font-20{ font-size:20px;}
.font-24{ font-size:24px;}
.BannerSlider .container h2{font-size: 78px;}
}


@media (min-width:576px) {
}

@media (min-width:768px) {
.home-w1 .content-row .col-md-6:last-child{ border-left: 2px dashed #d8d8d8;}

}

@media (min-width:992px) {
}

@media (min-width:1200px) {
}

@media (min-width:1400px) {
}