/* Things to add:

Article - standard
class - artAlt (alternating article to create seperation)
class - artCent (centered article, no pictures)
h1
H2

/* 
Color palette:
#227b88 - terqoise
#fefdff - white
#f2585b - dark coral
#ffcf9d - light sand
#f2a957 - dark sand

*/

/* --------------------- Headings -------------------- */
h1,
h2,
h3 {
  color: #227b88;
}
h1 {
  font-size: 5em;
  text-align: center;
  padding: 0;
  margin: 20px;
}
h2 {
  font-size: 3em;
  text-align: center;
}
h3 {
  font-size: 2em;
  text-align: center;
  color: #f2585b;
  margin-right: 30%;
  margin-left: 30%;
  border: #227b88;
  border-width: 3px;
  border-style: solid;
  background-color: #ffcf9d;
}
h4 {
  font-size: 2em;
  color: #227b88;
  padding-top: 0%;
  margin-top: 0%;
  margin-bottom: 0%;
  padding-bottom: 0%;
}
h5 {
  font-size: 1.5em;
  color: #227b88;
  padding-top: 0;
  margin-top: 0%;
  margin-bottom: 0%;
  padding-bottom: 0%;
}
.secondary {
  border-bottom-color: #f2585b;
  border-bottom-width: 3px;
  border-bottom-style: solid;
  margin-right: 30%;
  margin-left: 30%;
}

/* --------------------- Nav Bar -------------------- */
nav {
  background-color: #227b88;
  border-bottom-style: solid;
  border-bottom-color: #f2585b;
  border-bottom-width: 10px;
  padding-top: 10px;
}
nav > ul {
  list-style-type: none;
  text-align: center;
  font-size: 1em;
}
nav > ul > li {
  display: inline-block;
  padding: 2%;
}
nav > ul > li > a {
  color: #fefdff;
  text-decoration: none;
}
nav > ul > li {
  font-size: 1.5em;
}
/* --------------------- Top image -------------------- */
Header > a > img {
  margin: auto;
  display: block;
  object-fit: cover;
  width: 100%;
  height: 15em;
}
/* --------------------- General -------------------- */
p {
  font-size: 1.5em;
}
ul {
  list-style-type: none;
}

/* --------------------- Jump list -------------------- */
.jumplist {
  margin: 0 auto;
  display: flex;
  max-width: 1200px;
}
.blurb {
  width: 60%;
  margin-right: 30px;
}
.list {
  display: inline-block;
}
.list > ul > li {
  list-style-type: none;
  font-size: 1.5em;
}
/* --------------------- article alignment -------------------- */

section {
  margin: 0 auto;
  display: flex;
  max-width: 1200px;
}
img {
  width: 385px;
  margin-right: 30px;
  margin-left: 30px;
}
.righttext {
  display: inline-block;
  width: 785px;
}
.lefttext {
  width: 785px;
}
/* --------------------- article alternate -------------------- */

/* --------------------- article centered -------------------- */
.artCent {
  display: block;
  margin: 0 auto;
  width: 900px;
}
/* --------------------- form -------------------- */

.formtop {
  display: flex;
  max-width: 1200px;
  margin: 0 auto;
}
.formleft,
.formright {
  width: 50%;
  text-align: center;
  border: #676767;
  border-width: 3px;
  border-bottom-style: dashed;
  padding-bottom: 30px;
}
.formcenter {
  padding-right: 35%;
  padding-left: 35%;
}
.formcenter > label {
  font-size: 2em;
  color: #227b88;
}
.formcenter > input {
  height: 2.25em;
  vertical-align: text-bottom;
  border-color: #227b88;
  box-shadow: none;
  border-style: solid;
  box-sizing: border-box;
  width: 100%;
  margin: 10px;
  
}
#message{
  height: 12em;
}
.formleft {
  border-right-style: dashed;
}
.formbottom {
  text-align: center;
}
#submit {
  color: #227b88;
  background-color: #bdbdbd;
  width: 200px;
  height: 50px;
  font-size: 1.75em;
}
em {
  color: #227b88;
  font-size: 1.5em;
  padding-top: 0%;
  margin-top: 0%;
  font-weight: bold;
}
/* --------------------- footer -------------------- */
footer {
  background-color: #227b88;
}
footer > h2 {
  color: #fefdff;
  padding-top: 60px;
  margin-bottom: 0;
  font-size: 3em;
}
footer > a {
  color: #fefdff;
  font-size: 2em;
  display: block;
  text-align: center;
  padding-bottom: 60px;
}
hr {
  margin-bottom: 30px;
  margin-top: 30px;
}
body {
  margin: 0%;
}
/* ---------------------- */
.Button {
  background-color: #f2585b;
  padding: 15px;
  font-size: 1em;
  text-decoration: none;
  border-radius: 10px;
  color: #fefdff;
  border-bottom-style: solid;
  border-bottom-color: #f2a957;
  border-right-style: solid;
  border-right-color: #f2a957;
}
.button:hover {
  padding: 20px;
}
.question {
  text-align: left;
  padding-left: 20%;
  padding-right: 30%;
}
.answer {
  text-align: right;
  padding-right: 20%;
  padding-left: 30%;
  font-size: 2em;
}

.small, .smallr{
  font-size: small;
  padding-left: 30px;
  margin-top: 0%;
}
.note {
  font-size: medium;
  color: #fefdff;
  margin: 0%;
  padding: 0%;
}
#check {
  font-size: medium;
}