/* roboto-100 - greek_latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 100;
    src: url('./fonts/roboto-v49-greek_latin-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* roboto-200 - greek_latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 200;
    src: url('./fonts/roboto-v49-greek_latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* roboto-300 - greek_latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: url('./fonts/roboto-v49-greek_latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* roboto-regular - greek_latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url('./fonts/roboto-v49-greek_latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* roboto-italic - greek_latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    src: url('./fonts/roboto-v49-greek_latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* roboto-500 - greek_latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: url('./fonts/roboto-v49-greek_latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* roboto-600 - greek_latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 600;
    src: url('./fonts/roboto-v49-greek_latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* roboto-700 - greek_latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url('./fonts/roboto-v49-greek_latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* roboto-800 - greek_latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 800;
    src: url('./fonts/roboto-v49-greek_latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* roboto-900 - greek_latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: url('./fonts/roboto-v49-greek_latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }

*{margin: 0px;padding: 0px;box-sizing: border-box;}

html, body{margin: 0px;padding: 0px;font-family: 'Roboto'!important;background-color: var(--background-color)!important;}

:root{
    --white-color: #fff;
    --black-color: #222;
    --super-black-color: #000;
    --background-color: #f2f2f2;
    --gray-color: #5f5f5f;
    --light-gray-color: #f2f2f2;
    --line-color: #e1e1e1;
    --green-color: #00ff99;
    --ccc-color: #ccc;
    --text-14px: 14px;
}

h1 {font-size: clamp(50px, 5vw, 64px)!important;line-height: clamp(52px, 7vw, 82px)!important;font-weight: 400!important;padding: 0px!important;margin: 0px!important;}
h2 {font-size: clamp(28px, 3.5vw, 42px)!important;line-height: clamp(36px, 5vw, 52px)!important;font-weight: 400!important;padding: 0px!important;margin: 0px!important;}
h3 {font-size: clamp(24px, 2.8vw, 32px)!important;line-height: clamp(32px, 4vw, 42px)!important;font-weight: 400!important;padding: 0px!important;margin: 0px!important;}
h4 {font-size: clamp(20px, 2vw, 22px)!important;line-height: clamp(26px, 3vw, 32px)!important;font-weight: 400!important;padding: 0px!important;margin: 0px!important;}
h5 {font-size: clamp(18px, 1.8vw, 20px)!important;line-height: clamp(22px, 2.5vw, 28px)!important;font-weight: 400!important;padding: 0px!important;margin: 0px!important;}
h6 {font-size: clamp(16px, 1.5vw, 16px)!important;line-height: clamp(20px, 2vw, 26px)!important;font-weight: 400!important;padding: 0px!important;margin: 0px!important;}
p  {font-size: clamp(18px, 1.5vw, 16px)!important;line-height: clamp(26px, 2vw, 26px)!important;font-weight: 300!important;margin: 0px!important;padding: 0px!important;}

.main-line{position: fixed;height: 100%;background-color: var(--line-color);width: 1px;top: 0px;z-index: 5;}
#line1{left: 16.6666666667%;}
#line2{left: 33.3333333333%;}
#line3{left: 66.6666666667%;}

.pagewrap{width: 100%;position: relative;padding: 0px 20px;}

.btn{position: relative;letter-spacing: 2px;font-size: 12px;text-decoration: none;color: var(--black-color);transition: 0.1s ease;}
.btn:hover{opacity: 0.7;transition: 0.1s ease;}

.black-button{width: 220px;max-width: 100%;height: 60px;background-color: var(--black-color);display: flex;flex-direction: column;justify-content: center;align-items: center;color: var(--white-color);text-decoration: none;font-weight: 400;transition: 0.2s ease;}
.black-button:hover{background-color: var(--green-color);transition: 0.2s ease;}

.p-0{padding: 0px!important;}
.overflow-hidden{overflow: hidden!important;}

#section{width: 100%;position: relative;padding: 120px 0px;}
#section-small{width: 100%;position: relative;padding: 60px 0px;}
#section-small-single{width: 100%;position: relative;padding: 0px 0px 60px 0px;}

.grid-2-elements{width: 100%;position: relative;display: grid;grid-template-columns: repeat(2,1fr);gap: 20px;}
.grid-3-elements{width: 100%;position: relative;display: grid;grid-template-columns: repeat(3,1fr);gap: 20px;row-gap: 40px;}

.breadcrumbs{position: relative;display: flex;gap: 10px;flex-wrap: wrap;text-transform: uppercase;}
.breadcrumbs span{display: flex;gap: 10px;font-size: 14px;flex-wrap: wrap;}
.breadcrumbs a{color: var(--black-color);text-decoration: none;}
.breadcrumbs a:hover{color: var(--green-color);}

.section-title{position: relative;width: fit-content;font-weight: 600;border-bottom: 2px solid var(--black-color);padding-bottom: 2px;margin-bottom: 24px;}
.noscroll{overflow: hidden!important;}

#loading-overlay{display: none;position: fixed;top: 0px;left: 0px;width: 100%;height: 100dvh;background: #000;z-index: 100;}
.page-id-7 #loading-overlay{display: block;}
#loading-overlay .logo{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);overflow: hidden;}
#loading-overlay .logo img{max-width: 200px;opacity: 0;}



/*Header code Starts*/
header{width: 100%;position: relative;z-index: 100;padding-top: 20px;}
.page-id-7 header, .single-project header{position: absolute;top: 0px;left: 0px;}
.header-white{display: none;}
.header-black{display: block;}
.page-id-7 .header-white, .single-project .header-white{display: block;}
.page-id-7 .header-black, .single-project .header-black{display: none;}
header .flex-elements{display: flex;gap: 20px;justify-content: space-between;align-items: center;}
.header-left{display: flex;gap: 20px;}
.lab-logo a{display: block;}
.lab-logo a img{max-width: 130px;}
.header-left .menu-button{width: 35px;height: 35px;display: flex;flex-direction: column;justify-content: center;gap: 5px;cursor: pointer;transition: 0.2s ease;}
.header-left .menu-button span{width: 35px;height: 2px;background-color: var(--white-color);transition: 0.2s ease;}
.header-left .menu-button span:nth-child(2){width: 20px;transition: 0.2s ease;}
.header-left .menu-button:hover span:nth-child(2){width: 35px;transition: 0.2s ease;}
.header-right{display: flex;gap: 20px;color: var(--white-color);}
.header-right p{font-size: var(--text-14px)!important;}
.header-right span{font-weight: 500;color: var(--white-color);padding-right: 5px;}
.header-right a{color: var(--white-color);text-decoration: none;transition: 0.1s ease;}
.header-right a:hover{color: var(--green-color);transition: 0.1s ease;}

