/*=====
Template Name: Alice Production
Author: weco.digital
Author URI: https://weco.digital/
Version: 1.0
Description: Tema sostenible diseñado a medida
=======*/


/* Table of Content
==================================================
#BASIC
#RESPONSIVE
==========*/


/* BASIC */

@font-face {
	font-family: 'GeneralSans';
	src: url('assets/fonts/GeneralSans-Variable.woff2') format('woff2'),
		 url('assets/fonts/GeneralSans-Variable.woff') format('woff'),
		 url('assets/fonts/GeneralSans-Variable.ttf') format('truetype');
		 font-weight: 200 700;
		 font-display: swap;
		 font-style: normal;
}
  
@font-face {
	font-family: 'GeneralSansItalic';
	src: url('assets/fonts/GeneralSans-VariableItalic.woff2') format('woff2'),
		 url('assets/fonts/GeneralSans-VariableItalic.woff') format('woff'),
		 url('assets/fonts/GeneralSans-VariableItalic.ttf') format('truetype');
		 font-weight: 200 700;
		 font-display: swap;
		 font-style: italic;
}

:root {
	--black: #000;
	--gray: #2c2c2c;
	--white: #fff;
	--red: #d70000;
	--black-overlay: #00000072;
}

::-moz-selection {
	color: var(--white);
	background: var(--black);
}
  
::selection {
	color: var(--white);
	background: var(--black);
}

.invert .loop-holder .loop-holder__text h1::-moz-selection,
.invert h1::-moz-selection,
.invert h2::-moz-selection,
.invert p::-moz-selection,
.invert b::-moz-selection,
.invert a::-moz-selection,
.invert .button::-moz-selection,
.invert ul li::-moz-selection,
footer h3::-moz-selection,
footer p::-moz-selection,
footer a::-moz-selection,
footer b::-moz-selection {
	color: var(--black);
	background: var(--white);
}

.invert .loop-holder .loop-holder__text h1::selection,
.invert h1::selection,
.invert h2::selection,
.invert p::selection,
.invert b::selection,
.invert a::selection,
.invert .button::selection,
.invert ul li::selection,
footer h3::selection,
footer p::selection,
footer a::selection,
footer b::selection {
	color: var(--black);
	background: var(--white);
}

::-webkit-scrollbar {
	display: none;
}

* {
	/* border: 1px solid blue; */
	margin: 0;
	padding: 0;
	-webkit-tap-highlight-color: transparent;
}

body,
html {
	overflow-x:hidden;
}

body {
	width: 100%;
	height: 100%;
	font-family: 'GeneralSans', sans-serif !important;
	color: var(--black);
	background-color: var(--white);
	font-size: 14px;
	font-variation-settings: 'wght' 450;
	letter-spacing: .5px;
	margin: 0;
	padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-variation-settings: 'wght' 500;
}

h1 {
	font-size: 50px;
}

h2 {
	font-size: 38px;
}

h3 {  
	font-size: 26px;  
}

h4 {  
	font-size: 22px;  
}

h5 {  
	font-size: 20px;  
}

h6 {  
	font-size: 18px;  
}

b,
strong {
	font-variation-settings: 'wght' 600;
}

hr {
	border-style: none;
	border-bottom: 2px solid var(--black);
}

a {
	color: var(--black);
	text-decoration: none;
	display: inline-block;
    position: relative;
    padding: 2px 0;
	cursor: pointer;
}

.invert a {
	color: var(--white);
}

a:after {
	content: '';
	position: absolute;
	width: 100%;
	height: 3px;
	bottom: 0;
	left: 0;
	background-color: var(--red);
	transform: scaleX(0);
	transform-origin: bottom right;
	transition: transform 0.3s;
}
a:hover:after {
	transform-origin: bottom left;
	transform: scaleX(1);
}


/* LOADING */

.main-animation {
	animation: main-animation 4s cubic-bezier(.7,0,.3,1);
	transform-origin: top;
}

@keyframes main-animation {
	0%,
	70% {
		transform: scale(1.4);
	}
	100% {
		transform: scale(1);
	}
}

.main-animation-secondary {
	animation: main-animation-secondary 1.85s cubic-bezier(.7,0,.3,1);
	transform-origin: top;
}

@keyframes main-animation-secondary {
	0% {
		transform: scale(1.4);
	}
	100% {
		transform: scale(1);
	}
}

