banner.css

.header {
    background-color: #F1F1F1;
    text-align: center;
    padding: 20px;
}
* {
    box-sizing: border-box;
}

body {
  margin: 0;
  background-color: #F9F9F9;
}

/* Style the header */
.header {
    background-color: #f1f1f1;
    padding: 10px;
    text-align: center;
}

/* Style the top navigation bar */
.topnav {
    overflow: hidden;
    background-color: #333;
}

/* Style the topnav links */
.topnav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}
/* The navbar container */
.menu {
   overflow: hidden;
   background-color: #333;
}
/* Navbar links */
.menu a {
   float: left;
   display: block;
   color: #f2f2f2;
   text-align: center;
   padding: 14px 16px;
   text-decoration: none;
}

/* Links - change color on hover */
.topnav a:hover {
   background-color: #ddd;
   color: black;
}
.footer {
    background-color: #F1F1F1;
    text-align: center;
    padding: 2px;
    bottom: 0;
    left: 0;
    width: 100%;
}
p{
  text-align: justify;
}
h2, h4, h5{
  text-align: center;
}
h3, h6{
  text-align: left;
}
.next{
  position: fixed;
  bottom: 0%;
  right: 0%;
  z-index: 100;
}
.nextbutton{
  position: fixed;
  bottom: 3%;
  right: 0%;
  z-index: 100;
}
.wrapper {
  display: grid;
  background-color: white;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 5px;
  grid-auto-rows: minmax(47px, auto);
  grid-template-areas:
  "c d e"
  "c d e"
  "c d e"
  "c d e"
  "c d e"
  "f d g"
  "f d g"
  "f d g"
  "f d g"
  "f d g";
}

@media all and (max-width: 1000px) {
  .wrapper{
    grid-template-columns: 1fr;
    grid-template-areas:
      "d"
      "c"
      "e"
      "f"
      "g";
      grid-template-columns: 1fr;
    }
}

.three {
  grid-area:c;
  background-color: #F9F9F9;
  padding: 7px;
}
.four {
  grid-area: d;
  background-color: #F9F9F9;
  padding: 7px;
}
.five {
  grid-area: e;
  background-color: #F9F9F9;
  padding: 7px;
}
.six {
  grid-area: f;
  background-color: #F9F9F9;
  padding: 7px;
}
.seven{
  grid-area: g;
  background-color: #F9F9F9;
  padding: 7px;
}
a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

a:active {
    text-decoration: underline;
}
a.headerlink{
  color: black;
}
.edit{
  position: absolute;
  left: 50%;
}
p.foot{
  text-align: center;
}
img{
    display: block;
    margin: auto;
    width: 40%;
   }