@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Indie+Flower&family=PT+Sans:ital@0;1&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Indie+Flower&family=PT+Sans:ital@0;1&family=Zen+Loop&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Indie+Flower&family=PT+Sans:ital@0;1&family=Poppins:ital,wght@1,100&family=Zen+Loop&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Indie+Flower&family=PT+Sans:ital@0;1&family=Poppins:ital,wght@0,100;1,100&family=Zen+Loop&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Indie+Flower&family=Kalam:wght@300&family=PT+Sans:ital@0;1&family=Poppins:ital,wght@0,100;1,100&family=Zen+Loop&display=swap');



.flecahita{

    width: 23%;
    height: 14%;
}



* {

    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    
    
}

header {
    background-color: rgb(255, 255, 255);
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 10px;
    

}

a {
    color: orange;
    font-family: 'Poppins', sans-serif;
}


nav ul {
   display: flex;
   justify-content: space-around;
   width: 500px;
   padding-top: 10%;
    
}

li:hover {
    text-decoration: underline;
    color: rgb(4, 4, 4);
}

.nav-logo{
    height: 10vh;
}

.navbar{
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.section1section-container {
   
    height: 90%;
    width: 100%;
   
    background-color: #b3a054;
   background-image: url("https://www.transparenttextures.com/patterns/blizzard.png");

    
   
}

header {
    display: flex;
    display: block;
}

.descubre {
    font-size: 6rem;
    color: orange;
    font-family: 'Dancing Script', cursive;
    text-align: center;
    margin-top: 12%;
    
}

.mozzabar {
    font-size: 8rem;
    font-family:'Zen Loop', cursive;
    text-align: center;
   
}


.wa {
    text-align: center;
    font-size: 4rem;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;

}

.letrascontainer {
    
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    

}

.section2section-container{

    background-image:url(./assets/fondohojas.jpeg);
    

    padding-top: 15% !important;
    padding-left: 20%;
    padding-right: 20%;
    padding-bottom: 15%;
}

.letrascuadro {
    /* width: 50vw;
    height: 30vw; */
    border: 3px solid rgb(19, 66, 15);
    background: rgb(0, 0, 0);
    border-radius: 20px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    
    color: rgb(255, 255, 255);
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    text-align: center;
   


}

.concepto {
    /* text-align: center; */
    font-family: 'Poppins', sans-serif;
    font-size: 120%;
}

.section3section-container {
   
    height: 35vh;
    padding-top: 10%;
    padding-bottom: 10%;
    display: flex;
    display: inline;
    justify-content: space-between;
    

}
 .fotosection3{
     margin: 1.5%;
     width: 15%;
     height: 35%;
     


 }
/* h2{
    text-align: center;
} */
ul {
    padding-top: 5% !important;
    display: flex;
    justify-content: space-around;
    padding-bottom: 5% !important;
     
 }
 .carta ul li a{
     font-size: 120%;
 }

 .carta h2 {
     display: flex;
     justify-content: center;
 }
   
.section4section-container {

    background-color:white;
    /* height: 200px;
    width: 100%;
    color: black;
    display: flex;
    justify-content: space-around;
    text-align: center;
    font-size: 20px; */
    
  }
   
.carta {
    
   padding-top: 5%;
   font-family: 'Poppins', sans-serif; ;
   font-size: 100%;
    
}

.bg-carta{
background-image: url(./assets/fondocarta/fondobonito.jpeg);
height: 85vh;
padding-left: 5%;
padding-right: 5%;
}
.cartaIzq{
width: 30%;
background-color: white;
float: left;
margin: 5%;
padding: 5%;
}
.cartaDrch{
    width: 30%;
    background-color: white;
    float: left;
    margin: 5%;
    padding: 5%;
   
}

.section6section-container {


    background-image: url(./assets/mesa-madera-fondo-borroso_1253-54.webp);
   
    height: 50vh;
    font-family: 'kalam',cursive;
    font-size: 100%;

}


.container-formulario{
    /* background-color: rgb(199, 128, 21); */
    float: left;
    width: 30%;
    margin: 5%;
    font-family: 'kalam',cursive;
}

.adress{ 
    /* background-color: blue; */
    float: left;
    width: 30%;
    margin: 5%;
    
}

.logo{
    font-size: 150%;
    color: orange;
    font-family:  'Kalam', cursive;

}
   .direccion{
       font-size: 100%;
       font-family: 'kalam',cursive;
    }


input[type=text], select {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
  }
  
  input[type=submit] {
    width: 100%;
    background-color: #4CAF50;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: solid white;
    border-radius: 4px;
    cursor: pointer;
  }
  
  button[type=submit] {
   
    background-color: #87d189;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;
  }

  input[type=submit]:hover {
    background-color: #45a049;
  }

  .tdspace{
      width: 50px
  }

  .section7section-container{
      padding-top: 4%;
      padding-bottom: 4%;
      padding-left: 10%;
      padding-right: 10%;
      background-color: rgb(245, 243, 243) !important;
      display: flex;
      flex-direction: row-reverse;
      width: 80% !important;
      flex-wrap: wrap;
      justify-content: center;
      justify-content: space-between;
      justify-content: space-around;
    }
  
  




  .iz{
      padding: 3.5%;
      height: 70vh;
      
      font-size: 1rem;
      width: 20%;
      background-image: url(./assets/tarjetasBlog/fondo-fresa_9845-108.webp);
      color: white;
      font-family:  'Poppins', sans-serif;

  
     }

  .cn{
    padding: 3.5%;
    height: 70vh;
    /* float: left; */
    background-color: rgb(101, 33, 33);
    width: 20%;
    background-image: url(./assets/tarjetasBlog/50930934-gracias-letras-ilustración-vectorial-letras-blancas-sobre-fondo-negro-del-grunge-inscripción-de-la-c.webp);
    font-family:  'Poppins', sans-serif;
    color: white;
    font-size: 1rem;
    


  
  }

  .dr{
    padding: 3.5%;
    height: 70vh;
    /* float: left; */
    
    width: 20%;
    background-image: url(./assets/tarjetasBlog/tiempo-del-café-fondo-inconsútil-para-su-diseño-22371116.jpeg);
    color: white;
    text-align: center;
    font-family:  'Poppins', sans-serif;
    font-size: 1rem;


  }

  span{
      border: 1px solid white;
      color: white;
      padding: 1.5%;
      font-family:  'Poppins', sans-serif;
  }

  .botonblog{
      background-color: orange;
      border-radius: none;
      font-family:  'Poppins', sans-serif;
      padding-top: 5%;
     
      
  }


  .social{
      background-color: rgb(255, 253, 253);
      height: 20vh;
      padding: 5%;
      color: rgb(5, 5, 5);
      font-family:  'Poppins', sans-serif;
      

  }

  .contenedorlogosocial img {
      width: 100% !important;

  }


  .contenedorlogosocial{
      padding-left: 35%;
      padding-right: 35%;
      


  }

  #imagensocial { 

    
    height: 10%;
    width: 10%;

  }

  .social p{
      text-align: center;
      padding-top: 5%;
     
  }

  .social a {
      font-size: 200%;
  }

  .footer-links {
    list-style-type: none;
  }

  footer {
    
    background-image: url("https://www.transparenttextures.com/patterns/blizzard.png");
    width: 100%;
    left: 0;
    bottom: 0;
    background-color: rgb(9, 9, 9);
    font-size: 1rem;
  }