/* @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;700&family=Urbanist:wght@100;200;300;400;500;700&display=swap'); */



:root {--goldColor:#DAAF56;--grayColor:#9d8e7c;--yellowColor:#DEAA00;--lgrayColor:#faf7f2;}

::-webkit-scrollbar{width:7px;background-color:#aaa}

::-webkit-scrollbar-thumb{background-color:#000;border-radius:5px}

::selection{background:#222;color:#fff}

::-moz-selection{background:#222;color:#fff}

::-moz-placeholder{color:inherit;opacity:.6}

::-ms-input-placeholder{color:inherit;opacity:.6}

::-webkit-input-placeholder{color:inherit;opacity:.6}

.form-control:focus, .form-select:focus, .form-check-input:focus {outline:none;box-shadow:none;border-color:inherit}

input::-webkit-outer-spin-button,input::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0}

input[type=number] {-moz-appearance:textfield;appearance:textfield}

.form-check-input {width:1.2rem;height:1.2rem}

.form-check-input:checked {background-color:#000;border-color:#000}



html {scroll-behavior:smooth;font-size:16px}

body {font-family:'Poppins',sans-serif;font-weight:300;color:#000;line-height:1.8;background:#fff}

body * {color:inherit}

ul, li {list-style:none;margin:0;padding:0}

a {text-decoration:none}

/* .titleFont {font-family:'Urbanist',sans-serif} */

.titleFont {font-family:'Poppins',sans-serif;}



.animateThis {position:relative;will-change:opacity transform;transform-origin:50% 50%;transition: all .8s ease-in-out}

.slideLeft {opacity:0;transform: translate3d(100px, 0px, 0px)}

.slideLeft.in-view {opacity: 1;transform: translate3d(0px, 0px, 0px)}

.slideRight {opacity:0;transform: translate3d(-100px, 0px, 0px)}

.slideRight.in-view {opacity: 1;transform: translate3d(0px, 0px, 0px)}

.slideTop {opacity:0;transform: translate3d(0px, 100px, 0px)}

.slideTop.in-view {opacity: 1;transform: translate3d(0px, 0px, 0px)}

.fadeGrow {opacity:0;transform:scale(.5)}

.fadeGrow.in-view {opacity:1;transform:scale(1)}

.fadeShrink {opacity:0;transform:scale(1.5)}

.fadeShrink.in-view {opacity:1;transform:scale(1)}

.fadeIn {opacity:0}

.fadeIn.in-view {opacity:1}



@media (min-width:1600px) {

.container {max-width:1540px}

}

@media (min-width:1800px) {

.container {max-width:1740px}

}



.ctaBtn {min-width:150px;height:3rem;display:inline-flex;align-items:center;justify-content:center;background:var(--goldColor);color:#fff;padding:0 1rem;border:1px solid var(--goldColor);position:relative;top:0;left:0;font-size:1rem;font-weight:400;line-height:1;text-transform:lowercase;overflow:hidden;transition:all .3s ease;z-index:1;top:0}

.ctaBtn.white {background:#fff;color:#000;border:1px solid #482F2B}

.ctaBtn.ghost {background:transparent;color:#000;border:1px solid #482F2B}

.ctaBtn.ghostwhite {background:transparent;color:#fff;border:1px solid #fff}

.ctaBtn:hover {box-shadow: 0 0 0 4px var(--goldColor), 0 10px 15px 0 rgba(0,0,0,.5);color:#fff;background:var(--goldColor);top:-2px;border:1px solid #ffe5aa}

.ctaBtn:hover:after {content:'';width:100%;height:100%;display:block;position:absolute;top:0;left:-120%;background: linear-gradient(90deg, rgba(181,137,42,0) 0%, rgba(255,206,100,.8) 30%, rgba(181,137,42,0) 60%, rgba(255, 198, 77, 0.8) 70%, rgba(181,137,42,0) 75%);animation: btnAnim 2s ease 1 forwards;transition:all 1s ease;transform:skewX(-35deg)}

@keyframes btnAnim {

  0% {left:-120%} 99% {left:100%} 100% {left:-120%;opacity:0}

}



.ctaLink {color:#000;font-weight:400;position:relative;display:inline-block;padding:3px 0 3px 60px;transition:all .3s ease;z-index:1;text-transform:lowercase;}

.ctaLink:hover {color:inherit;padding:3px 30px;color:#fff;transition:color .3s .3s ease, padding .3s ease;}

.text-white .ctaLink {color:#fff;}

.text-white .ctaLink:before {background:#fff}

.ctaLink:before {content:'';width:45px;height:1px;display:block;position:absolute;top:0;bottom:0;left:0;margin:auto;background:#111;transition:inherit;z-index:-1;}

.ctaLink:hover:before {width:100%;height:100%;background:var(--goldColor);transition:width .3s ease, height .3s .3s ease, background .3s .3s ease, box-shadow .3s .3s ease;box-shadow: 0 0 0 3px var(--goldColor), inset 0 0 0 1px #fff}



@media (max-width:575.98px) {

.ctaBtn {font-size:.9rem;min-width:100px;height:2.5rem;}

.ctaLink {font-size:.9rem;padding:3px 0 3px 40px;}

.ctaLink:before {width:30px;}

}



.playBtn {color:#fff;text-transform:uppercase;font-size:.9rem;opacity:.8;transition:all .5s ease;background:transparent;border:0;}

.playBtn:before {content:'';width:1.2rem;height:1.2rem;display:inline-block;margin:0 .5rem 0 0;vertical-align:middle;background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 16 16'><path d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/><path d='M6.271 5.055a.5.5 0 0 1 .52.038l3.5 2.5a.5.5 0 0 1 0 .814l-3.5 2.5A.5.5 0 0 1 6 10.5v-5a.5.5 0 0 1 .271-.445z'/></svg>");}

.playBtn:hover {opacity:1;background:var(--goldColor);}



.swiperBtnBox {width:6.8rem;height:3rem;display:flex;justify-content:space-between;position:absolute;right:1.5rem;bottom:1.5rem;z-index:10;}

.swiperBtns {width:3rem;height:3rem;border:1px solid #fff;border-radius:50%;top:0;bottom:0;margin:0;color:#fff;display:inline-flex;justify-content:center;align-items:center;z-index:3;transition:all .3s ease;overflow:hidden}

.swiperBtns:hover {background:var(--goldColor);}

.swiperBtns:after {content:"";width:60%;height:60%;display:block;background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 16 16'><path d='M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8z'/></svg>");background-repeat:no-repeat;background-size:contain;}

.swiperBtns[data-title="Prev"]:after {transform:rotate(180deg)}

.swiperBtns.swiper-button-prev {left:0;}

.swiperBtns.swiper-button-next {right:0;}



.swiper-pagination {--swiper-pagination-bullet-inactive-color:#999;--swiper-pagination-color:#fff;--swiper-pagination-bullet-inactive-opacity:.6}

.swiper-pagination .swiper-pagination-bullet {box-shadow:0 0 0 1px #fff;margin:0 .5rem !important}



@media (max-width:575.98px) {

.swiperBtnBox {width:5.5rem;height:2.5rem;}

.swiperBtns {width:2.5rem;height:2.5rem;}

}



.bodyWrapper {overflow-x:hidden;background-color:#faf7f2}

.pageHeader {position:fixed;left:0;right:0;top:0;transition:all .3s ease;z-index:999}

.bodyWrapper.stick .pageHeader, .pageHeader.bgShow {background:var(--grayColor)}

.bodyWrapper.stick .pageHeader {box-shadow:0 5px 10px rgba(0,0,0,.2)}



.siteLogo {width:100%;max-width:250px;height:auto;display:block;transition:all .3s ease;margin:2rem 0}



.menuBtn {width:30px;height:30px;position:relative;background:transparent;border:0;display:inline-block;margin-left:1.5rem}

.menuBtn span {width:100%;height:2px;display:block;margin:auto;position:absolute;left:0;right:0;transition:all .25s ease-in-out;border-radius:2px;background:#fff}

.menuBtn span:nth-child(1) {top:15%}

.menuBtn span:nth-child(2), .menuBtn span:nth-child(3) {top:50%}

.menuBtn span:nth-child(4) {top:85%}

.menuBtn.active span:nth-child(1), .menuBtn.active span:nth-child(4) {width:0;top:50%}

.menuBtn.active span:nth-child(2) {-webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg)}

.menuBtn.active span:nth-child(3) {-webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg)}



.searchBtn {width:30px;height:30px;border:0;padding:0;position:relative;display:inline-block;background:transparent}

.searchBtn span {transition:all .1s ease}

.searchBtn span.circle{width:18px;height:18px;display:block;border:2px solid #fff;position:absolute;top:4px;left:4px;border-radius:50%;transform:rotate(0deg);transform-origin:0% 50%}

.searchBtn span.line {width:8px;height:2px;display:block;background:#fff;position:absolute;bottom:4px;right:4px;transform:rotate(45deg);transform-origin:100% 50%;border-radius:2px}

.searchBtn.active span.circle {width:30px;height:2px;border-radius:0;border:0;transform:rotate(-45deg);top:25px;left:5px;background:#fff}

.searchBtn.active span.line  {width:30px;right:4px;bottom:3px}



.searchWrapper {width:100%;height:300px;position:fixed;top:0;left:0;background:var(--grayColor);display:none;padding-top:100px;z-index:-1000;}

.searchWrapper .searchForm {width:100%;max-width:1000px;height:60px;border:0;opacity:0;transition:all .3s ease;}

.searchWrapper .searchSubmit {width:3rem;height:3rem;background:var(--yellowColor);color:#fff;border:0;padding:.8rem;display:flex;justify-content:center;align-items:center}

.searchWrapper .searchSubmit svg {width:100%;height:auto}

.searchWrapper .form-control {padding:10px;height:100%;font-size:1.5rem;font-weight:300;color:#fff;background:transparent;border:0;border-bottom:1px solid #fff}

.searchWrapper .form-control:focus {outline:none;box-shadow:none}

.searchWrapper .form-control::-moz-placeholder{color:inherit;opacity:1}

.searchWrapper .form-control::-ms-input-placeholder{color:inherit;opacity:1}

.searchWrapper .form-control::-webkit-input-placeholder{color:inherit;opacity:1}



.searchWrapper.searchopen {box-shadow:0 40px 40px rgba(0,0,0,.5);transition:box-shadow .1s .2s ease;}

.searchWrapper.searchopen .searchForm {opacity:1;transition-delay:.4s;}



@media (max-width:1199.98px) {

.siteLogo {max-width:250px;}

}



@media (max-width:991.98px) {

.navigHolder {max-width:600px;width:75%;height:100%;position:fixed;top:0;left:-120%;display:block;background:var(--grayColor);transition:all .5s ease;padding:0;box-shadow:0 0 50px rgba(0,0,0,.8);overflow:auto;z-index:100}

.navigHolder.open {left:0}

.menuList {padding-top:2rem}

.menuList > li {display:block;border-bottom:1px solid #ad9981;position:relative;width:100%}

.menuList > li > a {padding:1.5rem;display:block;font-size:1.4rem;font-weight:200;color:#fff !important;text-align:center;text-transform:uppercase}

.menuList > li > ul {display:none;background:#f6f6f6;padding:15px 20px;position:relative;box-shadow:inset 0 10px 20px rgba(0,0,0,.03)}

.menuList > li > ul:before {content:'';width:0;border-top:7px solid #000;border-left:8px solid transparent;border-right:8px solid transparent;display:block;position:absolute;top:0;left:0;right:0;margin:auto}

.menuList > li > ul li {margin-left:0 !important}

.menuList > li > ul li a {padding:7px 0;display:block;font-size:1.1rem;text-align:center}

.menuList > li > ul li a:hover {background:#f6f6f6}

.menuList > li > a[role=button]:after {content:'\002B';float:right;font-size:2rem;font-weight:400;line-height:1}

.menuList > li.open > a[role=button]:after {content:'\2212'}

}



@media (max-width:575.98px) {

.navigHolder {width:85%}

.menuList > li > a {font-size:1.1rem}

.searchWrapper .form-control {font-size:1.4rem}

}



@media (min-width:992px) {

.menuList {display:flex;margin-left:1rem;}

.menuList > li {display:inline-flex;padding:0 1.5rem;position:relative}

.menuList > li > a {padding:0 .2rem;color:#fff;text-transform:lowercase;line-height:2;font-weight:300;display:block;position:relative}

.menuList > li:last-child {margin-left:auto}

.menuList > li > a:after {content:'';width:0;height:2px;display:block;position:absolute;bottom:0;left:0;margin:auto;background:var(--yellowColor);transition:all .3s ease;}

.menuList > li:hover > a:after, .menuList > li.active > a:after {width:100%}

}



.pageWrapper {width:100%;min-height:100vh}

.pageWrapper > section {overflow:hidden;width:100%}



.homeBannerSection {position:relative}

.homeBanner {width:100%;height:calc(100vh - 55px);background:#111}

.hbSlide {position:relative;overflow:hidden}

.hbSlide:after {content:'';width:100%;height:100%;display:block;position:absolute;top:0;left:0;background: linear-gradient(0deg, rgba(0,0,0,.1) 0%, rgba(0,0,0,.5) 80%)}

.hbImg {width:100%;height:100%;object-fit:cover;object-position:center;transition:all 9s linear;transform:scale(1.2)}

.swiper-slide-active .hbImg {transform:scale(1)}

.hbContent {position:absolute;top:0;bottom:0;left:0;right:0;z-index:1;color:#fff;padding-bottom:5%}

.hbSlideText  {max-width:800px}



.homeBanner .hbSlideText {opacity:0;transition:all 1s 1.4s ease;filter:blur(30px);transform:translateX(-200px)}

.homeBanner .swiper-slide-active .hbSlideText {opacity:1;filter: blur(0px);transform:translateX(0)}



@media (min-width:992px) {

.homeBanner {height:100vh}

}



.sectionTitle {font-size:1.2rem;text-transform:uppercase;font-weight:400}

.bigText {font-size:2rem;line-height:1.2;font-weight:100; font-family:'Poppins',sans-serif; /*font-family:'Urbanist',sans-serif*/}

.bigText strong {font-weight:500}



@media (min-width:768px) {

.sectionTitle {font-size:1.25rem}

.bigText, .titleBig{font-size:2.5rem}



}



@media (min-width:1400px) {

.sectionTitle {font-size:1.5rem}

.bigText {font-size:3.5rem}

}



.whoweSection {background:center center no-repeat;background-size:auto 95%}

.whoweWrap {font-size:1.1rem}

.whoweWrap .bigText {font-weight:400}



.serviesList .servListItem {display:block;position:relative;font-size:1.3rem;white-space:nowrap;color:#000;font-weight:200;cursor:pointer}

.serviesList .servListItem.active {font-weight:500}

.serviesList .servListItem:before {content:'';width:0;height:0;border-top:3px solid var(--yellowColor);display:block;position:absolute;right:0;left:0;bottom:0;margin:auto;transition:all .3s ease-in-out}

.serviesList .servListItem.active:before {width:100%}



.serviceSwiper {height:100%;min-height:450px}

.serviceItem {width:100%;height:100%;position:relative;overflow:hidden;display:flex;align-items:end;justify-content:start;background: linear-gradient(45deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 70%)}

.servImg {width:130%;height:100%;display:block;position:absolute;top:0;left:0;object-fit:cover;object-position:center;z-index:-1; transition:all 0s 4s linear}

.servDetails {width:500px;height:auto;color:#fff;padding:1rem 1rem 2rem 2rem;position:relative;}

.servName {font-size:1.5rem;font-weight:500;text-transform:lowercase}

.servBrief {font-size:.9rem;font-weight:300;line-height:1.5}



.swiper-slide-active .serviceItem .servImg {left:-30%;transition:all 20s linear;}



.serviceCarousel {background:var(--grayColor);}

.serviceCarousel .show {transition-duration:1s;}



@media (min-width:992px) {

.serviesList .servListItem {display:inline-block;position:relative;font-size:1rem;white-space:nowrap;color:#000;font-weight:200;cursor:pointer}

.serviesList .servListItem.active {font-weight:500}

.serviesList .servListItem:before {content:'';width:0;height:0;border-top:3px solid var(--yellowColor);display:block;position:absolute;right:105%;top:0;bottom:0;left:unset;margin:auto;transition:all .3s ease-in-out}

.serviesList .servListItem.active:before {width:100%}



.servBtnWrap {position:absolute;left:0;bottom:1.4rem}

.serviesList {height:300px;margin-bottom:70px;overflow:visible;}

.serviesList .servListItem {font-size:1.5rem}

.serviceSwiper {min-height:unset}

}

/* @media (min-width:1200px) {

.serviesList .servListItem {font-size:2rem}

} */

@media (min-width:1400px) {

.serviesList {height:400px}

.serviesList .servListItem {font-size:2rem}

}

@media (max-width:991.98px) {

.serviesList .swiper-wrapper {flex-wrap:nowrap;}

.serviesList .swiper-slide {width:auto;padding:0 1rem;}

}

@media (max-width:575.98px) {

.servDetails {padding:1rem 1rem 2rem 1rem;}

.serviesList .servListItem {font-size:1rem;}

}



.projectSwiper {overflow:visible;}

.projectSwiper .swiperBtnBox {right:10%;}

.projectSwiper .swiper-slide {transform:scale(.9);transition:transform 2s ease;}

.projectSwiper .swiper-slide-active {transform:scale(1);}



.projectItem {width:100%;aspect-ratio:1;position:relative;overflow:hidden;display:flex;align-items:end;justify-content:start;transition:all 2s ease;background: linear-gradient(45deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,0) 60%);}

.pjiImg {width:130%;height:100%;display:block;position:absolute;top:0;left:0;object-fit:cover;object-position:center;transition:all 3s linear;z-index:-1}

.pjiDetails {max-width:500px;height:auto;padding:2rem;position:relative;}

.pjiName {font-size:1.5rem;font-weight:500;text-transform:lowercase}

.pjiDetails p {font-size:.9rem;font-weight:300;margin-bottom:1rem}



.swiper-slide-active .projectItem .pjiImg {left:-30%;transition:all 20s linear;}



@media (min-width:992px) {

.projectItem {width:100%;aspect-ratio:1/.5}

}

@media (max-width:575px) {

.pjiDetails {padding:1rem;}

.projectSwiper .swiperBtnBox {right:8%;bottom:4%;}

.pjiDetails p {line-height:1.5}

}



.highlightItem {width:100%;height:450px;position:relative;background:linear-gradient(0deg, rgba(0,0,0,.7) 0%, rgba(0,0,0,0) 60% 100%);overflow:hidden;display:flex;align-items:end;}

.hltImg {width:100%;height:100%;object-fit:cover;object-position:center;position:absolute;z-index:-1;}

.hltDetails {height:auto;padding:1.5rem;display:flex;margin-bottom:2rem;}

.hltName {max-width:800px;line-height:1.1;color:#fff;text-shadow:0 0 40px rgba(0,0,0,1);}

.hltName strong {font-weight:500}



.highlightSwiper .swiper-pagination {display:none}



.highlightItem .playBtn {position:absolute;}



@media (min-width:768px) {

.highlightItem {height:550px;background:linear-gradient(90deg, rgba(0,0,0,.7) 0%, rgba(0,0,0,0) 50% 100%);align-items:start;}

.hltDetails {padding:4rem;margin:0;}

.highlightSwiper .swiper-pagination {width:auto;text-align:left;margin:0 0 1.5rem 4rem;display:block;}

.highlightItem .playBtn {bottom:5rem;left:4rem;}

}



@media (min-width:992px) {

.highlightItem {height:650px;}

}



.newsSection {background:center center rgb(48,28,6);background-size:cover;position:relative}

.newsSection:before {content:'';width:100%;height:100%;display:block;position:absolute;left:0;top:0;background: linear-gradient(180deg, rgba(48,28,6,.9) 0%, rgba(66,39,11,.5) 100%);}



.newsItem {width:100%;max-width:400px;aspect-ratio:2/3;}

.newsInfo {text-transform:uppercase;font-weight:300;line-height:1;margin-bottom:.7rem;}

.newsInfo span:not(:first-child) {border-left:1px solid #fff;padding-left:1rem;margin-left:1rem;}

.newsContent {position:relative;overflow:hidden;}

.newsContent:before {content:'';width:100%;height:100%;display:block;position:absolute;top:-50%;left:0;background:linear-gradient(0deg, rgba(66,39,11,0) 0%, rgba(48,28,6,.9) 100%);transition:all .5s ease;}

.newsItem:hover .newsContent:before {top:0}

.newsImg {width:100%;height:100%;object-fit:cover;object-position:center;mix-blend-mode:color;}

.newsDetails {width:80%;position:absolute;top:0;right:0;padding:1.5rem;}

.newsHead {font-size:1rem;font-weight:300;line-height:1.5;margin-bottom:1rem;}



.newsSwiper .swiperBtnBox {top:0;}



@media (min-width:767.98px) {

.newsSection:before {background: linear-gradient(180deg, rgba(48,28,6,.75) 0%, rgba(66,39,11,.1) 100%)}

.newsItem {margin-top:100px;transition:margin 1.3s ease;}

.swiper-slide-active .newsItem {margin-top:0;}

}



@media (max-width:768px) {

.newsSwiper .swiperBtns {display:none;}

.newsSwiper {overflow:visible;}

.swiper-slide-active .newsContent:before {top:0}

}



.clientSwiper .swiper-wrapper {transition-timing-function:linear!important}

.clientSwiper .swiper-slide {width:120px;aspect-ratio:2/1;position:relative;}

.clientSwiper img {width:100%;height:100%;object-fit:contain;object-position:center;filter:grayscale(100%) contrast(30%);transition:all .5s esae;mix-blend-mode:color-burn;}

.clientSwiper img:hover {filter:grayscale(0) contrast(100%);}

.clientSwiper:after {content:'';width:100%;height:100%;display:block;position:absolute;top:0;left:0;background:linear-gradient(90deg, rgba(250,247,242,1) 0%, rgba(250,247,242,0) 10%, rgba(250,247,242,0) 90%, rgba(250,247,242,1) 100%);z-index:100;pointer-events:none;}



@media (min-width:767.98px) {

.clientSwiper .swiper-slide {width:150px}

}



.pageFooter {background:var(--grayColor);}



.footMenu {width:100%;columns:2;column-gap:15px;}

.footMenu li {display:block;margin-bottom:.5rem;}

.footMenu li a {line-height:2;color:#eee;position:relative;display:inline-block;white-space:nowrap;}

.footMenu li a:hover {color:#fff;}

.footMenu li a:before {content:'';width:0;height:2px;display:block;position:absolute;bottom:0;left:0;margin:auto;background:var(--yellowColor);transition:all .3s ease;}

.footMenu li a:hover:before {width:100%}



.socialLinks li:not(:first-child) {margin:0 0 0 1rem}

.socialLinks a {width:2rem;height:2rem;line-height:0;padding:.4rem;display:block;border-radius:50%;text-align:center;background:#fff;transition:all .2s ease;transform:scale(1);position:relative;color:#331400;}

.socialLinks a:hover {background:var(--goldColor);transform:scale(1.1);color:#fff;box-shadow: inset 0 0 0 1px #fff,0 0 0 2px var(--goldColor), 0 7px 10px rgba(0,0,0,.6);}

.socialLinks a svg {width:100%;height:auto;}



.footCopy {font-size:.85rem;color:#eee;}



@media (min-width:576px) {

.footMenu {columns:3;column-gap:15px;}

}

@media (min-width:768px) {

.footMenu {columns:4;column-gap:15px;}

}

@media (max-width:1199.99px){

.footLogo {max-width:200px;}

}





.innBannerSection {position:relative}

.listingBanner {width:100%;min-height:600px;height:65vh;background:#111}

.listingBanner .swiper-pagination {z-index:10;}



.lbSlide {position:relative;overflow:hidden}

.lbSlide:after {content:'';width:100%;height:100%;display:block;position:absolute;top:0;left:0;background: linear-gradient(0deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.2) 80%)}

.lbImg {width:100%;height:100%;object-fit:cover;object-position:center;transition:all 9s linear;transform:scale(1.2)}

.swiper-slide-active .lbImg {transform:scale(1)}

.lbContent {position:absolute;top:0;bottom:0;left:0;right:0;z-index:1;color:#fff;}

.lbSlideText  {max-width:500px;margin-bottom:3rem;}

.lbTitle {text-transform:uppercase;font-weight:500;font-size:1.15rem;}

.lbpName {text-transform:lowercase;font-size:3rem;font-weight:100;}

.listingBanner .lbSlideText {text-align:right;}



.pageTitle {text-transform:lowercase;font-weight:400;font-size:1.9rem;}

.projListTitle .pageTitle {top:-3.5rem;position:relative;z-index:1;pointer-events:none;}



@media (max-width:575.98px) {

.lbTitle {font-size:.9rem}

.lbpName {font-size:2rem}

.pageTitle {font-size:1.2rem;}

}



.projSearchBox {background:var(--lgrayColor);position:relative}

.projSearch {width:100px;height:35px;transition:all .5s ease;background:inherit;border:1px solid var(--lgrayColor);box-shadow:unset;outline:unset;padding-right:30px;}

.projSearchBtn {width:30px;height:35px;line-height:0;padding:0;background:var(--lgrayColor);color:#bbb;border:1px solid transparent;position:absolute;top:0;right:0;pointer-events:none;}

.projSearch:focus {width:300px;max-width:100% !important;box-shadow:unset;outline:unset;border-bottom:1px solid #000;}

.projSearch:focus + .projSearchBtn {opacity:1;pointer-events:all;color:#000;}



.filterItem {height:100%;}

.filtHead {font-size:1rem;font-weight:500;text-transform:uppercase;margin-bottom:-2px;display:block;position:relative;background:var(--lgrayColor);}



.filtersList {margin-top:-1px;}

.filtersList > li {position:relative;padding:.2rem 1rem;}

.filtRadio {width:0;height:0;opacity:0;position:absolute;}

.filtLabel {cursor:pointer;color:#000;font-size:1rem;}



.filtRadio:checked + .filtLabel {font-weight:500;color:var(--yellowColor);}



@media (max-width:991.99px) {

.filterItem {border:1px solid #ddd;}

.filtHead {padding:.5rem 1rem;margin-bottom:0}

.filtHead[aria-expanded="true"] {z-index:99;}

.filtHead:after {content:'';width:.6rem;height:.6rem;display:block;position:absolute;top:0;bottom:0;right:1rem;margin:auto;transition:all .5s ease;border-width:1px 1px 0 0;border-style:solid;border-color:#333;z-index:0;}

.filtHead[aria-expanded="false"]:after {transform:rotate(45deg)}

.filtHead[aria-expanded="true"]:after {transform:rotate(135deg)}

.filtContent {position:relative}

.filtContent > div {position:absolute;top:0;left:0;background:var(--lgrayColor);z-index:99999;box-shadow:0 10px 50px rgba(0,0,0,.9);padding:0 .75rem;}

.filtersList {padding:.5rem 0;}

}



@media (min-width:992px) {

.filtHead {pointer-events:none;display:inline-block;border-bottom:3px solid #000;}

.filtContent {border-top:1px solid #000;border-bottom:1px solid #000;}

.filtersList > li {padding:.6rem 0;margin-bottom:-1px;}

.filtHead {font-size:1.5rem;}

.filtContent .collapsing {transition:unset;height:100%;}

}



@media (min-width:1400px) {

.filtContent {padding-left:120px}

.filtLabel {font-size:1.1rem}

}


.projectList .projectItem {width:100%;aspect-ratio:3/2;position:relative;overflow:hidden;display:flex;align-items:end;justify-content:start;background:#eee;}

.projectList .projectItem:before {content:'';width:100%;height:100%;display:block;position:absolute;top:0;left:0;background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(48,27,4,.8) 100%);z-index:1;opacity:0;transition:all 1s ease;}



.projectList .projectItem .pjiImg {width:130%;height:100%;display:block;position:absolute;top:0;left:0;object-fit:cover;object-position:center;transition:all 3s ease;z-index:0}

.projectList .projectItem .pjiDetails {max-width:500px;height:auto;padding:2rem;position:relative;opacity:0;filter:blur(20px);left:-100px;transition:all 1s ease;}

.projectList .projectItem .pjiName {font-size:1.5rem;font-weight:500;text-transform:lowercase}

.projectList .projectItem .pjiDetails p {font-size:.9rem;font-weight:300;margin-bottom:1rem}



.projectList .projectItem:hover:before {opacity:1;}

.projectList .projectItem:hover .pjiImg {left:-30%;transition:left 10s linear;}

.projectList .projectItem:hover .pjiDetails {opacity:1;filter:blur(0px);left:0;transition-delay:.3s; z-index: 1;}



@media (max-width:575.98px) {

.projectList .projectItem .pjiDetails {padding:1rem}

}



.page-link, .page-link:hover, .page-link:focus {border:0;background:transparent;color:#000; height:2rem;text-align:center;line-height:2;box-shadow:unset;}

.active .page-link {font-weight:500;background:transparent;color:#000;border-color:var(--goldColor);}

.disabled .page-link {background:transparent;border:0;}

.page-item:first-child .page-link, .page-item:last-child .page-link {font-weight:500;}



.breadcrumb-item, .breadcrumb-item:hover {color:#999;}

.breadcrumb-item.active {color:#000;font-weight:500}

.breadcrumb-item+.breadcrumb-item::before {color:#999;}



.projectBanner {position:relative;aspect-ratio:3/1;min-height:300px;background:linear-gradient(0deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,0) 60% 100%);}

.projectBanner .projBanImg {width:100%;height:100%;display:block;position:absolute;object-fit:cover;object-position:center;z-index:-1;}



.projinfoBox {background:var(--grayColor);padding:2rem;min-width:450px;}

.pitItem {border-bottom:1px solid rgba(255, 255, 255, 0.3);display:flex;flex-wrap:nowrap;padding:.7rem 0;}

.pitItem:last-child {border-bottom:0;padding-bottom:0}

.pitHead {font-weight:600;width:110px;}



.projectContent h2 {font-size:2.3rem}



.sectionGray {background:#e6e0d8}

.projGallery {margin:0 -15px;}

.pgItem {float:left;overflow:hidden;padding:15px; box-sizing: border-box;}



.pgBox {width:100%;height:100%;position:relative;background:#301c06;overflow:hidden;}

/* .pgImg {width:110%;height:100%;object-fit:cover;object-position:center;left:0;position:relative;transition:left 1s linear;cursor: pointer;} */


.pgImg {width:120%;height:110%;object-fit:cover;object-position:center;position:relative; transform: translateX(0);
  transition: transform 5s linear; will-change: transform; display:block; cursor: pointer;}

.pgImgText {width:100%;height:100%;position:absolute;top:0;left:0;background: rgba(48,28,6,.6);display:flex;justify-content:center;align-items:center;opacity:0;transition:all .3s ease;pointer-events:none;}

.pgImgCaption {font-weight:500;width:80%;max-width:600px;text-align:center;color:#fff;transform:scale(.8) translateY(50px);transition:all .5s ease;filter:blur(20px);}

.pgImgCaption:before {content:'';width:1.3rem;height:1.3rem;display:block;margin:0 auto .5rem;background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 16 16'><path d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/></svg>");}

/* .pgBox:hover .pgImg {transform: translateX(-10%);} */

/* .pgBox:hover .pgImg {left:-10%;transition:left 5s linear;} */


.pgBox:hover .pgImgText {opacity:1}

.pgBox:hover .pgImgCaption {transform:scale(1) translateY(0);filter:blur(0);transition-delay:.3s;}



@media (min-width:992px) {

.pgItem:nth-child(5n+1) {width:30%;aspect-ratio:1/1.555;}

.pgItem:nth-child(5n+4) {width:30%;aspect-ratio: 1/ 0.777;}

.pgItem:nth-child(5n+2), .pgItem:nth-child(5n+3), .pgItem:nth-child(5n+5) {width:70%;aspect-ratio:3/1;}

}



.bmImg {width:100%;aspect-ratio:1;object-fit:cover;object-position:top center;}



.awardItem {padding:0;}

.awardItem:hover {z-index:100;}



.awardBox {border:.75rem solid var(--lgrayColor);transform:scale(1);transition:all .5s ease;box-shadow:0 0 0 rgba(0,0,0,0)}

.awardInfo {position:relative;min-height:310px;background:linear-gradient(180deg, rgba(0,0,0,.65) 0%, rgba(0,0,0,.1) 80%);margin-bottom:.3rem;overflow:hidden;}

.awardImg {width:100%;height:100%;position:absolute;top:0;left:0;object-fit:cover;object-position:center;z-index:-1}

.awardDetail {padding:1rem;}

.awardName {font-family:'Poppins',sans-serif; /*font-family:'DM Serif Display',serif;*/ font-size:1.8rem;color:#fff;text-transform:uppercase;}

.awardYear {color:var(--yellowColor);font-weight:500;}

.awardYear:after {content:'';width:20px;height:1px;display:block;background:#fff;}

.awardProject {background:var(--lgrayColor);}



@media (min-width:992px) {

.awardBox:hover {box-shadow:0 50px 100px rgba(0,0,0,.6);transform:scale(1.1);}

}



@media (min-width:1600px) {

.awardList > * {flex:0 0 auto;width:20%;}

.awardItem:nth-child(n+11) {display:none}

.awardItem:nth-child(5n+1) {transition-delay:.1s}

.awardItem:nth-child(5n+2) {transition-delay:.2s}

.awardItem:nth-child(5n+3) {transition-delay:.3s}

.awardItem:nth-child(5n+4) {transition-delay:.4s}

.awardItem:nth-child(5n+5) {transition-delay:.5s}

}

@media (min-width:1400px) and (max-width:1599.98px) {

.awardItem:nth-child(n+9) {display:none}

.awardItem:nth-child(4n+1) {transition-delay:.1s}

.awardItem:nth-child(4n+2) {transition-delay:.2s}

.awardItem:nth-child(4n+3) {transition-delay:.3s}

.awardItem:nth-child(4n+4) {transition-delay:.4s}

}

@media (min-width:768px) and (max-width:1399.98px) {

.awardItem:nth-child(n+10) {display:none}

.awardItem:nth-child(3n+1) {transition-delay:.1s}

.awardItem:nth-child(3n+2) {transition-delay:.2s}

.awardItem:nth-child(3n+3) {transition-delay:.3s}

}

@media (min-width:576px) and (max-width:767.98px) {

.awardItem:nth-child(n+9) {display:none}

.awardItem:nth-child(2n+1) {transition-delay:.1s}

.awardItem:nth-child(2n+2) {transition-delay:.2s}

}

@media (max-width:575.98px) {

.awardItem:nth-child(n+9) {display:none}

.awardName {font-size:1.5rem}

}



.workTabsWrap {max-width:850px;width:100%;text-transform:uppercase;text-align:center;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;}

.workTabsWrap::-webkit-scrollbar {display:none}

.workTabs {margin:auto;text-align:center;white-space:nowrap;}

.wtsItem {color:#aaa;border:0;background:transparent;padding:0 20px;white-space:nowrap;position:relative;display:inline-block;line-height:2;}

.wtsItem.active {color:#000;font-weight:400;}

.wtsItem:after {content:'';width:0%;height:3px;background:var(--yellowColor);display:block;position:absolute;bottom:0;left:0;right:0;margin:auto;transition:all .3s ease;}

.wtsItem.active:after {width:60%;}

@media (max-width:575.98px) {

.wtsItem {font-size:.85rem;}

}



.clientsList {width:100%;max-width:1400px;margin: auto;}

.clientsList img {width: 100%;max-width:200px;aspect-ratio:3/1.5;margin:0 auto 2rem;padding:.5rem;object-fit: contain;object-position:center;filter: grayscale(100%) contrast(50%);transition: all .3s ease;}

.clientsList img:hover {filter: grayscale(0) contrast(100%);}



.globalReach:before {content:'';width:100%;height:100%;display:block;background: url(../images/worldBg.svg) center no-repeat;background-size:contain;position:absolute;top:0;left:0;z-index:-1;}

.counter .count {font-size:3rem;margin-bottom:0px;font-weight: 600;line-height: 1;}

.counter hr {margin: 0.7rem 0 !important;opacity: 1;}

.countText {font-weight: 300;line-height:1.6;color:#000}

.globalLocations {column-count: 3;column-gap: 50px;}

.globalLocations li {font-size: 0.9rem;font-weight: 500;margin-bottom: 10px;}



@media ((min-width: 1200px) or (max-width: 567px)) {

.globalLocations {column-count:2;column-gap: 50px;}

}

@media (max-width: 992px) {

.globalReach {background-size:100%;}

}

@media (max-width: 576px) {

.counter .count {font-size:2.5rem}

}



.masonaryGrid {display: flex;flex-flow: row wrap;width: 100%;gap:25px;}

.mediaBox {width:calc(100% - 25px);flex:auto;overflow:hidden;position:relative;background:#ccc;aspect-ratio:1}

.mediaInner {top:10%;}



.mediaImg {width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1);transition:all 1s linear;position:absolute;}

.mediaBox:hover .mediaImg {transform: scale(1.3);transition-duration:5s;}



.mediaInner {position:absolute;left:0;width:80%;max-width:400px;padding:1.3rem;background:rgba(255,255,255,.98);}

.mediaInner > .animateThis {transition-delay:.5s;}

.mediaLogo {width:130px;aspect-ratio:2/1;object-fit:contain;}

.mediaText {color: #000;font-weight: 400;line-height:1.5;margin-bottom: 0px;}

.mediaInfo {color: #777;font-size: 0.9rem;font-weight: 400;}

.mediaInfo > span + span {border-left: solid 1px #777;}



@media (min-width:992px) {

.mediaBox {width:calc(50% - 25px);aspect-ratio:1.5/1}

.mediaBox:nth-child(6n+1), .mediaBox:nth-child(6n+6) {width:calc(40% - 25px);aspect-ratio:1}

.mediaBox:nth-child(6n+2), .mediaBox:nth-child(6n+5) {width:calc(60% - 25px);aspect-ratio:2/1}

.mediaBox:nth-child(odd) .mediaInner {top:10%;}

.mediaBox:nth-child(even) .mediaInner {bottom:10%;top:unset;}

}



.locationBlock {border-top: solid 1px #000;}

.locationInfo div:not(:last-child) {margin-bottom:20px;}

.locationBlock a:hover {color:var(--yellowColor);}

.fw-500 {font-weight: 500;}



/* .contactForm .form-control {background-color: transparent;  padding: 1rem;  border-radius: 0px;  border-color: #000;}

.contactForm .form-control:focus {color: #000;  background-color: #fffa;} */



.careerSection {background:center #2D1A07;background-size:cover;z-index:1;}

.careerSection:before {content:'';background: rgba(45,26,7,.68);width:100%;height:100%;position:absolute;top:0;left:0;z-index:-1;}



.vacancyList li:not(:first-child) {border-top:1px solid #ccc;}

.vacancyHead {width:100%;background:transparent;border:0;text-align:left;font-size:1.5rem;font-weight:500;padding:1rem 4rem 1rem 1rem;position:relative;transition:all .3s ease;}

.vacancyHead:hover {background:var(--goldColor);color:#fff;}

.vacancyHead:after {content:"";width:2.5rem;height:2.5rem;border:0;border-radius:50%;display:block;position:absolute;right:1rem;top:0;bottom:0;margin:auto;transition:all .3s ease;

  background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23000000' viewBox='0 0 16 16'><path d='M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8z'/></svg>") no-repeat center #E8E8E8;background-size:2rem 2rem;}



.applyPopup .modal-title {font-size:1.5rem;}

.applyPopup .modal-header {background:var(--grayColor);color:#fff;}

.applyPopup .btn-close {background-color:#fff;}

.applyPopup .form-control {line-height:35px}



.briefContent h3 {/*font-family:'Urbanist',sans-serif;*/ font-family:'Poppins',sans-serif; font-size:2rem;font-weight:500;color:#000;margin-bottom:1rem;}

.briefContent p {margin-bottom:1.3rem;}

.briefContent ul li {margin-left:1rem;list-style:disc;margin-bottom:1.3rem;}

.briefContent ul.number li {list-style:decimal;}

.briefContent ul.alpha li {list-style:lower-alpha;}

.briefContent ul.roman li {list-style:lower-roman;}

.briefContent ul > li::marker {font-weight:500;}

.projectSwiper {
  overflow: visible !important;
}
.swiper-wrapper {
  will-change: transform;
}

.page-id-54 .lb-prev, .lb-next {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10001; 
}

@media (max-width: 768px) {
  .page-id-54 .lb-prev,
  .lb-next {
    top: auto;
    bottom: 20px;
    transform: none;
  }
}

.page-id-54 .lb-data .lb-close {
  background: unset;
}

.newbox {display: none;}

.footLogo {width: 300px; height: 100%;}

.page-template-careers .wpcf7 form.sent .wpcf7-response-output,
.page-template-careers .wpcf7 form.invalid .wpcf7-response-output,
.page-template-careers .wpcf7 form.unaccepted .wpcf7-response-output,
.page-template-careers .wpcf7 form.payment-required .wpcf7-response-output {
  color: #000!important;
  border-color: #000!important;
}


/* Popup css */

.popup-wrapper {
  background-color: #2e1a00; /* dark brown background */
  border: none;
  position: relative;
}

.popup-close {
  position: absolute;
  top: 15px;
  right: 15px;
  z-index: 10;
  padding: 0.5em;
  border: none;
  background: transparent url('../images/close-outline.svg') center / contain no-repeat;
  width: 35px;
  height: 35px;
  cursor: pointer;
}


.popup-form {
  background-color: #2e1a00;
  color: #fff;
}

.popup-input {
  padding: 0.5rem!important;
}

.popup-input:focus {
  box-shadow: none;
  border-color: #f1c15d; /* goldish accent */
}

.popup-btn {
  background-color: #f1c15d;
  border: none;
  color: #000;
  font-weight: 600;
  border-radius: 0;
  padding: 10px 25px;
}

@media (max-width: 991px) {
  .popup-form {
    padding: 2rem 1.5rem !important;
  }
}

.popupForm p {margin-bottom: 0; }

.phone-field-wrapper p{
  display: flex;
  align-items: center;
}

.phone-field-wrapper select,
.phone-field-wrapper input[type="tel"] {
  flex: 1;
  font-size: 16px;
  padding: 8px;
}

.phone-field-wrapper select {
  max-width: 90px;
   cursor: pointer;
}

.blogFilterText{font-weight: 500;}
.blogFilterResult{font-weight: 500;}
.blogFilterSelect{max-width: 180px;border-radius: 0;border-color: black;font-size: .95rem;font-weight: 500;border: 2px solid black;}
.blogimage-card{height: 100%;}
.blogimage-card img{height: 100%; width: 100%;object-fit: cover;display: block;}
.blogimage-card .image{aspect-ratio: 4 / 3; position: relative;}
.blogimage-card .image-tag{position: absolute;top: 0;left: 0;font-style: italic;color: #fff;background-color: rgba(49, 29, 6, 1);}
.blogimage-card .blog-title{font-weight: 600;}
.blogimage-card .blog-date{font-weight: 500;}
.blogimage-card .blog-desc{font-weight: 400;}

.detail-title{max-width: 700px;}
.detailimage{width: 100%;}
.detailimage img{height: auto; width: 100%;display: block;max-height: 500px;object-fit: cover;}
.relatedBtnBox{position: static;display: flex;}
.relatedBtnBox .swiperBtns{border-color: black;}
.relatedBtnBox .swiperBtns:hover{border-color: white;}
.relatedBtnBox .swiperBtns:after{background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23000000' viewBox='0 0 16 16'><path d='M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8z'/></svg>");}
.relatedBtnBox .swiperBtns:hover:after{background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 16 16'><path d='M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8z'/></svg>");}

.page-link, .page-link:hover, .page-link:focus {border:0;background:transparent;color:#000;border-left:1px solid var(--goldColor);padding:0 1rem;height:2rem;text-align:center;line-height:2;box-shadow:unset;}
/* Reset Bootstrap */
.pagination .page-link {
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #000;
}

/* Base item */
.pagination .page-item {
    position: relative;
    padding: 0 12px;
}

/* Divider BEFORE every item except first (Prev) */
.pagination .page-item:not(:first-child)::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 18px;
    width: 1px;
    background-color: #f4a300;
}

/* Active page */
.pagination .page-item.active .page-link {
    font-weight: 700;
}

/* Disabled (Prev) */
.pagination .page-item.disabled .page-link {
    color: #aaa;
}

.socialShareBox {
    display: flex;
    gap: 12px;
}

.shareIcon {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #111;
    transition: 0.3s ease;
}

.shareIcon svg {
    width: 15px;
    height: 15px;
    fill: #fff;
}

.shareIcon:hover {
    background: #2e1a00; 
    transform: translateY(-3px);
}

.viewMoreBtn {
    font-size: 14px;
    font-weight: 500;
    color: #000;
    text-decoration: none;
    position: relative;
    display: inline-block;
    transition: 0.3s ease;
}

/* underline animation */
.viewMoreBtn::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -4px;
    width: 0;
    height: 1px;
    background: #000;
    transition: width 0.3s ease;
}

.viewMoreBtn:hover::after {
    width: 100%;
}
.cta-buttons {
    display: flex;
    align-items: center;
    gap: 12px;
}

.col-12.d-flex {
    justify-content: space-between;
    align-items: center;
}

.author {
    margin: 0;
}
.cta-buttons {
    margin: 15px auto;
}
a.ctaBtnn {
    color: var(--goldColor);
    text-decoration: underline;
}

.col-12.d-flex {
    align-items: center; /* aligns both in same line vertically */
}

.blogFilterResult {
    margin: 0;           /* remove default spacing */
    padding: 0;          /* remove py-3 effect */
}

.socialShareBox {
    margin-top: 0;       /* remove mt-3 pushing it down */
    display: flex;
    align-items: center;
    gap: 10px;
}
.shareIcon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -20px;
}