@charset "UTF-8";
/*

@Author: Themezinho
@URL: http://www.themezinho.net

This file contains the styling for the actual theme, this
is the file you need to edit to change the look of the
theme.


// Table of contents //

	01.	GOOGLE FONTS
	02.	BODY
	03.	CUSTOM CLASSES
	04. FORM ELEMENTS
	05.	SECTIONS
	06.	HTML TAGS
	07.	LINKS
	08.	MODAL
	09.	PAGINATION
	10. PRELOADER
	11.	TRANSITION OVERLAY
	12.	SANDWICH BUTTON
	13.	SCROLL DOWN
	14.	NAVIGATION MENU
	15.	HEADER
	16.	SOCIAL MEDIA
	17.	NAVBAR
	18.	SLIDER
	19.	PAGE HEADER
	20.	VIDEO BG
	21.	WORKS
	22.	FEATURES CONTENT
	23.	LISTING CONTENT
	24.	FULL MEDIA CONTENT
	25.	INTRODUCTION
	26. OUR TEAM
	27.	NEWS
	28.	SAY HELLO
	29.	LOGOS
	30.	FOOTER
	31.	RESPONSIVE TABLET FIXES
	32. REPSONSIVE MOBILE FIXES



*/
@import url("https://fonts.googleapis.com/css?family=Dancing+Script|Fjalla+One|Poppins:400,600,800&subset=latin-ext");
/* BODY */
* {
  outline: none !important;
}

body {
  margin: 0;
  padding: 0;
  font-family: "Poppins", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -moz-osx-font-smoothing: grayscale;
  font-size: 17px;
  color: #0e0e0e;
}

/* CUSTOM HTML ELEMENTS */
img {
  max-width: 100%;
}

/* CUSTOM ELEMENTS */
.overflow {
  overflow: hidden !important;
}

/* LINKS */
a {
  color: #0e0e0e;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

a:hover {
  color: #0e0e0e;
}

a:active {
  color: #0e0e0e;
}

/* SECTIONS */
section {
  overflow: hidden;
}

/* CUSTOM CONTAINER */
@media (min-width: 1280px) {
  .container {
    max-width: 1260px;
  }
}
@media (min-width: 1170px) {
  .container {
    max-width: 1100px;
  }
}

/* PAGE LOADED */
.page-loaded {
  overflow: inherit;
}
.page-loaded .preloader {
  bottom: -100%;
  transition-delay: 0.55s;
}
.page-loaded .preloader .layer {
  bottom: -100%;
}
.page-loaded .preloader .inner {
  transform: translateY(30px);
  opacity: 0;
}
.page-loaded header {
  transform: scale(1);
  transition-delay: 0.6s;
}
.page-loaded .navbar {
  transform: translateY(0);
  transition-delay: 0.75s;
}

/* PRELOADER */
.preloader {
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 11;
  overflow: hidden;
  background: #D66344;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}
.preloader .layer {
  width: 25%;
  height: 100%;
  position: absolute;
  bottom: 0;
  background: #000;
  z-index: 2;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}
.preloader .layer:nth-child(1) {
  left: 0;
  transition-delay: 0.15s;
}
.preloader .layer:nth-child(2) {
  left: 25%;
  transition-delay: 0.2s;
}
.preloader .layer:nth-child(3) {
  left: 50%;
  transition-delay: 0.25s;
}
.preloader .layer:nth-child(4) {
  left: 75%;
  transition-delay: 0.3s;
}
.preloader .inner {
  margin: 0;
  position: relative;
  z-index: 3;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}
.preloader figure {
  display: block;
  margin: 0;
}
.preloader figure img {
  height: 80px;
}
.preloader .typewriter {
  height: 26px;
  line-height: 26px;
  display: inline-block;
  transform: translateY(10px);
  color: #fff;
  font-family: "Fjalla One", sans-serif;
  font-size: 13px;
  text-transform: uppercase;
}
.preloader .typewriter #typewriter-text {
  float: left;
  margin-left: 5px;
  margin-top: -2px;
  margin-right: 3px;
}
.preloader .typewriter #typewriter-suffix {
  width: 2px;
  height: 22px;
  display: inline-block;
  background: #D66344;
  text-indent: -1000px;
  overflow: hidden;
}

/* TRANSITION OVERLAY */
.transition-overlay {
  width: 100%;
  height: 0;
  position: fixed;
  background: #D66344;
  left: 0;
  bottom: 0;
  z-index: 15;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}
.transition-overlay .layer {
  width: 25%;
  height: 0;
  position: absolute;
  bottom: 0;
  background: #000;
  z-index: 2;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}
.transition-overlay .layer:nth-child(1) {
  left: 0;
  transition-delay: 0.25s;
}
.transition-overlay .layer:nth-child(2) {
  left: 25%;
  transition-delay: 0.3s;
}
.transition-overlay .layer:nth-child(3) {
  left: 50%;
  transition-delay: 0.35s;
}
.transition-overlay .layer:nth-child(4) {
  left: 75%;
  transition-delay: 0.4s;
}
.transition-overlay.active {
  height: 100%;
}
.transition-overlay.active .layer {
  height: 100%;
}


/* NAVIGATION MENU */
.navigation-menu {
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 9;
  visibility: hidden;
}
.navigation-menu img {
    position: absolute;  /* Fija la imagen para que esté siempre visible al hacer scroll */
    bottom: -250px;     /* Separa la imagen de la parte inferior de la pantalla */
    left: 50%;        /* Centra la imagen horizontalmente */
    transform: translateX(-50%);  /* Ajusta para centrar perfectamente en el medio */
  }
  