.loading-animation {
	pointer-events: none;
	z-index: 10;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: row;
	background-color: var(--black);
	gap: 2rem;
	animation: loading-animation 3.7s cubic-bezier(.7,0,.3,1);
}

@keyframes loading-animation {
	0%,
	75% {
		height: 100vh;
		pointer-events: all;
	}
	100% {
		height: 0;
		pointer-events: none;
	}
}

.loading-animation lottie-player {
	max-width: 350px;
	height: 135px;
	width: 100%;
	animation: loading-logo 3s cubic-bezier(.7,0,.3,1);
	z-index: 11;
	opacity: 0;
}

@keyframes loading-logo {
	0% {
		transform: translateX(-50px);
		opacity: 1;
	}
	30% {
		transform: translateX(0);
	}
	90% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

.video-container {
	position: absolute;
	transform: translateX(calc(175px + 1rem));
	width: 350px;
	height: fit-content;
	overflow: hidden;
	animation: loading-video 3s cubic-bezier(.7,0,.3,1);
	opacity: 0;
}

@keyframes loading-video {
	0%,
	20% {
		transform: translateX(-150px);
		width: 0;
	}
	50% {
		transform: translateX(calc(175px + 1rem));
		width: 350px;
	}
	90% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

.loading-animation .video-placeholder {
	width: 350px;
	height: 250px;
}

.hidden {
    opacity: 0;
    transition: all .5s cubic-bezier(0.77, 0, 0.175, 1);
    transform: translateY(10px);
	visibility: hidden;
}

hr .hidden {
	width: 0;
}

hr .show {
	opacity: 1;
	transform: translateY(0);
	visibility: visible;
	width: 100%;
}

.show {
    opacity: 1;
    transform: translateY(0);
	visibility: visible;
}

.show:nth-of-type(2) {
	transition-delay: .05s;
}

.show:nth-of-type(3) {
	transition-delay: .1s;
}
.show:nth-of-type(4) {
	transition-delay: .15s;
}
.show:nth-of-type(5) {
	transition-delay: .2s;
}
.show:nth-of-type(6) {
	transition-delay: .25s;
}
.show:nth-of-type(7) {
	transition-delay: .3s;
}
.show:nth-of-type(8) {
	transition-delay: .35s;
}
.show:nth-of-type(9) {
	transition-delay: .4s;
}
.show:nth-of-type(10) {
	transition-delay: .45s;
}

.error-center {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100vh;
}





/* MENU */

header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 6;
	background-color: var(--white);
}

header,
.menu-toggle {
	animation: header .5s cubic-bezier(.7,0,.3,1);
}

@keyframes header {
	0% {
		top: -70px;
	}
	100% {
		top: 0;
	}
}

.header-top {
	width: calc(100% - 4rem);
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	height: 70px;
	padding: 0 2rem;
}

.logo {
	cursor: pointer;
}

.logo::after {
	display: none;
}

.menu-wrapper {
	z-index: 5;
	position: fixed;
	top: 0;
	left: 0;
	background-color: var(--white);
	width: 100%;
	height: 70px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	transition: height .7s cubic-bezier(.7,0,.3,1);
}

.menu-links {
	display: none;
	flex-direction: column;
	align-items: center;	
	transition: all .3s ease;
}

.menu-links a {
	font-size: 65px;
	text-align: center;
	text-decoration: none;
	color: var(--black);
	font-variation-settings: 'wght' 500;
	animation: menu-links 1s;
	transition: all .3s;
}

.menu-links a:hover {
	font-variation-settings: 'wght' 700;
}

@keyframes menu-links {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 0;
		transform: translateY(-10px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.menu-links a:nth-of-type(2) {
	animation-duration: 1.1s;
}

.menu-links a:nth-of-type(3) {
	animation-duration: 1.2s;
}

.menu-links a:nth-of-type(4) {
	animation-duration: 1.3s;
}

#menu-check {
	display: ;
}

.open-menu {
	height: 100vh;
}

.menu-toggle {
	transition: rotate .3s;
	cursor: pointer;
	height: 50px;
	position: fixed;
	top: .5rem;
	left: 50%;
	translate: -50% 0;
}

.menu-toggle:hover path:nth-of-type(2) {
	transform: scaleX(.6);
}

.menu-toggle path {
	transition: transform .3s;
	transform-origin: center center;
}

.active-menu {
	translate: -50% 0;
	rotate: 90deg;
}

.active-menu:hover path:nth-of-type(2) {
	transform: none;
}

.menu-contact {
	display: none;
	opacity: 0;
	transition: opacity .3s;
	animation: menu-contact 1s;
}

@keyframes menu-contact {
	0% {
		opacity: 0;
	}
	70% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

/* .active-menu path:first-of-type {
	transform: rotate(45deg) translateY(10px);
}

.active-menu path:nth-of-type(2) {
	transform: scale(0,1);
}

.active-menu path:last-of-type {
	transform: rotate(-45deg) translateY(-10px);
} */

.menu-contact-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 2rem;
}

.menu-contact-inner a {
	font-style: italic;
	font-variation-settings: 'wght' 700;
}

.language {
	display: flex;
	flex-direction: row;
	justify-content: center;
	gap: .15rem;
	margin-bottom: 2rem;
}

.language li {
	list-style: none;
	font-variation-settings: 'wght' 700;
	text-transform: uppercase;
}

.language li::after {
	content: "·";
	margin: 0 .15rem;
}

.language li:last-of-type::after {
	content: "";
}


/* BUTTON */

.button,
input[type="submit"],
.linkedin-page-post-user-container {
	font-size: 16px !important;
	padding: 10px 30px !important;
	border: 1px solid var(--black) !important;
	border-radius: 40px !important;
	text-decoration: none !important;
	color: var(--black) !important;
	background: var(--white) !important;
	line-height: normal !important;
	height: auto !important;
	transition: color, background-color !important;
	transition-duration: .3s !important;
}

.button:hover,
.linkedin-page-post-user-container:hover {
	cursor: pointer;
	background-color: var(--black) !important;
	color: var(--white) !important;
}

input[type="submit"] {
	border: 1px solid var(--white);
}

input[type="submit"]:hover {
	cursor: pointer;
	border: 1px solid var(--white) !important;
	background-color: var(--black) !important;
	color: var(--white) !important;
}

.button::after {
	display: none;
}

.invert .accordion-button[aria-expanded='true'],
.invert .button {
	border: 1px solid var(--white);
	background-color: var(--black);
	color: var(--white);
}

.invert .button:hover {
	border: 1px solid var(--white) !important;
	background-color: var(--black) !important;
	color: var(--white) !important;
}


/* MAIN */

main {
	display: flex;
	flex-direction: column;
	align-items: center;
}

#video-header {
	padding-top: 70px;
	width: 100%;
	max-height: 100%;
	overflow: hidden;
}

#video-header source {
	min-width: 100%;
	min-height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.fadeRight {
	opacity: 0;
	transform: translate(10vh, 0vh);
	transition: all 1s;
}
  
.visible {
	opacity: 1;
	transform: translate(0, 0);
}

#scroll-text {
	margin-left: 1rem;
	width: 100%;
	font-variation-settings: 'wght' 500;
	line-height: 100%;
	text-transform: uppercase;
	text-align: left;
}

