/* Table of Content
==================================================
	#Font-Face
	#Site Styles
	#Media Queries */

/* #Font-Face
================================================== */
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');

/* #Site Styles
================================================== */

/* ### general ### */
html,
body { font-family: 'Quicksand', sans-serif; font-size: 17px; line-height: 1.5; color: #2d4747; }
body { background: #fff; }
img { display: block; max-width: 100%; border: 0; object-fit: cover; }
input::placeholder,
textarea::placeholder { color: rgba(45, 71, 71, 0.5) !important; }
:focus { outline: none; }
:root { scroll-behavior: unset; }
a { display: inline-block; text-decoration: none; }
ul,
li { margin: 0; padding: 0; list-style: none; }
h1,
h2,
h3,
h4,
h5,
h6 { font-weight: 700; line-height: 1.1; }
h1 { font-size: 22px; }
h2 { font-size: 25px; }
h3 { font-size: 22px; }
h4 { font-size: 18px; }
h5 { font-size: 17px; }

/* ### global classes ### */
.clear { visibility: hidden; clear: both; height: 0; line-height: 0; }
.container { max-width: 1190px; }
.container-xl { max-width: 1840px; }
.form-control { padding: 10px 18px; width: 100%; height: 45px; font-size: 16px; font-weight: 700; color: rgba(45, 71, 71, 0.5) !important; border: 1px solid #79bebd; border-radius: 0; background-color: #fff; }
.form-control:focus { outline: inherit; box-shadow: none; border: 1px solid #79bebd; }
.btn { padding: 12px 22px; display: inline-block; font-size: 16px; font-weight: 700; line-height: 1.1; text-align: center; text-transform: uppercase; border: 2px solid #79bebd; border-radius: 0; transition: all 0.3s; }
.btn-primary { color: #fff; background-color: #79bebd; }
.btn-primary:hover { border: 2px solid #609f9e; background-color: #609f9e; }
.btn-outline-primary { color: #2d4747; }
.btn-outline-primary:hover { color: #fff; border: 2px solid #79bebd; background-color: #79bebd; }
.menuBorder .container { border-top: 1px solid rgba(45, 71, 71, 0.17); padding-top: 57px;}

/* ### wrapper ### */
#wrapper { padding-top: 169px; position: relative; display: block; width: 100%; min-height: 100%; overflow: hidden; }

/* ### main container ### */
#mainCntr { width: 100%; }

/* ### header container ### */
#headerCntr { padding-top: 54px; padding-bottom: 41px; position: fixed; top: 0; left: 0; z-index: 9; width: 100%; background-color: #fff; transition: all 0.3s; }
#headerCntr.sticky { padding-top: 20px; padding-bottom: 15px; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16); }

/* ### menu box ### */
.menuBox { margin-top: 7px; }
.menuBox ul { text-align: right; }
.menuBox ul > li { margin-right: 26px; padding-top: 20px; padding-bottom: 20px; position: relative; display: inline-block; }
.menuBox ul > li:last-child { margin-right: 0; }
.menuBox ul > li:hover ul { opacity: 1; visibility: visible; }
.menuBox ul > li > a { font-size: 18px; font-weight: 500; color: #1d1d1d; transition: all 0.3s; }
.menuBox ul > li > a:hover { color: #79bebd; }
.menuBox ul > li > ul { position: absolute; top: 100%; left: -7px; opacity: 0; visibility: hidden; width: 175px; text-align: left; background-color: #fff; transition: all 0.3s; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); }
.menuBox ul > li > ul > li { margin-right: 0; padding: 11px 10px 11px 17px; display: block; border-bottom: 1px solid rgba(45, 71, 71, 0.17); }
.menuBox ul > li > ul > li:last-child { border-bottom: 0; }
.menuBox ul > li > ul > li > a { font-size: 16px; }
.menuBox ul > li > ul > li > ul { position: relative; top: 100%; margin: 12px 0 -10px; left: -18px; opacity: 0; visibility: hidden; width: 175px; text-align: left; background-color: transparent; transition: all 0.3s; box-shadow: none; }
.menuBox ul > li > ul > li > ul > li { margin-right: 0; padding: 11px 10px 11px 37px; display: block; border-bottom: 1px solid rgba(45, 71, 71, 0.17); }
.menuBox ul > li > ul > li > ul > li:first-child { border-top: 1px solid rgba(45, 71, 71, 0.17); }
.menuBox ul > li > ul > li > ul > li:last-child { border-bottom: 0; }
.menuBox ul > li > ul > li > ul > li a { font-size: 16px; }
.menuBox .subitems {display: none; color: #fff;}

/* ### hamburger ### */
.hamburger { position: absolute; top: 47px; right: 77px; z-index: 5; display: none; width: 40px; height: 32px; font-weight: 600; color: #000; transition: all 0.3s; }
.hamburger span { margin: 4px auto; position: absolute; top: 11px; left: 7px; display: block; width: 27px; height: 3px; background-color: #79bebd; transition: all 0.3s; }
.hamburger.active span { background: none; }
.hamburger span:before,
.hamburger span:after { position: absolute; display: block; width: 100%; height: 3px; border-radius: 10px; background-color: #79bebd; transition: all 0.3s; content: ''; }
.hamburger span:before { top: -7px; }
.hamburger span:after { bottom: -7px; }
.hamburger.active span:before { top: 0; width: 100%; transform: rotate(135deg); }
.hamburger.active span:after { bottom: 0; width: 100%; transform: rotate(-135deg); }

/* ### content container ### */
#contentCntr { width: 100%; }

/* ### banner box ### */
.bannerBox .slide img { width: 100%; border-radius: 5px; max-height: 882px; }
.bannerBox .content { margin-top: 74px; margin-bottom: 68px; margin-left: -98px; padding: 53px 15px 48px 57px; width: 100%; position: relative; z-index: 1; border-radius: 2px; background-color: #fff; }
.bannerBox h2 { margin-bottom: 10px; }
.bannerBox p { margin-bottom: 0; }
.bannerBox .image img { margin: 0 auto; height: 545px; }
.bannerBox .slick-arrow { position: absolute; top: 50%; z-index: 2; width: 42px; height: 42px; color: #fff; border: 2px solid #79bebd; background-color: transparent; transform: translateY(-50%); cursor: pointer; }
.bannerBox .slick-prev { left: 25px; }
.bannerBox .slick-next { right: 25px; }
.bannerBox .bannerText { display: none;}
.bannerBox .bannerTitle { display: none;}
.bannerBox .bannerTitle h2 { font-size: 40.5px}
/* ### content box ### */
.contentBox { margin-top: -113px; position: relative; z-index: 1; }
.contentBox .title { margin-bottom: 54px; margin-left: -30px; font-size: 218px; font-weight: 700; line-height: 1; white-space: nowrap; color: rgba(45, 71, 71, 0.1); }
.contentBox .content { padding-bottom: 41px; }
/*.contentBox .content { padding-bottom: 41px; border-bottom: 1px solid rgba(45, 71, 71, 0.17); }*/
.contentBox p { margin-bottom: 0; }
.contentBox .paragraph { font-weight: 500; }
.contentBox .paragraph.semi { font-weight: 600; }
.contentBox strong { margin-bottom: 28px; display: block; }

/* ### filter box ### */
.filterBox { margin-bottom: 74px; padding-top: 74px; }
.filterBox.menuBorder { margin-bottom: 188px; padding-top: 0;}
.filterBox.homeFilter {padding-top: 0;}
.filterBox .text { margin-bottom: 40px; max-width: 645px; }
.filterBox h1 { margin-bottom: 10px; }
.filterBox li { margin-right: 31px; position: relative; }
.filterBox li:after { position: absolute; top: 8px; right: -16px; width: 1px; height: 12px; background: rgba(45, 71, 71, 0.17); content: ''; }
.filterBox li:last-child { margin-right: 0; }
.filterBox li:last-child:after { display: none; }
.filterBox li .js-filter { padding: 0; font-size: 16px; font-weight: 500; color: #2d4747; border: 0; background-color: transparent; transition: all 0.3s; }
.filterBox li .js-filter.active,
.filterBox li .js-filter:hover { color: #79bebd; font-weight: bold }
.filterBox .filter-image { margin: 0 auto 19px; padding-top: 47px; max-width: 1690px; }
.filterBox .filter-image.project { margin: 0 auto 142px; padding-top: 47px; max-width: 1690px; }
.filterBox.menuBorder .filter-image.project {margin-bottom: 100px;}
.filterBox .image { margin-bottom: 30px; position: relative; border-radius: 2px; cursor: pointer; }
.filterBox .image.active .content,
.filterBox .image:hover .content,
.filterBox .image.active:before,
.filterBox .image:hover:before { opacity: 1; visibility: visible; }
.filterBox .image:before { position: absolute; top: 0; left: 0; opacity: 0; visibility: hidden; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(45, 71, 71, 0) 0%, rgba(45, 71, 71, 1) 100%); transition: all 0.3s; content: ''; }
.filterBox .image img { width: 100%; border-radius: 2px; }
.filterBox .big-image img {width: 831px; height: 882px; }
.filterBox .hide { display: none; }
.filterBox .content { position: absolute; bottom: 44px; left: 42px; z-index: 1; opacity: 0; visibility: hidden; transition: all 0.3s; }
.filterBox .news-grid .content { position: relative; visibility: visible; opacity: 1; bottom: 0; left: 0; }
.filterBox .news-grid .content h3 { color: #2d4747 }
.filterBox .news-grid .content p { color: #2d4747 }
.filterBox .news-grid .content a { color: #79bebd; font-weight: 400; width: 100%;}
.filterBox .news-grid a {  width: 100%;}
.filterBox h3 { margin-bottom: 2px; color: #fff; }
.filterBox .content p { margin-bottom: 0; font-size: 16px; color: #fff; width: 90%; }
.filterBox .filter-image .projects {display: flex; gap: 30px;}
.filterBox .filter-image .projects .margin-image {margin-top: -372px;}
.filterBox .project-section .big-image img { width: 831px; height: 882px;}
.filterBox .image img {height: 510px;}
.filterBox .mobile-container { display: none;}
/*.filterBox .projects {display: flex; flex-direction: row; width: 100%; justify-content: space-between;}*/
/*.filterBox .projects .image img {width: 400px; height: 510px;}*/
/*.filterBox .projects .image-1 img,*/
/*.filterBox .projects .image-6 img {height: 882px; width: 831px}*/

/* ### info box ### */
.infoBox { margin-bottom: 162px; }
.infoBox .row { padding-top: 0;}
.infoBox .content { padding-top: 3px; max-width: 427px; }
.infoBox .button { margin-bottom: 133px; }
.infoBox h3 { margin-bottom: 10px; }
.infoBox p { margin-bottom: 28px; }
.infoBox h5 { margin-bottom: 8px; color: #79bebd; }
.infoBox .image { margin-bottom: 30px; }
.infoBox .image img { margin-left: auto; width: 640px; height: 533px; }
.infoBox ul { margin-bottom: 25px; }
.infoBox li { display: flex; }
.infoBox li span { width: 100px; }

/* ### blog box ### */
.blogBox { margin-bottom: 70px; }
.blogBox .head { margin-bottom: 28px; }
.blogBox h3 { margin-bottom: 0; }
.blogBox .holder { padding-bottom: 71px; }
/*.blogBox .holder { padding-bottom: 71px; border-bottom: 1px solid rgba(45, 71, 71, 0.17); }*/
.blogBox .box { position: relative; cursor: pointer; border-radius: 2px; }
.blogBox .box.active .content,
.blogBox .box:hover .content,
.blogBox .box.active:before,
.blogBox .box:hover:before { opacity: 1; visibility: visible; }
.blogBox .box:before { position: absolute; top: 0; left: 0; opacity: 0; visibility: hidden; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(45, 71, 71, 0) 0%, rgba(45, 71, 71, 1) 100%); transition: all 0.3s; content: ''; }
.blogBox .content { position: absolute; bottom: 17px; left: 20px; z-index: 1; opacity: 0; visibility: hidden; transition: all 0.3s; width: 90%; }
.blogBox h4 { margin-bottom: 4px; color: #fff; }
.blogBox p { margin-bottom: 0; font-size: 14px; color: #fff; }
.blogBox .box img { width: 100%; height: 377px; border-radius: 2px; }
.blogBox .holder a {width: 100%;}


/* ### over box ### */
.overBox { margin-bottom: 107px; }
.overBox .content { padding-top: 93px; }
.overBox .count { padding-left: 16px; }
.overBox .count li { list-style: auto; }
.overBox ul { margin-bottom: 16px; }
.overBox li { position: relative; }
.overBox .dot-balls li { padding-left: 16px; }
.overBox .dot-balls li:before { position: absolute; top: 10px; left: 0; width: 6px; height: 6px; border-radius: 50%; background-color: #79bebd; content: ''; }
.overBox .image img { margin-left: auto; border-radius: 2px; width: 640px; height: 553px;}
.overBox p { margin-bottom: 26px; }
.overBox p:last-child { margin-bottom: 0; }
.overBox.inner .image img { margin-left: 0; }
.overBox.inner .content { margin-left: auto; max-width: 430px; }

/* ### contact box ### */
.contactBox { margin-bottom: 100px; }
.contactBox .content { margin-bottom: 31px; }
.contactBox p { margin-bottom: 0; }
.contactBox .form { max-width: 557px; }
.contactBox .form-group { margin-bottom: 18px; }
.contactBox .image { margin-top: -52px; margin-right: -152px; }
.contactBox .image img { margin-left: auto;max-height: 660px;max-width: 976px; }
.contactBox textarea { min-height: 224px; }

/* ### person box ### */
.personBox p { margin-bottom: 27px; }
.personBox .image { margin-right: -138px; }
.personBox .image img { margin-left: auto; }

/* ### footer container ### */
#footerCntr { width: 100%; }

/* ### footer box ### */
.footerBox { padding-top: 111px; padding-bottom: 104px; background-color: #2d4747; }
.footerBox .logo { margin-bottom: 49px; display: inline-block; }
.footerBox .title { margin-bottom: 6px; font-weight: 700; color: #fff; }
.footerBox p { margin-bottom: 14px; font-size: 15px; color: #fff; }
.footerBox li { margin-bottom: 5px; }
.footerBox li:last-child { margin-bottom: 0; }
.footerBox li a { font-size: 15px; color: #fff; transition: all 0.3s; }
.footerBox li a:hover { color: #79bebd; }
.footerBox li .icon { display: inline-block; width: 24px; }
.footerBox li .icon-mail { font-size: 17px; vertical-align: middle; }
.footerBox .navigation { padding-left: 83px; }
.footerBox .navigation li { margin-bottom: 5px; }
.footerBox .navigation li:last-child { margin-bottom: 0; }

/* #Media Queries
================================================== */

@media only screen and (max-width: 1500px) {
	.bannerBox p span { display: none; }
	.bannerBox .content { margin-top: 50px; margin-bottom: 40px; margin-left: -100px; padding: 30px 15px 30px 40px; }
	.filterBox .content { bottom: 25px; left: 20px; }
}

@media only screen and (max-width: 1199px) {
	.container { padding-right: 40px; padding-left: 40px; }
	.container-xl { padding-right: 20px; padding-left: 20px; }
	.bannerBox .content { margin-top: 25px; margin-bottom: 20px; margin-left: -100px; }
	.bannerBox p { font-size: 16px; }
	.contentBox { margin-top: -80px; }
	.contentBox .title { font-size: 150px; }
	.contentBox p { margin-bottom: 28px; }
	.filterBox h3 { font-size: 17px; }
	.filterBox .content p { font-size: 12px; }
	.filterBox .content { bottom: 20px; }
	.infoBox { margin-bottom: 50px; }
	.overBox .content { padding-top: 40px; }
	.personBox .image { margin-right: 0; }
}

@media only screen and (min-width: 992px) {
	.menuBox ul > li > ul { display: block !important; }
}

@media only screen and (max-width: 991px) {
	h1 { font-size: 21px; }
	h2 { font-size: 21px; }
	h3 { font-size: 21px; }
	#wrapper { padding-top: 121px; }
	body { font-size: 15px; }
	.btn { font-size: 15px; }
	.container { padding-right: 78px; padding-left: 78px; }
	#headerCntr { padding-top: 49px; padding-bottom: 29px; }
	#headerCntr.sticky { padding-bottom: 20px; }
	#headerCntr.sticky .hamburger { top: 20px; }
	#headerCntr .logo img { max-width: 236px; }
	.menuBox { margin-top: 0; padding: 49px 82px; position: absolute; top: 0; left: 0; opacity: 0; visibility: hidden; width: 100%; height: 100vh; background-color: #2d4747; transition: all 0.3s; overflow-y: scroll; }
	.menuBox.active { opacity: 1; visibility: visible; }
	.menuBox ul { margin-bottom: 15px; padding-top: 36px; padding-bottom: 15px; max-width: 287px; text-align: left; border-bottom: 1px solid rgba(121, 190, 189, 0.24); }
	.menuBox ul > li { margin-right: 0; padding-top: 7px; padding-bottom: 7px; display: block; }
	.menuBox ul > li > a { font-size: 20px; color: #fff; }
	.menuBox ul > li > a.dropdown { position: relative; }
	/*.menuBox ul > li > .arrow-down:before { position: relative; top: 2px; right: -25px; font-family: 'icomoon', sans-serif; color: #fff; font-size: 18px; content: '\e900'; transform: rotate(-90deg); }*/
	.menuBox ul > li > ul { margin-bottom: 0; padding-top: 0; padding-bottom: 0; position: unset; top: auto; left: auto; display: none; width: 100%; border-bottom: 0; background-color: transparent; transition: unset; box-shadow: none; }
	.menuBox ul > li > ul > li { padding: 10px 10px 0; border-bottom: 0; }
    .menuBox .subitems {display: inline-block; color: #fff; font-size: 18px; margin-left: 10px;}
	.menuBox .info { margin-bottom: 0; padding-top: 0; padding-bottom: 0; border-bottom: 0; }
	.menuBox .info li { padding-top: 5px; padding-bottom: 5px; }
	.menuBox .info li a { font-size: 16px; font-weight: 400; }
	.menuBox .info .icon { display: inline-block; width: 24px; }
	.menuBox .info .icon-mail { font-size: 18px; vertical-align: middle; }
	.hamburger { display: block; }
	.bannerBox .content { margin-top: 13px; margin-bottom: 0; margin-left: -160px; }
	.bannerBox p { font-size: 15px; }
	.bannerBox .slick-arrow { top: 54%; width: 29px; height: 29px; font-size: 15px; }
	.bannerBox .slide img { min-height: 370px; object-fit: cover; }
	.contentBox { margin-top: -60px; }
	.contentBox p { font-size: 15px; }
	.contentBox .title { margin-bottom: 39px; font-size: 93px; }
	.filterBox { margin-bottom: 43px; }
    .filterBox.menuBorder {margin-bottom: 80px;}
    .filterBox .filter-image { margin: 0 auto 81px; }
    .filterBox .project-section .big-image img { /*width: 347px; */height: 369px;}
    .filterBox .image img {height: 211px;}
    .filterBox.menuBorder .filter-image.project { margin-bottom: 25px;}
	.infoBox .row { padding-top: 56px; }
	.infoBox .button { margin-bottom: 60px; }
    .infoBox .image img { margin-left: auto; width: 100%; height: 245px; }
	.blogBox .holder { padding-bottom: 59px; }
	.blogBox h4 { font-size: 16px; }
	.blogBox p { font-size: 14px; }
    .blogBox .box img { width: 100%; height: 211px; border-radius: 2px; }
	.overBox { margin-bottom: 70px; }
	.overBox .content { padding-top: 0; }
	.overBox .image img { width: 320px; height: 320px; object-fit: cover; }
	.contactBox .image { margin-top: 0; margin-right: -40px; }
	.personBox .image { margin-right: -50px; }
	.personBox .content { padding-bottom: 40px; }
	.footerBox { padding-top: 56px; padding-bottom: 55px; }
	.footerBox .logo { margin-bottom: 23px; }
	.footerBox .logo img { max-width: 214px; }
	.footerBox .navigation { padding-left: 70px; }
}

@media only screen and (max-width: 767px) {
	#wrapper { padding-top: 92px; }
	.container { padding-right: 37px; padding-left: 37px; }
	.form-control { height: 40px; font-size: 14px; }
	#headerCntr { padding-top: 35px; padding-bottom: 18px; }
	#headerCntr.sticky { padding-top: 35px; padding-bottom: 18px; }
	#headerCntr.sticky .hamburger { top: 30px; }
	#headerCntr .logo img { max-width: 212px; }
	.menuBox { padding: 35px 37px; }
	.menuBox img { max-width: 212px; }
	.menuBox ul { max-width: 100%; }
	.menuBox ul > li > a { font-size: 18px; }
	.menuBox ul > li > ul > li > a { font-size: 14px; }
	.menuBox .info li a { font-size: 14px; }
	.hamburger { top: 30px; right: 28px; }
	.hamburger span { width: 24px; }
	.hamburger span:before { top: -6px; }
	.hamburger span:after { bottom: -6px; }
	.bannerBox .row { margin-right: -33px; margin-left: -33px; width: calc(100% + 66px); }
	.bannerBox .image { margin-top: -120px; position: relative; z-index: 1; }
	.bannerBox .slick-arrow { top: 50%; }
	.bannerBox .slide img { min-height: 500px; height: 552px; border-radius: 0; }
    .bannerBox .bannerTitle { top: 470px;z-index: 2;width: 100%;position: absolute;display: block;}
    .bannerBox .bannerText {display: block;}
    .bannerBox .bannerText .content{margin-left:0; padding-top: 0;}
	.filterBox { margin-bottom: 35px; padding-top: 15px; }
	.filterBox.menuBorder { margin-bottom: 67px; padding-top: 15px; }
	.filterBox.project { margin-bottom: 67px; padding-top: 15px; }
    .filterBox .filter-image.project {margin-bottom: 0;}
    .filterBox.menuBorder .filter-image.project {margin-bottom: 40px;}
	.filterBox .image img { min-height: 380px; }
	.filterBox li { margin-right: 0; margin-bottom: 5px; }
	.filterBox li .js-filter { font-size: 14px; }
	.filterBox li:after { display: none; }
	.filterBox .filter-image { margin: 0 auto 6px; padding-top: 37px; }
    .filterBox .filter-image .projects { flex-direction: column;}
    .filterBox .filter-image .projects { flex-direction: column;}
    .filterBox .filter-image .projects .margin-image {margin-top: 0;}
    .filterBox .project-section .big-image img { /*width: 322px; */height: 379px;}
    .filterBox .image { margin-bottom: 0; }
    .filterBox .image img {height: 379px; width: 835px;}
    .filterBox .mobile-container { display: block; padding: 35px 0}
	.infoBox { margin-bottom: 35px; }
	.infoBox .row { padding-top: 45px; padding-bottom: 30px; border-bottom: 1px solid rgba(45, 71, 71, 0.17); }
	.infoBox h3 { font-size: 18px; }
	.infoBox .image { margin: 0 -15px 30px; width: calc(100% + 30px); }
    .infoBox .image img { margin-left: auto; width: 100%; height: 379px; }
	.blogBox { margin-bottom: 46px; }
	.blogBox .box { margin: 0 -15px 30px; width: calc(100% + 30px); }
	.blogBox h3 { font-size: 18px; }
	.blogBox .holder { padding-bottom: 31px; }
    .blogBox .box img { width: 100%; height: 379px; border-radius: 2px; }
	.overBox { margin-bottom: 50px; }
	.overBox .content { margin-bottom: 20px; }
	.overBox.inner .content { max-width: 100%; }
	.overBox .image { margin: 0 -15px; width: calc(100% + 30px); }
	.overBox .image img { width: 100%; height: 380px; }
	.overBox h3 { font-size: 18px; }
	.contactBox { margin-bottom: 50px; }
	.contactBox .row:last-child { padding-bottom: 60px; border-bottom: 1px solid rgba(45, 71, 71, 0.17); }
	.contactBox .form { margin-bottom: 60px; max-width: 100%; }
	.contactBox .image { margin-right: -50px; }
	.contactBox .image img { width: 100%; }
	.contactBox .form-group { margin-bottom: 10px; }
	.personBox .content { padding-bottom: 40px; }
	.personBox .image { margin-right: 0; }
	.personBox .image img { margin: 0 auto; }
	.footerBox .navigation { padding-top: 35px; padding-left: 0; }
	.footerBox p { font-size: 14px; }
	.footerBox li a { font-size: 14px; }
	.footerBox .title { font-size: 16px; }
}