.navigation-menu .bg-layers {
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  position: absolute;
  left: 0;
  top: 0;
}
.navigation-menu .bg-layers * {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}
.navigation-menu .bg-layers span {
  width: 0%;
  height: 100%;
  position: absolute;
  top: 0;
  transform: skewX(0);
  background: #0e0e0e;
}
.navigation-menu .bg-layers span:nth-child(1) {
  left: 0;
}
.navigation-menu .bg-layers span:nth-child(1):before {
  content: "";
  width: 150%;
  height: 100%;
  background: #0e0e0e;
  position: absolute;
  left: -149%;
  top: 0;
}
.navigation-menu .bg-layers span:nth-child(2) {
  left: 25%;
}
.navigation-menu .bg-layers span:nth-child(3) {
  left: 50%;
}
.navigation-menu .bg-layers span:nth-child(4) {
  left: 75%;
}
.navigation-menu .bg-layers span:nth-child(4):before {
  content: "";
  width: 150%;
  height: 100%;
  background: #0e0e0e;
  position: absolute;
  right: -149%;
  top: 0;
}
.navigation-menu .inner {
  position: relative;
  z-index: 3;
  color: #fff;
  text-align: center;
  padding-top: 96px;
}
.navigation-menu .inner * {
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}
.navigation-menu .inner .menu {
  display: block;
  min-height: 130px;
  opacity: 0;
  transform: translateY(-30px);
}
.navigation-menu .inner .menu ul {
  display: block;
  margin-bottom: 50px;
  padding: 0;
  position: relative;
}
.navigation-menu .inner .menu ul li {
  display: inline-block;
  margin: 0 20px;
  padding: 0;
  list-style: none;
}
.navigation-menu .inner .menu ul li:hover ul {
  opacity: 1;
  visibility: visible;
}
.navigation-menu .inner .menu ul li:hover ul li ul {
  opacity: 0;
  visibility: hidden;
}
.navigation-menu .inner .menu ul li a {
  display: inline-block;
  line-height: 1;
  font-size: 3vw;
  font-weight: 800;
  color: #fff;
  padding-bottom: 8px;
  border-bottom: 5px solid transparent;
}
.navigation-menu .inner .menu ul li a:hover {
  padding-bottom: 3px;
  border-bottom: 5px solid #D66344;
  text-decoration: none;
}
.navigation-menu .inner .menu ul li ul {
  width: 100%;
  min-height: inherit;
  position: absolute;
  left: 0;
  top: 70px;
  opacity: 0;
  visibility: hidden;
}
.navigation-menu .inner .menu ul li ul li {
  margin: 0 15px;
}
.navigation-menu .inner .menu ul li ul li a {
  font-size: 2vw;
  padding: 0;
  border-bottom: none;
}
.navigation-menu .inner .menu ul li ul li a:hover {
  padding: 0;
  border-bottom: none;
  color: #D66344;
}
.navigation-menu .inner .menu ul li ul li:hover ul {
  opacity: 1;
  visibility: visible;
}
.navigation-menu .inner .menu ul li ul li ul {
  top: 55px;
  opacity: 0;
  visibility: hidden;
}
.navigation-menu .inner .menu ul li ul li ul li {
  margin: 0 20px;
}
.navigation-menu .inner .menu ul li ul li ul li a {
  font-size: 20px;
  font-weight: 600;
}
.navigation-menu .inner blockquote {
  display: block;
  font-size: 2vw;
  font-family: "Fjalla One", sans-serif;
  text-transform: uppercase;
  color: #D66344;
  opacity: 0;
  transition-delay: 0.5s;
  transform: translateY(30px);
}

.inner img{
    width: 15%;
}
.navigation-menu.active .bg-layers {
  visibility: visible;
}
.navigation-menu.active .bg-layers span {
  width: calc(25% + 1px);
  transform: skewX(45deg);
}
.navigation-menu.active .bg-layers span:nth-child(1) {
  width: calc(25% + 1px);
}
.navigation-menu.active .bg-layers span:nth-child(4) {
  width: calc(25% + 1px);
}
.navigation-menu.active .inner .menu {
  opacity: 1;
  transform: translateY(0);
}
.navigation-menu.active .inner blockquote {
  opacity: 1;
  transform: translateY(-50px);
}
.navigation-menu.active {
  visibility: visible;
}

/* HAMBURGER */
.hamburger {
  float: left;
  width: 26px;
  height: 18px;
  position: relative;
}
.hamburger * {
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}
.hamburger span {
  display: block;
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  background: #D66344;
  z-index: 0;
}
.hamburger span:nth-child(1) {
  top: 0px;
  width: 50%;
}
.hamburger span:nth-child(2) {
  top: 8px;
}
.hamburger span:nth-child(3) {
  width: 50%;
  top: 16px;
  right: 0;
  left: auto;
}
.hamburger span:before, .hamburger span:after {
  position: absolute;
  content: "";
  display: block;
  top: 0;
  height: 100%;
  width: 0;
  right: 0;
  left: auto;
}
.hamburger span:before {
  z-index: 1;
  background: #fff;
  transition: all 0.15s linear 0s;
}
.hamburger span:after {
  z-index: 2;
  background: #D66344;
  transition: all 0.15s linear 0.3s;
}
.hamburger span:nth-child(2):before {
  transition-delay: 0.05s;
}
.hamburger span:nth-child(3):before {
  transition-delay: 0.1s;
}
.hamburger span:nth-child(2):after {
  transition-delay: 0.15s;
}
.hamburger span:nth-child(3):after {
  transition-delay: 0.2s;
}