/* MARQUEE*/

.scroll-container {
	margin: 4vw 0;
	width: 100%;
}

.scroll-container h1 {
	font-size: 6.5vw;
	line-height: 100%;
	text-transform: uppercase;
}

.loop-holder {
    padding: 0;
    display: flex;
    white-space: nowrap;
    overflow: hidden;
}

.loop-holder__text,
.loop-holder__image {
    animation: textLoop 40s linear infinite;
    line-height: 1;
    padding-right: 7rem;
}

.loop-holder__image {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 7rem;
}

.loop-holder__image img {
	max-height: 2.5rem;
}

.loop-holder__text h1 {
	font-variation-settings: 'wght' 500;
	font-size: 6.5vw;
	line-height: 100%;
	text-transform: uppercase;
}

@keyframes textLoop {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}


/* SECTIONS */

section {
	width: 100%;
}

.margin-section {
	margin: 0 10vw;
}

.spacer {
	width: 100%;
	height: 6rem;
}

.spacer-small {
	width: 100%;
	height: 3rem;
}

.spacer-big {
	width: 100%;
	height: 9rem;
}

.invert {
	background-color: var(--black);
	color: var(--white);
}

.text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 2rem 0;
}

.three-section,
.two-section {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	width: 100%;
	gap: 1rem;
}

.two-section {
	align-items: flex-start !important;
}

.three-section div:nth-of-type(2) {
	border-left: 1px solid var(--white);
	border-right: 1px solid var(--white);
}

