:root {
  --basewidth: 120ch;
}
body {
  margin: 0;

  background-image: url("pattern2.svg");
  background-size: 30px;
  font-family: Helvetica;

}

.push {
    margin-right: auto;
}

img {
  width: 100%;
}

/* ----- Header/Footer ----- */

header {
    /* background-color: black; */
    background: linear-gradient(110deg,

        /* #092264, #092254 05ch, */
        /* #373773 05ch, #373773 10ch, */
        /* #5277a1 10ch, #5277a1 15ch, */
        /* #faac86 15ch, #faac86 20ch, */
        /* #fdd4c0 20ch */

        #092264, #092254 9%,
        #373773 9%, #373773 18%,
        #5277a1 18%, #5277a1 27%,
        #faac86 27%, #faac86 36%,
        #fdd4c0 36%

        /* #fdd4c0 00ch, #fdd4c0 05ch, */
        /* #faac86 05ch, #faac86 10ch, */
        /* #5277a1 10ch, #5277a1 15ch, */
        /* #373773 15ch, #373773 20ch, */
        /* #092264 20ch, #092254 25ch */
    );

    display: flex;
    flex-direction: row;
    justify-content: center;
}


nav {
    display: flex;
    align-content: center;
    /* align-items: center; */
    width: var(--basewidth);
    /* margin-left: 22ch; */
}

nav li {
    /* color: white; */
    color: black;
    text-decoration: none;
    margin: 1ch;
    font-size: 18px;
    font-weight: 600;
    list-style-type: none;
}

nav a {
  text-decoration: none;
}

.redcirc {
    height: 2ch;
}

footer {
    background: linear-gradient(
      110deg,
      /* #fdd4c0, #fdd4c0 63%, */
      /* #faac86 63%, #faac86 72% */
      /* #5277a1 72%, #5277a1 79%, */
      /* #373773 79%, #373773 87%, */
      /* #092264 87%, #092254 100% */
      #fdd4c0 0%, #fdd4c0 75%,
      #faac86 75%, #faac86 81%,
      #5277a1 81%, #5277a1 87%,
      #373773 87%, #373773 93%,
      #092264 93%, #092254 100%
    );
    border-top: 5px solid black;

    display: flex;
    flex-direction: row;
    justify-content: center;
}

.twocol {
  column-count: 2;
  column-width: 50ch;
}


/* ----- Dropdown ----- */


.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding: 12px 16px;
  z-index: 1;
}

.dropdown:hover .dropdown-content {
  display: block;
}

/* ----- Main Content ----- */

main {
  display: flex;
  flex-direction: column;
  align-items: center;

  padding: 1ch;
  line-height: 2.0;
}

section {
  border: 1px solid black;
  box-sizing: border-box;
  padding: 2ch;
  max-width: var(--basewidth);
  width: 100%;
  background-color: white;
  margin: 1ch;

  border-radius: 2ch;

  /* display: grid; */
  /* grid-template-columns: 60ch 60ch; */
}

section table {
  width: 50ch;
  margin: 1ch auto 1ch auto;
  border-collapse: collapse;
}

section table td {
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  padding: 1ch;
}

section table ul {
  padding-left: 2ch;
  /* list-style-type: none; */
}

section img {
  width: 100%;
}

/* center content within a section */
.center {
  margin: 1ch auto 1ch auto;
  display: block;
}

figure {
  /* prevent caption from being separated/split across columns */
  display: inline-block;
}

figcaption {
  text-align: center;
}

.banner {
  overflow: hidden;
  padding: 0;
  line-height: 0;
}

.banner img {
  height: 100%;
  margin: 0;
}

.inline-right {
  float: right;
  width: 40ch;
  margin: 3ch;
}

h1 { font-size:1.5em }
h2 { font-size: 1.2em }