.hamburger:hover span {
  width: 100% !important;
}
.hamburger:hover span:after, .hamburger:hover span:before {
  width: 100%;
  left: 0;
  right: auto;
}
.hamburger:hover span:after {
  z-index: 1;
  transition: all 0.15s linear 0s;
}
.hamburger:hover span:before {
  z-index: 2;
  transition: all 0.15s linear 0.3s;
}
.hamburger:hover span:nth-child(2):after {
  transition-delay: 0.05s;
}
.hamburger:hover span:nth-child(3):after {
  transition-delay: 0.1s;
}
.hamburger:hover span:nth-child(2):before {
  transition-delay: 0.15s;
}
.hamburger:hover span:nth-child(3):before {
  transition-delay: 0.2s;
}

.hamburger.open span:nth-child(1) {
  top: 9px;
  width: 100%;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

.hamburger.open span:nth-child(2) {
  opacity: 0;
  left: -15px;
}

.hamburger.open span:nth-child(3) {
  top: 9px;
  width: 100%;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

/* CUSTOM LINK */
.custom-link {
  display: block;
  transition: all 0.5s;
}

.custom-link * {
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

.custom-link a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  font-size: 14px;
  color: #0e0e0e;
}

.custom-link a:hover {
  text-decoration: none;
}

.custom-link b {
  font-weight: 600;
  display: inline-block;
  margin-left: 20px;
}

.custom-link .lines {
  width: 42px;
  height: 1px;
  float: left;
  overflow: hidden;
}

.custom-link .lines span:nth-child(1) {
  width: 100%;
  height: 1px;
  float: right;
  background: #0e0e0e;
}

.custom-link .lines span:nth-child(2) {
  width: 0;
  height: 1px;
  float: left;
  background: #0e0e0e;
}

.custom-link:hover .lines {
  width: 62px;
  margin-left: 20px;
}

.custom-link:hover .lines span:nth-child(1) {
  width: 0;
}

.custom-link:hover .lines span:nth-child(2) {
  width: 100%;
  transition-delay: 0.2s;
}

/* HEADER */
.header {
  width: 100%;
  height: 100vh;
  min-height: 660px;
  display: flex;
  flex-wrap: wrap;
  position: relative;
  background: #0e0e0e;
}
.header .container {
  position: relative;
  z-index: 2;
}
.header .container .tagline {
  display: block;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 15px;
}
.header .container .tagline span {
  color: #D66340;
  float: left;
  font-weight: 600;
  color: #fff;
}
.header .container .tagline span:after {
  content: "";
  width: 22px;
  height: 1px;
  float: right;
  margin: 10px;
  background: #D66340;
}
.header .container .tagline h6 {
  float: left;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  margin-top: 2px;
  margin-bottom: 0;
}
.header .container h1 {
  width: 100%;
  float: left;
  font-weight: 800;
  color: #D66340;
  font-size: 10vw;
  line-height: 1;
}
.header .container h1 span {
  -webkit-text-stroke-width: 1px;
  transform: translateY(-35%);
  margin-left: 4%;
  display: flex;
  -webkit-text-stroke-color: #fff;
  color: transparent;
}
.header .container .slide-btn {
  float: left;
}
.header .perspective {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  z-index: 0;
}
.header .perspective canvas {
  min-height: 100%;
  width: auto !important;
  position: absolute;
  left: 0;
  top: 0;
}
.header .particles-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  z-index: 0;
}
.header .particles-wrap .particles {
  width: 100%;
  height: calc(100% - 50px);
  position: absolute;
  left: 0;
  bottom: 0;
}
.header .video-bg {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  z-index: 20;
}
.header .video-bg:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}
.header .video-bg video {
  min-width: 100%;
  min-height: 100%;
  position: absolute;
  opacity: 0.8;
}

.page-header {
  width: 100%;
  height: 100vh;
  min-height: 660px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  position: relative;
  background: #0e0e0e;
}
.page-header .video-bg {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
}
.page-header .video-bg:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}
.page-header .video-bg video {
  min-width: 100%;
  min-height: 100%;
  float: left;
  opacity: 0.2;
}
.page-header .container {
  position: relative;
  z-index: 3;
  padding: 0 10%;
}
.page-header .container h1 {
  font-weight: 800;
  font-size: 10vw;
  color: #fff;
  line-height: 1;
  text-indent: -5px;
}
.page-header .container p {
  margin-bottom: 0;
  font-family: "Fjalla One", sans-serif;
  color: #D66344;
}

header {
  transform: scale(1.5);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}
header .left-side {
  width: 50%;
  height: 60px;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-end;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateX(-50%) translateY(-50%) rotate(-90deg);
  margin-left: 30px;
  z-index: 3;
}
header .left-side ul {
  margin: 0 auto;
  padding: 0;
}
header .left-side ul li {
  display: inline-block;
  margin: 0 10px;
  padding: 0;
  list-style: none;
}
header .left-side ul li a {
  font-size: 14px;
  color: #fff;
  font-family: "Fjalla One", sans-serif;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
  padding-bottom: 6px;
  border-bottom: 2px solid transparent;
}
header .left-side ul li a:hover {
  padding-bottom: 1px;
  border-bottom: 2px solid #fff;
  text-decoration: none;
}
header .scroll-down {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 3;
}
header .scroll-down small {
  width: 98px;
  display: inline-block;
  transform: rotate(-90deg);
  margin-bottom: 50px;
  color: #fff;
  font-family: "Fjalla One", sans-serif;
}
header .scroll-down span {
  display: block;
  height: 50px;
  position: relative;
  transform: translateX(-1px);
}
header .scroll-down span::before {
  -webkit-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
  -moz-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
  -o-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
  animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
}
header .scroll-down span::before {
  position: absolute;
  top: 0px;
  left: 50%;
  margin-left: -0.5px;
  width: 1px;
  height: 70px;
  background: #fff;
  content: "";
}
header .sound {
  position: absolute;
  right: 40px;
  bottom: 40px;
  z-index: 3;
}
header .sound span {
  float: left;
  color: #fff;
  font-size: 14px;
  margin-right: 10px;
  font-family: "Fjalla One", sans-serif;
}
header .sound .equalizer {
  float: left;
}
header .sound .equalizer .holder {
  width: 23px;
  height: 20px;
  position: relative;
}

