/*Seccion navbar*/
@media (max-width: 768px) {

  .nav-links {
    flex-direction: column;
    position: absolute;
    top: 15vh;
    left: 0;
    background-color: rgba(31, 78, 95, 0.9);
    width: 100%;
    overflow: hidden;
    max-height: 0;
    transition: 
      max-height 1s,
      content-visibility 1s;
    gap: 0px;

  }

  .nav-links.show {
    display: flex;
    max-height: 500px;
  }

  .nav-links a {
    padding: 1rem;
    color: var(--beige-arena);
    border-top: 1px solid var(--verde-salvia);
    }


  .landing a:nth-child(1){
    animation: 0;
    opacity: 1;
  }

  .landing a:nth-child(2){
      animation: 0;
      opacity: 1;
  }

  .landing a:nth-child(3){
      animation: 0;
      opacity: 1;
  }

  .hamburger {
    display: block;
  }
}

/*Break point presentacion para moviles*/
@media (max-width: 768px){

  #contenedor_presentacion h1{
    font-size: clamp(1.15rem, 2vw, 2rem);
    /*Evitar doblar linea*/
    white-space: nowrap;
    overflow: hidden;
    margin-top: 1rem;
  }

  .animation {
    transform: scale(0.18);
  }
  .animation {
    top: 1.75%;
    width: 200px;
    left: 50%;
    transform: translateX(-50%) scale(0.6);
    transition: all 0.5s ease;
  }

  .content {
    top: 15%;
    width: auto;
    margin-top: 50px;
    margin-left: 2.5rem;
    margin-right: 2.5rem;

    .cta a {
      display: block;
      width: 100%;
      height: 40px;
      padding: 8px 1em;
      margin-top: 2rem;
      border-radius: 8px;
      text-align: center;
      text-decoration: none;
      color: var(--azul-petroleo);
      background-color: var(--beige-arena);
      box-sizing: border-box;
    }

    span{
      font-weight: 400;
    }

    #anuncio{
    padding: .2rem;
    }
  }

  /*.animation.sticky {
    position: fixed;
    top: 1.75%;
    left: 50%;
    transform: translateX(-50%) scale(0.25);
    z-index: 1001;
  }*/

  #seccion_logo{

    .item {
      transform: scale(0.3);
    }
    .item {
      top: 5%;
      width: 200px;
      left: 50%;
      transform: translateX(-50%) scale(0.6);
    }

    .item.logosticky  {
      position: fixed;
      top: 1.75%;
      left: 50%;
      transform: translateX(-50%) scale(0.25);
      z-index: 1001;
    }
  }
}

/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .columna_footer {
    flex-direction: column;
  }
} 

/*PAGINA SERVICIOS*/
/*Seccion servicios*/

/*Time line*/
/* Media queries - Responsive timeline on screens less than 600px wide */
@media screen and (max-width: 600px) {
  /* Place the timelime to the left */
  .timeline::before {
    left: 35px;
  }
  
  /* Full-width containers */
  .side {
    width: 100%;
    padding-left: 50px;
    padding-right: 15px;
  }
  
  /* Make sure that all arrows are pointing leftwards */
  .side.left::before, .side.right::before {
    left: 40px;
    border: medium solid var(--azul-petroleo);
    border-width: 10px 10px 10px 0;
    border-color: transparent var(--azul-petroleo) transparent transparent;
  }
  
  /* Make sure all circles are at the same spot */
  .side.left .circle, .side.right .circle {
    left: 0px;
  }
  
  /* Make all right containers behave like the left ones */
  .side.right {
    left: 0%;
  }
}