body,
html {
  font-family: "Wix Madefor Display", serif;
  color: #181818 !important;
}





/* inner page header style */

#inner-header {
  background: linear-gradient(
    90deg,
    rgba(48, 104, 89, 1) 0%,
    rgba(188, 161, 74, 0.9) 100%
  );
  background-image: url(../images/inner-header.png);
  height: 200px;
  padding: 60px 0;
  background-size: cover;
  background-position: center center;
}

#inner-header h2 {
  font-size: 36px;
  font-weight: 900;
  color: #fff;
}

#inner-header .sub-head {
  color: #fff;
}



#involve-header {
  background: linear-gradient(
    90deg,
    rgba(48, 104, 89, 1) 0%,
    rgba(188, 161, 74, 0.9) 100%
  );
  background-image: url(../images/involved-header.png);
  height: 200px;
  padding: 60px 0;
  background-size: cover;
  background-position: center center;
}

#involve-header h2 {
  font-size: 36px;
  font-weight: 900;
  color: #fff;
}

#involve-header .sub-head {
  color: #fff;
}





#camp-header {
  background: linear-gradient(
    90deg,
    rgba(48, 104, 89, 1) 0%,
    rgba(188, 161, 74, 0.9) 100%
  );
  background-image: url(../images/campgain.png);
  height: 200px;
  padding: 60px 0;
  background-size: cover;
  background-position: center center;
}

#camp-header h2 {
  font-size: 36px;
  font-weight: 900;
  color: #fff;
}

#camp-header .sub-head {
  color: #fff;
}







/* section header splite style */

.split-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.split-head .left {
  width: 70%;
}
.split-head .right {
  width: 30%;
}













/* common style */

.sub-head {
  color: #bca14a;
  font-size: 16px;
  margin-bottom: 8px;
}
h2 {
  font-size: 36px;
  font-weight: 900;
  margin: 0;
}
.para {
  color: #18181898;
  line-height: 30px;
  font-weight: 500;
  margin: 0;
}
.gap {
  margin-top: 50px;
}

.web-link {
  color: #bca14a;
  text-decoration: none;
  margin-top: 25px;
  display: block;
  font-weight: 700;
}
.web-link:hover {
  color: #03565e;
}

.section-gap {
  margin: 100px 0;
}

.inner-banner {
  width: 100%;
}

.arrow-list p {
  font-size: 16px;
  color: #18181898;
  font-weight: 500;
  padding-left: 0px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  column-gap: 10px;
  line-height: 30px;
}
.arrow-list p::before {
  content: "";
  background-image: url(../images/dubble-arrow.svg);
  height: 18px;
  width: 18px;
  background-size: 18px;
  display: block;
  background-repeat: no-repeat;
}