/* NAVBAR */
.navbar {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  padding: 20px 40px;
  color: #fff;
  font-family: "Fjalla One", sans-serif;
  font-size: 14px;
  z-index: 10;
  transform: translateY(-130%);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}
.navbar a {
  color: #fff;
}
.navbar .left {
  width: 30%;
  margin-left: 0;
}
.navbar .left a {
  position: relative;
  padding-bottom: 6px;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
  border-bottom: 2px solid transparent;
}
.navbar .left a:hover {
  padding-bottom: 1px;
  border-bottom: 2px solid #fff;
  text-decoration: none;
}
.navbar .logo {
  margin: 0 auto;
}
.navbar .logo a {
  float: left;
}
.navbar .logo a img {
  height: 56px;
}
.navbar .right {
  width: 10%;
  margin-right: 0;
  display: flex;
}
.navbar .right ul {
  margin-left: auto;
  margin-bottom: 0;
  padding: 0;
}
.navbar .right ul li {
  display: inline-block;
  margin-left: 15px;
  padding: 0;
}
.navbar .right ul li a {
  position: relative;
  padding-bottom: 6px;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
  border-bottom: 2px solid transparent;
}
.navbar .right ul li a:hover {
  padding-bottom: 1px;
  border-bottom: 2px solid #fff;
  text-decoration: none;
}
.navbar .right .hamburger-menu {
  margin-right: 0;
  margin-left: 0px;
}
#hamburger-menu{  
  cursor: pointer;
}
.navbar .right .hamburger-menu .hamburger {
  float: right;
  margin-top: 1px;
}
.navbar .right .hamburger-menu b {
  display: inline-block;
  font-weight: 400;
  margin-right: 15px;
}

/* SWIPER SLIDER */
.swiper-slider {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  color: #fff;
  background-color: #000;
  overflow: hidden;
}
.swiper-slider .swiper-slide {
  display: block;
  overflow: hidden;
}
.swiper-slider .swiper-slide.swiper-slide-active .slide-inner {
  transform: scale(1);
  object-fit: cover;
}
.slide-inner video {
    width: 100%;
    height: auto;
     /* Esto asegura que el video cubra el contenedor manteniendo su proporción */
    position: relative;
}
.swiper-slider .swiper-slide.swiper-slide-active .slide-inner .container {
  transform: translateY(0);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  opacity: 1;
}
.swiper-slider .swiper-slide .slide-inner {
  width: 100%;
  height: 100%;
  transform: scale(0.5);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: column;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  background-size: cover;
  background-position: center;
  position: relative;
}
.swiper-slider .swiper-slide .slide-inner:after {
  content: "";
  width: 100%;
  height: 100%;
  opacity: 0.04;
  position: absolute;
  left: 0;
  top: 0;
}
.swiper-slider .swiper-slide .slide-inner:before {
  content: "";
  width: 100%;
  height: auto;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}
.swiper-slider .swiper-slide .slide-inner .container {
  transform: translateY(50px);
  opacity: 0;
  transition-delay: 0.15s !important;
  position: relative;
  z-index: 2;
}
.swiper-slider .swiper-slide .slide-inner .container .tagline {
  display: block;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 15px;
}
.swiper-slider .swiper-slide .slide-inner .container .tagline span {
  color: #D66340;
  float: left;
  font-weight: 600;
  color: #fff;
}
.swiper-slider .swiper-slide .slide-inner .container .tagline span:after {
  content: "";
  width: 22px;
  height: 1px;
  float: right;
  margin: 10px;
  background: #D66340;
}
.swiper-slider .swiper-slide .slide-inner .container .tagline h6 {
  float: left;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  margin-top: 2px;
  margin-bottom: 0;
}
.swiper-slider .swiper-slide .slide-inner .container h1 {
  width: 100%;
  float: left;
  font-weight: 800;
  color: #D66340;
  font-size: 10vw;
  line-height: 1;
}
.swiper-slider .swiper-slide .slide-inner .container h1 span {
  -webkit-text-stroke-width: 2px;
  transform: translateY(-35%);
  margin-left: 4%;
  display: flex;
  -webkit-text-stroke-color: #000;
  color: transparent;
  font-size: 190px;
}

.swiper-slider .swiper-slide .slide-inner .container .slide-btn {
  float: left;
}
.swiper-slider .swiper-pagination-bullets {
  width: 50px;
  left: auto;
  right: 40px;
  bottom: 50%;
  text-align: right;
  font-size: 14px;
  font-weight: 600;
  z-index: 2 !important;
}
.swiper-slider .swiper-pagination-bullets .swiper-pagination-bullet {
  width: 100%;
  height: auto;
  float: left;
  margin: 5px 0;
  background: none;
  position: relative;
  text-indent: 9999px;
  padding-right: 36px;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}
.swiper-slider .swiper-pagination-bullets .swiper-pagination-bullet:hover {
  opacity: 1;
}
.swiper-slider .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
  text-indent: 0;
}
.swiper-slider .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active:after {
  width: 67px;
  right: -45px;
}
.swiper-slider .swiper-pagination-bullets .swiper-pagination-bullet:after {
  content: "";
  width: 22px;
  height: 1px;
  background: #D66344;
  position: absolute;
  top: 10px;
  right: 0;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

.other-section {
    position: relative;
    width: 100%;
    height: 100vh;
    background-color: #000;
    padding:  2% 5%;
}

.other-wrapper {
    display: flex;
    align-items: center; /* Alinea verticalmente el contenido */
    height: 100%;
}

.other-text {
    font-size: 18px;
    line-height: 1.2;
    color: #fff;
    font-weight: 500;
    display: flex;
    flex-direction: column;
    max-width: 30%;
}

.other-text p {
 margin-bottom: 40px;
 margin-top: -25px;
}

#bucle-letter {
    -webkit-text-stroke: 1px #fff;
    margin-top: 0%;
}