.three-section h2 {
	cursor: pointer;
}

.three-section h2,
.two-section h2 {
	font-size: 50px;
	line-height: 100%;
}

.three-section p,
.two-section p {
	font-size: 18px;
	max-width: 480px;
}

.three-section h2,
.three-section p {
	height: auto;
}

.twenty-row,
.sixty-row {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 480px;
}

.twenty-row {
	width: 25%;
}

.sixty-row {
	width: 50%;
	padding: 0 2rem;
}

.half-row {
	width: 50%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 1rem 0;
}

.half-row p,
.half-row h5 {
	margin-bottom: 1rem;
}

.half-row ul li {
	font-size: 18px;
}

.half-row:first-of-type {
	margin: 5rem 0 5rem 10vw;
}

.half-row:last-of-type {
	margin: 5rem 10vw 5rem 0;
}


/* ACCORDION */

.accordion {
	width: 100%;
}

.accordion .accordion-button {
	display: flex;
	align-items: center;
	justify-content: space-between;
	text-align: left;
	width: 100%;
	font-size: 20px;
	border: none;
	background: none;
	outline: none;
	transition: all .3s;
	border-top: 1px solid var(--black);
}

.accordion .accordion-item:last-of-type {
	border-bottom: 1px solid var(--black);
}
  
.accordion .accordion-button:hover {
	cursor: pointer;
	font-variation-settings: 'wght' 700;
}
  
.accordion .icon {
	width: 22px;
	height: 22px;
	margin-right: 1rem;
}

.accordion .icon::after,
.accordion .icon::before {
	border-bottom: 2px solid var(--black);
	width: 20px;
	transition: all .3s ease-in-out;
}
  
.accordion .icon::before {
	display: block; 
	content: '';
	transform: translateY(1px);
}
  
.accordion .icon::after {
	display: block; 
	content: '';
	transform: rotate(90deg);
}
  
.accordion .accordion-button[aria-expanded='true'] {
	font-variation-settings: 'wght' 700;
}

.accordion .last[aria-expanded='true'] {
	border-bottom: 1px solid var(--white);
}
  
.accordion .accordion-button[aria-expanded='true'] .icon::after {
	transform: rotate(180deg) translateY(1px);
}
  
.accordion .accordion-button[aria-expanded='true'] + .accordion-content {
	opacity: 1; 
	max-height: 20rem; 
}
  
.accordion .accordion-content {
	opacity:0;
	max-height: 0;
	overflow:hidden;
	transition-property:max-height,opacity;
	transition-duration:.3s,.3s;
	transition-timing-function:ease-in-out,ease-in-out;
}

.accordion .accordion-content p {
	max-width: 100%;
}

.accordion .accordion-button p {
	font-variation-settings: 'wght' 700;
}

.accordion-text {
	display: flex;
	flex-direction: row;
	align-items: baseline;
	gap: 0 5vw;
}

.accordion-text p,
.accordion-content p {
	margin: 2rem 0;
}

.accordion-title {
	padding-bottom: 2rem;
	max-width: 25rem;
}

/* SELECTED PROJECTS */

.selected-projects{
	margin: 0 10vw;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 2rem;
}

.selected-projects a {
	position: relative;
	overflow: hidden;
	width: calc(50vw - 10vw - 2rem);
	height: calc(27.71vw - 2rem);
	cursor: pointer;
}

.selected-projects a::after {
	display: none;
}

.selected-projects a img {
	width: calc(50vw - 10vw - 2rem);
	height: calc(27.71vw - 2rem);
	transition: transform .3s ease-out;
}

.selected-projects a::after {
	content: "";
	display: inline-block;
	transform: scaleX(1) !important;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: calc(50vw - 10vw - 2rem);
	height: calc(27.71vw - 1.7rem);
	background-color: var(--black-overlay);
}

.selected-projects a:hover img {
	transform: scale(1.05);
}

.selected-projects a .project-info {
	position: absolute;
	bottom: 2vw;
	left: 2vw;
	z-index: 2;
}

.selected-projects a .project-info h5 {
	text-transform: uppercase;
	font-size: 18px;
	font-variation-settings: 'wght' 600;
}

.selected-projects a .project-info span {
	font-size: 16px;
	font-variation-settings: 'wght' 400;
}

.wrapper-right {
	margin: 0 10vw;
	display: flex;
	justify-content: flex-end;
}


/* SERVICES */

