@media screen and (max-width: 987px)
{
  #banner 
  {
    display: none;
  }
  #nav
  {
    display: none;
  }
  #side
  {
    display: none;
  }
  #footer
  {
    display: none;
  }
}

@media screen and (min-width: 988px)
{
  #bannerNav
  {
    display: none;
  }
}

body 
{
  background-color: #000;
  color: white;
  font-family: "Fira Code", verdana;
  font-size: 16px;
  text-align: left;
  margin: 0;
  padding: 0;
}

/* Text */
#main h1 
{
  /*background-color: #171817;*/
  margin: 0;
  padding: 10px 10px 0 20px;
}

#main h2
{
  /*background-color: #171817;*/
  margin: 0;
  padding: 10px 10px 0 30px;
}

p 
{
  line-height: 1.5;
}

.date
{
  color: #ccc;
  font-size: 10px;
  text-align: right;
  margin: 0;
  padding: 0 0 0 0;
}

#banner p
{
  margin: 30px 0;
  padding: 0;
}

#nav p
{
  padding: 0;
  display: inline;
  font-size: 16px;
}

#bannerNav p
{
  padding: 0;
  display: inline;
  font-size: 14px;
}

#main p
{
  margin: 10px;
}

#main li
{
  padding: 10px 0;
}

hr
{
  margin: -5px -1px 0 -1px;
  padding: 0;
  border: none;
  border-top: 3px solid;
  border-color: #458dff;
}

.tile:hover hr
{
  border-color: #ffa100;
}

abbr
{
  text-decoration: none;
}

.date abbr
{
  text-decoration: underline dotted;
}

figcaption 
{
  font-size: 12px;
}

/* Links */
a 
{
  color: #458dff;
}

.navLink a 
{
  display: block;
  font-size: 20px;
  color: #0062FF;
}

.bannerNavLink a
{
  display: block;
  font-size: 20px;
  color: #0062FF;
}

/* Image */
#banner img
{
  display: block;
}

#main img
{
  margin: 0;
  padding: 0;
}

#side img
{
    display: block;
}

#main figure
{
  margin: 0 0 0 20px;
  padding: 0;
}

.images figure
{
  margin-top: 20px;
  margin-right: 0;
  margin-left: 0;
}

#nav img
{
  margin: 0;
  padding: 0;
}


/* Layout */
#content
{
  /*background-color: rgb(226,224,222);*/
  margin-left: auto;
  margin-right: auto;
  /*margin-top: -2px;*/
  border-style: none;
  /*border-width: 6px;*/
  /*border-color: #458dff;*/
  padding: 0;
}

.tile
{
  background-color: #171717;
  vertical-align: top;
  margin-top: 0;
  border-style: solid;
  border-width: 3px;
  border-color: #458dff;
  border-spacing: 0px;
}

.tile td
{
  margin: 0;
  padding: 0;
  /*margin-left: 0;*/
  /*margin-right: 0;*/
  /*padding-left: 0;*/
  /*padding-right: 0;*/
}

.tile:hover
{
  vertical-align: top;
  border-style: solid;
  border-color: #ffa100;
}

#banner
{
  margin: 0;
  padding: 0;
}

#bannerNav
{
  background-color: #171717;
  height: 140px;
  margin: 0;
  padding: 0;
}

#bannerNavTable
{
  height: 24px;
  border-collapse: collapse;
  margin-bottom: -1px;
  border-top-width: 2px;
}

.bannerNavIcon
{ 
  border-style: solid;
  border-width: 3px;
  border-top-width: 2px;
  border-color: #171717;
  width: 24px;
  height: 24px;
  margin: 0;
  padding: 0;
}

.bannerNavLink
{ 
  border-style: solid;
  border-width: 3px;
  border-top-width: 2px;
  border-color: #171717;
  width: 151px;
  margin: 0;
  padding: 0;
}

#nav
{
  /*background-color: #171717;*/
  vertical-align: top;
    max-width: 190px;
  width: 190px;
  margin: 0;
  padding: 0;
  font-size: 0;
}

#navTable
{
  border-collapse: collapse;
}

.navIcon
{ 
  border-style: solid;
  border-width: 3px;
  border-color: #171717;
  width: 24px;
  height: 24px;
  margin: 0;
  padding: 0;
}

.navLink
{ 
  border-style: solid;
  border-width: 3px;
  border-color: #171717;
  width: 151px;
  margin: 0;
  padding: 0;
}

#main
{
  /*background-color: #171717;*/
  vertical-align: top;
    max-width: 600px;
  width: 600px;
  margin: 0;
  padding: 0;
}

#side
{
  /*background-color: #171717;*/
  vertical-align: top;
  width: 190px;
    max-width: 190px;
  /*height: 500px;*/
  margin: 0;
  padding: 0;
}

#footer
{
  background-color: #171717;
  margin: 0;
  padding: 0;
}