.project-fliter-section{ padding: 0 0 100px; }


.fliter-head{ padding: 0 0 65px; display: block; width: 100%;}
.fliter-row ul{ gap: 20px; display: flex; align-items: center; flex-wrap: wrap;   }
.fliter-row ul li{ display: flex;}
.fliter-row ul li .checkbox{ position: relative; display: flex; align-items: center;}
.fliter-row ul li .checkbox input{ display: none;}
.fliter-row ul li .checkbox label span{ min-height: 36px; font-size: 16px; padding: 0 38px;  color: #06080b;  border: solid 1px #bcc5d3; position: relative; width: auto; font-family: 'stolzl';  display: flex; align-items: center; justify-content: center; transition: all 0.3s ease-in-out; cursor: pointer;  }
.fliter-row ul li .checkbox label span:hover{ background: #1532FF; border-color: #1532FF; color: #fff; }
.fliter-row ul li .checkbox  input:checked + label span{ background: #021179;  border-color: #021179;color: #fff; }

.projects-listing{ display: block; width: 100%; }
.projects-listing .row { row-gap: 69px; margin: 0 -34px; display: flex; flex-wrap: wrap;}
.projects-listing .row>*{ padding: 0 34px; width: 50%; }
.project-box-main { position: relative; width: 100%; overflow: hidden; }
.project-box-main .project_link { position: absolute; top: 0; left: 0; z-index: 2; width: 100%; height: 100%; }
.project-box-main .project_link.modal-trigger-empty { cursor: default; }
.project-box-main .img{ display: flex; position: relative; width: 100%; }
.project-box-main .img span { overflow: hidden; aspect-ratio: 825/570; position: relative; display: flex; align-items: center; width: 100%;}
.project-box-main .img span img{ transition: all 0.3s ease-in-out;  width: 100%; height: 100%; position: absolute; left: 0; top: 0; object-fit: cover;}
.project-box-main:hover .img span img{ transform: scale(1.1); }
.project-box-main.hover_desabled:hover .img span img{ transform: none; }
.project-box-main .project-box-sub{ padding: 36px 0 0 0; display: block;width: 100%;}
.project-box-main .project-box-sub .cat-row{ gap: 20px; display: flex; align-items: center;}
.project-box-main .project-box-sub .cat-row .cat { display: flex; flex-wrap: wrap;}
.project-box-main .project-box-sub .cat-row .cat span{  background-color: rgba(188, 197, 211, 0.7); min-height: 36px;  font-size: 16px; line-height: 1.5; font-family: 'stolzl'; align-items: center; color: #06080b; display: flex;  justify-content: center; white-space: nowrap; padding: 0 38px; }
.project-box-main .project-box-sub .cat-row .cat-text{ min-height: 36px; display: flex; align-items: center; border-left:#06080B solid 2px ;font-family: 'stolzl'; line-height: 1.5; padding: 0 0 0 20px;color: #3f4957; font-size: 16px; font-weight: 500; }
.project-box-main .project-box-sub h4{font-family: 'stolzl';font-weight: normal; color: #06080b; text-transform: uppercase; font-size: 24px; line-height: 1.79; padding: 40px 0 0 0; }
.project-box-main .project-box-sub .sub-text { padding: 24px 0 0 0; flex-wrap: wrap; gap: 10px; display: flex ;align-items: flex-start;}
.project-box-main .project-box-sub .sub-text .sub-text-in{  min-width: 187px;} 
.project-box-main .project-box-sub .sub-text .sub-text-in p{color: #3f4957;  line-height: 1.5; font-size: 16px;}

.load-more-block{ padding: 88px 0 0 0; display: block; width: 100%; text-align: center;}
.load-more-link{ display: flex; min-height: 30px; align-items: center; justify-content: center;}
.load-more-link a{ border-bottom: transparent solid 2px; text-transform: uppercase;font-family: 'stolzl';  color: #06080b; font-size: 20px; padding: 0 0 6px; line-height: 1.5; font-weight: 300; }
.load-more-link a:hover{  border-color: #3F4957; color: #3F4957; }
.load-more-block .total-count {  color: #3f4957; line-height: 1.5; font-size: 20px; padding: 16px 0 0 0; } 
.mobile-fliter-main{ display: none;}
.mobile-fliter-head{ display: none;}
.project-modal-outer .popup-loader { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); display: flex; align-items: center; justify-content: center; opacity: 0.7; }
.project-modal-outer .popup-loader .icon { display: flex; width: 80px; height: 80px; background: url('../images/loader.gif') center center no-repeat; background-size: cover; }

.project-modal-outer{ height: 100vh; height: calc(var(--vh,1vh)*100); overflow: auto; width: 100%; position: fixed; left: 0; top: 0; z-index: 1000;  background-color: #151b24; transform: translateY(100%);  visibility: hidden;  pointer-events: none; transition: all 0.4s ease-in-out;  }
body.active-modal .project-modal-outer{ transform: none;  visibility: visible; pointer-events: all; }
body.active-modal .header_main{ transform: translateY(-100%); }

.project-modal-outer .modal-cls{ z-index: 10; position: absolute; right: 11.62vh; top: 5.47vh; display: flex; }
.project-modal-outer .modal-cls a{ filter: brightness(0) invert(1); display: flex;}
.project-modal-main{ display: flex ;  width: 100%;}
.project-modal-main .left-slider{ width: 54.2%; display: flex;}
.project-modal-main .left-slider .modal-img{ width: 100%; height: 100vh; height: calc(var(--vh,1vh)*100); display: flex ; position: relative; }
.project-modal-main .left-slider .modal-img img{ position: absolute; top: 0; width: 100%; height: 100%; object-fit: cover; left: 0; }
.project-modal-main .modal-right {width: 45.8%; overflow: hidden; padding: 17.2vh 10.28vw 0 0; display: block;}
.left-slider-inner{ display: block;width: 100%;}
.modal-right-inner{  padding: 68.4px 60px 30px 96px; border-right: solid 1px #3f4957; height: 100%;  background-color: rgba(63, 73, 87, 0.25); }
.modal-right-inner .modal-title{ color: #f8fbff;  font-size: 24px;  font-family: 'stolzl';line-height: 1.5; padding: 0 0 50px;}
.modal-right-slider{ display: block; width: 100%;}

.modal-right-slider .swiper-cls-arrow{ margin: 0; display: flex; align-items: flex-start;   }
.modal-right-slider .swiper-cls-arrow-inner{ padding: 36px 0 0 0; display: flex ;align-items: center; gap: 64px; flex-direction: row-reverse;}
.modal-right-slider div[class*="swiper-button"]::after{ display: none;}
.modal-right-slider div[class*="swiper-button"] { margin: 0; position: relative;left: auto; top: auto; bottom: auto; right: auto; display: flex; cursor: pointer; }
.modal-right-slider div[class*="swiper-button"] .arrow { opacity: 0.7; display: flex; width: 21px; height: 13px; background-position: center center; background-repeat: no-repeat; background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='20.853' height='12.711' viewBox='0 0 20.853 12.711'%3e%3cpath d='M0,8.449,8.161,0l8.449,8.449' transform='translate(2.121 2.14)' fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-width='3'/%3e%3c/svg%3e"); transition: all ease-in-out 300ms; }
.modal-right-slider .swiper-button-prev .arrow { transform: rotate(-90deg); }
.modal-right-slider .swiper-button-next .arrow { transform: rotate(90deg); }
.modal-right-slider div[class*="swiper-button"].swiper-button-disabled { cursor: default; }
.modal-right-slider div[class*="swiper-button"]:not(.swiper-button-disabled):hover .arrow { opacity: 1; background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='20.853' height='12.711' viewBox='0 0 20.853 12.711'%3e%3cpath d='M0,8.449,8.161,0l8.449,8.449' transform='translate(2.121 2.14)' fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-width='3'/%3e%3c/svg%3e");  }
.modal-right-slider div[class*="swiper-button"].swiper-button-disabled .arrow { opacity: 0.70; background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='20.853' height='12.711' viewBox='0 0 20.853 12.711'%3e%3cpath d='M0,8.449,8.161,0l8.449,8.449' transform='translate(2.121 2.14)' fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-width='2'/%3e%3c/svg%3e"); }
.modal-text p{ color: #fff;}
 
.project-modal-main .modal-right .swiper-counter2{ position: relative; display: flex;  color: #fff;  line-height: 1.06;letter-spacing: 0.64px;  font-size: 32px;font-family: 'stolzl'; font-weight: 500; justify-content: flex-end; padding: 11px 30px; border-right: solid 1px #3f4957;  }
.project-modal-main .modal-right .swiper-counter2 i{ font-style: normal; padding: 0 3px; position: relative;}
.project-modal-main .modal-right .swiper-counter2::after{ height: 100%; position: absolute; border-top: solid 1px #3f4957; border-bottom: solid 1px #3f4957; pointer-events: none; width: 100vw; left: 0; top: 0; height: 100%; content: '';    }
 
.project-modal-main .modal-right.hide_navigation .swiper-cls-arrow-inner { display: none; }
.project-modal-main .modal-right.hide_navigation .swiper-counter2 { padding: 0 0; border-right: none; }
.project-modal-main .modal-right.hide_navigation .swiper-counter2::after { border-top: none; }
.project-modal-main .modal-right.hide_navigation .swiper-counter2 .innerbox { opacity: 0; visibility: hidden; pointer-events: none; }


@media (min-width: 1401px) and (max-width: 1599px) {
	.projects-listing .row{ margin: 0 -26px; row-gap: 64px; }	
	.projects-listing .row>* { padding: 0 26px; }
	.fliter-head{ padding: 0 0 48px; }
	.project-box-main .project-box-sub{ padding: 24px 0 0 0;  }

	.modal-right-inner{ padding: 44px 44px 30px 64px; }
	.modal-right-inner .modal-title{ padding: 0 0 32px; }
	.project-modal-main .modal-right{ padding: 15.2vh 9.28vw 0 0; }


}


@media (min-width: 1281px) and (max-width: 1400px) {
	.projects-listing .row{ margin: 0 -20px; row-gap: 48px; }	
	.projects-listing .row>* { padding: 0 20px; }
	.fliter-head{ padding: 0 0 48px; }
	.project-box-main .project-box-sub{ padding: 24px 0 0 0;  }
	.project-box-main .project-box-sub h4{ padding: 30px 0 0 0; } 	
	.project-box-main .project-box-sub .sub-text{ padding: 20px 0 0 0; }

	.modal-right-inner{ padding: 32px 32px 20px 32px; }
	.modal-right-inner .modal-title{ padding: 0 0 32px; }
	.project-modal-main .modal-right{ padding: 15.2vh 7vw 0 0; }


}


@media (min-width: 992px) and (max-width: 1280px) {
	.projects-listing .row{ margin: 0 -15px; row-gap: 48px; }	
	.projects-listing .row>* { padding: 0 15px; }
	.fliter-head{ padding: 0 0 48px; }
	.project-box-main .project-box-sub{ padding: 20px 0 0 0;  }
	.project-box-main .project-box-sub h4{ line-height: 1.5; padding: 20px 0 0 0; } 	
	.project-box-main .project-box-sub .sub-text{ padding: 20px 0 0 0; }
	.project-box-main .project-box-sub .cat-row .cat-text{ font-size: 14px; line-height: 1.4;}	
	.load-more-block{ padding: 32px 0 0 0; }
	.load-more-link a{ font-size: 16px;}
	.load-more-block .total-count{ font-size: 16px;}
	.project-fliter-section{ padding: 0 0 64px; }

	.modal-right-inner{ padding: 32px 32px 20px 32px; }
	.modal-right-inner .modal-title{ padding: 0 0 32px; }
	.project-modal-main .modal-right{ padding: 15.2vh 5vw 0 0; }
}


@media (max-width: 992px) {
	.modal-right-inner{ background: none; padding: 45px 30px 64px 30px; }
	.modal-right-inner .modal-title{ padding: 0 0 45px; }
	.project-modal-main .left-slider{ width: 100%;}
	.project-modal-main .modal-right{ width: 100%; padding: 0 0 0; background-color: rgba(63, 73, 87, 0.25); }
	.project-modal-main{ padding: 96px 0 18px 0; flex-direction: column;}
	.project-modal-outer .modal-cls{ top: 27px; right: 30px;}
	.project-modal-main .left-slider .modal-img{ height: 500px; }
	.project-modal-main .modal-right .swiper-counter2::after{ border-top: 0; }

	.project-box-main .project-box-sub .cat-row { flex-wrap: wrap; }
	.project-box-main .project-box-sub .cat-row .cat-text { padding-left: 0; border-left: none; }
 
}


@media (min-width: 768px) and (max-width: 991px) {
	.projects-listing .row{ margin: 0 -10px; row-gap: 40px; }	
	.projects-listing .row>* { padding: 0 10px; }
	.fliter-head{ padding: 0 0 48px; }
	.project-box-main .project-box-sub{ padding: 20px 0 0 0;  }
	.project-box-main .project-box-sub h4{ line-height: 1.5; padding: 20px 0 0 0; } 	
	.project-box-main .project-box-sub .sub-text{ padding: 20px 0 0 0; }
	.project-box-main .project-box-sub .cat-row .cat-text{ font-size: 14px; line-height: 1.4;}
	.fliter-row ul{ gap: 10px;}
	.fliter-row ul li .checkbox label{ padding: 0 30px; }
	.project-box-main .project-box-sub .sub-text .sub-text-in{ min-width: 170px; }
	.load-more-block{ padding: 32px 0 0 0; }
	.load-more-link a{ font-size: 16px;}
	.load-more-block .total-count{ font-size: 16px;}
	.project-fliter-section{ padding: 0 0 64px; }


}


@media (max-width: 767px) {
	.projects-listing .row{ margin: 0 -10px; row-gap: 0px; }	
	.projects-listing .row>* { width: 100%; padding: 0 10px; }
	.fliter-head{ padding: 0 0 48px; }
	.project-box-main{ padding: 20px 0; }
	.project-box-main .project-box-sub{ padding: 12px 0 0 0;  }
	.project-box-main .project-box-sub h4{ line-height: 1.5; padding: 20px 0 0 0; } 	
	.project-box-main .project-box-sub .sub-text{ padding: 20px 0 0 0; }
	.project-box-main .project-box-sub .cat-row .cat-text{ min-height: 0; border: 0; padding: 0; font-size: 14px; line-height: 1.4;}
	.fliter-row ul{ gap: 10px;}
	.fliter-row ul li .checkbox,
	.fliter-row ul li{ width: 100%;}
	.fliter-row ul li .checkbox label span{ width: 100%; text-align: center; padding: 0 30px; }
	.project-box-main .project-box-sub .sub-text .sub-text-in{ min-width: 170px; width: 100%; }
	.project-box-main .project-box-sub .cat-row{ flex-direction: column; gap: 10px; align-items: flex-start;}
	.project-box-main .project-box-sub .sub-text { gap: 20px; flex-direction: column;}
	.projects-listing .row .col-md-6 + .col-md-6 .project-box-main{ border-top: #dad6d3 solid 1px;}

	.load-more-block{ padding: 32px 0 0 0; }
	.load-more-link a{ font-size: 16px;}
	.load-more-block .total-count{ font-size: 16px;}
	.project-fliter-section{ padding: 0 0 64px; }

	.mobile-fliter-main{ background: #fff; position: sticky; top: 0; z-index: 100; padding: 25px 0; display: flex;align-items: center;}
	.fliter-icon a{ display: flex; padding: 0  27px 0 16px; }
	.fliter-icon a img{ min-width: 33px; height: auto;}
	.mobile-fliter-main .btnbox{ width: 100%;}
	.mobile-fliter-head{ display: block;}

	.fliter-head{   position: fixed; left: 0; transition: all 0.3s ease-in-out; transform: translateX(-110%); padding: 30px ; background: #fff;  z-index: 1000;   top: 0; width: 100%; height: 100vh; height: calc(var(--vh,1vh)*100); opacity: 0; visibility: hidden; pointer-events: none; }
	.mobile-fliter-head{ display: block ;width: 100%; position: relative;}
	.mobile-fliter-head .logo-f{ display: flex;}
	.mobile-fliter-head .logo-f a{ display: flex;}
	.mobile-fliter-head .logo-f a{ width: 174px; height: auto; display: flex;}
	.f-close{ display: flex ;position: absolute; right: 0; top: 0;}
	.f-close a{ display: flex;}
	.mobile-fliter-text{ padding: 70px 0 39px 0; }
	.mobile-fliter-text span{ width: 100%; padding: 13px; color: #2c2424; font-size: 24px; text-transform: uppercase; line-height: 1; border-top:  #dad6d3 solid 1px; border-bottom:  #dad6d3 solid 1px; text-align: center; display: block; font-family: 'stolzl';}
	.asset-text{ display: block; padding: 0 0 28px; color: #2c2424;  font-size: 16px; line-height: 1.5; font-family: 'stolzl';}

	.fliter-row{ padding: 0 0 0 26px; }
	.fliter-row ul { gap: 15px; flex-direction: column; align-items: flex-start;}
	.fliter-row ul li .checkbox label{ width: 100%; padding: 0 0 0 49px; }
	.fliter-row ul li .checkbox label span{border: solid 1px #82936b; }
	.fliter-row ul li .checkbox label::after {width: 36px; height: 36px; content: ''; position: absolute; left: 0; top: 0;  border: solid 1px #82936b;}
	.fliter-row ul li .checkbox label::before {width: 36px; background: url(../images/checkmark.svg) no-repeat center center; height: 36px; content: ''; position: absolute; left: 0; top: 0; opacity: 0;  transition:all 0.3s ease-in-out ;}
	.fliter-row ul li .checkbox input:checked +  label::before{ opacity: 1; }
	body.active-fliter{ overflow: hidden; }
	body.active-fliter .fliter-head{ opacity: 1; transform: none; visibility: visible; pointer-events: all;  }
	.mobile-fliter-main .btnbox .primary-btn{ min-width: 100%;}


}