/* color palette as follows
think VAPORWAVE

#ff71ce
#01cdfe
#05ffa1
#b967ff
#fffb96

end color pallete */

  /* basic setup */
  * {
    margin: 0;
    padding: 0;
  }

/*prevent site from breaking*/
  html {
}

  h2 {
    padding: 1em;
  }

  header h3 {
    font-size: 150%;
    color: #fffb96;
    margin-right: 20px;
    margin-top: -10px;
  }

  /* the styles for the header, main content, sidebar, and footer */
  header {
     border-bottom: 10px solid transparent;
     width: 100%;
     height: 165px;
  }

  .hdr_imgs {
    padding-top: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .shadow {
  	text-shadow: 2px 2px 2px #b967ff;
  	float: right;
  }

  .shadow2 {
    text-shadow: 2px 2px 2px #fffb96;
  }


  /* the styles for the navigation menu */
  #nav_menu {
    margin-bottom: 10px;
  }

  #nav_menu ul {
    width: auto;
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: relative;
    background-color: #05ffa1;
  }

  #nav_menu ul li {
    text-align: center;
    float: left;
  }

  #nav_menu ul li a {
    display: block;
    color: #b967ff;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
  }

  #nav_menu ul ul {
      display: none;
      position: absolute;
      top: 100%;
  }

  #nav_menu ul ul li {
  	float: none;
  }

  #nav_menu ul li:hover > ul {
  	display: block;
  }

  #nav_menu a.current {
  	color: #fffb96;
  }

  #nav_menu li a:hover {
    background-color: #01cdfe;
    text-shadow: 2px 2px 2px #fffb96;
  }

  #nav_menu > ul::after {
      content: "";
      clear: both;
      display: block;
  }

  /* begin body style */
  body {
    width: 100%;
    border: 1px solid transparent;
  }

  /* for fluid layout */
  .row {
    display: flex;
  }

  /* primary column */
  main {
    width: 80%;
    height: 100%;
    border-right: 10px solid transparent;
    background-color: #01cdfe;
    margin-bottom: 10px;
  }

  section {
  	margin-top: 30px;
  	height: 100%;
  	float: left;
  	display: flex;
  	flex-direction: column;
  	flex-wrap: wrap;
  }
  section h1 {
  	font-size: 150%;
  	padding: .5em 0 .25em 2em;
  	margin: 0;
  	color: #01cdfe;
  }
  section img {
    float: right;

  }
  section h2 {
  	color: #b967ff;
  	font-size: 130%;
  	padding: 0em 0 1em 1em;
  }
  section h3 {
  	padding-left: 2em;
  }
  section p {
    margin-left: 15px;
  }
  section blockquote {
  	padding: 1em 2em;
  	font-style: italic;
  }
  section ul {
  	padding: 0em 0 .25em 2em;
  }
  section li {
  	height: 2em;
  }

  /* begin aside edits */
  aside {
    width: 20%;
    background-color: #b967ff;
    height: 100%;
    text-align: center;
    margin-bottom: 10px;
    border-left: 10px solid;
  }

  aside h2 {
    color: #01cdfe;
    text-align: center;
  }

  aside img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
    width: 75%;
  }
  footer {
    clear: both;
    background-color: #ff71ce;
    text-align: center;
    color: #05ffa1;
  }