.text-bold{
    font-weight: bold;
    margin-top: -10px;
}

.other-image {
    flex-grow: 1; 
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.other-section img {
    max-width: 90%;
    max-height: 90vh; /* Limita la altura para que no se salga de la pantalla */
    height: auto;
    width: auto; 
}

.nosotros-section {
    position: relative;
    width: 100%;
    height: 100vh; 
    background-image: url("../images/TUBONARANJA.png");
    background-size: cover;
    background-position: center;
    padding: 0% 5%;
}

.nosotros-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    text-align: left;
}

.nosotros-large {
    font-size: 260px;
    font-weight: 700;
    color: transparent;
    -webkit-text-stroke: 1px #666; /* Borde negro */
    letter-spacing: -13px; /* Ajusta el espacio entre letras si es necesario */
    margin-top: 12%;
    margin-left: -12px;
    padding: 0;
    width: 100%;
}

.nosotros-small {
    font-size: 48px;
    font-weight: 700;
    color: #000; /* Color negro para el "nosotros" más pequeño */
    position: absolute;
    top: 37%; /* Ajusta la posición de acuerdo a tu preferencia */

    margin: 0;
}

.nosotros-text {
    position: absolute;
    top: 11%;
    right: 5%;
    max-width: 50%;
    font-size: 18px;
    line-height: 1.2;
    color: #000;
    font-weight: 500;
}

.nosotros-text p {
    margin-bottom: 20px;
}


/* INTRO */

#first-div{
    position: relative; /* Permite ajustar la posición */
    top: 20%; /* Mueve el div hacia arriba */
    left: 60%; /* Mueve el div hacia la derecha */
    width: 48%;
} 


#transparent-letter{
    font-weight: 800;
    -webkit-text-stroke-width: 1.2px;
    margin-left: -7px;
    display: flex;
    -webkit-text-stroke-color: #777;
    color: transparent;
    font-size: 260px;
    letter-spacing: -5px;
}

/* WORKS */
.works {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-wrap: wrap;
  padding: 150px 0;
  transition-delay: 0s !important;
  transition: background 0.4s;
  align-items: center;
}
#second-section {
    background-color: #000;
    color: #fff;
  }

.works h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
}
.works h2 {
  margin-bottom: 60px;
  font-weight: 800;
  font-size: 60px;
  line-height: 1.2;
  padding-right: 35%;
}
.works h2:before {
  content: attr(data-text);
  font-size: 20vw;
  opacity: 0.05;
  z-index: -1;
  position: absolute;
  left: 0;
  top: -20%;
}
.description {
    position: relative;
    top: -50px; 
    max-width: 250px;
    display: block;
  }
#second-section .description {
    left: 150px
  }  
.works .project-box {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 75px 0;
}
.works .project-box * {
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}
.works .project-box:hover figure {
  transform: scale(0.95);
}
.works .project-box:hover figure video {
  transform: scale(1.15);
}
.works .project-box:last-child {
  padding-bottom: 0;
}
.works .project-box:nth-child(2n+2) .custom-link a {
  float: right;
}
.works .project-box:nth-child(2n+2) .content-box {
  order: 1;
  text-align: right;
  padding-left: 0;
  padding-right: 5%;
}
.works .project-box:nth-child(2n+2) .content-box h3 span {
  margin-left: 0;
  margin-right: -7vw;
}
.works .project-box:nth-child(2n+2) figure {
  order: 2;
}
.works .project-box figure {
  width: 55%;
  margin: 0;
  position: relative;
  overflow: hidden;
  border: 1px solid transparent;
}
.works .project-box figure video {
  width: 100%;
}
.works .project-box .content-box {
  width: 45%;
  padding-left: 5%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  z-index: 2;
}
.works .project-box .content-box .inner {
  margin: 0;
}
.works .project-box .content-box .inner small {
  display: block;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
}
.works .project-box .content-box .inner h3 {
  font-size: 5vw;
  font-weight: 800;
  margin-bottom: 10vh;
  line-height: 1;
}
.works .project-box .content-box .inner h3 span {
  display: block;
  font-size: 8vw;
  color: #D66344;
  margin-left: -7vw;
}

.works-large{
    font-size: 260px;
    font-weight: 800;
    color: transparent;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #ccc;
    display: flex;
    margin: -12% -10% -15% -12%;
    letter-spacing: -10px;
    width: 100%;
    text-align: center;
}

#white-letter{
    -webkit-text-stroke-color: #fff !important;
}

