/* Text Elements */

h1#heading {
  display: inline-block;
  margin-right: 18px;
  margin-left: 12px;

  grid-area: top;
  justify-self: center;
}

h1.text {
  display: inline-block;
  -ms-flex-order: 2;
  float: left;
  clear: left;
  margin-bottom: 50px;
  padding-bottom: 0;
  font-size: 28px;
  font-family: 'Jura', sans-serif;

  -webkit-align-self: flex-end;
  -ms-flex-item-align: end;
          align-self: flex-end;
  justify-self: end;
  -webkit-box-ordinal-group: 3;
  -webkit-order: 2;
     -moz-box-ordinal-group: 3;
          order: 2;
}

p.paragraph#infoText {
  margin-right: 10px;
  margin-left: 24px;
  text-align: center;
  font-family: 'Jura', sans-serif;

  grid-area: bot;
  justify-self: center;
}

p.paragraph#paragraph-1 {
  display: block;
  float: none;
  clear: none;
  text-align: center;
  font-size: 12px;
  font-family: 'Jura', sans-serif;

  justify-self: center;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
          align-self: center;
}

p.paragraph.paragraph-1 {
  display: block;
}

/* Interaction Elements */

a.link-button.text {
  position: static;
  float: left;
  clear: left;
  margin-top: 0;
  margin-bottom: 30px;
  padding: 8px 24px 10px;
  min-width: 70px;
  min-height: 20px;
  border-width: .0625rem;
  border-style: solid;
  border-radius: 4px;
  background-color: #004973;
  box-shadow: #000 -1px 3px 0 2px;
  color: #78c3d0;
  text-align: center;
  text-shadow: #000 -3px 1px 3px;
  font-weight: 600;
  font-family: 'Jura', sans-serif;

  -webkit-align-self: center;
  -ms-flex-item-align: center;
          align-self: center;
  grid-area: elementArea;
}

a.link-button#btnThree {
  float: left;
  clear: left;

  grid-area: mid;
  justify-self: center;
}

/* Layout Elements */

.container#menu {
  display: grid;
  background-color: #00bfff;

  grid-template-columns: minmax(15%, 50px) auto minmax(10px, 50px);
  grid-template-rows: minmax(20px, auto) minmax(50px, 30vh) auto minmax(50px, 30vh) 50px;
  grid-template-areas: 'spaceLeft spaceTop spaceRight' 'spaceLeft top spaceRight' 'spaceLeft mid spaceRight' 'spaceLeft bot spaceRight' 'spaceLeft spaceBot spaceRight';
}

.container.container-2 {
  min-width: 100vw;
  min-height: 100vh;

  justify-self: auto;
  grid-template-rows: 100px minmax(100px, 40%) auto 200px minmax(100px, 150px);
}

.container#midDiv {
  grid-area: mid;
  justify-self: center;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
          align-self: center;
}

.container#container-1 {
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .2) 66%, rgba(0, 73, 115, 1) 100%);
  background-image:    -moz-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .2) 66%, rgba(0, 73, 115, 1) 100%);
  background-image:      -o-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .2) 66%, rgba(0, 73, 115, 1) 100%);
  background-image:         linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .2) 66%, rgba(0, 73, 115, 1) 100%);
  background-attachment: scroll;
  background-position: left top;
  background-clip: border-box;
  background-origin: padding-box;
  background-size: auto auto;
  background-repeat: repeat;

  background-blend-mode: multiply;
}

.container.leftDiv {
  grid-area: spaceLeft;
  justify-self: auto;
}

.container#copyright {
  display: flex;
  justify-content: center;
  align-items: center;

  grid-area: spaceBot;
  justify-self: center;
}

.container.container-1 {
  float: none;
  clear: none;
  -webkit-column-count: auto;
     -moz-column-count: auto;
          column-count: auto;
}

div.responsive-picture#picture-1 {
  display: inline-block;
  min-width: 20px;
  max-width: 200px;
  width: 60px;

  grid-area: top;
  justify-self: center;
}

div.responsive-picture.picture-1 {
  float: left;
  clear: left;
  background-image: none;
  background-attachment: scroll;
  background-position: left top;
  background-clip: border-box;
  background-origin: padding-box;
  background-size: 0 0;
  background-repeat: no-repeat;

  background-blend-mode: normal;
  -webkit-align-self: flex-start;
  -ms-flex-item-align: start;
          align-self: flex-start;
}

div.responsive-picture.picture-1 > picture > img {
  -o-object-fit: scale-down;
     object-fit: scale-down;
}

div.responsive-picture#picture-1 > picture > img {
  -o-object-fit: contain;
     object-fit: contain;
}

div.responsive-picture#picture-2 {
  position: static;
  right: -30%;
  display: block;
  float: none;
  clear: none;
  overflow: visible;
  margin-right: 10px;
  margin-left: 10px;
  min-width: 30px;
  max-width: 100px;
  width: 40px;
  vertical-align: middle;

  -webkit-align-self: center;
  -ms-flex-item-align: center;
          align-self: center;
  justify-self: center;
}

div.responsive-picture#picture-2 > picture > img {
  -o-object-fit: fill;
     object-fit: fill;
  -o-object-position: 50% 50%;
     object-position: 50% 50%;
}

div.responsive-picture.picture-2 {
  display: block;
  min-width: 30px;
  width: 40px;

  -webkit-align-self: center;
  -ms-flex-item-align: center;
          align-self: center;
}