@import url(https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;1,400&display=swap);
html,
body {
  padding: 0;
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
}

a {
  color: inherit;
  text-decoration: none;
}

* {
  box-sizing: border-box;
}

@keyframes modal-video {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

@keyframes modal-video-inner {
  from {
    transform: translate(0, 100px); }
  to {
    transform: translate(0, 0); } }

.modal-video {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1000000;
  cursor: pointer;
  opacity: 1;
  animation-timing-function: ease-out;
  animation-duration: 0.3s;
  animation-name: modal-video;
  -webkit-transition: opacity 0.3s ease-out;
  -moz-transition: opacity 0.3s ease-out;
  -ms-transition: opacity 0.3s ease-out;
  -o-transition: opacity 0.3s ease-out;
  transition: opacity 0.3s ease-out; }

.modal-video-effect-exit {
  opacity: 0; }
  .modal-video-effect-exit .modal-video-movie-wrap {
    -webkit-transform: translate(0, 100px);
    -moz-transform: translate(0, 100px);
    -ms-transform: translate(0, 100px);
    -o-transform: translate(0, 100px);
    transform: translate(0, 100px); }

.modal-video-body {
  max-width: 940px;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  display: table; }

.modal-video-inner {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  height: 100%; }

.modal-video-movie-wrap {
  width: 100%;
  height: 0;
  position: relative;
  padding-bottom: 56.25%;
  background-color: #333;
  animation-timing-function: ease-out;
  animation-duration: 0.3s;
  animation-name: modal-video-inner;
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -ms-transition: -ms-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out; }
  .modal-video-movie-wrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.modal-video-close-btn {
  position: absolute;
  z-index: 2;
  top: -35px;
  right: -35px;
  display: inline-block;
  width: 35px;
  height: 35px;
  overflow: hidden;
  border: none;
  background: transparent; }
  .modal-video-close-btn:before {
    transform: rotate(45deg); }
  .modal-video-close-btn:after {
    transform: rotate(-45deg); }
  .modal-video-close-btn:before, .modal-video-close-btn:after {
    content: '';
    position: absolute;
    height: 2px;
    width: 100%;
    top: 50%;
    left: 0;
    margin-top: -1px;
    background: #fff;
    border-radius: 5px;
    margin-top: -6px; }

.divider-hr {
  background: #e5e5e5;
  height: 1px;
  width: 80%;
  margin: auto;
  opacity: 0.8; }

.container-img {
  display: flex;
  align-items: center;
  justify-content: center; }

.img-cover {
  width: 100%;
  object-fit: cover; }

.img-type-show {
  object-fit: cover;
  width: 100%; }

.type-btn {
  background: #fecc4d;
  border-radius: 3px;
  position: absolute;
  padding: 0.5em 1em;
  transition: all 350ms ease-in-out;
  color: #1f242c;
  font-size: calc(0.485vw + 14.18182px);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  cursor: pointer; }
  .type-btn:hover {
    transition: all 350ms ease-in-out;
    background: #60c0ec;
    transition: all 350ms ease-in-out;
    color: #fff; }
  @media (max-width: 767px) {
    .type-btn {
      width: 100%;
      text-align: center; } }

.blob {
  background: #60c0ec;
  border-radius: 50%;
  height: 34px;
  width: 34px;
  box-shadow: 0 0 0 0 #fecc4d;
  transform: scale(1);
  animation: pulse 2s infinite; }

@keyframes pulse {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(254, 204, 77, 0.7); }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 21px rgba(254, 204, 77, 0); }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(254, 204, 77, 0); } }

body {
  margin: 0;
  padding: 0;
  font-family: "Lato", sans-serif;
  font-weight: 400;
  box-sizing: border-box; }

/* width */
::-webkit-scrollbar {
  width: 5px;
  overflow: hidden; }

/* Track */
::-webkit-scrollbar-track {
  background-color: #0e6aac;
  box-shadow: inset 0 0 2px #0e6aac;
  border-radius: 5px; }

