@charset "UTF-8";
/*****TABLE OF CONTENTS
CH1 RESETS
CH2 FONTS
CH3 COLORS
CH4 GLOBAL
CH5 HEADER
CH6 CONTENT
CH7 FOOTER
CH8 MISCELLANEOUS
*****/

/**********************/
/***** CH1 RESETS *****/
/**********************/
article, aside, footer, header, main, nav, section{
display: block;
}
html, body, h1, h2, h3, ul, li, a, p, article, aside, footer, header, main, nav, section{
margin: 0;
padding: 0;
}

/*********************/
/***** CH2 FONTS *****/
/*********************/

/**********************/
/***** CH3 COLORS *****/
/**********************/
/*
  background color has been set to black
  border color has been set to hsla(35, 100%, 45%, 1) orange
  code color has been set to green
  LINKS:
    unvisited: hsla(199, 85%, 35%, 1) sky blue
    visited: hsla(275, 65%, 55%, 1) light purple
    mouseover/hover: hsla(360, 85%, 35%, 1) red
    active: hsla(199, 85%, 35%, 1) sky blue
  NAVIGATION:
    background color: hsla(333, 100%, 10%, 0.7) maroon
  text color has been set to hsla(35, 100%, 55%, 1) orange
*/

/**********************/
/***** CH4 GLOBAL *****/
/**********************/
  /* Links are styled using LoVe HAte sequence, not alphabetical */
  a:link{
    color: hsla(199, 85%, 35%, 1);
  }
  a:visited{
    color: hsla(275, 65%, 55%, 1);
  }
  a:hover{
    color: hsla(360, 85%, 35%, 1);
  }
  a:active{
    color: hsla(199, 85%, 35%, 1);
  }
  aside{
    border: 0.2em solid hsla(35, 100%, 35%, 1);
    float: left;
    margin: 1.5em 2em 0 2em;
    width: 15%;
  }
  body{
    background-color: black;
    /*background-image: url("../img/darkbg.jpg");*/ /*I commented this background out because it was making the text harder to read*/
    background-size: cover;
    color: hsla(35, 100%, 55%, 1);
    font-family: 'Ubuntu', serif;
    font-size: 18px;
    height: 100%;
    text-align: left;
    width: 100%;
  }
  .code{
    font-weight: bold;
    color: hsla(121, 85%, 25%, 1);
    font-family: 'Fira Mono', monospace;
    font-size: 1em;
  }
  footer{
    margin-left: 25%;
    width: 50%;
  }
  h1{
    font-family: 'Play', sans-serif;
    font-size: 3em;
    text-align: center;
  }
  h3{
    font-size: 1.5em;
    text-align: center;
  }
  header{
    background-color: hsla(333, 100%, 10%, 0.7);
    height: 4em;
  }
  main{
    float: right;
    margin: 0 25% 0 0;
    width: 50%;
  }

  nav#topnav a{
    text-decoration: none; /*removes underline from hyperlinks*/
    transition: .3s background-color; /*delays the color change*/
  }
  nav#topnav a:hover{
    background-color: hsla(333, 100%, 5%, 1.0); /*dark maroon*/
  }
  nav#topnav li{
    display: inline-block;
    padding: 0 0.5em; /*separates list items a bit*/
  }
  nav#topnav ul{
    background-color: hsla(333, 100%, 10%, 0.7); /*maroon*/
    border-bottom: 1px solid hsla(333, 100%, 0%, 1.0); /*dark maroon*/
    font-size: 1.2em;
    height: 3.5em;
    line-height: 4em; /*paired with height, this centers the text*/
    list-style-type: none; /*removes bullet points from list*/
    margin: 0;
    padding: 0;
    text-align: center;
  }

  nav#asidenav a{
    text-decoration: none; /*removes underline from hyperlinks*/
    transition: .3s background-color; /*delays the color change*/
  }
  nav#asidenav ul{
    list-style-type: none;
    margin: 1em;
  }
  p,ul{
    margin: 1em;
  }
/**********************/
/***** CH5 HEADER *****/
/**********************/

/***********************/
/***** CH6 CONTENT *****/
/***********************/


/**********************/
/***** CH7 FOOTER *****/
/**********************/

/*****************************/
/***** CH8 MISCELLANEOUS *****/
/*****************************/