.page-title {
	font-size: 60px;
	line-height: 105%;
	font-variation-settings: 'wght' 500;
	margin: 8rem 10vw 0;
}

.services {
	padding: 70px 0;
}

.services h1 {
	margin: 8rem 10vw 4rem;
	line-height: 105%;
}

.main {
	padding: 0;
	overflow-x: scroll;
	overflow-y: hidden;
}

.items {
	position: relative;
	width: 100%;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
	user-select: none;
	cursor: pointer;
	padding-left: 10vw;
	transition: padding .5s cubic-bezier(0,0,.3,1);
}

.items:hover {
	padding-left: 5vw;
}

.item {
	display: inline-block;
	height: 250px;
	width: 425px;
	object-fit: cover;
	margin: 2em 2rem 2rem 0;
}

.item:last-of-type {
	padding-right: 10vw;
}

.item-large {
	display: inline-block;
	height: 600px;
	width: 950px;
	object-fit: cover;
	margin: 2em 2rem 2rem 0;
}




/* PROJECTS */

.project {
	margin: 6rem 10vw 0;
	display: block;
	height: fit-content;
}

.project-date {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	gap: 2rem;
	margin-top: 2rem;
}

.project-date p {
	font-size: 18px;
	text-transform: uppercase;
	font-variation-settings: 'wght' 400;
}

.project-date span {
	content: "";
	width: 1px;
	height: 24px;
	background-color: var(--white);
}

.project-title {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin: .5rem 0 1rem;
}

.project-title h1 {
	word-break: break-word;
}

.project-image{
	width: 100%;
	position: relative;
	min-height: auto;
	height: 100%;
}

.project-image img,
.project-description {
	width: 100%;
	transition: all .3s ease-out;
}

.project-image-toggle {
	height: 100%;
	animation: image .5s ease-out;
}

@keyframes image {
	0% {
		height: 0;
	}
	100% {
		height: 100%;
	}
}

.project-description {
	display: none;
	transform: translateY(30px);
	font-size: 20px;
	top: 0;
	margin: 5rem 0;
	opacity: 0;
}

.project-description p {
	max-width: 45rem;
}

.project-description .grid-item .items {
	padding-left: 0;
	padding-right: 0;
	transition: transform .5s cubic-bezier(0,0,.3,1);
}

.project-description .grid-item .items .item {
	display: inline-block;
	height: 250px;
	width: 425px;
	object-fit: cover;
	margin: 2em 2rem 2rem 0;
}

.project-description .grid-item .items .item:last-of-type {
	padding-right: 0;
	margin: 2em 0 2rem 0;
}

.project-description .grid-item:hover .items {
	transform: translateX(-20px);
}

.expand-icon {
	width: 50px;
	height: 50px;
	min-width: 50px;
	min-height: 50px;
	cursor: pointer;
	margin: .5rem 0;
}

.expand-icon:hover path{
	scale: 1.8;
	stroke-width: 1.5;
}

.expand-icon path {
	transform-origin: center center;
	transition: all .3s cubic-bezier(0,0,.3,1);
}




/* ABOUT */

.about-header {
	width: 100%;
	height: 100vh;
	overflow: hidden;
}

.about-header::after {
	background-color: var(--black-overlay);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	content: "";
	margin-top: 48px;
}

.about-header img {
	width: 100%;
	height: 100vh;
	display: block;
	object-fit: cover
}

.about-header h1 {
	font-size: 130px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	color: var(--white);
	z-index: 1;
	width: fit-content;
	white-space: nowrap;
	animation: header-title 2.5s cubic-bezier(.7,0,.3,1);
	transform-origin: left top;
	font-variation-settings: 'wght' 200;
}

@keyframes header-title {
	0%,
	60% {
		opacity: 0;
		transform: translate(-50%,-50%);
		font-variation-settings: 'wght' 900;
	}
	100% {
		opacity: 1;
		transform: translate(-50%,-50%);
		font-variation-settings: 'wght' 200;
	}
}

.about-half-text {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	gap: 2rem;
	width: calc(100vw - 20vw);
	padding: 6rem 10vw;
}

.about-dual-text {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	gap: 2rem;
	width: calc(100vw - 20vw);
	padding: 6rem 10vw;
}

.about-half-text .dual-text {
	max-width: 100%;
	width: 100%;
	font-size: 18px;
}