.bg-grey{background-color: #f6f9fc; padding: 100px 0;}

.mob-navi{display: none;}






/* blur background style */

.blur {
  position: relative;
}
.blur .green {
  position: absolute;
  left: -150px;
  bottom: 0px;
  z-index: -1;
}
.blur .yellow {
  position: absolute;
  right: 0px;
  top: 0px;
  z-index: -1;
}











/* campaigns slider style */

.swiper {
  width: 100%;
  height: 100%;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-button-next {
  left: 0 !important;
  right: 0 !important;
  position: static !important;
  background-color: #f6f9fc !important;
  height: 50px !important;
  width: 50px !important;
  display: block !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 8px !important;
}
.swiper-button-prev {
  left: 0 !important;
  right: 0 !important;
  position: static !important;
  background-color: #f6f9fc !important;
  height: 50px !important;
  width: 50px !important;
  display: block !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 8px !important;
}

.swiper-button-next:after {
  font-size: 16px !important;
  color: #181818 !important;
}
.swiper-button-prev:after {
  font-size: 16px !important;
  color: #181818 !important;
}












/* button style */

.primary-btn {
  border-radius: 8px;
  border: 2px solid #bca14a;
  padding: 12px 24px;
  color: #bca14a;
  font-weight: 500;
  line-height: 28px;
  transition: all 0.5s linear;
}
.primary-btn:active,
.primary-btn:hover {
  background-color: #bca14a;
  border-color: #bca14a;
  color: #fff;
}

.white-btn {
  border-radius: 8px;
  border: 2px solid #fff;
  padding: 12px 24px;
  color: #fff;
  font-weight: 500;
  line-height: 28px;
  transition: all 0.5s linear;
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 6px;
  margin-top: 25px;
}

.white-btn img {
  width: 22px;
}
.white-btn:active,
.white-btn:hover {
  background-color: #fff;
  border-color: #fff;
  color: #181818;
}

.white-btn:hover img {
  filter: invert(100);
}










/* notice section style */
.notice-bar {
  background-color: #03565e;
  padding: 10px;
}

.notice-bar .detail {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  column-gap: 50px;
}

.notice-bar .detail p,
a {
  color: #fff;
  font-size: 14px;
  text-decoration: none;
  margin: 0;
}

.notice-bar .detail .phone {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  column-gap: 6px;
}

.notice-bar .detail .phone::before {
  content: "";
  background-image: url(../images/call.svg);
  background-size: 18px;
  background-position: center center;
  height: 18px;
  width: 18px;
  display: block;
}

.notice-bar .detail .mail {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  column-gap: 6px;
}

.notice-bar .detail .mail::before {
  content: "";
  background-image: url(../images/mail.svg);
  background-size: 18px;
  background-position: center center;
  height: 18px;
  width: 18px;
  display: block;
}

.notice-bar .social {
  display: flex;
  justify-content: flex-end;
  column-gap: 16px;
}










/* navigation section style */
.navi {
  padding: 22px 0;
}
.navi .brand-name {
  font-size: 22px;
  text-transform: uppercase;
  color: #bca14a;
  margin: 0;
  font-weight: 700;
  text-align: center;
  padding-top: 10px;
}
.navi .sysv-img {
  display: block;
  margin-left: auto;
}
.navi img {
  width: 90px;
}
.navi .navbar .nav-item .nav-link {
  padding: 5px 26px;
  color: #181818;
  font-weight: 500;
}
.navi .navbar .nav-item .active {
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 10px;
  font-weight: 600;
  color: #03565e;
}
.navi .navbar .nav-item .active::after {
  content: "";
  height: 6px;
  width: 6px;
  border-radius: 100px;
  background-color: #03565e;
  display: block;
}
.navi .navbar .nav-item .dropdown-toggle::after {
  display: none;
}
.navi .navbar .nav-item .dropdown-menu {
  border: none;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  border-radius: 8px;
  padding: 0;
  overflow: hidden;
}
.navi .navbar .nav-item .dropdown-menu .dropdown-item {
  padding: 15px;
  font-weight: 500;
  color: #181818;
  transition: all 0.2s linear;
}

.navi .navbar .nav-item .dropdown-menu .dropdown-item:hover {
  background-color: #bca14a;
  color: #fff;
}







/* Banner section style */
.banner .caption {
  padding: 150px 120px;
  width: 40%;
  background-color: #03565e;
  vertical-align: middle;
}
.banner .slide {
  width: 60%;
}
.banner .caption h1 {
  font-size: 42px;
  margin: 0;
  color: #fff;
  font-weight: 900;
  max-width: 600px;
  line-height: 65px;
}
.banner .caption h1 span {
  color: #bca14a;
}
.banner .caption h1::after {
  content: "";
  background-image: url(../images/heading-strock.svg);
  display: block;
  width: 250px;
  height: 15px;
  background-repeat: no-repeat;
  background-size: 100%;
}
.banner .caption p {
  color: #ffffffb3;
  font-size: 16px;
  line-height: 30px;
  max-width: 500px;
  margin: 15px 0;
  font-weight: 400;
}
.banner .caption .primaty-btn {
  border: 2px solid #fff !important;
  color: #fff !important;
}
.banner .slide {
  background-image: url(../images/banner.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  height: 700px;
}







/* what we  belive Style */

.belive {
  background-color: #f6f9fc;
  padding: 100px 0;
}
.belive .card-box {
  padding: 20px;
  border-radius: 8px;
  background-color: #fff;
}
.belive .card-box .count {
  height: 60px;
  width: 60px;
  font-weight: 900;
  background-color: #03565e;
  color: #fff;
  font-weight: 900;
  font-size: 20px;
  margin-bottom: 15px;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.belive .card-box h3 {
  font-size: 20px;
  font-weight: 900;
  color: #181818;
  margin-bottom: 8px;
}
.belive .card-box:hover {
  background: rgb(188, 161, 74);
  background: linear-gradient(
    55deg,
    rgba(188, 161, 74, 0.9) 0%,
    rgba(9, 121, 133, 1) 48%,
    rgba(48, 104, 89, 1) 100%
  );
}
.belive .card-box:hover h3 {
  color: #fff;
}
.belive .card-box:hover .count {
  background-color: #fff;
  color: #03565e;
}
.belive .card-box:hover .para {
  color: #ffffffb3;
}
.belive h2 {
  margin-bottom: 16px;
}









/* about us section style */

.about {
  padding: 100px 0;
}
.about .info {
  padding: 100px 120px 100px 0;
}
.about .para {
  margin-top: 16px;
  margin-bottom: 16px;
}
.about .primary-btn {
  margin-top: 10px;
}














/* areas section style */

.area {
  background-image: url(../images/area.png);
  background-position: center center;
  background-attachment: fixed;
  padding: 100px 0;
  background-size: cover;
}
.area .flex-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.area .flex-box .icon-box {
  padding: 20px;
  border-radius: 8px;
  background-color: #fff;
  min-width: 160px;
}
.area .flex-box .icon-box img {
  width: 60px;
  height: 60px;
  display: block;
  margin: auto;
  margin-bottom: 8px;
}
.area .flex-box .icon-box .tag {
  font-size: 16px;
  color: #181818;
  margin: 0;
  text-align: center;
  font-weight: 500;
}
.area .sub-head {
  color: #fff;
}
.area h2 {
  color: #fff;
}

.area .right .para {
  color: #fff;
  max-width: 400px;
}










/* campaigns section style */

.campaigns {
  padding: 100px 0;
}
.campaigns .split-head .right {
  display: flex;
  justify-content: flex-end;
  column-gap: 10px;
}
.campaigns .camp-box .camp-data {
  background-color: #f6f9fc;
  padding: 50px;
  width: 40%;
  border-radius: 8px;
  text-align: left;
}
.campaigns .camp-box .camp-data .sub-head {
  padding: 10px 16px;
  border-radius: 8px;
  background-color: #bca14a15;
  display: inline-block;
  margin-bottom: 15px;
}
.campaigns .camp-box .camp-data h3 {
  font-size: 20px;
  font-weight: 900;
  color: #181818;
  margin-bottom: 30px;
}
.campaigns .camp-box {
  display: flex;
  column-gap: 20px;
  justify-content: space-between;
}
.campaigns .camp-box .camp-data .para {
  margin-bottom: 30px;
}
.campaigns .camp-box .camp-img1 {
  background-image: url(../images/camp1.png);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  height: 520px;
  width: 60%;
  border-radius: 8px;
}











/* gallery section style */

.gallery {
  padding: 100px 0;
  background-color: #f6f9fc;
}
.gallery .split-head .right {
  display: flex;
  justify-content: flex-end;
}
.gallery .top {
  margin-top: 40px;
}















/* success story section style */

.success {
  padding: 100px 0;
}
.success .warp {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  column-gap: 20px;
  padding: 15px 0;
  margin-left: 40px;
}
.success .warp img {
  width: 60px;
  height: 60px;
  margin-bottom: 16px;
}
.success .warp h2 {
  margin-bottom: 8px;
}
.success .warp h2 span {
  color: #bca14a;
}
.success .count-box {
  width: 300px;
  border-radius: 8px;
}

.success .bor {
  padding: 20px;
  border: 1px solid;
  border-image-slice: 1;
  border-image-repeat: round;
  border-image-source: url("data:image/svg+xml,%3Csvg%20width%3D%2222%22%20height%3D%2222%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%200%20H%206%20V%201%20H%201%20V%206%20H%200%20V%200%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3Cpath%20d%3D%22M22%200%20V%206%20H%2021%20V%201%20H%2016%20V%200%20H%2022%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3Cpath%20d%3D%22M22%2022%20H%2016%20V%2021%20H%2021%20V%2016%20H%2022%20V%2022%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3Cpath%20d%3D%22M0%2022%20V%2016%20H%201%20V%2021%20H%206%20V%2022%20H%200%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3C%2Fsvg%3E");
}

.success .para {
  margin-top: 16px;
}












/* footer section style */

.footer {
  padding: 80px 0 40px 0;
  background-color: #03565e;
}
.footer .para {
  color: #ffffffb3;
  font-weight: 400;
}
.footer .para a {
  color: #bca14a;
  text-decoration: none;
}
.footer h3 {
  font-size: 20px;
  font-weight: 900;
  color: #fff;
  margin-bottom: 20px;
}

.footer .links {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
.footer a {
  color: #ffffffb3;
  text-decoration: none;
  display: block;
  margin-bottom: 24px;
}
.footer .links li {
  list-style-type: none;
}
.footer .links ul {
  padding-left: 0;
}
.footer .links ul:nth-child(2) {
  padding-left: 110px;
}
.footer .location {
  padding-left: 40px;
  color: #ffffffb3;
  line-height: 30px;
  position: relative;
}
.footer .location a {
  color: #ffffffb3;
  text-decoration: none;
}
.footer .location a:hover {
  color: #bca14a;
}
.footer .call {
  padding-left: 40px;
  color: #ffffffb3;
  line-height: 30px;
  position: relative;
}
.footer .call a {
  color: #ffffffb3;
  text-decoration: none;
}
.footer .call a:hover {
  color: #bca14a;
}
.footer .mail {
  padding-left: 40px;
  color: #ffffffb3;
  line-height: 30px;
  position: relative;
}
.footer .mail a {
  color: #ffffffb3;
  text-decoration: none;
}
.footer .mail a:hover {
  color: #bca14a;
}

.footer .mail::before {
  content: "";
  background-image: url(../images/mail-footer.svg);
  width: 22px;
  height: 22px;
  background-size: 22px;
  background-repeat: no-repeat;
  display: block;
  position: absolute;
  left: 0;
  top: 5px;
}
.footer .location::before {
  content: "";
  background-image: url(../images/location-footer.svg);
  width: 22px;
  height: 22px;
  background-size: 22px;
  background-repeat: no-repeat;
  display: block;
  position: absolute;
  left: 0;
  top: 5px;
}
.footer .call::before {
  content: "";
  background-image: url(../images/call-footer.svg);
  width: 22px;
  height: 22px;
  background-size: 22px;
  background-repeat: no-repeat;
  display: block;
  position: absolute;
  left: 0;
  top: 5px;
}




/* copyright section style */

.copyright {
  background-color: #bca14a;
  padding: 10px 0;
}
.copyright .social {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  column-gap: 16px;
}
.copyright p {
  margin: 0;
  font-size: 14px;
  color: #fff;
}










/* about Page style */
.aboutPage {
  padding: 100px 0;
}
.aboutPage .tp {
  margin-top: 30px;
}
.aboutPage .border-box {
  border-radius: 8px;
}
.aboutPage .border-box .pad {
  padding: 20px;
  border: 1px solid;
  border-image-slice: 1;
  border-image-repeat: round;
  border-image-source: url("data:image/svg+xml,%3Csvg%20width%3D%2222%22%20height%3D%2222%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%200%20H%206%20V%201%20H%201%20V%206%20H%200%20V%200%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3Cpath%20d%3D%22M22%200%20V%206%20H%2021%20V%201%20H%2016%20V%200%20H%2022%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3Cpath%20d%3D%22M22%2022%20H%2016%20V%2021%20H%2021%20V%2016%20H%2022%20V%2022%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3Cpath%20d%3D%22M0%2022%20V%2016%20H%201%20V%2021%20H%206%20V%2022%20H%200%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3C%2Fsvg%3E");
}

.aboutPage .border-box .pad h3 {
  font-size: 20px;
  font-weight: 900;
  color: #181818;
  margin-bottom: 10px;
}

.aboutPage .values .border-box .pad {
  min-height: 170px;
}

.aboutPage.employee-card {
  border-radius: 8px;
  overflow: hidden;
}
.aboutPage.employee-card img {
  width: 120px;
}
.aboutPage .employee-card .pad {
  display: flex;
  justify-content: flex-start;
  column-gap: 20px;
  align-items: center;
}

.aboutPage .employee-card .pad {
  padding: 20px;

  border: 1px solid;
  border-image-slice: 1;
  border-image-repeat: round;
  border-image-source: url("data:image/svg+xml,%3Csvg%20width%3D%2222%22%20height%3D%2222%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%200%20H%206%20V%201%20H%201%20V%206%20H%200%20V%200%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3Cpath%20d%3D%22M22%200%20V%206%20H%2021%20V%201%20H%2016%20V%200%20H%2022%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3Cpath%20d%3D%22M22%2022%20H%2016%20V%2021%20H%2021%20V%2016%20H%2022%20V%2022%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3Cpath%20d%3D%22M0%2022%20V%2016%20H%201%20V%2021%20H%206%20V%2022%20H%200%22%20fill%3D%22rgba(24%2C24%2C24%2C0.13)%22%20%2F%3E%3C%2Fsvg%3E");
}

.aboutPage .employee-card .data h4 {
  font-size: 18px;
  font-weight: 900;
  color: #181818;
  margin-bottom: 5px;
}













/*contat page form style */

.contactPage {
  padding: 100px 0;
}
.contactPage h3 {
  font-size: 20px;
  font-weight: 900;
  color: #181818;
}
.contactPage .address-block {
  display: flex;
  justify-content: space-between;
  column-gap: 20px;
  margin-top: 20px;
}
.contactPage .address-block .ad-card {
  background-color: #f6f9fc;
  width: 50%;
  border-radius: 8px;
  padding: 20px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  column-gap: 15px;
}
.contactPage .address-block .ad-card .ad-icon {
  background-color: #bca14a15;
  height: 50px;
  width: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
}
.contactPage .address-block .ad-card .ad-icon img {
  width: 22px;
}
.contactPage .form-box {
  background-color: #f6f9fc;
  padding: 20px;
  border-radius: 8px;
}
.contactPage .form-box .form-group label {
  font-size: 14px;
  color: #181818;
  font-weight: 700;
  margin-bottom: 8px;
}
.contactPage .form-box .form-group .form-control {
  border-radius: 8px;
  background-color: #fff;
  border: none;
  font-size: 14px;
  display: block;
  height: 50px;
  padding: 10px 16px;
}
.contactPage .form-box .form-group {
  margin-bottom: 15px;
}
.contactPage .form-box select {
  border-radius: 8px;
  background-color: #f6f9fc;
  border: none;
  font-size: 14px;
}
.contactPage .form-box .form-control::placeholder {
  font-size: 14px;
  color: #18181860;
}
.contactPage .form-box .form-group textarea {
  border-radius: 8px;
  background-color: #fff;
  border: none;
  font-size: 14px;
  display: block;
  height: 110px !important;
  padding: 10px 16px;
}
.contactPage .form-box .right-btn {
  display: flex;
  justify-content: flex-end;
  margin-top: 25px;
}








/* get involved page style */


.involve .form-box {
  background: none;
  padding: 0;
}
.involve .form-control {
  border-radius: 8px;
  background-color: #f6f9fc !important ;
  border: none;
  font-size: 14px;
  display: block;
  height: 50px;
  padding: 10px 16px;
}

.involve input::file-selector-button {
  font-weight: bold;
  color: #fff;
  height: 42px;
  padding: 0 16px;
  background-color: #bca14a;
  border-radius: 8px;
  font-weight: 500;
}

.involve .form-group .form-select {
  border-radius: 8px;
  background-color: #f6f9fc;
  color: #18181860;
  border: none;
  font-size: 14px;
  display: block;
  height: 50px;
  padding: 10px 16px;
}








/* our work page style */
.ourWorkPage h5{font-size: 16px; font-weight: 700; color: #181818; margin-bottom: 15px;}





/* gallary page style */
.gallaryPage{padding: 100px 0;}










/* responsive media queries */
@media (max-width: 575px) { 
  .mob-navi{display: flex;}
  .mob-navi .mob-header{display:flex; justify-content: space-between; align-items: center; padding: 15px;}
  .mob-navi .mob-link{padding: 16px 20px;}
  .mob-navi .mob-link a{color: #181818; font-size: 16px; font-weight: 500;}
  .mob-navi .mob-link .dropdown-menu{padding: 0; border: none; background-color: #f6f9fc;}
  .mob-navi .mob-link .dropdown-menu .dropdown-item{padding: 15px; font-size: 16px; border-radius: 8px;}
  .mob-navi .mob-link .dropdown-menu .dropdown-item:hover{background-color: #bca14a; color: #fff;}
  .mob-navi .offcanvas{width:300px;}
.mob-navi .offcanvas-title{font-size: 16px; font-weight: 700; color: #bca14a; line-height: 26px;}
.mob-navi .offcanvas-header{background-color: #f6f9fc;}
.mob-navi .offcanvas-body{padding: 0;}
.mob-navi .menu-btn{border:1px solid #bca14a; color: #bca14a; opacity: 9;}
.mob-navi .mob-logo{display: flex; justify-content: flex-start; column-gap: 10px; align-items: center;}
.mob-navi .mob-logo p{margin: 0; font-weight: 700; font-size: 16px; color: #bca14a;}
 

  .navi{display: none;}
  .notice-bar{display: none;}
  .area .flex-box{column-gap: 15px; flex-flow: wrap; row-gap: 15px; justify-content: flex-start;}
  .area .flex-box .icon-box{flex: 1;}
  .banner .caption{padding: 30px; width: 100%; order: 12;}
  .banner .caption h1{font-size: 32px; line-height: normal;}
  .banner .caption h1::after{ width: 170px; height: 15px;}
  .banner .slide{width: 100%; height: 370px; order: 1;  background-size: cover;}
  .belive .card-box{margin-bottom: 20px;}
  .about .info{padding: 0; margin-bottom: 50px;}

  .area .split-head{display: block; width: 100%;}
  .area .split-head .left{width: 100%;}
  .area .split-head .right{width: 100%; margin-top: 16px;}
  
  .campaigns  .split-head{display: block; width: 100%;}
  .campaigns  .split-head .left{width: 100%;}
  .campaigns  .split-head .right{width: 100%; margin-top: 40px; justify-content: flex-start;}
  .campaigns .camp-box{display: block;}
  .campaigns .camp-box .camp-img1{width: 100%; height: 280px;}
  .campaigns .swiper-slide{padding: 0px 15px !important;}
  .campaigns .camp-box .camp-data{width: 100%; padding: 30px; margin-top: 20px;}

  .gallery  .split-head{display: block; width: 100%;}
  .gallery  .split-head .left{width: 100%;}
  .gallery  .split-head .right{width: 100%; margin-top: 16px; justify-content: flex-start;}
  .gallery img{width: 100%; margin-bottom: 20px;}
  .gallery .top{margin-top: 0;}

  .success .warp{margin-left: 0; margin-top: 20px; display: block;}
  .success .count-box{width: auto;}
  .success .count-box:nth-child(1){ margin-bottom: 20px;}

  .footer .location{margin-bottom: 10px;}
  .footer .mail{margin-bottom: 10px;}
  .footer .call{margin-bottom: 10px;}
  .copyright .social{justify-content: flex-start; margin-top: 10px;}



  .aboutPage .values .border-box .pad{min-height: auto;}
  .aboutPage .employee-card{margin-bottom: 20px;}


  .ourWorkPage img{width: 100%; margin-bottom: 50px;}
  .ourWorkPage .section-gap{margin: 50px 0;}
  .order1{order: 1;} 
  .order12{order: 12;}
  
  .contactPage .address-block{display: block; width: 100%;}
  .contactPage .address-block .ad-card{width: 100%; margin-bottom: 20px;}


  .belive{padding: 60px 0;}
  .about{padding: 60px 0;}
  .area{padding: 60px 0;}
  .campaigns{padding: 60px 0;}
  .gallery{padding: 60px 0;}
  .success{padding: 60px 0;}
  .aboutPage{padding: 60px 0;}
  .ourWorkPage{padding: 60px 0;}
  .contactPage{padding: 60px 0;}
}




@media (min-width: 576px) and (max-width: 767px) { 
  .mob-navi{display: flex;}
  .mob-navi .mob-header{display:flex; justify-content: space-between; align-items: center; padding: 15px;}
  .mob-navi .mob-link{padding: 16px 20px;}
  .mob-navi .mob-link a{color: #181818; font-size: 16px; font-weight: 500;}
  .mob-navi .mob-link .dropdown-menu{padding: 0; border: none; background-color: #f6f9fc;}
  .mob-navi .mob-link .dropdown-menu .dropdown-item{padding: 15px; font-size: 16px; border-radius: 8px;}
  .mob-navi .mob-link .dropdown-menu .dropdown-item:hover{background-color: #bca14a; color: #fff;}
  .mob-navi .offcanvas{width:300px;}
.mob-navi .offcanvas-title{font-size: 16px; font-weight: 700; color: #bca14a; line-height: 26px;}
.mob-navi .offcanvas-header{background-color: #f6f9fc;}
.mob-navi .offcanvas-body{padding: 0;}
.mob-navi .menu-btn{border:1px solid #bca14a; color: #bca14a; opacity: 9;}
.mob-navi .mob-logo{display: flex; justify-content: flex-start; column-gap: 10px; align-items: center;}
.mob-navi .mob-logo p{margin: 0; font-weight: 700; font-size: 16px; color: #bca14a;}


  .navi{display: none;}
  .notice-bar{display: none;}
  .area .flex-box{column-gap: 15px; flex-flow: wrap; row-gap: 15px; justify-content: flex-start;}
  .area .flex-box .icon-box{flex: 1;}
  .banner .caption{padding: 50px; width: 100%; order: 12;}
  .banner .caption h1{font-size: 40px; line-height: 60px;}
  .banner .caption h1::after{ width: 170px; height: 15px;}
  .banner .slide{width: 100%; height: 400px; order: 1; background-size: cover;}
  .belive .card-box{margin-bottom: 20px;}
  .about .info{padding: 0; margin-bottom: 50px;}
  
  .area .split-head{display: block; width: 100%;}
  .area .split-head .left{width: 100%;}
  .area .split-head .right{width: 100%; margin-top: 16px;}
  
  .campaigns  .split-head{display: block; width: 100%;}
  .campaigns  .split-head .left{width: 100%;}
  .campaigns  .split-head .right{width: 100%; margin-top: 40px; justify-content: flex-start;}
  .campaigns .camp-box{display: block;}
  .campaigns .camp-box .camp-img1{width: 100%; height: 280px;}
  .campaigns .swiper-slide{padding: 0px 15px !important;}
  .campaigns .camp-box .camp-data{width: 100%; padding: 30px; margin-top: 20px;}

  .gallery  .split-head{display: block; width: 100%;}
  .gallery  .split-head .left{width: 100%;}
  .gallery  .split-head .right{width: 100%; margin-top: 16px; justify-content: flex-start;}
  .gallery img{width: 100%; margin-bottom: 20px;}
  .gallery .top{margin-top: 0;}

  .success .warp{margin-left: 0; margin-top: 20px; display: flex;justify-content: space-between;}
  .success .count-box{width: 100%;}


  .footer .location{margin-bottom: 10px;}
  .footer .mail{margin-bottom: 10px;}
  .footer .call{margin-bottom: 10px;}
  .copyright .social{justify-content: flex-start; margin-top: 10px;}


  
  .aboutPage .values .border-box .pad{min-height: auto;}
  .aboutPage .employee-card{margin-bottom: 20px;}


  .ourWorkPage img{width: 100%; margin-bottom: 50px;}
  .ourWorkPage .section-gap{margin: 50px 0;}
  .order-1{order: 1;} 
  .order-12{order: 12;} 

  .contactPage .address-block{display: block; width: 100%;}
  .contactPage .address-block .ad-card{width: 100%; margin-bottom: 20px;}


  .belive{padding: 60px 0;}
  .about{padding: 60px 0;}
  .area{padding: 60px 0;}
  .campaigns {padding: 60px 0;}
  .gallery {padding: 60px 0;}
  .success {padding: 60px 0;}
  .aboutPage{padding: 60px 0;}
  .ourWorkPage{padding: 60px 0;}
  .contactPage{padding: 60px 0;}
}



@media (min-width: 768px) and (max-width: 991px){

  .mob-navi{display: flex;}
  .mob-navi .mob-header{display:flex; justify-content: space-between; align-items: center; padding: 15px;}
  .mob-navi .mob-link{padding: 16px 20px;}
  .mob-navi .mob-link a{color: #181818; font-size: 16px; font-weight: 500;}
  .mob-navi .mob-link .dropdown-menu{padding: 0; border: none; background-color: #f6f9fc;}
  .mob-navi .mob-link .dropdown-menu .dropdown-item{padding: 15px; font-size: 16px; border-radius: 8px;}
  .mob-navi .mob-link .dropdown-menu .dropdown-item:hover{background-color: #bca14a; color: #fff;}
  .mob-navi .offcanvas{width:300px;}
.mob-navi .offcanvas-title{font-size: 16px; font-weight: 700; color: #bca14a; line-height: 26px;}
.mob-navi .offcanvas-header{background-color: #f6f9fc;}
.mob-navi .offcanvas-body{padding: 0;}
.mob-navi .menu-btn{border:1px solid #bca14a; color: #bca14a; opacity: 9;}
.mob-navi .mob-logo{display: flex; justify-content: flex-start; column-gap: 10px; align-items: center;}
.mob-navi .mob-logo p{margin: 0; font-weight: 700; font-size: 16px; color: #bca14a;}

.navi{display: none;}
.notice-bar{display: none;}


  .banner .caption{padding: 50px; width: 100%; order: 12;}
  .banner .caption h1{font-size: 40px; line-height: 60px;}
  .banner .caption h1::after{ width: 170px; height: 15px;}
  .banner .slide{width: 100%; height: 600px; order: 1;  background-size: cover;}


  .area .flex-box{column-gap: 15px; flex-flow: wrap; row-gap: 15px; justify-content: flex-start;}
  .area .flex-box .icon-box{flex: 1 1;}
  .gallery img{width: 100%;}
  .success .warp{margin-left: 0; display: block; padding: 0;}
  .success .count-box{width: auto;}
  .success .count-box:nth-child(1){ margin-bottom: 20px;}

  .about .info{padding: 0; margin-bottom: 50px;}
  .about img{width: 100%;}

  .campaigns .camp-box{display: block;}
  .campaigns .camp-box .camp-img1{width: 100%; height: 280px;}
  .campaigns .swiper-slide{padding: 0px 15px !important;}
  .campaigns .camp-box .camp-data{width: 100%; padding: 30px; margin-top: 20px;}
  .belive .card-box{margin-bottom: 30px;}

  .success  .sub-head{margin-top: 60px;}

  .aboutPage .values .border-box .pad{min-height: auto;}
  .aboutPage .employee-card{margin-bottom: 20px;}

  .ourWorkPage img{width: 100%; margin-bottom: 50px;}
  .ourWorkPage .section-gap{margin: 50px 0;}
  .order-1{order: 1;} 
  .order-12{order: 12;} 


  .contactPage .address-block{display: block; width: 100%;}
  .contactPage .address-block .ad-card{width: 100%; margin-bottom: 20px;}



  .belive{padding:70px 0;}
  .about{padding:70px 0;}
  .area{padding:70px 0;}
  .campaigns {padding:70px 0;}
  .gallery {padding:70px 0;}
  .success {padding:70px 0;}
  .aboutPage {padding:70px 0;}
  .ourWorkPage{padding:70px 0;}
  .contactPage{padding:70px 0;}
}





@media (min-width: 992px) and (max-width: 1199px){

  .area .flex-box{column-gap: 15px; flex-flow: wrap; row-gap: 15px; justify-content: flex-start;}
  .area .flex-box .icon-box{flex: 1 ;}


  .banner .caption{padding:80px 50px; width: 50%;}
  .banner .slide{width: 50%; height: 700px;}


  .navi .navbar .nav-item .nav-link{padding: 0 10px;} 
   /* .banner .caption h1{font-size: 32px; line-height: 50px;} */
   .belive .card-box{margin-bottom: 30px; min-height: 240px;}

   .about .info{padding: 0; margin-bottom: 50px;}
   .about img{width: 100%;}

   .blur .yellow{display:none ;}
   .blur .green{display:none ;}

   .gallery img{width: 100%;}


   .campaigns .camp-box{display: block;}
   .campaigns .camp-box .camp-img1{width: 100%; height: 280px;}
   .campaigns .swiper-slide{padding: 0px 15px !important;}
   .campaigns .camp-box .camp-data{width: 100%; padding: 30px; margin-top: 20px;}

   .aboutPage .values .border-box .pad{min-height: 170px;}
   .aboutPage .employee-card{margin-bottom: 20px;}

   .navi .navbar .nav-item .active::after{display: none;}

   .belive{padding:70px 0;}
  .about{padding:70px 0;}
  .area{padding:70px 0;}
  .campaigns {padding:70px 0;}
  .gallery {padding:70px 0;}
  .success {padding:70px 0;}
  .aboutPage{padding:70px 0;}
  .ourWorkPage{padding:70px 0;}
  .contactPage{padding:70px 0;}
 
}




@media (min-width: 1200px) and (max-width: 1499px){
  .banner .caption{padding:140px 50px; width: 50%;}
  .banner .slide{width: 50%; height: 100vh; background-size: cover;}
  /* .banner .caption h1{font-size: 36px; line-height: 50px; max-width: 450px;} */

  .belive{padding:80px 0;}
  .about{padding:80px 0;}
  .area{padding:80px 0;}
  .campaigns {padding:80px 0;}
  .gallery {padding:80px 0;}
  .success {padding:80px 0;}

  .about .info{padding-top: 50px; padding-bottom: 0;}
  .navi .navbar .nav-item .nav-link{padding: 5px 15px;}
  .about img{width: 100%;}

  .blur .yellow{display:none ;}
  .blur .green{display:none ;}


  .area .flex-box{column-gap: 15px; flex-flow: wrap; row-gap: 15px; justify-content: flex-start;}
  .area .flex-box .icon-box{flex: 1  ;}

  .gallery img{width: 100%;}

  .belive .card-box{margin-bottom: 30px;}
}





@media (min-width: 1500px) and (max-width: 1899px){
  .banner .caption{padding:110px 70px; }
  .aboutPage .border-box{min-height: 120px;}
}





















.lightboxpreview {
  transition: all .3s linear;
padding-top:60%;
 cursor:pointer;
 background-size:cover;
}
  
.lightbox-content {
max-height:75vh;
 height:75vh;
 width:100%;
 max-width: 1000px;}

.lightbox-close { 
 cursor:pointer;
   margin-left: auto;
 position:absolute;
 right:-30px;
 top:-30px;
 color:white;
   font-size: 2rem;
   font-weight: 700;
   line-height: 1;}
.modal_inner_image {
   min-height: 400px;
   z-index: 1000;}
.modal-content {
   width: 100%;}


.modalscale {transform:scale(0);
opacity:0;}



.lightbox-container, .lightbox-btn, .lightbox-image-wrapper, .lightbox-enabled{transition:all .4s ease-in-out;}
.lightbox_img_wrap {padding-top:65%;
 position:relative;
 overflow:hidden;
 margin-bottom: 30px;
 border-radius: 8px;
}
.lightbox-enabled:hover {
 transform:scale(1.1)
}
.lightbox-enabled {width:100%;
height:100%;
 position:absolute;
 top:0;
object-fit:cover;
cursor:pointer;}

.lightbox-container {width:100vw;
height:100vh;
position:fixed;
top:0;
left:0;
 display:flex;
 align-items:center;
 justify-content:center;
background-color:rgba(0,0,0,.6);
z-index:9999;
opacity:0;
pointer-events:none;
}

.lightbox-container.active {
 opacity:1;
 pointer-events:all;
}
.lightbox-image-wrapper {
 display:flex;
 transform:scale(0);
 align-items:center;
 justify-content:center;
 max-width:90vw;
 max-height:90vh;
 position:relative;
}
.lightbox-container.active .lightbox-image-wrapper {transform:scale(1);}
.lightbox-btn, #close {
 color:white;
 z-index:9999999;
cursor:pointer; 
 position:absolute;

 font-size:50px;
}

.lightbox-btn:focus {
 outline:none;
}

.left {left:50px;}
.right {right:50px;}
#close {top:50px;
right:50px;}

.lightbox-image {
 width:100%;
 -webkit-box-shadow: 5px 5px 20px 2px rgba(0,0,0,0.19); 
box-shadow: 5px 5px 20px 2px rgba(0,0,0,0.19);
 max-height:95vh;
 object-fit:cover;
}

@keyframes slideleft {
 33% {transform:translateX(-300px);
 opacity:0;
 }
 66% {transform:translateX(300px);
 opacity:0;
 }
}


.slideleft {
  animation-name: slideleft;
animation-duration: .5s; 
animation-timing-function: ease; 
}
@keyframes slideright {
 33% {transform:translateX(300px);
 opacity:0;}
 66% {transform:translateX(-300px);
 opacity:0;}
}


.slideright{
  animation-name: slideright;
animation-duration: .5s; 
animation-timing-function: ease; 
}
 

 