/* grid-contenedor-contenido */

@supports(display: grid ) {

  .grid-contenedor-contenido {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas: "franja-migas"
                         /* "go-back" No usado en JEP */
                         "opcion-seleccionada"
                         "franja-modulos";
  }

  .franja-migas {
    grid-area: franja-migas;
  }

  .go-back { /* No usado en JEP */
    grid-area: go-back;
  }

  .opcion-seleccionada {
    grid-area: opcion-seleccionada;
  }

  .franja-modulos {
    grid-area: franja-modulos;
  }
}

/* -> grid-contenedor-contenido */


/* grid-contenedor-franja-modulos */

@supports(display: grid) {

  .grid-contenedor-franja-modulos {
    display: grid;
    grid-template-columns: 0 1fr 0;
    grid-template-areas: "left-panel-modulos contenido-modulos right-panel-modulos";
  }

  @media screen and (min-width: 1200px) { /* 1140px + 30px x 2 */
    .grid-contenedor-franja-modulos {
      grid-template-columns: 1fr 1140px 1fr;
    }
  }

  .contenido-modulos {
    grid-area: contenido-modulos;
  }

  .left-panel-modulos {
    grid-area: left-panel-modulos;
  }

  .right-panel-modulos {
    grid-area: right-panel-modulos;
  }
}

/* -> grid-contenedor-franja-modulos */