.header-black .header-left .menu-button span{background-color: var(--black-color);}
.header-black .header-right span, .header-black .header-right a{color: var(--black-color);}

@media screen and (max-width:800px) and (min-width:200px){
    .header-right{display: none;}
    .header-left{width: 100%;justify-content: space-between;}
    .header-left .lab-logo{order: 0;}
    .header-left .menu-button{order: 1;align-items: end;}
}
/*Header code Ends*/

/*All pages code Starts*/
.homepage-hero{position: relative;z-index: 10;}
.swiper-container{position: relative;}
.swiper {width: 100%;height: 100%;}
.swiper-slide {text-align: center;font-size: 18px;background: #444;display: flex;justify-content: center;align-items: center;}
.swiper-slide img {display: block;width: 100%;height: 900px;object-fit: cover;}
.swiper-slide .slide-content{/*width: 63%;*/width: 100%;position: absolute;z-index: 2;left: 16%;bottom: 75px;text-align: left;color: var(--white-color);}
.swiper-slide .slide-content span{font-size: var(--text-14px);font-weight: 300;}
.swiper-slide .slide-content h6{font-weight: 400;text-transform: uppercase;}
.swiper-slide .slide-content h1 {font-size: clamp(60px, 10vw, 180px) !important;line-height: clamp(60px, 10vw, 180px) !important;text-transform: uppercase;}
.swiper-slide .slide-content h1 a{color: var(--white-color)!important;text-decoration: none;}
.swiper-hero-progress{position: absolute;bottom: 0px;right: 0px;width: 340px;max-width: 100%;background-color: var(--white-color);z-index: 3;}
.swiper-hero-progress .autoplay-progress-content{padding: 20px;display: flex;gap: 10px;justify-content: space-between;}
.swiper-hero-progress .autoplay-progress-content:hover p{color: var(--green-color);}
.swiper-hero-progress .autoplay-progress-content p{font-weight: 400;text-transform: uppercase;}
.swiper-hero-progress .autoplay-progress-content .next-arrow{border: none;background: transparent;position: absolute;width: 89%;display: flex;cursor: pointer;}
.swiper-hero-progress .autoplay-progress-content .next-arrow img{margin-left: auto;}
.swiper-hero-progress .autoplay-progress-content .autoplay-progress-line{position: absolute;top: 0px;left: 0px;width: 100%; height: 3px; background: rgba(255,255,255,.25);overflow: hidden; border-radius: 2px;}
.swiper-hero-progress .autoplay-progress-content .autoplay-progress-line .bar{display: block;width: 0;height: 4px;background-color: var(--green-color);}

.hero-section{width: 100%;position: relative;height: 850px;overflow: hidden;}
.hero-section .image{width: 100%;height: 100%;}
.hero-section .image img{width: 100%;height: 100%;object-fit: cover;}
.hero-section .hero-content{position: absolute;left: 50%;bottom: 0px;padding: 20px;width: 68%;transform: translate(-50%,0);display: flex;flex-direction: column;gap: 20px;color: var(--white-color);}
.hero-section .hero-content .hero-content-top,
.hero-section .hero-content .hero-content-bottom{display: flex;flex-direction: column;gap: 7px;}
.hero-section .hero-content .hero-content-top{width: fit-content;border-bottom: 2px solid var(--white-color);padding-bottom: 7px;}
.hero-section .hero-content span{font-size: 16px!important;line-height: 20px!important;font-weight: 400!important;}
.hero-section .hero-content h5{font-size: 22px!important;}
.hero-section .hero-content h1{font-size: clamp(60px, 13vw, 120px)!important;line-height: clamp(60px, 13vw, 120px)!important;text-transform: uppercase;}

.white-section{width: 100%;position: relative;padding: 120px 0px 80px 0px;background-color: var(--white-color);}
.white-section-before{position: absolute;background-color: #f6f0e8;display: block;width: 58%;top: 80px;bottom: 130px;z-index: 1;}
.white-section-after{position: absolute;background-color: #f2f2f2;display: block;width: 77%;top: 150px;bottom: 190px;z-index: 0;right: 0;z-index: 2;}
.white-section .flex-elements{display: grid;grid-template-columns: 0.191fr 1fr;}
.white-section .section-top{position: relative;padding-bottom: 160px;z-index: 3;}
.white-section .section-top .btn{margin: 0px auto;}
.white-section .section-top .content{width: fit-content;max-width: 100%;margin-left: 20%;padding: 0px 20px;}
.white-section .section-top .content h3{font-weight: 500;}
.white-section .section-bottom{position: relative;z-index: 3;}
.white-section .section-bottom .grid-elements{width: 100%;position: relative;display: grid;grid-template-columns: 0.4fr 0.5fr 0.1fr;gap: 20px;}
.white-section .section-bottom .grid-elements .content-title{margin-bottom: 20px;}
.white-section .section-bottom .image{position: relative;}
.white-section .section-bottom .image img{width: 100%;height: auto;aspect-ratio: 800/450;display: block;object-fit: cover;}
.white-section .section-bottom .image img:nth-child(2){position: absolute;top: -68px;right: 0px;width: 360px;height: 200px;}
.white-section .section-bottom .content{margin-left: 12%;}
.white-section .section-bottom .content .content-title h5{width: fit-content;font-weight: 600;border-bottom: 2px solid var(--black-color);padding-bottom: 5px;margin-bottom: 24px;}
.white-section .section-bottom .content .content-inside{max-width: 610px;display: flex;flex-direction: column;gap: 20px;}
.white-section .section-bottom .background-image{position: relative;padding: 0px 20px;margin: auto 0px 0px auto;}

.project-section{width: 100%;position: relative;background-color: var(--white-color);overflow: hidden;}
.project-section .category{position: relative;cursor: pointer;}
.project-section-top .grid-elements{position: relative;display: grid;grid-template-columns: 0.5fr 1fr;}
.project-section-top .project-section-top-left{margin: auto 0px;padding-left: 40px;}
.project-section-top .project-section-top-right{background-color: var(--gray-color);padding: 30px 46px 30px 0px;}
.project-section-top .project-section-top-right a{position: relative;display: flex;justify-content: end;align-items: center;gap: 10px;color: var(--white-color);text-decoration: none;padding-right: 40px;transition: 0.2s ease;}
.project-section-top .project-section-top-right a::after{content: '';position: absolute;right: 0px;background-image: url(svg/arrow-right-white.svg);width: 20px;height: 20px;display: flex;justify-content: center;align-items: center;transition: 0.2s ease;}
.project-section-top .project-section-top-right a:hover{color: var(--green-color);transition: 0.2s ease;}
.project-section-top .project-section-top-right a:hover::after{right: -10px;transition: 0.2s ease;}
.project-section-bottom{width: 100%;position: relative;padding: 0px 12px;}
.project-section-bottom .category-image{position: relative;width: 100%;height: 700px;}
.project-section-bottom .category-image::before{content: '';position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: var(--light-gray-color);transition: 0.5s ease;}
.project-section-bottom .category-image img{width: 100%;height: 100%;object-fit: cover;}
.project-section-bottom .category-title{width: 100%;position: absolute;padding: 30px;bottom: 0px;z-index: 2;color: var(--black-color);}
.project-section-bottom .category-title .count p{position: relative;display: flex;align-items: center;gap: 10px;}
.project-section-bottom .category-title .count p::after{content: '';width: 50px;height: 1px;background: var(--black-color);margin-left: 10px;margin-bottom: 2px;}
.project-section .category:hover .category-image::before{left: 100%;transition: 0.5s ease;}
.project-section-bottom .category:hover .category-title{color: var(--white-color);}
.project-section-bottom .category:hover .category-title .count p::after{background-color: var(--white-color);}

.team-section{width: 100%;position: relative;}
.team-section-after{position: absolute;background-color: var(--gray-color);display: block;width: 72%;top: 27%;bottom: 23%;z-index: 0;right: 0px;}
.team-section-top, .team-section-bottom{position: relative;z-index: 1;}
.team-section-top .grid-elements{width: 100%;position: relative;display: grid;grid-template-columns: 0.1fr 0.4fr 0.5fr;gap: 20px;}
.team-section-bottom .grid-elements{width: 100%;position: relative;display: grid;grid-template-columns: 0.4fr 1fr;gap: 20px;}
.text-updown{position: relative;}
.text-updown p{letter-spacing: 5px;color: var(--black-color);font-weight: 500;writing-mode: vertical-rl;padding: 0;margin: 0;position: relative;left: 50%; transform: rotate(180deg)translateX(100%);}
.team-section .content{margin-left: 25%;}
.team-section .content .content-title{position: relative;width: fit-content;font-weight: 600;border-bottom: 2px solid var(--black-color);padding-bottom: 2px;margin-bottom: 24px;}
.team-section .images{position: relative;display: flex;justify-content: end;}
.team-section .images .background-image{display: flex;justify-content: end;position: absolute;right: 0px;top: 30px;}
.team-section .images .background-image img{max-width: 758px;width: 100%;}
.team-card{width: fit-content;}
.team-section .images .team-card{margin-left: 27.5%;padding-top: 113px;/*position: absolute;top: 115px;*/}
.team-section-top .images .team-card{margin-right: 27%;margin-left: 0px;}
.team-card .team-card-image{position: relative;overflow: hidden;transform: 0.3s ease;}
.team-card .team-card-image img{width: 100%;max-width: 347px;height: auto;aspect-ratio: 347/360;object-fit: cover;display: block;transition: 0.2s ease;}
.team-card .team-card-image:hover img{transform: scale(1.1);transition: 0.2s ease;}
.team-card .team-card-social{display: flex;justify-content: end;gap: 10px;padding-top: 10px;transition: 0.2s ease;}
.team-card .team-card-social a img{width: 24px;transition: 0.2s ease;}
.team-card .team-card-social a:hover img{transform: scale(1.1);transition: 0.2s ease;}
.team-section-bottom{margin-top: 40px;padding: 0px 20px;}
.team-section-bottom .team-section-bottom-right{display: flex;align-items: start;justify-content: end;}
.team-section-bottom .team-card{float: right;}
.team-section-bottom .content{max-width: 700px;text-align: right;margin-right: 18%;margin-left: 0px;display: flex;flex-direction: column;justify-content: end;align-items: end;gap: 40px;}
.team-section-mobile{display: none;padding: 0px 20px;}
.team-section-mobile .background-image{display: flex;justify-content: end;padding-bottom: 40px;}
.team-section-mobile .background-image img{max-width: 260px;}
.team-section-mobile .content{display: flex;flex-direction: column;gap: 20px;padding-bottom: 40px;}
.team-section-mobile .team-cards .team-card{width: 100%;}

.press-section{background-color: var(--super-black-color);}
.press-section .grid-elements{display: grid;grid-template-columns: 0.1fr 0.5fr 0.4fr;gap: 20px;}
.press-section .section-title{display: flex;flex-direction: column;justify-content: space-between;align-items: center;border-bottom: 0px;}
.press-section .section-title h2{width: fit-content;letter-spacing: 5px;color: var(--white-color);font-weight: 500;writing-mode: vertical-rl;padding: 0;margin: 0;position: relative;left: 32%; transform: rotate(180deg)translateX(100%);}
.press-section .section-title img{width: 100px;max-width: 100%;}
.press-section .section-press-elements{margin-left: 19%;margin-top: 70px;}
.section-press-elements .press-element{width: fit-content;position: relative;margin-bottom: 30px;}
.section-press-elements .press-element h3 a{color: var(--white-color);text-decoration: none;transition: 0.1s ease;}
.section-press-elements .press-element h3:hover a{color: var(--green-color);transition: 0.1s ease;}
.section-press-elements .press-element h5{color: var(--ccc-color);font-style: italic;font-weight: 400;}
.section-subtitle{display: flex;flex-direction: column;justify-content: space-between;align-items: end;}
.section-subtitle .section-subtitle-top{display: flex;flex-direction: column;justify-content: end;align-items: end;text-align: right;color: var(--gray-color);position: relative;}
.section-subtitle .section-subtitle-top:after{content: '';display: flex;width: 100px;height: 2px;background-color: var(--white-color);margin-top: 10px;}
.section-subtitle .section-subtitle-top p{color: var(--white-color);}
.section-subtitle .section-subtitle-bottom a{color: var(--white-color);text-decoration: none;transition: 0.1s ease;}
.section-subtitle .section-subtitle-bottom a:hover{color: var(--green-color);transition: 0.1s ease;}
.section-subtitle .section-subtitle-bottom a p{position: relative;display: flex;align-items: center;padding-right: 30px!important;}
.section-subtitle .section-subtitle-bottom a p::after{content: '';position: absolute;top: 4px;right: 0px;background-image: url(svg/arrow-right-white.svg);width: 20px;height: 20px;display: flex;justify-content: center;align-items: center;transition: 0.2s ease;}
.section-subtitle .section-subtitle-bottom a p:hover::after{right: -5px;}


.aboutus-section .grid-elements{width: 100%;position: relative;display: grid;grid-template-columns: 0.2fr 0.8fr;gap: 20px;}
.aboutus-section .aboutus-content{max-width: 900px;display: flex;flex-direction: column;gap: 0px;}
.aboutus-section .aboutus-content .section-content{padding: 80px 0px;position: relative;}
.aboutus-section .aboutus-content .section-content .content-inside{max-width: 700px;position: relative;display: flex;flex-direction: column;gap: 20px;z-index: 2;}
.aboutus-section .aboutus-content .section-content .image{position: absolute;top: 50px;left: -90px;}
.aboutus-section .aboutus-content .section-content .image img{max-width: 443px;height: 253px;object-fit: cover;}

.team-section-aboutus{position: relative;background-color: var(--gray-color);}
.team-section-aboutus .grid-elements{width: 100%;position: relative;display: grid;grid-template-columns: 0.2fr 0.8fr;gap: 20px;}
.section-team-elements{max-width: 1200px;margin-top: 60px;position: relative;}
.section-team-elements-before{position: absolute;right: 0px;top: -134px;background-image: url(images/TEAM.png);width: 100%;height: auto;aspect-ratio: 500/200;background-position: center;background-repeat: no-repeat;background-size: contain;max-width: 500px;}
.team-card-titles{display: flex;gap: 20px;justify-content: space-between;padding-top: 10px;}
.team-card-titles h5{color: var(--green-color);}
.team-card-titles span{color: var(--ccc-color);}

.cv-element{margin-top: 60px;position: relative;}
.cv-element-top{width: fit-content;position: relative;border-bottom: 2px solid var(--green-color);padding-bottom: 10px;margin-bottom: 20px;}
.cv-element-top h2{color: var(--green-color);}
.cv-element-bottom h5{font-weight: 500!important;color: var(--black-color);}
.cv-element-bottom p{font-weight: 400!important;padding-top: 10px!important;color: var(--ccc-color);}
.cv-element-bottom p a{color: var(--ccc-color);}
.cv-element-bottom p a:hover{color: var(--green-color);}

#projects-page #section-small{padding: 60px 0px 0px 0px;}
.projects-section .grid-elements{width: 100%;position: relative;display: grid;grid-template-columns: 0.2fr 0.8fr;gap: 20px;}
.projects-section .projects-content{max-width: 1440px;margin: 60px 0px;}
.projects-section .grid-3-elements{gap: 40px;}
.projects-section .tabcontent{display:none;}
.projects-section .tabcontent:nth-child(1){display: block;}
.project-card{width: 100%;position: relative;margin: auto 0px;transition: 0.3s ease;}
.project-card .project-image{width: 100%;height: auto;max-width: 370px;overflow: hidden;transition: 0.3s ease;}
.project-card .project-image a{display: block;transition: 0.3s ease;}
.project-card .project-image img{width: 100%;height: auto;object-fit: cover;display: block;transition: 0.3s ease;}
.project-card .project-image:hover img{transform: scale(1.1);transition: 0.3s ease;}
.project-card .project-informations{padding-top: 10px;}
.project-card .project-informations p{font-size: 14px!important;text-transform: uppercase;}
.project-card .project-informations h4 a{font-weight: 500;color: var(--black-color);text-decoration: none;text-transform: uppercase;}
.project-card .project-informations p a:hover,
.project-card .project-informations h4 a:hover{color: var(--green-color);}

.filters{display: flex;gap: 20px;}
.filters .tabs-button{display: flex;gap: 20px;flex-wrap: wrap;cursor: pointer;}
.filters .tabs-button {color: var(--black-color);text-decoration: none;}
.filters .tabs-button h5:hover{color: var(--green-color);}
.filters h5, .filters .tabs-button h5{font-weight: 400;}
.tab-button.active h5{color: var(--green-color);}

#press-page #section-small{padding: 60px 0px 0px 0px;}
#press-page .press-section{background-color: var(--background-color);margin-bottom: 60px;}
#press-page .press-section-left{display: flex;flex-direction: column;justify-content: space-between;}
#press-page .press-section-left h3{width: fit-content;letter-spacing: 5px;color: var(--black-color);font-weight: 500;writing-mode: vertical-rl;padding: 0;margin: 0;position: relative;left: 32%;transform: rotate(180deg)translateX(100%);}
#press-page .press-section-left img{max-width: 80px;}
#press-page .press-section .section-press-elements{margin-left: 20%;margin-top: 0px;}
#press-page .section-subtitle .section-subtitle-top{color: var(--black-color);}
#press-page .section-subtitle .section-subtitle-top p{color: var(--black-color);}
#press-page .section-subtitle .section-subtitle-top::after {background-color: var(--black-color);}
#press-page .section-press-elements .press-element h3 a{color: var(--black-color);}
/*#press-page .section-press-elements .press-element h5{color: var(--black-color);}*/
/*
#press-page .press-element .press-image{max-width: 217px;width: 100%;height: auto;position: fixed;visibility: hidden;opacity: 0;z-index: 10;pointer-events: none;cursor: none;}
#press-page .press-element .press-image img{width: 100%;height: 100%;object-fit: cover;}
*/
/*
#press-page .press-element{position: relative;}
#press-page .press-element .press-image{position: absolute;max-width: 217px;width: 100%;height: 100%;border-radius: 50%;object-fit: cover;opacity: 0;transition: opacity 0.5s;}
#press-page .press-element .press-image img{width: 100%;height: 100%;object-fit: cover;}
*/
#press-page .press-element { position: relative; cursor: pointer;}

#press-page .press-element .press-element-title{position: relative;z-index: 2;}

#press-page .press-element .press-image{
  position: absolute;
  width: 217px;          /* σταθερή διάσταση για κύκλο */
  height: auto;
  border-radius: 50%;
  opacity: 0;            /* αρχικά κρυφό (GSAP θα χειριστεί το fade) */
  pointer-events: none;  /* να μη "κόβει" το hover */
  z-index: 1;
}

#press-page .press-element .press-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.press-content{display: flex;flex-direction: column;gap: 20px;}
.press-content{width: 100%;position: relative;margin: 40px 0px;}
.press-images{display: flex;flex-direction: column;gap: 40px;}
.press-images img{width: auto;max-width: 100%;height: auto;object-fit: cover;}

.awards-elements{margin-top: 60px;}
.award-card{width: 100%;position: relative;border-bottom: 1px solid var(--black-color);padding-bottom: 20px;margin-bottom: 20px;}
.award-card .grid-2-elements{grid-template-columns: 1fr 250px;}
.award-card img{width: 100%;height: auto;aspect-ratio: 200/140;object-fit: cover;}
.award-card .award-elements-left{display: flex;flex-direction: column;justify-content: space-between;gap: 20px;}
.award-card .award-elements-left a{color: var(--black-color);font-weight: 500;text-decoration: none;}
.award-card .award-title h4{padding-bottom: 20px;}

.contact-content{max-width: 1440px;display: grid;gap: 80px;grid-template-columns: repeat(2,1fr);}
.contact-content .contact-content-left,
.contact-content .contact-content-right{display: flex;flex-direction: column;gap: 20px;}
.contact-content .contact-element .contact-element-title{margin-bottom: 20px;}
.contact-content .contact-element .social-elements{display: flex;gap: 20px;}
.contact-content .contact-element .social-elements a{width: 30px;height: 30px;position: relative;display: flex;justify-content: center;align-items: center;transition: 0.1s ease;}
.contact-content .contact-element .social-elements a:hover img{transform: scale(1.1);transition: 0.1s ease;}
.contact-content .contact-element ul{margin: 0px!important;padding: 0px!important;}
.contact-content .contact-element .office{padding-bottom: 20px;}
.ff-default .ff-el-form-control{background-color: var(--background-color)!important;}
.ff-default .ff_btn_style{border-radius: 50px!important;background-color: var(--black-color)!important;color: var(--white-color)!important;}
.frm-fluent-form{position: relative;}
.frm-fluent-form .ff_submit_btn_wrapper{position: absolute;right: 0px;bottom: -6px;}
.fluentform .ff-el-form-check{width: 40%;}

.project-button{position: relative;width: 335px;max-width: 100%;height: 75px;font-weight: 300;display: flex;justify-content: center;align-items: center;background-color: var(--gray-color);color: var(--white-color);text-decoration: none;transition: 0.2s ease;}
.project-button::after{content: '';position: relative;width: 20px;height: 20px;margin-left: 20px;background-image: url(svg/arrow-right-white.svg);background-position: center;background-repeat: no-repeat;background-size: cover;transition: 0.2s ease;}
.project-button:hover{opacity: 0.7;transition: 0.2s ease;}
.project-button:hover::after{right: -10px;transition: 0.2s ease;}

#single-project{background-color: var(--white-color);}
.single-project-aboutus .grid-elements{width: 100%;position:relative;display: grid;grid-template-columns: 0.2fr 0.8fr;gap: 20px;}
.single-project-aboutus .single-project-informations{display: flex;flex-direction: column;gap: 50px;}
.single-project-aboutus .single-project-informations .single-span{font-size: 14px;color: var(--gray-color);letter-spacing: 2px;font-weight: 300;}
.single-project-aboutus .single-project-informations .single-project-info h5{text-transform: uppercase;}
.single-project-aboutus .single-project-content{max-width: 1200px;position: relative;}
.single-project-aboutus .single-project-content .content{max-width: 800px;position: relative;display: flex;flex-direction: column;gap: 20px;}
.single-project-aboutus .single-project-content img{width: 100%;height: 100%;object-fit: cover;}
.single-project-aboutus .single-project-content .single-project-images{max-width: 1200px;width: 100%;position: relative;display: grid;grid-template-columns: repeat(2,1fr);gap: 20px;margin-top: 100px;}
.single-project-aboutus .single-project-content .single-project-images .project-image{width: 100%;position: relative;margin-top: 100px;}
.single-project-aboutus .single-project-content .single-project-images .project-image:nth-child(odd){margin-top: 0px;}
.single-project-aboutus .single-project-content .single-project-images .project-image:nth-child(5n){grid-column: 1/3;margin-top: 0px;}
.single-project-aboutus .single-project-content .single-project-images .project-image a{display: block;width: 100%;}

@media screen and (max-width:1490px) and (min-width:200px){
    .swiper-slide .slide-content{left: 0px;padding: 0px 20px;}
}
@media screen and (max-width:1000px) and (min-width:200px){
    .swiper-slide .slide-content{width: 100%;}
}
@media screen and (max-width:800px) and (min-width:200px){
    .swiper-slide .slide-content{width: 100%;bottom: 0px;}
    .swiper-slide img{height: auto;aspect-ratio: 700/600;}
    .swiper-hero-progress{position: relative;margin-left: auto;}
}


@media screen and (max-width:1658px) and (min-width:200px){
    .hero-section .hero-content{width: 100%;}
    .hero-section .hero-content h1 {
        font-size: clamp(60px, 10vw, 120px) !important;
        line-height: clamp(60px, 10vw, 120px) !important;
    }
}
@media screen and (max-width:950px) and (min-width:200px){
    #single-project #section-small{padding: 60px 0px 10px 0px;}
    .hero-section{height: 600px;}
    .single-project-aboutus .grid-elements{grid-template-columns: 1fr;gap: 50px;}
    .single-project-aboutus .single-project-informations{gap: 20px;}
    .single-project-aboutus .single-project-content .content,
    .single-project-aboutus .single-project-content .single-project-images{max-width: 100%;}
}
@media screen and (max-width:650px) and (min-width:550px){
    .single-project-aboutus .single-project-content .single-project-images{margin-top: 60px;}
    .single-project-aboutus .single-project-content .single-project-images .project-image{margin-top: 50px;}
}
@media screen and (max-width:549px) and (min-width:200px){
    .single-project-aboutus .single-project-content .single-project-images{margin-top: 60px;grid-template-columns: 1fr;gap: 40px;}
    .single-project-aboutus .single-project-content .single-project-images .project-image{margin-top: 0px;}
    .single-project-aboutus .single-project-content .single-project-images .project-image:nth-child(5n){grid-column: 1;}
}

@media screen and (max-width:960px) and (min-width:841px){
    .white-section .section-bottom .content{margin-left: 0px;}
}
@media screen and (max-width:840px) and (min-width:200px){
    .white-section{background-color: var(--background-color);padding: 60px 20px;}
    .white-section::before, .white-section::after{display: none;}
    .white-section .flex-elements{grid-template-columns: 1fr;gap: 25px;}
    .white-section .white-section-before,
    .white-section .white-section-after{display: none;}
    .white-section .section-top{padding-bottom: 40px;}
    .white-section .section-top .btn{margin: 0px auto 0px 0px;}
    .white-section .section-top .content{margin-left: 0px;padding: 0px;}
    .white-section .section-bottom .grid-elements{grid-template-columns: 1fr;}
    .white-section .section-bottom .image, .white-section .section-bottom .background-image{display: none;}
    .white-section .section-bottom .content{margin-left: 0px;}
    .white-section .section-bottom .content .content-inside{max-width: 100%;}
}
@media screen and (max-width:1576px) and (min-width:887px){
    .white-section .section-bottom .image img:nth-child(2){width: 240px;height: 136px;top: -47px;object-fit: cover;}
}
@media screen and (max-width:886px) and (min-width:200px){
    .white-section .section-bottom .image img:nth-child(2){width: 200px;height: 112px;top: -39px;object-fit: cover;}
}

@media screen and (max-width:702px) and (min-width:200px){
    .project-section-top .grid-elements{grid-template-columns: repeat(2,1fr);}
    .project-section-bottom .category-image{height: 500px;}
    .project-section-bottom .category-image::before {display: none;}
    .project-section-bottom .category-title{color: var(--white-color);}
    .project-section-bottom .category-title .count p::after {background-color: var(--white-color);}
}
@media screen and (max-width:550px) and (min-width:200px){
    .project-section-top .grid-elements{grid-template-columns: repeat(1,1fr);}
    .project-section-top .project-section-top-left{padding: 30px 20px;}
    .project-section-top .project-section-top-right{padding: 30px 20px;}
    .project-section-top .project-section-top-right a{width: fit-content;justify-content: start;}
    .project-section-bottom .category-image{height: 500px;}
    .project-section-bottom .category-image::before {display: none;}
    .project-section-bottom .category-title{color: var(--white-color);}
    .project-section-bottom .category-title .count p::after {background-color: var(--white-color);}
}

@media screen and (max-width:1480px) and (min-width:1221px){
    .team-section .content{margin-left: 0px;}
    .team-section .images .background-image{top: 30px;}
}
@media screen and (max-width:1220px) and (min-width:200px){
    .team-section-bottom .content{margin-right: 0px;}
    .team-section .content{margin-left: 0px;}
    .team-section-top .images .team-card{margin-right: 0px;padding-right: 20px;}
}
@media screen and (max-width:882px) and (min-width:200px){
    .team-section{background-color: var(--gray-color);}
    .team-section::after{display: none;}
    .team-section .team-section-top, .team-section .team-section-bottom{display: none;}
    .team-section-mobile{display: block;}
    .team-card .team-card-image img{max-width: 100%;}
    .team-section-after{display: none;}
}
@media screen and (max-width:490px) and (min-width:200px){
    .team-section-mobile .grid-2-elements{grid-template-columns: 1fr;row-gap: 40px;}
    .team-card .team-card-social{padding-top: 10px;}
}

@media screen and (max-width:820px) and (min-width:200px){
    .press-section .grid-elements{grid-template-columns: 1fr;}
    .press-section .section-title{align-items: start;}
    .press-section .section-title h2{font-size: 42px!important;writing-mode: inherit;transform: none;left: 0px;letter-spacing: 0px;}
    .press-section .section-title img{display: none;}
    .press-section .section-press-elements{margin-left: 0px;margin-top: 40px;}
    .section-subtitle{align-items: start;flex-direction: row;align-items: center;}
    .section-subtitle .section-subtitle-top{justify-content: start;align-items: start;}
    .section-subtitle .section-subtitle-top h3{margin: 0px!important;}
    .section-subtitle .section-subtitle-bottom a p::after {top: 4px;}
}
@media screen and (max-width:540px) and (min-width:200px){
    .section-subtitle{flex-direction: column;gap: 30px;align-items: start;}
}

@media screen and (max-width:850px) and (min-width:200px){
    .project-section-bottom .category-image::before {display: none;}
    .project-section-bottom .category-title{color: var(--white-color);}
    .project-section-bottom .category-title .count p::after {background-color: var(--white-color);}
}

@media screen and (max-width:900px) and (min-width:711px){
    .aboutus-section .aboutus-content .section-content{padding: 40px 0px;}
}
@media screen and (max-width:710px) and (min-width:200px){
    .aboutus-section .grid-elements{grid-template-columns: 1fr;gap: 40px;}
    .aboutus-section .aboutus-content .section-content{padding: 20px 0px;}
    .aboutus-section .aboutus-content .section-content .image{top: 50%;left: 50%;transform: translate(-50%,-50%);}
}
@media screen and (max-width:494px) and (min-width:200px){
    .aboutus-section .aboutus-content .section-content .image img{max-width: 343px;height: 192px;}
}

@media screen and (max-width:670px) and (min-width:200px){
    .team-section-aboutus .grid-elements{grid-template-columns: 1fr;}
    .team-section-aboutus .team-section-aboutus-left{display: none;}
}
@media screen and (max-width:840px) and (min-width:501px){
    .section-team-elements .grid-3-elements{grid-template-columns: repeat(2,1fr);}
}
@media screen and (max-width:500px) and (min-width:200px){
    .section-team-elements .grid-3-elements{grid-template-columns: repeat(1,1fr);}
    .team-card{width: 100%;}
    .team-card .team-card-image img{max-width: 100%;}
}

@media screen and (max-width:1080px) and (min-width:200px){
    .projects-section .projects-content .grid-3-elements{grid-template-columns: repeat(2,1fr);}
}
@media screen and (max-width:710px) and (min-width:536px){
    .projects-section .grid-elements{grid-template-columns: 1fr;}
    .projects-section .projects-section-left{display: none;}
}
@media screen and (max-width:535px) and (min-width:200px){
    .projects-section .grid-elements{grid-template-columns: 1fr;}
    .projects-section .projects-section-left{display: none;}
    .projects-section .projects-content{margin-top: 0px;}
    .projects-section .projects-content .grid-3-elements{grid-template-columns: repeat(1,1fr);}
    .project-card .project-image{max-width: 100%;transition: 0.3s ease;}
}

@media screen and (max-width:817px) and (min-width:769px){
    .filters .tabs-button{gap: 10px;}
}
@media screen and (max-width:768px) and (min-width:200px){
    .filters .tabs-button{flex-direction: column;gap: 10px;}
}

@media screen and (max-width: 834px) and (min-width: 711px){
    #press-page .press-section-left, #press-page .section-subtitle{display: none;}
    #press-page .press-section .grid-elements{grid-template-columns: 1fr;}
    #press-page .press-section .section-press-elements{margin-left: 22%;}
}
@media screen and (max-width: 710px) and (min-width: 501px){
    #press-page .press-section-left, #press-page .section-subtitle{display: none;}
    #press-page .press-section .grid-elements{grid-template-columns: 1fr;}
    #press-page .press-section .section-press-elements{margin-left: 0px;}
}
@media screen and (max-width: 500px) and (min-width: 200px){
    #press-page .press-section-left, #press-page .section-subtitle{display: none;}
    #press-page .press-section .grid-elements{grid-template-columns: 1fr;}
    #press-page .press-section .section-press-elements{margin-left: 0px;}
    #press-page .press-element .press-image{width: 100%;max-width: 100%;position: relative!important;opacity: 1!important;visibility: visible!important;top: 0px!important;transform: translate(0,0)!important;}
    #press-page .section-press-elements .press-element{width: 100%;display: flex;flex-direction: column;gap: 20px;}
    #press-page .section-press-elements .press-element .press-image{order: 0;width: 100%;height: auto;/*aspect-ratio: 350/240;*/}
    #press-page .section-press-elements .press-element .press-element-title{order: 1;}
    #press-page .section-press-elements .press-element{margin-bottom: 50px;}
}

@media screen and (max-width: 710px) and (min-width:200px){
    .award-card .grid-2-elements {grid-template-columns: 1fr 180px;}
}

@media screen and (max-width:1496px) and (min-width:1369px){
    .contact-content{gap: 40px;}
}
@media screen and (max-width:1368px) and (min-width:1230px){
    .contact-content{display: grid;grid-template-columns: repeat(2,1fr);gap: 40px;}
}
@media screen and (max-width:1229px) and (min-width:200px){
    .aboutus-section .grid-elements{grid-template-columns: 1fr;row-gap: 40px;}
    #awards-page .aboutus-section .aboutus-content{max-width: 100%;}
}
@media screen and (max-width:1152px) and (min-width:954px){
    .contact-content{display: grid;grid-template-columns: repeat(2,1fr);gap: 40px;}
    .contact-content .contact-element:last-child{grid-column: 1/3;}
}
@media screen and (max-width:953px) and (min-width:200px){
    .contact-content{display: grid;grid-template-columns: repeat(1,1fr);gap: 40px;}
}

@media screen and (max-width:860px) and (min-width:200px){
    .section-team-elements::before {display: none;}
}

@media screen and (max-width:882px) and (min-width:200px){
    #section{padding: 60px 0px;}
}
@media screen and (max-width:840px) and (min-width:200px){
    .main-line{display: none;}
}
/*All pages code Ends*/


/*Footer code Starts*/
footer{width: 100%;position: relative;padding: 120px 20px 20px 20px;background-color: var(--white-color);}
footer .grid-elements{width: 100%;position: relative;display: grid;grid-template-columns: 0.4fr 1fr;gap: 20px;}
footer .footer-left .footer-logo img{max-width: 170px;}
footer .footer-left .footer-social{display: flex;gap: 10px;padding-top: 20px;}
footer .footer-left .footer-social a{width: 30px;height: 30px;position: relative;display: flex;justify-content: center;align-items: center;transition: 0.1s ease;}
footer .footer-left .footer-social a:hover img{transform: scale(1.1);transition: 0.1s ease;}
footer .footer-right{margin-left: auto;}
footer .footer-right .office{padding-bottom: 40px;}
footer .footer-right .office:last-child{padding-bottom: 0px;}
.office ul{list-style: none;}
.office ul li{display: flex;gap: 20px;padding-bottom: 5px;}
.office ul li:last-child{padding-bottom: 0px;}
.office ul li span{width: 150px;font-size: clamp(18px, 1.5vw, 16px) !important;line-height: clamp(26px, 2vw, 32px) !important;font-weight: 500;}
.office ul li p{font-weight: 300;color: var(--black-color);}
.office ul .address p{max-width: 140px;}
.office ul li p a{color: var(--black-color);text-decoration: none;}
.office ul li p a:hover{color: var(--green-color);}
footer .footer-bottom-elements{margin-top: 100px;}
footer .footer-bottom-elements .footer-bottom-elements-left{margin: auto 0px;}
footer .footer-bottom-elements .footer-bottom-element-right{margin-left: auto;}
footer .footer-bottom-elements .footer-bottom-element-right .elements-inside{width: 428px;max-width: 100%;display: flex;justify-content: space-between;align-items: center;gap: 20px;}
footer .footer-bottom-elements a{color: var(--black-color);text-decoration: none;}
footer .footer-bottom-elements a:hover{color: var(--green-color);}
footer .top-button{display: flex;gap: 10px;align-items: center;}
footer .top-button img{width: 30px;height: 30px;border-radius: 30px;border: 1px solid var(--black-color);padding: 6px;}

@media screen and (max-width:740px) and (min-width:200px){
    footer .footer-top-elements .grid-elements{grid-template-columns: 1fr;}
    footer .footer-right{margin-left: 0px;}
    footer ul{padding: 0px!important;}
    footer .footer-right .office:nth-child(1){padding-top: 40px;}
    footer .footer-bottom-elements{margin-top: 70px;}
}

@media screen and (max-width:684px) and (min-width:200px){
    footer .footer-bottom-elements .footer-bottom-element-right .elements-inside{width: 100%;}
}
/*Footer code Ends*/

/*Overlay code Starts*/
#overlay{width: 100%;height: 0dvh;position: fixed;top: 0px;left: 0px;padding: 0px 20px;background-color: var(--white-color);z-index: 99;visibility: hidden;opacity: 0;transition: 0.7s ease;}
.overlay-inside{width: 100%;height: 100%;position: relative;}
.overlay-inside-top{margin-top: 120px;}
.overlay-inside-top ul{padding: 0px;margin: 0px;list-style: none;}
.overlay-inside-top ul li{width: fit-content;transition: 0.2s ease;}
.overlay-inside-top ul li:hover{padding-left: 10px;transition: 0.2s ease;}
.overlay-inside-top ul li a{font-size: 32px;color: var(--black-color);text-decoration: none;transition: 0.2s ease;}
.overlay-inside-top ul li a:hover{color: var(--green-color);}
.overlay-inside-bottom{padding-top: 50px;}
.overlay-inside-bottom .element{padding-bottom: 20px;}
.overlay-inside-bottom .element-top{padding-bottom: 15px;}
.overlay-inside-bottom .element-bottom ul{padding-left: 0px;list-style: none;}
.overlay-inside-bottom .element-bottom ul li{display: flex;padding-bottom: 5px;}
.overlay-inside-bottom .element-bottom ul li span{width: 110px;display: block;font-weight: 500;}
.overlay-inside-bottom .element-bottom ul li a{font-weight: 300;color: var(--black-color);text-decoration: none;}
.overlay-inside-bottom .element-bottom ul li a:hover{color: var(--green-color);}
.overlay-inside-bottom .element.social-media .element-bottom{display: flex;gap: 20px;}
.overlay-inside-bottom .element.social-media .element-bottom a{width: 30px;height: 30px;position: relative;display: flex;justify-content: center;align-items: center;transition: 0.1s ease;}
.overlay-inside-bottom .element.social-media .element-bottom a:hover img{transform: scale(1.1);transition: 0.1s ease;}

#overlay.open{height: 100dvh;visibility: visible;opacity: 1;overflow: scroll;transition: 0.7s ease;}
/*Overlay code Ends*/

/* Header Active code starts */
.header-left .menu-button.active span{color: var(--black-color);}
.header-left .menu-button.active span:nth-child(2){width: 35px;}
.header-left .menu-button.active span:nth-child(1){transform: rotate(45deg) translateY(3px) translateX(2px);}
.header-left .menu-button.active span:nth-child(2){transform: rotate(-45deg) translateY(-3px) translateX(2px);}

header.open{background-color: var(--white-color);}
header.open .header-white{display: none;}
header.open .header-black{display: block;}
/* Header Active code ends */

/* Espa - Error code starts */
#espa{position: fixed;bottom: 30px;left: 20px;padding: 20px;background-color: #fff;border-radius: 12px;transition: opacity .25s ease, transform .25s ease;z-index: 10;}
#espa img{max-width: 320px;}

.error-section{max-width: 1200px;margin: auto;height: 60vh;}
.error-section .extreme-big{font-size: 300px!important;line-height: 300px!important;padding: 20px 0px;}

#espa.is-hidden{
  opacity: 0; pointer-events: none; transform: translateY(6px);
}

@media screen and (max-width:500px) and (min-width:200px){
  #espa img{max-width: 230px;}
}

@media screen and (max-width: 500px) and (min-width:200px){
    .error-section{height: 50vh;}
    .error-section .extreme-big{font-size: 200px!important;line-height: 200px!important;padding: 20px 0px;}
}

@media screen and (max-width:900px) and (min-width:200px){
    .section-team-elements-before{display: none;}
}
/* Espa - Error code ends */

/* Related Projects code starts */
.related-projects{position: relative;background-color: var(--background-color);}
.related-projects-inside{position: relative;max-width: 1200px;margin: auto;padding-left: 20px!important;padding-right: 20px!important;}
.related-projects-title{text-align: center;padding-bottom: 70px;}

.new-project-button{position: absolute;top: -221px;right: 20px;width: 200px;height: 200px;display: flex;justify-content: center;align-items: center;text-align: center;padding: 20px 10px;border-radius: 200px;color: var(--black-color);text-decoration: none;background-color: var(--green-color);transition: 0.2s ease;}
.new-project-button h4{color: var(--black-color);transition: 0.2s ease;}
.new-project-button:hover{background-color: var(--black-color);color: var(--white-color);transition: 0.2s ease;}
.new-project-button:hover h4{color: var(--white-color);transition: 0.2s ease;}

@media screen and (max-width: 750px) and (min-width: 520px){
    .related-projects .grid-3-elements{grid-template-columns: repeat(2,1fr);}
}
@media screen and (max-width: 519px) and (min-width: 200px){
    .related-projects .grid-3-elements{grid-template-columns: repeat(1,1fr);}
}

@media screen and (max-width: 900px) and (min-width: 200px){
    .new-project-button{display: none;}
}
/* Related Projects code ends */