.about-dual-text .dual-text {
	max-width: 30rem;
	width: 100%;
	font-size: 18px;
}

.aboutIconText {
	display: flex;
	flex-direction: row;
	gap: 2rem;
	align-items: flex-start;
	justify-content: space-around;
	padding: 2rem 0;
}

.aboutIcon {
	max-width: 3rem;
	max-height: 3rem;
}

.aboutText {
	width: 30vw;
	max-width: 30rem;
}

.projects .loop-holder .loop-holder__image img {
	height: 100%;
	max-height: 4.5rem;
}

.our-offices {
	position: relative;
	width: 100%;
	background-image: url(assets/images/offices.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 37.3rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8rem;
	color: var(--white);
}

.our-offices::after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 37.3rem;
	background-color: var(--black-overlay);
	content: "";
}

.our-offices a {
	color: var(--white);
}

.our-offices-title,
.offices-wrapper {
	width: 80vw;
	z-index: 1;
}

.offices-wrapper {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
}


/* CONTACT */

.wpcf7,
label,
.two-section .half-row form p {
	width: 100%;
	max-width: 100%;
}

form label {
	font-variation-settings: 'wght' 400;
}

form input:focus,
form textarea:focus {
	outline: none;
}

input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
    background-color: transparent;
    color: var(--white);
    width: 100%;
	border-style: none;
	border-bottom: 1px solid var(--white);
	margin: 1rem 0 2rem;
}

textarea {
	height:0em;
	resize: none;
}

input[type="submit"] {
	float: right;
}

.sk-ww-linkedin-page-post {
	padding: 2rem 0 4rem;
	margin: 0 !important;
}

.sk-ww-linkedin-page-post,
.linkedin-page-post-user-root-container,
.swiper-container {
	border-radius: 0 !important;
	font-family: 'GeneralSans', sans-serif !important;
	font-variation-settings: 'wght' 500;
}

.sk-arrow {
	border-color: var(--white) !important;
	opacity: 1;
}

.grid-item-linkedin-page-post {
	border-radius: 40px;
}






/* FOOTER */

footer {
	background-color: var(--black);
	color: var(--white);
	width: 100%;
	display: flex;
	justify-content: space-between;
	padding: 8rem;
	font-size: 16px;
}

footer svg {
	margin-left: 10vw;
}

footer .text {
	gap: .5rem;
}

footer a {
	color: var(--white);
}

footer h3 {
	margin-left: 10vw;
	font-size: 45px;
	font-variation-settings: 'wght' 400;
}

footer .language {
	margin-right: 10vw;
}

.adress-phone {
	display: flex;
	flex-direction: column;
}





/* RESPONSIVE */

@media (max-width: 1150px) {
	.about-dual-text {
		flex-direction: column;
	}
}

@media (max-width: 900px) {
	.loading-animation {
		flex-direction: column;
		gap: 3rem;
		animation: loading-animation 3.7s cubic-bezier(.7,0,.3,1);
	}

	.loading-animation lottie-player {
		max-width: 200px;
		height: auto;
	}
	
	.video-container {
		transform: translateY(70px);
	}
	
	@keyframes loading-video {
		0%,
		20% {
			transform: translateY(-100px);
			height: 0;
		}
		50% {
			transform: translateY(70px);
			height: 250px;
		}
		90% {
			opacity: 1;
		}
		100% {
			opacity: 0;
		}
	}
}

