p{ 
        /*background-color:rgb(8, 8, 75);
        color: aliceblue;*/
font-weight: 400;
letter-spacing: 2px;

}


/*.container-fluid {
    height: 720px;
  }*/

.container-fluid {
    height: 720px;
  }




#wa{ 
    position: fixed;
    bottom: 90px; 
    right: 30px;
    transform: scale(1); /* Tamaño inicial */
      animation: scaleImage 2s infinite alternate; /* Animación que cambia el scale */

}

#tel{ 
    position: fixed;
    bottom: 180px; 
    right: 35px;
    width: 60px; 
    height: 60px;
   
    }



@media (min-width: 1024px) {

#tel { display: none;
       
         } 
  


       
} 
      


#primer_tramo{ 
    height: 95vh;
    background-color:#1a2930;

   /*view-timeline-name: --prueba2;
    view-timeline-axis: block;

    animation-timeline: --prueba2;
    animation-name: primer_tramoScroll; */
        
} 


h1 { font-family: 'Montserrat', sans-serif;
    font-weight: 550;
    font-size:60px;
    letter-spacing: 10px;
    color: azure;
}

h2 { font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size:35px;
    color: azure;
}

h4 { font-family: 'Montserrat', sans-serif;
    color: whitesmoke;
    font-style: italic;
    font-size: 18px;
    /*font-weight: 100;*/
    /*height: 30px;*/
    vertical-align: text-top;
    text-decoration: solid;
    
}



h3 { font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: medium;
    color:#0a1612;
}

#sep{ 
    
    animation: backInRight; /* referring directly to the animation's @keyframe declaration */
    animation-delay: 0s;
    animation-duration: 1s; /* don't forget to set a duration! */

    
    border: 2px solid azure;
    height: 1px;
    width: 260px;
    padding: 0px;
    color: azure;
    
    font-size: 25px;
    margin: auto;
    
} 



#segundo_tramo { 
        display: flex; /*  coloca ambos divs uno al lado del otro    */
        background: #c5c1c0;
         
        
} 


#frase {
   
    color:#1a2930;
        max-width: 800px;
        font-size: x-large;
        text-align: justify;
        line-height: 2; /* interlineado    */ 
        margin: 30px;
        padding: 15px;  

        text-indent: 0%; /*  coloca sangría en la primera lìnea     */ 

       
   
     
            
       
} 



span {
        
    /*  background-color:#f7ce3e; resalta el texto... borrado    */


       
} 


#foto { 
        display: none;      
 
       
} 


@media (min-width: 1024px) {

#foto { display:block;
        width: 50%;
         } 
  
#frase { width: 50%; 
         font-size: xx-large;
        
     
   

  


       
} 
      
} 


#tercer_tramo { 
        background-color:#1a2930;
        padding: 10px;

        display: flex; 

        flex-wrap: wrap;
        justify-content: center;   

  padding-top: 50px;
   padding-bottom: 50px;
        
       
       
} 

.caja { 
        background-color:#f7ce3e;
        text-align: center;

        display: flex;/*  estas 3 líneas centra el texto verticalmente    */
        justify-content: center;/*   estas 3 líneas centra el texto verticalmente    */
        align-items: center;/*   estas 3 líneas centra el texto verticalmente    */


        margin-inline: 40px; /*      */
        margin-block: 10px;
        border-radius: 5px;
        
margin-top: 20px;
margin-bottom: 20px;


        font-size: 10px;
        color: #0a1612;

        width: 300px;
        height: 100px;       
      
       
} 

@media (min-width: 1024px) {


.caja { 
        /*background: linear-gradient(to right, rgb(0, 0, 0), rgb(8, 8, 75));   borrado */
        text-align: center;

        display: flex;/*  estas 3 líneas centra el texto verticalmente    */
        justify-content: center;/*   estas 3 líneas centra el texto verticalmente    */
        align-items: center;/*   estas 3 líneas centra el texto verticalmente    */


        margin-inline: 40px; /*      */
        margin-block: 10px;
        border-radius: 5px;


margin-top: 40px;
margin-bottom: 40px;

        font-size: 20px;
        color: #0a1612;

        width: 400px;
        height: 200px;

        }


        
      
       
} 

#mapa {
        margin: 35px;

 }


 #direccion {
        font-size: 20px;
       
        background: #c5c1c0;
        color:#1a2930;
        
        margin: 20px;
        padding: 20px;

       
        

 }

 a {
  color: rgb(8, 8, 75);
  text-decoration: none; /* Quita el subrayado */
}