/* FAQS */
.faq-section {
    padding: 50px 50px 50px 50px;
    position: relative;
    background-image: url("../images/CUADRADOS.png");
    background-size: cover;
    background-position: center;
    min-height: 100vh;
  }

  .faq-section .faq-header{
    display: flex;
    flex-direction: row;
    margin-top: -100px;
  }
  
  /* Título grande FAQ */
  .faq-section .faq-header h1 {
    font-size: 450px;
    font-weight: 800;
    color: transparent;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #ccc;
    text-align: left;
    margin-bottom: 20px;
    letter-spacing: -30px;
  }
   #letter-a{
    margin-left: -45px;
    margin-right: -20px;
   }

   .faq-intro {
    margin: -70px 0 50px 70px;
  }
  
  .faq-intro h2 {
    font-size: 48px;
    font-weight: 800;
    color: #D66344; 
    text-align: left;
    letter-spacing: -5px;
  }
  
  /* Estilo para la lista de preguntas */
  .faq-section .faq-list .faq-item {
    margin-bottom: 30px;
    margin-left: 20px;
  }
  
  /* Preguntas */
  .faq-section .faq-list .faq-question {
    font-size: 22px;
    font-weight: bold;
    cursor: pointer;
    color: #404040;
  }
  
  /* Respuestas ocultas por defecto */
  .faq-section .faq-list .faq-answer {
    font-size: 18px;
    display: none;
    margin-top: 10px;
    color: #666;
  }

  .faq-answer {
  width: 70%;
  }
  
  /* Para asegurarse que las letras FAQ no se superponen al margen derecho */
  .faq-section .faq-header {
    margin-right: 100px;
    position: relative;
    z-index: 1;
  }
  
  /* Estilo para cuando se expande la respuesta */
  .faq-section .faq-item.active .faq-answer {
    display: block;
  }



  
  .contact-section {
    position: relative;
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-color: #000;
    padding: 50px;
  }

  
  /* Texto gigante detrás */
  .contact-section h1 {
    width: 100%;
    position: absolute;
    font-size: 260px;
    font-weight: 700;
    color: transparent;
    -webkit-text-stroke: 1px #fff;
    letter-spacing: -13px; /* Ajusta el espacio entre letras si es necesario */
    padding: 0;
    top: 48%;
    left: 0;
    transform: translateY(-50%);
    text-align: center;
  }
   
  /* HELLO */
.hello {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    background-color: transparent !important;
    transform: translateY(20%);
    padding: 0px 10%;
    
  }
  .hello h6 {
    display: block;
    line-height: 1;
    margin-bottom: 20px;
    font-family: "Fjalla One", sans-serif;
    opacity: 0.5;
    font-size: 14px;
  }
  .hello h2 {
    margin-bottom: 60px;
    font-weight: 800;
    font-size: 60px;
    line-height: 1.2;
    padding-right: 35%;
  }
  .hello h2:before {
    content: attr(data-text);
    font-size: 20vw;
    opacity: 0.05;
    z-index: -1;
    position: absolute;
    left: 0;
    top: 0%;
  }
  #form-row{
    display: flex;
    flex-direction: row;
  }
  .hello address {
    display: block;
    margin-bottom: 0px;
  }
  .hello address b {
    display: block;
    margin-bottom: 0px;
  }
  .hello #success, .hello #error {
    display: none;
    float: left;
  }
  .hello #contact {
    width: 100%;
    display: flex;
    background: transparent;
}
  .hello form {
    display: flex;
    flex-direction: column;
    max-width: 600px; /* Ajusta el ancho del formulario si es necesario */
}
  .hello #contact .form-group:last-child {
    display: flex;
    flex-direction: column;
    gap: 0px; /* Espacio entre los elementos */
    max-width: 600px; 
    margin-bottom: 0;
  }
  .hello #contact label {
    display: block;
    font-size: 12px;
    font-weight: 600;
  }
  .hello #contact label.error {
    color: #D66344;
    margin-top: 4px;
    margin-bottom: -5px;
  }
  .hello #contact div.error {
    background: #D66344;
    color: #fff;
    border-radius: 0;
    border: none;
  }
  .hello #contact input[type=text] {
    width: 100%;
    height: 50px;
    background: #fff;
    border: 1px solid #eee;
    padding: 0 20px;
  }
  .hello #contact textarea {
    width: 100%;
    height: 220px;
    background: #fff;
    border: 1px solid #eee;
    padding: 20px;
    resize: none;
  }
  .hello #contact button[type=submit] {
    height: 50px;
    padding: 0 30px;
    font-size: 30px;
    font-weight: 900;
    color: #0e0e0e;
    background: #D66344;
    border: none;
  }
  .button-group {
    display: flex;
    justify-content: flex-end; /* Mueve el botón a la derecha */
}

.button-group button {
    align-self: flex-end; /* Alinea el botón al final del área de mensaje */
}

.contact-info{
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.contact-info span {
    color: white; /* Texto en blanco */
    font-size: 12px; /* Ajusta el tamaño de la letra según tu preferencia */
    font-weight: bold; /* Para hacer la letra más destacada */
}
#contact-data {
    color: white; /* Texto en blanco */
    text-decoration: underline; /* Subrayado */
    text-decoration-color: #d66344; /* Color de subrayado en naranja */
    text-decoration-thickness: 2px; /* Grosor del subrayado */
    text-underline-offset: 10px; /* Separación entre el texto y el subrayado */
    font-size: 22px; /* Ajusta el tamaño de la letra según tu preferencia */
    margin-bottom: 20px;
    font-weight: 500;
}

.contact-footer {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 0px 10%;
    
  }
  .contact-footer img {
    width: 100%; /* Ajusta el tamaño de la imagen, puedes cambiar este valor */
    max-width: 150px; /* Limita el tamaño máximo de la imagen */
    height: auto; /* Mantiene la proporción de la imagen */
    cursor: pointer; /* Cambia el cursor a "puntero" cuando pase sobre la imagen */
    transition: transform 0.3s ease; /* Efecto suave al hacer hover */
}

.contact-footer img:hover {
    transform: scale(1.1); /* Reduce el tamaño ligeramente al pasar sobre la imagen */
}

.contact-row {
    display: flex;
    flex-direction: row;
    gap: 35px; /* Espacio entre los iconos */
    list-style-type: none; /* Quitar los puntos de la lista */
    padding: 0; /* Eliminar el padding de la lista */
    padding-top: 12px;
}

