html, body {
   -webkit-text-size-adjust: none;
    min-height: 100%;
    margin: 0;
    padding: 0;
}

#bg {
   margin: 0;
   padding: 0;
   border: 0;
   outline: 0;
   vertical-align: baseline;
   margin-right: auto;
   margin-left: auto;
   width: 100%;
   font-size: 16px;
   font-weight: inherit;
   font-style: inherit;
   font-family: Arial, Helvetica, sans-serif;
   color: #474849;
}

#logo {
   background-color: #000000;
   padding: 20px;
   /* Set top section to fixed position */
   position: fixed;
   width: 100%;
   overflow: hidden;
   top: 0;
}

#menu ul {
   position: absolute;
   top: 20px;
   left: 60%;
   position: fixed; /* Set to fixed position */
}

#menu li {
   display: inline;
   padding-right: 18px;
}

#menu a {text-decoration: none; color: #ffffff;}
#menu a:visited {color: #ffffff;}
#menu a:hover {color: silver;}

a {text-decoration: none; color: #1570A6;}
a:visited {color: #1570A6;}
a:hover {color: red;}

#midsec {
   width: 100%;
   max-width: 800px;
   background-color: white;
   color: #474849;
   text-align: justify;
   margin: auto;
   margin-top: 70px;
}

#bottombar {
   width: 100%;
   height: 120px;
   background-color: #474849;
   color: white;
   padding-top: 4px;
   font-size: 87%;
}

#bottombar a {text-decoration: none;color: #ffffff;}
#bottombar a:visited {color: #ffffff;}
#bottombar a:hover {color: silver;}

.note {
   color: #474849;
   font-size: 87%;
}

.button {
   background-color: #1570A6;
   color: white;
   height:25px;
}

figcaption{
  position: relative;
}

figure{
  
  opacity: 0;
  transition: 1s opacity;
  max-width: 800px;
  margin: auto;
}

figure.show{
  opacity: 1;
  position: static;
  transition: 1s opacity;
}

.input_field {
   border: 1px solid #1570A6;
}

.input_field_invalid {
   display: none;
   color: red;
}

.opt {font-size: 10px;}