* {
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    }

.fa-house {font-size: 1em; color: white; vertical-align: middle;}

.header-grid {
    display: grid;
    grid-template-columns: repeat(12,1fr);
    grid-template-rows: 45px 50px;
    height: 105px;
    width: 95%;
    max-width: 1300px;
    margin: auto;
    gap: 0px;
}

.logo {
    grid-column: 1/2;
    grid-row: 1/2;
} 

.textologo {
    grid-column: 2/10;
    grid-row: 1/2;
    text-align: left;
    font-size: 1.5em;
    font-family: 'Lavishly Yours', cursive;
    font-family: 'Lora', serif;
    font-family: 'Open Sans', sans-serif;
    font-family: 'Prompt', sans-serif;
}

.banner {
    grid-column: 1/12;
    grid-row: 2/3;
    background-color:darkblue;
    color:whitesmoke;
    margin: 0px;
    font-size: 2em;
    font-family: 'Lavishly Yours', cursive;
    font-family: 'Lora', serif;
    font-family: 'Open Sans', sans-serif;
    font-family: 'Prompt', sans-serif;
}

.home {
    grid-column: 12/13;
    grid-row: 2/3;
    background-color:darkblue;
    text-align: right;
    padding-right: 10px;
}

.section-grid {
    display: grid;
    grid-template-columns: repeat(12,1fr);
    height: 350px;
    width: 95%;
    max-width: 1300px;
    margin: auto;
    margin-bottom: 5px;
    gap: 5px;
}

.datos {
    grid-column: 1/6;
    grid-row: 1/2;
    border-style: solid;
    font-size: 0.8em;
}

.ubicacion {
    grid-column: 6/13;
    grid-row: 1/2;
    border-style: solid;
}

.separador {
    height: 20px;
}

.footer-grid {
    display: grid;
    grid-template-columns: repeat(12,1fr);
    grid-template-rows: 50px 20px;
    width: 95%;
    max-width: 1300px;
    margin: auto;
    row-gap: 5px;
}

.footer-grid-item {
    background-color:dodgerblue;
    color: white;
    text-align: center;
    font-size: 0.8em;
}

.redes {
    display: flex;
    flex-direction: row;
    justify-content:flex-start;
    column-gap: 10px;
    grid-column: 1/13;
    grid-row: 1/2;
    align-items: center;
}

.contacto {
    grid-column: 12/13;
    grid-row: 1/2;
    padding-top: 8px;
    text-align: center;
}

.derechos {
    grid-column: 1/13;
    grid-row: 2/3;
}

/*@media only screen and (max-width: 600px) {
    .header-grid {
        display: grid;
        grid-template-columns: repeat(12,1fr);
        grid-template-rows: 30px 12px;
        height: 50px;
        width: 95%;
        max-width: 1100px;
        margin: auto;
        gap: 4px;
    }
    
    .textologo {
        display: none;
    }

    .banner {
        grid-column: 2/13;
        grid-row: 1/3;
        background-color:darkblue;
        color:whitesmoke;
        margin: 0px;
    }
    
    .section-grid {
        display: grid;
        grid-template-columns: repeat(12,1fr);
        height: 335px;
        width: 95%;
        max-width: 1100px;
        margin: auto;
        margin-bottom: 5px;
        gap: 5px;
    }
    
    .imagenIPM {
        grid-column: 1/13;
        grid-row: 2/3;
        margin: auto;
        text-align: center;
    }

    #imagenIPM {
        max-width: 55%;
        height: auto;
    }
    
    .bienvenido {
        grid-column: 1/6;
        grid-row: 1/2;
        margin-top: 0px;
    }
    
    .usuarioypassword {
        grid-column: 6/13;
        grid-row: 1/2;
        margin-bottom: 0px;
    }
    }

@media only screen and (max-width: 400px) {
    .imagenIPM {
        display: none;
    }

    .banner {
        font-size: 1.5em;
    }
    }


.fa-brands {font-size: 1em; margin: auto;}

.fa-solid {font-size: 1em; margin: auto;}

.text-center {text-align: center;}