body{
    font-family: 'Source Sans Pro', sans-serif;
    background-color: #1c1c1c;

}

/* barra navegacion*/

#barranavegacion{
    font-family: 'Source Sans Pro', sans-serif;
    color: red;}
#barranavegacion {
    width: 100%;
    margin: 0 auto;
    background-color:#4c8e17;
    background: linear-gradient(to bottom right,#d3f36b, #4c8e17);

}
.logo{
    width: 20%;
    justify-content: flex-start;
}
#menu  {
    width: 90%;
    margin: 0 auto;
    justify-content: space-between;
}
#barranavegacion .categorias {
    font-weight: 600;
    text-decoration: none;
    gap: 30px;
    color: #d3f36b;
} 
#barranavegacion .categorias :hover {
    font-weight: 600;  
    color: #d3f36b;
}


#barranavegacion   {
    font-weight: 600;  
    color: red;
}




/* seccion presentacion */
#presentacion{
    width: 90%;
    margin: 0 auto;
    display: flex;

    background-color: #1c0d02;
    border-radius: 10px;
    align-items: center;
    align-content: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 25px 10px;
    margin-top: 100px;
}

#presentacion .presentacion1{
    width: 90%;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    align-content: center;
    justify-content: space-evenly;
    flex-wrap: wrap;
    background: linear-gradient(to bottom right,#d3f36b, #4c8e17);
    border-radius: 12px;
    padding:  20px;
    min-width: 380px;
}

#presentacion .slide{
    padding: 20px;
}

#presentacion .texto {
    width: 40%;
    margin: 0 auto;
    flex-grow: 1;
    padding:  20px;
    text-align-last: left;
    hyphens: auto;
    text-indent: 0px;
    justify-content: right;
    color: #1c1c1c;
}

#presentacion .texto h3 {
    font-weight: 600;
    line-height: 30px;
    padding: 10px 0;
}

/* seccion datos */
#datos{
    width: 90%;
    margin: 0 auto;
    display: flex;

    background-color: #1c0d02;

    border-radius: 10px;
    align-items: center;
    align-content: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 25px 10px;
    margin-top: 30px;
    margin-bottom: 50px;
}

#datos .frase1{
    margin: 0 auto;
   
    font-weight: 600;
   padding: 10px 30px;
   color: #1c1c1c;

}
#datos .frase2{
    margin: 0 auto;
    font-weight: 600;
   padding: 10px 30px;
   color: #FFF7DB;
}

#datos .datos1{
    width: 90%;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    align-content: center;
    justify-content: space-evenly;
    flex-wrap: wrap;
    background: linear-gradient(to bottom right,#d3f36b, #4c8e17);
    border-radius: 12px;
    padding:  20px;
    min-width: 380px;
}

/* inicio contacto */

#contacto{
    width: 100%;
    margin: 0 auto;
    padding: 30px  ;
    align-items: center;

    padding: 30px 0 0 0;

    margin-top: 30px;
    margin-bottom: 30px;
}

/* inicio footer */

#piedepagina{
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-wrap: wrap;
    flex-grow: 1;


    background-color: #4c8e17;
    color: white;
    padding: 70px 0 ;
    }


    #piedepagina ul{
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 14px;    
    }
    #piedepagina .footer-col{
    width: 25%;
    gap: 20px;
    padding: 10px;
    margin: 10px;           
    }
    #piedepagina .footer-col h4{
    font-weight: 700;
    margin-bottom: 20px;
    }
    #piedepagina .footer-col ul  a{    
    font-weight: 600;
    margin-bottom: 15px;
    text-decoration: none;
    color: white;
    display: block;    
    }

    #piedepagina .footer-col ul li :hover{    
    color: #f2b90c;
    font-weight: 600;
    }

#piedepagina .slide{
    margin:  10px;
    padding: 20px;
}

   #piedepagina .linea{
    display: flex;
    flex-direction: row;
    align-items: center;
   }

   #piedepagina .icono{
       padding-right: 10px;
   }
   #piedepagina .margen{
    padding-left: 20px;
}
#piedepagina .espacio{
    margin-top: 10px;
}