body {
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  margin: 0;  
  color: #01132d;
  background: #7196d0;
}

html, body {
    max-width: 100%;
    overflow-x: hidden;
}

a {
  color: #ff2000;
  font-weight: 700;
}

a:hover {
  color: #f8a109;
}

h2 {
  margin: 0;
  padding: 0;
  font-weight: 800;
  font-size: 130%;
}

p {
  margin: 2px;
  padding: 0;
}

h1 {
  margin: 5px 0 5px 0;
  padding: 0;
  font-weight: 800;
  font-size: 200%;
  text-decoration: underline dotted 3px;
}

#container {
  flex-direction: column;
  align-items: center;
  display: flex;
  text-align: center;
}

h3 {
  margin:0;
}

hr {
    border: 1px solid #faaf10;
    margin-bottom: 12px;
}

#header {
  background-image:
    linear-gradient(
      to bottom,
      rgba(113, 150, 208, 0) 0%,
      rgba(113, 150, 208, 0) 80%,
      #7196d0 100%
    ),
    url("img/headerphoto.jpg");
  background-size: cover;
  background-position: center;
  width: 100%;
  height: clamp(120px, 50vw, 800px);
  position: relative;
}

#header img {
  width: 95%;
  min-width: 440px;
  max-width: 100%;
  position: absolute;
  left: 50%;
  bottom: -50px;
  transform: translateX(-50%);
  z-index: 2;
}

#frame {
  background: linear-gradient(#7196d0 0%, #01132d 70%, #566e1d 100%);
  width: 100%;
  flex-direction: column;
  align-items: center;
  display: flex;
  text-align: center;
}

#content {
  background-color: #f2f6c4;
  background-image: url('img/bg_brush.png');
  padding: 4px;
  width: 75%;
  min-width: 340px;
  z-index: 1;
  flex-direction: column;
  align-items: center;
  display: flex;
  text-align: center;
  border: 8px solid #ff4557;
}

.item {
  background-color: #f2f6c4;
  padding: 12px;
  width: 85%;
  border: 3px solid #ff6f6f;
  outline: 6px solid #d7ac0b;
  margin-top: 20px;
  margin-bottom: 18px;
}

.item:hover {
  border: 3px solid #ff4557;
}

.item p {
  padding: 3px;
}

.doodad {
  width: 15%;
  min-width: 80px;
  margin: 10px 0 10px 0;
}

.doodad2 {
  width: 35%;
  min-width: 200px;
  margin: 10px 0 10px 0;
}

.doodad3 {
  width: 10%;
  min-width: 80px;
  margin: 5px 0 5px 0;
}

.doodad4 {
  width: 25%;
  min-width: 80px;
  margin: 10px 0 10px 0;
}

.float {
  background-color: #f2f6c4;
  width: 100%;
  z-index: 0;
  padding: 10px 0 10px 0;
  border-top: 3px solid #ff6f6f;
  outline: 4px solid #d7ac0b;
  margin-top: 12px;
}

.float p {
  padding: 0 8px 0 8px;
}

#subheadtext {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
}

#subheadtext p {
  width: 80%;
}

.section_reading {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  width: 90%;
  margin: 0 auto;
}

.section_reading-image img {
  width: 260px;
  margin: 5px;
}

.section_reading-child {
  min-width: 240px;
  flex: 1;
  text-align: center;
  padding: 0 12px 0 0;
}

.section_reading-child h3 {
  margin: 0;
}

.section_reading-child p {
  text-align: center;
}


.section_guest {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  border-bottom: 1px solid #faaf10;
  width: 90%;
  margin: 0 auto;
  padding: 5px 15px 0px 15px;
}


.section_guest-image img {
  width: 300px;
  height: 300px;
  margin: 5px;
}

.section_guest-child {
    min-width: 300px;
    flex: 1;
  text-align: center;
      margin: auto 0;
    padding: 0 12px 0 12px;
    }

.section_guest-child h3 {
  margin: 0;
}

.section_guest-child p {
  text-align: center;
}

#exhiblist {
  font-size:1.2em;
  line-height: 1.6em;
  overflow: hidden;
  text-overflow: ellipsis;
}

#exhiblist a {
  text-decoration: none;
}

.exname {
  white-space: nowrap;
  }

.exname::before {
    content: '\2666 \0020 ';
    color: #faaf10;
}

.exname:last-child:after {
  content: '';
}

#sponsors {
  display: table;
}

#sponsors img {
  vertical-align: middle;
  width: 15%;
  max-width: 256px;
  min-width: 80px;
  padding: 6px;
}