﻿body {
    background-color:lightgrey;
}

.bgTransp {
    background: rgba(255, 255, 255, 0.60);
    padding: 10px;
}

.loginContenedorGrid {
    display: grid;
    margin:10px 0 0 0;
    grid-gap: 10px;
    grid-template-columns: auto 50% auto;
    grid-template-areas:
        "loginIzq loginCent loginDer"
        "loginInf loginInf  loginInf";
}

    .loginIzq {
        grid-area: loginIzq;
    }

    .loginCent {
        grid-area: loginCent;
    }

    .loginDer {
        grid-area: loginDer;
    }

    .loginInf {
        grid-area: loginInf;
    }


.contenedorGrid2Bloques {
    display:grid;
    grid-gap: 10px;
    margin: 10px 0 0 0;
    grid-template-areas:
        "areaSuperior"
        "areaInferior";
}

    .areaSuperior {
        grid-area: areaSuperior;
    }

    .areaInferior {
        grid-area: areaInferior;
    }


.indexGrid {
    display:grid;
    grid-gap: 10px;
    grid-template-rows: minmax(20px, 600px) auto auto;
    grid-template-columns: minmax(100px, auto);
    grid-template-areas:
        "indexSuperior"
        "indexMedio"
        "indexInferior";
}

    .indexSuperior {
        grid-area: indexSuperior;
        background-image: url('/img/bg_Modeo.jpg');
        background-size: cover;
        background-repeat: no-repeat;        
    }

    .indexMedio {
        grid-area: indexMedio;
    }

    .indexInferior {
        grid-area: indexInferior;
    }