.container {  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(5, auto);
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "section-navi"
    "section-hero"
    "section-body"
    "section-subs"
    "section-foot";
}

.section-navi {  display: grid;
  grid-template-columns: 1fr 5fr 1fr;
  grid-template-rows: 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    ". navi .";
  grid-area: section-navi;
}

.navi {  display: grid;
  grid-template-columns: 1fr 3fr;
  grid-template-rows: 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "navi-img navi-links";
  grid-area: navi;
}

.navi-img {
  justify-self: start;
  align-self: center;
  grid-area: navi-img;
}

.navi-links {
  justify-self: end;
  align-self: center;
  grid-area: navi-links;
}

.section-hero {  display: grid;
  grid-template-columns: 1fr 5fr 1fr;
  grid-template-rows: 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    ". hero .";
  grid-area: section-hero;
}

.hero { grid-area: hero; }

.section-body {  display: grid;
  grid-template-columns: 1fr 5fr 1fr;
  grid-template-rows: 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    ". body .";
  grid-area: section-body;
}

.body { grid-area: body; }

.section-subs {  display: grid;
  grid-template-columns: 1fr 5fr 1fr;
  grid-template-rows: 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    ". subs .";
  grid-area: section-subs;
}

.subs { grid-area: subs; }

.section-foot {  display: grid;
  grid-template-columns: 1fr 5fr 1fr;
  grid-template-rows: repeat(3, 1fr);
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-area: section-foot;
}

.foot-crumbs {
  justify-self: start;
  align-self: center;
  grid-area: 1 / 2 / 2 / 3;
}

.foot-top {
  justify-self: end;
  align-self: center;
  grid-area: 1 / 2 / 2 / 3;
}

.foot-copy {
  justify-self: start;
  align-self: center;
  grid-area: 3 / 2 / 4 / 3;
}

.foot-legal {
  justify-self: center;
  align-self: center;
  grid-area: 3 / 2 / 4 / 3;
}

.foot-privacy {
  justify-self: end;
  align-self: center;
  grid-area: 3 / 2 / 4 / 3;
}

.foot-widgets {  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "foot-widget-1 foot-widget-2 foot-widget-3 foot-widget-4";
  grid-area: 2 / 2 / 3 / 3;
}

.foot-widget-1 { grid-area: foot-widget-1; }

.foot-widget-2 { grid-area: foot-widget-2; }

.foot-widget-3 { grid-area: foot-widget-3; }

.foot-widget-4 { grid-area: foot-widget-4; }