/*** PROJECTS ***/
.project-header{height: calc(100vh - 22px); background-size: cover; background-repeat: no-repeat; background-position: center; margin-top: -100px; padding-top: 100px; position: relative;}
.project-header:before{content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.55); z-index: 0;}
.project-header .project-header-content{z-index: 2; position: relative;}
.project-header .project-header-content img.project-logo{width: 100%; height: auto; max-width: 430px;}
.project-header .project-header-content .project-title{color: #fff; position: relative; margin: 0 0 55px 0; padding: 0 0 45px 0; max-width: 525px; width: 100%;}
.project-header .project-header-content .project-title:after{content: ""; position: absolute; width: 90px; height: 1px; top: 100%; left: 0; background-color: #008faf;}
.project-header .project-header-content p{color: #fff; margin: 0; /*padding: 120px 0 0 0;*/ padding: 0; line-height: 1.8; font-size: 20px; font-weight: 300; position: relative; max-width: 525px; width: 100%;}
.project-header .project-header-content .arrow-down{position: absolute; top: calc(100% + 75px); left: 0; width: 1px; height: 125px; background: #fff;}
.project-header .project-header-content .arrow-down:after{content: ""; position: absolute; top: calc(100% - 2px); left: -4px; border: solid #fff; border-width: 0 1px 1px 0; display: inline-block; padding: 4px; transform: rotate(45deg) translate(-50%, -50%); -webkit-transform: rotate(45deg) translate(-50%, -50%);}
.project-header .project-header-content .arrow-down:hover{top: calc(100% + 100px);}
.project-header.new .project-header-content .project-title{margin: 0 0 25px 0; padding: 0 0 25px 0;}
.project-header.new .project-header-content .project-title,
.project-header.new .project-header-content p{max-width: 900px;}
/*
.project-header .project-header-content p:before{content: ""; width: 90px; height: 1px; background: #00addf; position: absolute; left: 0; top: 60px;}
*/
.project-header.fixed-height{min-height: 800px;}

.project-details{overflow: hidden; position: relative;}
.project-details:before{content: ""; position: absolute; top: 50%; left: 0; right: unset; bottom: unset; transform: translate(-40%, -50%); width: 800px; height: 800px; background-image: url("../images/Ellipse 149@2x.png"); background-repeat: no-repeat; background-position: center; background-size: cover; z-index: 1;}
.project-details:after{content: ""; position: absolute; top: unset; left: unset; right: 0; bottom: 0; transform: translate(35%, 35%); width: 800px; height: 800px; background-image: url("../images/Ellipse 149@2x.png"); background-repeat: no-repeat; background-position: center; background-size: cover; z-index: 1;}
.project-details .image-vetrilo{width: 100%; height: auto; display: block; float: left; margin-top: 40px; margin-right: 0; margin-bottom: 0; margin-left: 50%; transform: translate(-50%, 0); z-index: 2; position: relative;}

.project-info{border-radius: 0 0 25px 25px; background-color: #0d141c; padding: 60px 130px; z-index: 3; position: relative;}
.project-info .label{margin: 0 0 12px 0; font-weight: 500; text-transform: uppercase; font-size: 12px; color: #00addf; line-height: 1;}
.project-info .data{margin: 0 0 40px 0; color: #929599; font-size: 18px; font-weight: 300; line-height: 1;}
.project-info .data:only-of-type,
.project-info .data:last-child{margin: 0;}
.project-info .data-list,
.project-info .project-services ul{margin: 0 0 -15px 0; padding: 0; list-style-type: none; color: #929599; font-size: 18px; font-weight: 300; line-height: 1;}
.project-info .data-list li,
.project-info .project-services ul li{width: 50%; display: block; float: left; margin: 0 0 15px 0;}

.project-services{}
.project-services.service-2{padding-bottom: 135px;}
.project-services .service-title{margin: 0 0 60px 0; padding: 0 0 0 110px; position: relative;}
.project-services .service-title:before{content: ""; width: 90px; height: 1px; background: #00addf; position: absolute; top: 50%; left: 0;}
.project-services .service-description{}
.project-services .service-description p{margin: 0 0 35px 0; line-height: 1.6; font-size: 18px; font-weight: 300;}
.project-services .service-description p:only-of-type,
.project-services .service-description p:last-child{margin: 0;}
.project-services .service-description ul{margin: 0 0 35px 0; padding: 0 0 0 35px; line-height: 1.6; font-size: 18px; font-weight: 300;}
.project-services .service-description ul li{margin: 0;}
.project-services .service-description ul li:only-of-type,
.project-services .service-description ul li:last-child{margin: 0;}
.project-services .service-sub-title{font-size: 24px;}
.project-services .floating-image{position: absolute; top: 50%; left: 0; right: 0; transform: translate(0, -50%);}
.project-services .floating-image img{position: relative; float: right; display: block; z-index: 2;}
.project-services .floating-image:after{content: ""; position: absolute; top: 50%; left: unset; right: 0; bottom: unset; transform: translate(25%, -50%); width: 800px; height: 800px; background-image: url("../images/Ellipse 149@2x.png"); background-repeat: no-repeat; background-position: center; background-size: cover; z-index: 1;}
.project-services.service-2 .project-service-2-image img{width: 100%; max-width: 700px;}

.project-improvements{}
.project-improvements .project-improvements-image:after{content: ""; position: absolute; top: 50%; left: 50%; right: unset; bottom: unset; transform: translate(-50%, -50%); width: 800px; height: 800px; background-image: url("../images/Ellipse 149@2x.png"); background-repeat: no-repeat; background-position: center; background-size: cover; z-index: 1;}
.project-services.service-2 .project-service-2-image:after{content: ""; position: absolute; top: 50%; left: 50%; right: unset; bottom: unset; transform: translate(-35%, -70%); width: 800px; height: 800px; background-image: url("../images/Ellipse 149@2x.png"); background-repeat: no-repeat; background-position: center; background-size: cover; z-index: 1;}

.project-before-after{padding: 0 0 120px 0;}

.project-how-we-did-it{}
.project-how-we-did-it .percentages{transform: translate(0, -50%);}
.project-how-we-did-it .percentages h3{font-size: 60px;}
.project-how-we-did-it .project-how-we-did-it-content{margin-top: -30px;}
.project-how-we-did-it .project-how-we-did-it-content .right > *:last-child{margin-bottom: 65px;}

.featured-project{}
.featured-project .image-1,
.featured-project .image-2{background-size: cover; background-repeat: no-repeat; background-position: center;}
.featured-project .text{padding: 100px 145px 125px 100px;}
.featured-project.text-image .text{padding: 100px 100px 125px 145px;}

.projects-loop{margin: 0 -70px; width: calc(100% + 140px);}
.projects-loop .single-project{margin: 0 70px 80px 70px; width: calc(33.3% - 140px);}
.projects-loop .single-project a:lang(bg){cursor: url("../images/custom-cursor-bg-1.svg") 45 45, pointer;}
.projects-loop .single-project a:lang(en){cursor: url("../images/custom-cursor-en-1.svg") 45 45, pointer;}
.projects-loop .single-project a:lang(de){cursor: url("../images/custom-cursor-de-1.svg") 45 45, pointer;}
.projects-loop .single-project .featured-image:after{content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0,0,0,.15); z-index: 2;}
.projects-loop .single-project .featured-image:after{-webkit-transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease;-ms-transition: all 0.6s ease;transition: all 0.6s ease;}
.projects-loop .single-project:hover .featured-image:after{background: rgba(0,0,0,.35);}
.projects-loop .single-project .logo{width: 70px; height: 70px; display: block; float: left; background: #fff; border-radius: 50%; padding: 0; margin: 0 20px 0 0; position: relative;}
.projects-loop .single-project .logo img{width: 100%; max-width: 40px; height: auto; display: block; float: left; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.projects-loop .single-project .featured-image .wp-post-image{width: 100%; height: auto; display: block; float: left; position: relative; z-index: 1; margin: 0 0 20px 0;}
.projects-loop .single-project .title,
.projects-loop .single-project .desc{width: calc(100% - 90px); clear: none; line-height: 35px; text-align: left;}

.projects-loop-new{overflow: hidden;}
.projects-loop-new .single-project{width: calc(50% - 140px); height: 440px; margin: 0 70px 100px 70px; display: flex; background-repeat: no-repeat; background-position: center; background-size: cover;}
.projects-loop-new .single-project > a{padding: 40px;}
.projects-loop-new .single-project > video{
	position: absolute;
    top: 0;
    left: 0;
	right: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
	z-index: 1;
}
.projects-loop-new .single-project.background-gradient{position: relative;}
.projects-loop-new .single-project.background-gradient:after{content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; /*background: linear-gradient(0deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.5) 50%, rgba(255,255,255,0.15) 100%);*/ /*z-index: 0; background: linear-gradient(0deg, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);*/ background: rgba(0,0,0,.5); z-index: 2;}
.projects-loop-new .single-project.background-gradient:after{-webkit-transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease;-ms-transition: all 0.6s ease;transition: all 0.6s ease;}
.projects-loop-new .single-project.background-gradient:hover:after{/*background: linear-gradient(0deg, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.65) 50%, rgba(0,0,0,0.65) 100%);*/ background: rgba(0,0,0,.7);}
.projects-loop-new .single-project.background-gradient > *:not(video){position: relative; z-index: 3;}

.projects-loop-new .masonry{width: 100%; display: grid; grid-template-columns: repeat(auto-fill, minmax(30%, 1fr)); grid-gap: 20px; grid-auto-rows: 150px; margin: 0 0 20px 0;}
.projects-loop-new .masonry .single-project{width: 100%; height: auto; margin: 0;}
.projects-loop-new .masonry .single-project:nth-child(odd){grid-row: span 2;}
.projects-loop-new .masonry .single-project:nth-child(even){grid-row: span 3;}
.projects-loop-new .masonry .single-project:nth-child(4){grid-row: span 4;}

.projects-grid.manual-selection{width: 100%; display: flex; flex-wrap: wrap; gap: 20px; margin: 0 0 20px 0;}
.projects-grid.manual-selection .left{width: calc(100% - 425px); display: flex; flex-wrap: wrap; gap: 20px; align-content: flex-start; order: 1;}
.projects-grid.manual-selection .right{width: 405px; display: flex; flex-wrap: wrap; gap: 20px; align-content: flex-start; order: 2;}
.projects-grid.manual-selection.wide-in-right .left{order: 2;}
.projects-grid.manual-selection.wide-in-right .right{order: 1;}
.projects-grid.manual-selection .single-project{position: relative; display: flex; background-repeat: no-repeat; background-position: center; background-size: cover;}
.projects-grid.manual-selection .left .single-project{width: calc(50% - 10px); height: fit-content; aspect-ratio: 9 / 6; margin: 0;}
.projects-grid.manual-selection .left .project-1.single-project{width: 100%; height: 510px; margin: 0;}
.projects-grid.manual-selection .right .single-project{width: 100%; margin: 0;}
.projects-grid.manual-selection .right .project-4.single-project{height: 270px;}
.projects-grid.manual-selection .right .project-5.single-project{height: calc(100% - 290px);}
.projects-grid.manual-selection .single-project > a{padding: 30px; text-align: left;}

@media (max-width: 1600px){
	.project-header .project-header-content p{/*padding: 100px 0 0 0; */font-size: 18px;}
	.project-header .project-header-content p:before{top: 50px;}
	.projects-loop{padding-left: 20px; padding-right: 20px;}
}
@media (max-width: 1450px){
	.project-services.service-1 .service-description p:not(:first-child){max-width: 60%;}
}
@media (max-width: 1350px){
	.projects-loop .single-project{width: calc(50% - 140px);}
}
@media (max-width: 1290px){
	.project-services.service-1 .service-description p:not(:first-child){max-width: unset;}
	.project-services .floating-image{position: relative; top: unset; left: unset; right: unset; bottom: unset; transform: none; margin-top: -200px; margin-bottom: -100px; height: auto !important;}
	.project-services.service-2{padding-bottom: 130px;}
	.project-services.service-2 .project-service-2-image img{float: none; margin-left: auto; margin-right: auto; max-width: 100% !important;}
	.project-how-we-did-it .content-container{margin-top: -90px;}
	.project-how-we-did-it .percentages{transform: none;}
	.project-how-we-did-it .project-how-we-did-it-content{margin-top: 0; padding-top: 60px;}
	.project-before-after{padding: 90px 0 25px 0;}
	.projects-loop-new .masonry{grid-template-columns: repeat(2, minmax(30%, 1fr));}

	.projects-grid.manual-selection .left .project-1.single-project,
	.projects-grid.manual-selection .left .single-project{width: 100%; height: 270px; aspect-ratio: unset;}
	.projects-grid.manual-selection .single-project > a{padding: 20px;}
}
@media (max-width: 1024px){
	.project-header{height: auto; padding-top: 200px; padding-bottom: 120px;}
	.project-info .one-fourth{width: 50%; margin-bottom: 40px;}
	.project-info .one-half{width: 100%;}
	.project-details .image-vetrilo{margin-top: 100px;}
	.project-services .floating-image{margin-top: 50px; margin-bottom: 0px;}
	.project-services .floating-image img{float: none; margin-left: auto; margin-right: auto; max-width: 100% !important;}
	.project-services .floating-image:after{top: 50%; left: 50%; transform: translate(-50%, -50%);}
	.project-improvements .content-container > div,
	.project-services .content-container > div{max-width: 600px; margin-left: auto; margin-right: auto; float: none;}
	.project-improvements .project-improvements-image img{margin: 0 auto 60px auto; float: none;}
	.project-services .project-service-2-image img{margin: 60px auto 0 auto; float: none;}
	.project-how-we-did-it .percentages h3{font-size: 50px;}
	.project-how-we-did-it .project-how-we-did-it-content{padding-bottom: 65px;}
	.featured-project .image-1{height: 400px; order: 1;}
	.featured-project .image-2{display: none;}
	.featured-project .text{order: 2;}
	.projects-loop-new .margin-fix-70{width: calc(100% + 20px); margin-left: -10px; margin-right: -10px;}
	.projects-loop-new .single-project{width: calc(50% - 20px); margin: 0 10px 100px 10px; padding: 20px;}

	.projects-grid.manual-selection .left,
	.projects-grid.manual-selection .right{width: calc(50% - 10px);}
	.projects-grid.manual-selection .single-project{padding: 0;}
}
@media (max-width: 800px){
	.project-info{padding: 60px;}
	.projects-loop-new .single-project > a{padding: 0;}
}
@media (max-width: 768px){
	.project-how-we-did-it .percentages{max-width: 480px; margin-left: auto; margin-right: auto; float: none; display: table;}
	.project-how-we-did-it .percentages .one-third{width: 100%;}
	.project-how-we-did-it .content-container{margin-top: -230px;}
	.project-services.service-2{padding-bottom: 270px;}
	ul.blue-line-marker li{width: 100%;}
	.projects-loop .single-project{width: calc(100% - 140px);}
	.projects-loop-new .single-project{width: calc(100% - 20px);}
}
@media (max-width: 600px){
	.project-header{margin-top: -65px; padding-top: 165px;}
	.project-details .image-vetrilo{width: 250%;}
	.project-details:after{display: none;}
	.project-improvements .content-container > div,
	.project-services .content-container > div{max-width: 600px; margin-left: 0; margin-right: 0; float: left;}
	.projects-loop-new .single-project > a{padding: 0;}
	.projects-loop-new .masonry{grid-template-columns: repeat(1, minmax(30%, 1fr));}

	.projects-grid.manual-selection .left,
	.projects-grid.manual-selection .right{width: 100%;}
	.projects-grid.manual-selection .left .project-1.single-project,
	.projects-grid.manual-selection .left .single-project,
	.projects-grid.manual-selection .right .project-4.single-project,
	.projects-grid.manual-selection .right .project-5.single-project{height: 320px;}
}
@media (max-width: 480px){
	ul.simple li{width: 100%;}
	.project-header .project-header-content img.project-logo{max-width: 300px;}
	.project-header .project-header-content p{/*padding: 80px 0 0 0; */line-height: 1.4;}
	/*
	.project-header .project-header-content p:before{top: 40px;}
	*/
	.project-info .one-fourth,
	.project-info .data-list li,
	.project-info .project-services ul li{width: 100%;}
	.project-services .floating-image:after{width: 600px; height: 600px;}
	.featured-project .text,
	.featured-project.text-image .text{padding: 100px 50px;}
}
/*** PROJECTS ***/


/*** PROJECTS SLIDER ***/
#projects-slider{padding-left: 35px;}
.single-project{display: block; float: left; width: 370px; height: auto; margin-right: 35px;}
.single-project .picture{width: 100%; height: 510px; display: block; float: left; background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; z-index: 1; margin: 0 0 20px 0;}
.single-project .picture:after{content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0,0,0,.25); z-index: 2;}
.single-project .picture:after{-webkit-transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease;-ms-transition: all 0.6s ease;transition: all 0.6s ease;}
.single-project:hover .picture:after{background: rgba(0,0,0,.5);}
.single-project .logo{width: 70px; height: 70px; display: block; float: left; background: #fff; border-radius: 50%; padding: 0; margin: 0 20px 0 0; position: relative;}
.single-project .logo img{width: 100%; max-width: 40px; height: auto; display: block; float: left; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.single-project .title,
.single-project .desc{width: calc(100% - 90px); clear: none; line-height: 35px;}
.single-project a:lang(bg){cursor: url("../images/custom-cursor-bg-1.svg") 45 45, pointer;}
.single-project a:lang(en){cursor: url("../images/custom-cursor-en-1.svg") 45 45, pointer;}
.single-project a:lang(de){cursor: url("../images/custom-cursor-de-1.svg") 45 45, pointer;}

#projects-for-nav-slider .single-project .picture{/*height: 400px;*/}

@media (max-width: 480px){
	#projects-slider{padding-left: 20px;}
	.single-project{margin-right: 20px;}
}
/*** PROJECTS SLIDER ***/
