html {
  font-family: "Helvetica", "Arial", sans-serif;
}
element.style {
  display: block;
}
input, :before :after, * {
  box-sizing: border-box;
}
body {
  display: block;
  color: black;
  text-align: center;
  margin: 0;
}
header {  
  background: light-blue;
  position: fixed;
  margin: 0px;
  top: 0px;
  left: 0px;
   width: 100%;
  color: white;
  padding: 1px;
}
main {
  background: #ffffff;
  margin: 0px;
  position:fixed;
  top:388px;
  bottom: 50;
  width: 100%;
  color: black;
  padding: 1px;
}
footer {
	background: light-blue;
  position:fixed; 
  margin: 0px;
  bottom: 0px;
  left: 0px;
  width: 100%;
  color: white;
  padding: 1px;
}
div {
  vertical-align: baseline;
  margin: 0px;
  padding: 0px;
  border: 0px;
  border-width: 0px;
}
section {
  margin: 5px;
  padding: 25px;
}
.newsletter-frame {
  background: #1d2c41;
  margin: 0 auto;
  width: 100%;
  max-width: 1360px;
  padding-inline-start: 0px;
  padding-inline-end: 0px;
}
.updates-bar {
  display: grid; 
  align-items: center;
  min-height: 2.6rem;
  grid-template-columns: 50% 20% 30%;
}
.updates-bar-social-media {
  padding-inline-end: 1.25rem;
}
.social-media-icons {
  display: flex;
  flex-wrap: wrap;
  margin-inline-start: -.3125rem;
}
.social-media-icons a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 2rem;
  margin: .3125rem;
  border: none;
}
.social-media-icons a .icon {
  width: 3rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.social-media-icons a .icon img {
  height: 100%;
}
.updates-bar-announcements {
  padding-inline-end: 1.25rem;
}
.announcements {
  display: contents;
  align-items: center;
  justify-items: center;
}
.updates-bar-codices-signup {
  padding-inline-end: 1.25rem;
}
.codices-signup {
  display: content;
  align-items: center;
  justify-items: center;
}
.codices-signup a {
  font-display: block;
}
.codices-signup a:link {
  color: #ffffff;
}
.codices-signup a:visited {
  color: lightgray;
}
.codices-signup a:hover {
  color: lightyellow;
}
.navigation-frame {
  background: #ffffff;
  margin: 0 auto;
  width: 100%;
  max-width: 1360px;
  padding-inline-start: 0px;
  padding-inline-end: 0px;
}
table {
	table-layout: Auto;
  width:100%;
  margin: 0px auto;
  border-collapse: collapse;
  border-bottom: 1px solid #1d2c41;
  border-top: 1px  solid #1d2c41;
}
caption {
  padding: 1 em;
  font-style: italic;
  caption-side: top;
  letter-spacing: 1 px;
}
th {
  padding: 0em;
  vertical-align: left;
}
td {
  color: black;
  padding: 0.6em;
  vertical-align: top;
}
caption {
  padding: 1em;
  font-style: italic;
  caption-side: top;
  letter-spacing: 1px;
}
.menu {
  list-style: none; 
  padding: 0;
  margin: 0;
  text-align: center;
}
/*
ul li {
  display: inline-block;
  margin: 10px 10px;
}
*/
.button {
  position: relative;
  display: inline-block;
}
.button-link {
  text-decoration: none;
  padding: 10px 20px;
  background-color: #1d2c41;
  color: #ffffff;
  cursor: pointer;
}
.button-link a{
  background-color: #1f3f6d;
}
.button-link:hover, .dropButton:focus {
  background-color: #2868c2;
}
.drop-down {
  position: relative;
  display: inline-block;
}
.drop-button {
  position: relative;
  display: inline-block;
  background-color: #1d2c41;
  padding: 10px 20px;
  color: #ffffff;
  cursor: pointer;
}
.drop-button:hover, .drop-button:focus {
  background-color: #2868c2;
}
.drop-down-content {
  display: none;
  position: absolute;
  background-color: #739eda;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  border-radius: 10px;
  z-index: 1;
}
.drop-down-content a {
  color: #ffffff;
  padding: 12px 16px;
  text-decoration: none;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  display: block;
}
.drop-down-content a:hover{
  background-color: #1631c5;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  border-radius: 10px;
}
.show {
  display:block;
}
tfoot {
  border-top: 1px solid #1d2c41;
  border-right: 1px solid #1d2c41;
  border-left: 1px solid #1d2c41;
}
.form {
  border: 1px solid #1d2c41; 
}
.build-cosmic-creations {
  background: rgb(66, 27, 1);
  color: #ffffff;
  margin: 0 auto;
  width: 100%;
  max-width: 1360px;
  padding-inline-start: 0px;
  padding-inline-end: 0px;
}
.story-progress {
  position: relative;
  display: grid; 
  align-items: center;
  min-height: 2.6rem;
  grid-template-columns: 33% 33% 33%;
}
.story-progress-update-bar {
  padding-inline-end: 1.25rem;
}
.progress-update-icons {
  display: flex;
  flex-wrap: wrap;
  margin-inline-start: -.3125rem;
}
.published.products {
  position: relative;
  display: grid; 
  align-items: center;
  min-height: 2.6rem;
  grid-template-columns: 40% 60%;
}
.published.products {

}
.biography-section {
  background: #CCCCFF;
  margin: 0 auto;
  height: 500px;
  width: 100%;
  max-width: 1360px;
  padding-inline-start: 0px;
  padding-inline-end: 0px;
  border-radius: 10px;
  overflow-y:scroll;
}
.biography-contact-section {
  color: orange;
  position: relative;
  display: block; 
  align-items: center;
  min-height: 2.6rem;
  border-left: 1px solid #black;
  border-right: 1px solid #black;
  box-shadow: 0px 8px 16px 0px #black;
}
.biography-education-section {
  color: #4B0082;
  position: relative;
  display: block; 
  align-items: center;
  min-height: 2.6rem;
  border-left: 1px solid #black;
  border-right: 1px solid #black;
}
.biography-memberships-section {
  color: teal;
  position: relative;
  display: block; 
  align-items: center;
  min-height: 2.6rem;
  border-left: 1px solid #black;
  border-right: 1px solid #black;
}