.contact-row li {
    display: inline-block;
}

.contact-row img {
    width: 30px; /* Ajusta el tamaño de los iconos sociales */
    height: auto;
    cursor: pointer;
    transition: transform 0.3s ease;
}

.contact-row img:hover {
    transform: scale(1.1); /* Agranda ligeramente al pasar sobre el icono */
}



/* MEDIUM FIXES */
@media only screen and (max-width: 1199px), only screen and (max-device-width: 1199px) {

  .intro h4 {
    padding-right: 0;
  }

  .work-with-us h2 {
    padding-right: 0;
  }

  .work-with-us h4 {
    padding-right: 0;
  }

  .works-single h2 {
    padding-right: 0;
  }

  .direction h2 {
    padding-right: 0;
  }

  .clients h4 {
    padding-right: 0;
  }

  .news .post {
    flex-direction: column;
  }

  .news .post .post-image {
    margin-bottom: 30px;
  }
  .swiper-slider .swiper-slide.swiper-slide-active .slide-inner {
    transform: scale(1);
  }

  .direction figure figcaption {
    width: 50%;
  }

  .hello h2 {
    padding-right: 0;
  }
  .description {
    top: 0px; 
  }
}
/* RESPONSIVE TABLET FIXES */
@media only screen and (max-width: 991px), only screen and (max-device-width: 991px) {
  header {
    min-height: inherit;
  }

  .swiper-slider .swiper-slide .slide-inner .container h1 {
    font-size: 12vw;
  }

  .intro {
    padding: 80px 0;
  }

  .intro h2 {
    padding-right: 0;
    margin-bottom: 50px;
  }

  .intro .custom-link {
    transform: translateY(0);
  }

  .process {
    padding: 80px 0;
  }

  .process h2 {
    margin-bottom: 0;
  }

  .services-content-block {
    padding: 80px 0;
  }

  .services-content-block h2 {
    padding-right: 0;
  }

  .services-content-block .left {
    width: 100%;
    margin-bottom: 20px;
  }

  .services-content-block .right {
    width: 100%;
  }

  .team {
    padding: 80px 0;
  }

  .team figure {
    margin: 15px 0;
  }

  .direction {
    padding: 80px 0;
  }

  .direction figure figcaption {
    width: 100%;
  }

  .works {
    padding: 80px 0;
  }

  .works h2 {
    padding-right: 0;
    margin-bottom: 50px;
  }

.works-large {
    font-size: 25vw;
    margin: -25% 0% 0% 0%;
    letter-spacing: 0px;
}

  .works .project-box {
    padding: 35px 0;
  }

  .work-with-us {
    padding: 80px 0;
  }

  .works-single {
    padding: 80px 0;
  }

  .description {
    top: 0px; 
  }

  .nosotros-wrapper{
    justify-content: flex-end;
  }

  .nosotros-large{
    font-size: 17vw;
    margin-bottom: 25%;
    letter-spacing: 0px;
  }

  .other-text {
    max-width: 50%;
}


#bucle-letter {
    font-size: 22vw;
    margin-bottom: 15%;
}

  #second-section .description {
     left: 40px;
}