/* Handle */
::-webkit-scrollbar-thumb {
  background: #fecc4d;
  border-radius: 5px; }

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #febd1a; }

h2 {
  font-size: calc(1vw + 16px);
  font-weight: 400; }

h3 {
  font-size: calc(1vw + 14px);
  font-weight: 400; }

p {
  font-size: calc(0.485vw + 14.18182px);
  color: #8d8f9a;
  font-weight: 300;
  letter-spacing: 0.025em;
  line-height: 1.55556;
  margin-bottom: 1.7em; }

.subtitle-box h2,
.subtitle-box h3,
.subtitle-box p {
  margin: 0;
  padding: 0; }

.subtitle-box p {
  color: #aaaaaa;
  font-weight: 400; }

section {
  overflow: hidden;
  width: 80%;
  margin: auto; }

.center-center {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%; }
  @media (max-width: 767px) {
    .center-center {
      flex-direction: column; } }

@media (max-width: 767px) {
  .flip-config {
    flex-direction: column-reverse; } }

.size-left,
.size-right {
  width: 50%; }
  @media (max-width: 767px) {
    .size-left,
    .size-right {
      width: 100%; } }

.type-hr-white {
  width: 80%;
  margin: auto;
  background: #fecc4d;
  height: 1px;
  margin: 1em auto; }

.area-info-txt {
  padding: 2em; }
  @media (max-width: 767px) {
    .area-info-txt {
      padding: 0; } }

#tsparticles canvas {
  opacity: 0.2; }

.bg-particule {
  z-index: 0;
  position: absolute;
  width: 100%;
  height: auto; }

.add-video-market {
  display: flex;
  align-items: center;
  justify-content: center; }
  .add-video-market video {
    border-radius: 3px; }
    @media (max-width: 767px) {
      .add-video-market video {
        object-fit: cover; } }

