/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color: #01141C;
  color: #04362A;
  font-family: "Georgia", serif;
  display: flex;
  justify-content: center;
  align-items: center;
}
#Columns{
  min-width: 85%;
  max-width: 85%;
  background-color: #6E7B85;
  border-radius: 15px 15px 15px 15px;
  margin-top: 1em;
  display: inline-block;
  justify-content: center;
  align-items: center;
}
#Wide{
  min-width: 100%;
  max-width: 100%;
  display: inline-block;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 15px 15px 0px 0px;
}
#HeaderImg{
  background-image: url("https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fimg.freepik.com%2Fpremium-photo%2Fwatercolor-swirl-background-blending-seamless-pattern-central-vortex_300191-9241.jpg&f=1&nofb=1&ipt=e7c548b6f610dbe9fc48bfcb0a07cc8996eb15b0b25073d22b86f5ca70dd9597");
  padding: 5em;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 15px 15px 0px 0px;
}
#Nav{
  min-width: 100%;
  max-width: 100%;
  display: inline-block;
  justify-content: center;
  align-items: center;
  text-align: center;
}
#NavSeg{
  display: inline-block;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding-left:.5em;
  padding-right:.5em;
}
#NavSeg a{
  padding: 0.3em;
  text-decoration: none;
  color: black;
  display: inline-block;
  justify-content: center;
  align-items: center;
  text-align: center;
}
#ColLeft{
  min-width: 19%;
  max-width: 19%;
  display: inline-block;
  justify-content: center;
  align-items: center;
  text-align: center;
  background-color: #6E7B85;
  border-radius: 0px 0px 0px 15px;
  color: #042936;
  vertical-align: top;
}
#LeftSeg{
  background-color: #95ABC4;
  border-radius: 15px 15px 15px 15px;
  padding: .1em;
  margin-left: .45em;
  margin-bottom: .3em;
}
#LeftSeg h2{
  margin-bottom: 0;
}
#LeftSeg h3{
  margin-top: 0;
  margin-bottom: 0;
}
#LeftSeg p{
  margin-top: 0;
}
#ColMid{
  min-width: 59%;
  max-width: 59%;
  border-radius: 15px 15px 15px 15px;
  display: inline-block;
  justify-content: center;
  align-items: center;
  background-color: #95C2C4;
  padding-bottom: 1.4em;
  margin-bottom: .45em;
  color: #04362A;
  padding-left: 1em;
  padding-right: 1em;
}
#ColMid h1{
  text-align: center;
  margin-bottom: 0;
}
#ColMid hr{
  text-align: center;
  border-top: 1px solid #04362A;
  margin-top: 0;
  margin-bottom: 0;
}
#lineBreak{
  margin-top:.5em;
  border-top: 1px solid #04362A;
}
#Centered{
  min-width: 100%;
  max-width: 100%;
  text-align: center;
  margin-bottom: 0;
  display: inline-block;
  justify-content: center;
  align-items: center;
}
#CharacterInfo{
  float: right;
  background-color: #AED4D3;
  border-radius: 15px 15px 15px 15px;
  margin-top: 1em;
  margin-right: 1em;
  padding: .5em;
  max-width: 10em;
  min-width: 10em;
}
#CharacterInfo h3{
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
}
#CharacterInfo img{
  text-align: center;
  max-width: 100%;
  min-width: 100%;
}
#CharacterInfo hr{
  text-align: center;
  border-top: 1px solid #04362A;
  margin-top: 0;
  margin-bottom: 0;
}
#CharacterInfo p{
  text-align: left;
  margin-top: 0;
  margin-bottom: 0;
}
#LeftText{
  text-align: left;
  padding-right: 1em;
}
#LeftText a{
  text-decoration: none;
  color: #04362A;
  display: inline-block;
  justify-content: center;
  align-items: center;
  text-align: center;
}
#LeftText ul{
  color: #04362A;
  display: inline-block;
  text-align: left;
  margin-top: 0;
  margin-bottom: 0;
}
#LeftText ol{
  color: #04362A;
  display: inline-block;
  text-align: left;
  margin-top: 0;
  margin-bottom: 0;
}
#LeftText h2{
  color: #04362A;
  margin-top: 0;
  margin-bottom: 0;
}
#LeftText h3{
  margin-top: .2em;
  margin-bottom: 0;
  padding-left: 1em;
}
#LeftText h4{
  margin-bottom: 0;
  margin-top: .2em;
  padding-left: 1em;
}
#LeftText p{
  margin-top: 0;
  margin-bottom: 0;
}
#ColRight{
  min-width: 19%;
  max-width: 19%;
  display: inline-block;
  justify-content: center;
  align-items: center;
  text-align: center;
  background-color: #6E7B85;
  border-radius: 0px 0px 15px 0px;
  vertical-align: top;
}
#RightSeg{
  background-color: #95ABC4;
  border-radius: 15px 15px 15px 15px;
  padding: .1em;
  margin-bottom: .3em;
  color: #042936;
  margin-right: .45em;
}
#RightSeg h2{
  margin-bottom: 0;
}
#RightSeg h3{
  margin-top: 0;
  margin-bottom: 0;
}
#RightSeg p{
  margin-top: 0;
}