*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    --color1: rgb(239, 229, 229);
    --color2: rgb(220, 226, 238);
    --color3: rgb(213, 242, 213);
    --color4: rgb(172, 52, 52);
    --color5: rgb(66, 66, 206);
    --color6: rgb(34, 132, 34);
}
hr{
    border: 1px solid black;
}
body{
    background-image: url('Imagenes/fondo.jpg');
}
#contenedor{
    width: 90%;
    margin: 25px auto;
}
#cabecera{
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* border: solid; */
}
#logo{
    border-radius: 50%;
}

h4{
    text-align: end;
}
#definiciones{
    display: flex;
    border: 5px solid;
    flex-direction: row;
    justify-content: space-between;
    margin: 10px auto;
    padding: 10px;
}
#definiciones h3{
    text-align: center;
    color: white;
}
#definiciones p{
    text-align: justify;
    margin: 10px;
    padding: 10px
}
.html{
    background-color: var(--color1);
    margin: 8px;
    width: 30%;
}
.html h3{
    background-color: var(--color4);
}
.html img{
    width: auto;
    display: block;
    margin: auto;
}
.css{
    background-color: var(--color2);
    margin: 8px;
    width: 30%;
}
.css h3{
    background-color: var(--color5);
}
.css img{
    width: auto;
    display: block;
    margin: auto;
}
.jc{
    background-color: var(--color3);
    margin: 8px;
    width: 30%;
}
.jc h3{
    background-color: var(--color6);
}
.jc img{
    width: auto;
    display: block;
    margin: auto;
}
#definiciones img{
    width: 100px;
}
#analogia{
    display: flex;
    border: 5px solid;
    flex-direction: row;
    justify-content: space-between;
    margin: 10px auto;
    padding: 10px;;
}
#analogia h3{
    text-align: center;
    color: white;
}
#analogia p{
    text-align: justify;
    margin: 10px;
    padding: 10px
}
#casas img{
    display: flex;
    width: 500px;
    margin: 15px auto;
    box-shadow: 15px 15px 40px black;
}
#pie p{
    text-align: center;
    margin: 25px auto;
    background-color: white;
    border-radius: 10px;
}
.icono{
    display: flex;
    justify-content: center;
    border: solid black;
    background-color: var(--color4);
}
.icono2{
    display: flex;
    justify-content: center;
    border: solid black;
    background-color: var(--color5); 
}
.icono3{
    display: flex;
    justify-content: center;
    border: solid black;
    background-color: var(--color6);
}