/* grid-contenedor-footer */

@supports(display: grid ) {

  .grid-contenedor-footer {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas: "franja-AJ"
                         "franja-jep-footer";
  }

  @media screen and (min-width: 768px) {

    .grid-contenedor-footer {
      grid-template-columns: 1fr;
      grid-template-areas: "franja-AJ"
                           "franja-jep-footer";
    }
  }

  .franja-AJ {
    grid-area: franja-AJ;
  }

  .franja-jep-footer {
    grid-area: franja-jep-footer;
  }
}

/* -> grid-contenedor-footer */


/* grid-contenedor-franja-jep-footer */

@supports(display: grid) {

  .grid-contenedor-franja-jep-footer {
    display: grid;
    grid-template-columns: 0fr 12fr 0fr;
    grid-template-areas: "left-panel-franja-jel-footer contenido-franja-jep-footer right-panel-franja-jep-footer";
  }

  @media screen and (min-width: 1200px) { /* 1140px + 30px x 2 */
    .grid-contenedor-franja-jep-footer {
      grid-template-columns: 1fr 1140px 1fr;
    }
  }

  .contenido-franja-jep-footer {
    grid-area: contenido-franja-jep-footer;
  }

  .left-panel-franja-jep-footer {
    grid-area: left-panel-franja-jep-footer;
  }

  .right-panel-franja-jep-footer {
    grid-area: right-panel-franja-jep-footer;
  }
}

/* -> grid-contenedor-franja-jep-footer */


/* grid-contenedor-franja-informacion-jep */

@supports(display: grid) {

  .grid-contenedor-franja-informacion-jep {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas: "informacion-jep-contactos"
                         "informacion-jep-horarios"
                         "informacion-jep-mapa";
    grid-row-gap: 10px;
  }

  @media screen and (min-width: 768px) {
    .grid-contenedor-franja-informacion-jep {
      grid-template-columns: 1fr 1fr 1fr;
      grid-template-areas: "informacion-jep-contactos informacion-jep-horarios informacion-jep-mapa";
      grid-column-gap: 70px;
    }
  }

  @media screen and (min-width: 992px) {
    .grid-contenedor-franja-informacion-jep {
      grid-column-gap: 100px;
    }
  }

  .informacion-jep-contactos {
    grid-area: informacion-jep-contactos;
  }

  .informacion-jep-horarios {
    grid-area: informacion-jep-horarios;
  }

  .informacion-jep-mapa {
    grid-area: informacion-jep-mapa;
  }

}

/* -> grid-contenedor-franja-informacion-jep */


/* grid-contenedor-franja-logo-jep-cv-ubpd-footer */

@supports(display: grid) {

  .grid-contenedor-franja-logo-jep-cv-ubpd-footer {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas: "logo-jep-footer"
                         "logo-comision-verdad-footer"
                         "logo-upbd-footer";
    grid-row-gap: 20px;
  }

  @media screen and (min-width: 768px) {
    .grid-contenedor-franja-logo-jep-cv-ubpd-footer {
      grid-template-columns: 1fr 1fr 1fr;
      grid-template-areas: "logo-jep-footer logo-comision-verdad-footer logo-upbd-footer";
      grid-column-gap: 100px;
    }
  }

  .logo-jep-footer {
    grid-area: logo-jep-footer;
  }

  .logo-comision-verdad-footer {
    grid-area: logo-comision-verdad-footer;
  }

  .logo-upbd-footer {
    grid-area: logo-upbd-footer;
  }

}

/* -> grid-contenedor-franja-logo-jep-cv-ubpd-footer */