.bg-hero {
  background: #1f242c; }

.welcome-section {
  padding: 11vh 0;
  color: #fff;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center; }
  .welcome-section h1 {
    font-size: calc(1.333vw + 16px);
    letter-spacing: -1px;
    text-transform: capitalize;
    line-height: 144%;
    margin: 0;
    font-weight: 300; }
    .welcome-section h1 span {
      font-size: calc(1.333vw + 18px);
      font-weight: 400; }
  .welcome-section p {
    line-height: 150%;
    font-weight: 300;
    font-size: 1.2em;
    letter-spacing: 0.5px;
    margin-bottom: 1.3em; }
    @media (max-width: 767px) {
      .welcome-section p {
        font-size: 1em;
        letter-spacing: 0.5px; } }
  .welcome-section img {
    width: 80%; }

.thermo-section {
  background: #f4f4f6;
  padding: 3em; }
  .thermo-section h2 {
    color: #474749; }
  .thermo-section .aux-color-p {
    color: #ababad; }

.door-section,
.thermo-section,
.specifications-secction,
.banner-section {
  height: fit-content;
  padding: 6vh 0; }
  @media (max-width: 767px) {
    .door-section,
    .thermo-section,
    .specifications-secction,
    .banner-section {
      padding: 5vh 0; } }
  .door-section p,
  .thermo-section p,
  .specifications-secction p,
  .banner-section p {
    margin-top: 0.1em; }

.door-section {
  display: flex; }
  @media (max-width: 767px) {
    .door-section {
      flex-direction: column; } }

.thermo-section {
  display: flex;
  flex-direction: row-reverse;
  padding: 2em;
  margin: 5vh auto; }
  @media (max-width: 767px) {
    .thermo-section {
      flex-direction: column; } }

.aux-rever-secction {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-align: end; }
  @media (max-width: 767px) {
    .aux-rever-secction {
      align-items: start;
      text-align: initial; } }

.bloque-esp {
  display: flex;
  justify-content: space-around; }
  @media (max-width: 767px) {
    .bloque-esp {
      flex-direction: column; } }
  .bloque-esp ul {
    list-style: none;
    margin: 0 !important;
    padding: 0 !important; }
    .bloque-esp ul li {
      margin-bottom: 1em; }
      .bloque-esp ul li h5,
      .bloque-esp ul li p {
        margin: 0 !important;
        padding: 0 !important; }
      .bloque-esp ul li h5 {
        font-size: calc(0.485vw + 10px);
        color: #8d8f9a;
        font-weight: 400;
        letter-spacing: 0.025em;
        line-height: 1.55556; }
      .bloque-esp ul li p {
        font-weight: 700;
        color: #1f242c;
        font-size: calc(1.1vw); }
        @media (max-width: 767px) {
          .bloque-esp ul li p {
            font-size: calc(1.333vw + 10px); } }

.map-section {
  width: 100% !important; }

.section-Video {
  background: #f4f4f6;
  margin: 6vh auto;
  padding: 3vh; }

.container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 2vh; }
  @media (max-width: 767px) {
    .container {
      flex-direction: column; } }

.item-video-call {
  overflow: hidden;
  width: 40vw; }
  @media (max-width: 767px) {
    .item-video-call {
      width: 100%; } }
  .item-video-call img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    padding: 1em;
    transition: all 350ms ease;
    transform: scale(1);
    cursor: pointer; }
    .item-video-call img:hover {
      transform: scale(0.9);
      transition: all 350ms ease;
      filter: brightness(0.5); }
    @media (max-width: 767px) {
      .item-video-call img {
        padding: 1em 0;
        height: 300px; } }
  .item-video-call p {
    margin: 0;
    font-weight: 300;
    text-align: center;
    line-height: 1.2;
    letter-spacing: 0.02em;
    pointer-events: auto;
    color: #252525;
    text-transform: capitalize; }

.video-icon-area {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative; }
  .video-icon-area .circle {
    position: absolute;
    display: inline-block;
    border: 3px solid white;
    border-radius: 25px;
    padding: 20px;
    height: 10px;
    width: 10px; }
  .video-icon-area .circle .triangle {
    display: inline-block;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid white;
    transform: translate(-25%, -50%); }

.navbar {
  height: 74px;
  background: #2a323d;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.2em 1em;
  position: fixed;
  width: 100%;
  z-index: 1; }
  .navbar img {
    height: 100%; }
  @media (max-width: 767px) {
    .navbar {
      height: 64px; } }

footer {
  background: #1f242c;
  padding: 0 0 2em 0;
  color: #fff; }
  footer .area-footer {
    width: 80%;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column; }
  footer .logo-footer {
    width: 200px; }
  footer ul {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 2em 0 !important;
    padding: 0; }
    footer ul li {
      display: inline;
      margin-right: 2em; }
      footer ul li:last-child {
        margin-right: 0em; }

.area-about-footer {
  display: flex;
  width: 100%;
  flex-direction: column;
  text-align: center; }

.aux-addres {
  flex-direction: column;
  margin-bottom: 2vh; }
  .aux-addres p {
    letter-spacing: 0.1em; }

.container-info {
  display: flex; }
  @media (max-width: 767px) {
    .container-info {
      flex-direction: column; } }

.full-width {
  width: 100%; }
  .full-width p,
  .full-width h4 {
    padding: 0 !important;
    margin: 0 0 0.34em 0 !important; }
  .full-width h4 {
    font-size: calc(0.485vw + 14.18182px);
    color: #ffffff;
    font-weight: 300;
    letter-spacing: 0.25em;
    line-height: 1.55556;
    text-transform: uppercase; }
  .full-width a {
    transition: all 350ms ease-in-out;
    text-decoration: none; }
    .full-width a:hover {
      color: #fecc4d;
      transition: all 350ms ease-in-out; }

.full-width {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center; }

.footer-copy {
  font-weight: 300;
  letter-spacing: 0.5px; }
  .footer-copy h6 {
    padding: 0 !important;
    margin: 0 !important;
    font-size: calc(0.485vw + 14.18182px);
    color: #ffffff;
    font-weight: 300;
    letter-spacing: 1.025em;
    line-height: 1.55556; }