@media (max-width: 780px) {

	h1 {
		font-size: 40px;
	}
	
	h2 {
		font-size: 35px;
	}
	
	h3 {  
		font-size: 20px;  
	}

	.three-section h2,
	.two-section h2 {
		font-size: 40px;
	}

	.three-section p,
	.two-section p,
	.two-section ul li {
		font-size: 16px;
	}

	.accordion-button,
	.accordion-title {
		font-size: 16px;
	}

	.selected-projects a .project-info h5 {
		font-size: 16px;
	}

	.selected-projects a .project-info span {
		font-size: 14px;
	}

	.page-title {
		font-size: 45px;
	}

	.about-header h1 {
		font-size: 11vw;
	}

	.margin-section {
		margin: 0 1.5rem;
	}

	.three-section,
	.two-section {
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		padding: 3rem 0;
	}

	.twenty-row,
	.sixty-row {
		height: auto;
		width: auto;
		padding: 3rem 1.5rem;
	}

	.three-section div:nth-of-type(2) {
		border-left: none;
		border-right: none;
		border-top: 1px solid var(--white);
		border-bottom: 1px solid var(--white);
		padding: 1.5rem;
		margin: 0;
	}

	.three-section p {
		max-width: 100%;
	}

	.sixty-row,
	.our-offices-title,
	.offices-wrapper,
	.services,
	.half-row {
		width: calc(100% - 3rem);
	}

	.half-row:first-of-type {
		margin: 1.5rem 1.5rem .5rem;
	}

	.half-row:last-of-type {
		margin: .5rem 1.5rem 1.5rem;
	}

	.selected-projects {
		margin: 0 1.5rem;
	}

	.selected-projects a,
	.selected-projects a img {
		width: 100%;
		height: calc(66.03vw - 2rem);
	}

	.selected-projects a::after {
		width: 100%;
		height: calc(66.03vw - 1.5rem);
	}

	.wrapper-right {
		margin: 0 1.5rem;
	}

	.loop-holder__image {
		gap: 4rem;
	}

	.accordion .accordion-button[aria-expanded='true'] + .accordion-content {
		max-height: 20rem;
	}

	.accordion-content p {
		margin: 1rem 0 4rem;
	}

	.accordion-content p p {
		margin: 0;
	}

	.page-title {
		margin: 6rem 1.5rem 2rem;
	}

	.project {
		margin: 4rem 1.5rem;
	}

	.services h1 {
		margin: 6rem 0;
		font-size: 40px;
	}

	.services p {
		font-size: 40px;
		margin: 4rem 0 6rem;
	}

	.item {
		min-height: 170px;
		min-width: 272px;
		height: 170px;
		width: 272px;
   	}

	.item:last-of-type {
		margin-right: 2rem;
	}

	.item-large {
		width: 630px;
		height: 400px;
	}

	.items {
		padding-left: 1.5rem;
	}

	.project-description {
		margin: 2rem 0;
		font-size: 14px;
	}

	.project-description .grid-item .items .item {
		min-height: 170px;
		min-width: 272px;
		height: 170px;
		width: 272px;
	}

	.project-title h1 {
		font-size: 40px;
		line-height: 105%;
	}

	.expand-icon {
		margin: 0;
		width: 40px;
		height: 40px;
		min-width: 40px;
		min-height: 40px;
	}

	.project-date {
		gap: .5rem;
	}

	.project-date p {
		font-size: 14px;
	}

	.about-dual-text {
		padding: 4rem 1.5rem;
	}

	.about-header {
		height: 40vh;
	}
	
	.about-header::after {
		height: 40vh;
	}
	
	.about-header img {
		height: 40vh;
	}

	.about-header h1 {
		top: calc(20vh + 50px);
	}

	.about-half-text {
		flex-direction: column;
		gap: 0;
		width: 100%;
		padding: 0;
	}

	.aboutIcon {
		margin-left: 1.5rem;
	}

	.aboutText {
		width: 80vw;
		margin-right: 1.5rem;
	}

	.our-offices {
		height: 43.5rem;
	}

	.our-offices::after {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 43.5rem;
		background-color: var(--black-overlay);
		content: "";
	}

	.offices-wrapper {
		gap: 2rem 1rem;
		flex-wrap: wrap;
	}

	.offices-wrapper p {
		width: 45%;
	}

	footer {
		flex-direction: column;
		gap: 2rem;
		padding: 3rem 1.5rem;
		width: calc(100% - 3rem);
		justify-content: center;
	}

	footer h3,
	footer p,
	footer .language,
	footer .text {
		width: fit-content;
	}

	.menu-contact .language {
		margin-bottom: 8rem;
	}

	footer svg {
		margin-left: 0;
	}

	footer h3 {
		margin-left: 0;
	}
	
	footer .language {
		margin-right: 0;
	}

}

@media (max-width: 640px){
}

@media (max-width: 500px) {
	.desktop {
		display: none;
	}

	.header-top {
		padding: 0 1.5rem;
	}

	.menu-toggle {
		left: auto;
		right: 1rem;
	}

	.menu-links a {
		font-size: 40px;
	}
}

@media (max-width: 320px) {
	.offices-wrapper {
		flex-direction: column;
		gap: 2rem;
		flex-wrap: nowrap;
	}

	.offices-wrapper::after {
		height: 58.4rem;
	}

	.offices-wrapper p {
		width: 100%;
	}
}

@media (max-width: 320px) {
}