.contact-section h1 {

    font-size: 17vw;
    top:45%;
    letter-spacing: 0px;
}
  .news {
    padding: 30px 0;
    padding-bottom: 80px;
  }

  .news .post.single-post {
    padding-left: 0;
    padding-right: 0;
  }

  .news .post.single-post .post-content .inner .post-title {
    font-size: 44px;
  }

  .news .post:nth-child(2n+2) .post-image {
    order: 0;
  }

  .news .post:nth-child(2n+2) .post-content {
    padding: 0 50px;
  }

  .awards {
    padding: 80px 0;
  }

  .clients {
    padding: 80px 0;
  }

  .hello {
    padding: 0px 0;
  }

  .hello #contact {
    margin-left: 0;
    box-shadow: none;
  }

  .footer .footer-quote h2 {
    font-size: 6vw;
  }
  .contact-section{
    padding: 0 50px;
  }
}
/* RESPONSIVE MOBILE FIXES */
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
  .container {
    padding: 0 30px;
  }

  .page-header .video-bg:before {
    display: none;
  }

  header .scroll-down {
    left: -10px;
  }

  header .sound {
    right: 30px;
    bottom: 30px;
  }

  .header {
    min-height: inherit;
  }

  .page-header {
    min-height: inherit;
  }

  .page-header .container h1 {
    font-size: 15vw;
  }

  .navigation-menu.active .bg-layers span {
    width: 50%;
  }

  .navigation-menu.active .bg-layers span:nth-child(1) {
    left: -50%;
    width: 50%;
  }

  .navigation-menu.active .bg-layers span:nth-child(2) {
    left: 0;
    width: 50%;
  }

  .navigation-menu.active .bg-layers span:nth-child(3) {
    left: 50%;
    width: 50%;
  }

  .navigation-menu.active .bg-layers span:nth-child(4) {
    left: 100%;
    width: 50%;
  }

  .other-section{
    padding: 12% 5% 5% 5%;
  }
  .other-wrapper {
    flex-direction: column;
  }

  .other-text {
    max-width: 80%;
}

  .navigation-menu .inner .menu ul li {
    display: block;
    margin-bottom: 20px;
  }

  .navigation-menu .inner .menu ul li a {
    font-size: 9vw;
    padding-bottom: 2px;
  }

  .navigation-menu .inner .menu ul li a:hover {
    padding-bottom: 2px;
  }

  .navigation-menu .inner .menu ul li ul {
    position: static;
    display: none;
    visibility: visible;
    opacity: 1;
    margin-top: 10px;
    margin-bottom: 0;
  }

  .navigation-menu .inner .menu ul li ul li {
    padding: 5px 0;
  }

  .navigation-menu .inner .menu ul li ul li a {
    font-size: 20px;
  }

  .navigation-menu .inner .menu ul li:hover ul {
    display: block;
  }

  .navigation-menu .inner blockquote {
    display: none;
  }

  .navbar {
    padding: 20px 30px;
  }

  .navbar .right {
    width: 30%;
  }  

  .navbar .right ul {
    display: none;
  }

  .navbar .right .hamburger-menu {
    margin-left: auto;
  }

  header .left-side {
    display: none;
  }

  .header .container h1 {
    font-size: 20vw;
  }

  .header .container h1 span {
    margin-left: 0;
    transform: translateY(0);
  }

  .header .container .slide-btn {
    padding-left: 0;
  }

  .swiper-slider .swiper-pagination-bullets {
    display: none;
  }

  .swiper-slider .swiper-slide .slide-inner:before {
    display: none;
  }

  .swiper-slider .swiper-slide .slide-inner .container h1 {
    font-size: 20vw;
  }

  .swiper-slider .swiper-slide .slide-inner .container h1 span {
    margin-left: 0;
    transform: translateY(0);
  }

  .swiper-slider .swiper-slide .slide-inner .container .slide-btn {
    padding-left: 0;
  }

  .awards {
    padding: 40px 0;
    padding-bottom: 0;
  }

  .awards .odometer {
    margin-bottom: 40px;
  }

  .contact-footer {
    width: 100%;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 0px 10%;
    flex-direction: column;
    align-content: center;
    gap: 0px;
  }

  .contact-section {
    justify-content: initial;
    height: initial;
    min-height: 100vh;
  }

  .other-section{
    justify-content: initial;
    height: initial;
    min-height: 100vh;
  }

  .works-single h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .works-single h4 {
    margin-bottom: 20px;
  }

  .works-single p {
    font-size: 18px;
    line-height: 30px;
  }

  .description {
    top: 0px; 
  }

  .hello{
    justify-content: center;
    transform: translateY(0%);
  }

  .contact-section{
    padding: 10px;
  }

  .hello h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .hello address {
    margin-bottom: 20px;
  }

  .hello iframe {
    height: 400px !important;
  }

  .hello #contact {
    width: auto;
    margin-top: 40px;
    padding: 0;
    margin-left: -15px;
  }

  .hello #contact .form-group:last-child {
    margin-bottom: 40px;
  }

  .faq-section {
    padding: 0;
  }

  .faq-answer {
    width: 95%;
    }

  .nosotros-text{
    font-size: 18px;
    top: 7%;
    right: initial;
    max-width: initial;
    padding: 5%;
  }

  .nosotros-small{
    top: initial;
    bottom: 5% !important;
  }

  .team h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .intro h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .intro h4 {
    margin-bottom: 20px;
  }

  .intro p {
    font-size: 18px;
    line-height: 30px;
  }

  .services-content-block h2 {
    font-size: 32px;
    margin-bottom: 60px;
  }

  .direction h2 {
    font-size: 32px;
    margin-bottom: 40px;
  }

  .direction figure figcaption {
    width: 100%;
    position: static;
    display: block;
  }

  #bucle-letter {
    font-size: 22vw;
    margin-bottom: 15%;
}

.other-section img {
    margin-top: -50px;
}

  .works h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .works .project-box {
    flex-direction: column;
  }

  .works .project-box figure {
    width: 100%;
    margin-bottom: 20px;
  }

  .works .project-box:nth-child(2n+2) figure {
    order: 0;
  }

  .works .project-box:nth-child(2n+2) .content-box {
    text-align: left;
  }

  .works .project-box:nth-child(2n+2) .custom-link a {
    float: left;
  }

  .works .project-box .content-box {
    width: 100%;
    padding-left: 0;
  }

  .works .project-box .content-box .inner small {
    margin-bottom: 5px;
  }

  .works .project-box .content-box .inner h3 {
    margin-bottom: 30px;
  }

  .works .project-box .content-box .inner h3 span {
    margin-left: 0;
    font-size: 12vw;
  }

  .works-large {
    font-size: 17vw;
    margin: -20% 0% 0% -3%;
    letter-spacing: 0px;
  }

  .other-image {
    justify-content: center;
  }

  .services-content-block .col-md-4:nth-child(3) {
    margin: 40px 0;
  }

  .work-with-us h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .clients h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .clients ul {
    margin-left: -10px;
    margin-right: -10px;
    margin-top: 40px;
    width: auto;
  }

  .clients ul li {
    width: 50%;
  }

  .faq-section .faq-header {
    margin-top: 0px;
}
.faq-section .faq-header h1 {
    font-size: 40vw;
    margin-bottom: 40px;
    letter-spacing: -5px;
}

#letter-a {
    margin-left: -18px;
    margin-right: -8px;
}

  .news .pagination {
    margin-top: 0;
    text-align: left;
  }

  .news .pagination a {
    margin-left: 0;
    margin-right: 20px;
  }

  .news .post .post-content {
    padding: 0;
  }

  .news .post:nth-child(2n+2) .post-content {
    padding: 0;
  }

  .footer {
    padding: 80px 0;
  }

  .footer .footer-quote img {
    margin-bottom: 40px;
  }

  .footer .footer-quote {
    margin-bottom: 40px;
  }

  .footer .footer-quote h2 {
    font-size: 8vw;
  }

  .footer .footer-contact {
    margin-bottom: 40px;
  }

  .footer .footer-contact address {
    margin-bottom: 30px;
  }

  .footer .footer-bottom ul li {
    margin-right: 15px;
  }

 /* Estilo para la sección FAQ */

  
}

/*# sourceMappingURL=style.css.map */
