body[layout='layout-home'] {
  display: grid;
  grid-template-columns: 1fr minmax(692px, 950px) 1fr;
  grid-template-rows: 56px repeat(6, minmax(350px, auto)) auto;
  grid-template-areas:
    "head-l       head-main       head-r"
    "content-l    content-main    content-r"
    "content2-l   content2-main   content2-r"
    "content3-l   content3-main   content3-r"
    "content4-l   content4-main   content4-r"
    "content5-l   content5-main   content5-r"
    "content6-l   content6-main   content6-r"
    "foot-l       foot-main       foot-r"
}

.ga-head-l {
  grid-area: head-l;
}
.header-grid-area {
  grid-area: head-main;
}
.ga-head-r {
  grid-area: head-r;
}

.ga-content-l {
  grid-area: content-l;
}
.ga-content-main {
  grid-area: content-main;
}
.ga-content-r {
  grid-area: content-r;
}

.ga-content2-l {
  grid-area: content2-l;
}
.content-grid-area {
  grid-area: content2-main;
}
.ga-content2-r {
  grid-area: content2-r;
}

.ga-content3-l {
  grid-area: content3-l;
}
.ga-content3-main {
  grid-area: content3-main;
}
.ga-content3-r {
  grid-area: content3-r;
}

.ga-content4-l {
  grid-area: content4-l;
}
.ga-content4-main {
  grid-area: content4-main;
}
.ga-content4-r {
  grid-area: content4-r;
}

.ga-content5-l {
  grid-area: content5-l;
}
.ga-content5-main {
  grid-area: content5-main;
}
.ga-content5-r {
  grid-area: content5-r;
}

.ga-content6-l {
  grid-area: content6-l;
}
.ga-content6-main {
  grid-area: content6-main;
}
.ga-content6-r {
  grid-area: content6-r;
}

.ga-foot-l {
  grid-area: foot-l;
}
.ga-foot-main {
  grid-area: foot-main;
}
.ga-foot-r {
  grid-area: foot-r;
}
.sidebar-grid-area {
  grid-area: content-side;
}
body[layout='layout-sidebar'] {
  grid-auto-rows: 0; 
  grid-auto-columns: 0;
  overflow-x: hidden;
  display: grid;
  grid-template-columns: 1fr 300px minmax(665px, 830px) 1fr;
  grid-template-rows: 81px minmax(350px,auto) auto;
  grid-template-areas:
    "content-l  head-main     head-main     content-r"
    "content-l  content-side  content2-main  content-r"
    "content-l  foot-main     foot-main     content-r"
}

@media (max-width: 1024px) {
  body[layout='layout-home'],
  body[layout='layout-sidebar']  {
    display: grid;
    grid-template-columns: auto;
    grid-template-rows: 56px minmax(350px, 1fr) auto;
    grid-template-areas:
      "head-main"
      "content2-main"
      "foot-main";
    /* next 4 lines prevents stray grid items from being written WTF???????? */
    grid-auto-rows: 0; 
    grid-auto-columns: 0;
    overflow-x: hidden;
  }
  .ga-head-l,
  .ga-head-r,
  .ga-content-l,
  .ga-content-main,
  .ga-content-r,
  .ga-content2-l,
  .ga-content2-main,
  .ga-content2-r,
  .ga-content3-l,
  .ga-content3-main,
  .ga-content3-r,
  .ga-foot-l,
  .ga-foot-r,
  .ga-content4-l,
  .ga-content4-main,
  .ga-content4-r,
  .ga-content5-l,
  .ga-content5-main,
  .ga-content5-r,
  .ga-content6-l,
  .ga-content6-main,
  .ga-content6-r {
    display: none;
  }
}