 /* Begin Navigation Bar Styling */
 

   
      /* This is the navigation from w3schools with some modifications   https://www.w3schools.com/howto/howto_js_topnav.asp */
      .topnav {
        background-color: #2c2c2e;
        overflow: hidden;
      }
      
      /* Style the links inside the navigation bar */
      .topnav a {
        float: left;
        color: #f2f2f2;
        text-align: center;
        padding: 12px 12px;
        text-decoration: none;
        font-size: 13px;
      }
      
      /* Change the color of links on hover */
      .topnav a:hover {
        background-color: #7d7d80;
        color: #9faad6;
      }
      
      /* Add a color to the active/current link */
      .topnav a.active {
        background-color: #121b96;
        color: white;
      }

 /* End Navigation Bar Styling */



   body {
      background-color: #555; 
      font: small/1.3 Verdana, Helvetica, sans-serif;
      height:100%;
      }
      
   #wrap {
      width: 1000px;
      margin: 0 auto;
      background-color: #F8F8F8; }
    #banner {
     height: 80px;
      background-color: #000;
      /* The css file is in the css folder */
      /* therefore, we need to instruct the browser to first navigate to the root (this is done by typing ../) */
      /* then, we need to instruct the browser navigate to the images folder to find the image*/
      background-image: url("../images/proj_banner.png");
      background-repeat: no-repeat; }
   #content {
      padding: 0 50px 50px;
      min-height:100%;
      
      }
      
   a {
      
      text-decoration: none;
      font-weight: bold;
      color: #069;
      
   }
   a:hover {
      
      text-decoration: none;
      font-weight: bold;
      color: red;
      
   }
   
   p {
      
     color: #444444; 
   }
   p.footer {
      
     color: #FFF; 
   }
    
    h1 {
      font-size: 30px;
      text-align:center;
      font-family:courier;
    }
    
    h2 {
      font-size: 1;
      text-align:left;
      
     
    }
    
    #post {
    border:1px solid grey;
    margin: 5px;margin-bottom:15px;padding:8px;
   
    }
    
   aside {float: right;}

  table.styled-table {

    border-collapse: collapse;
    margin: 25px 0;
    font-size: 0.9em;
    font-family: sans-serif;
    min-width: 400px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
  }
.styled-table th,.styled-table td {
    padding: 12px 15px;
}
.styled-table tbody tr {
    border-bottom: thin solid #dddddd;
}

.styled-table tbody tr:nth-of-type(even) {
    background-color: #f3f3f3;
}

.styled-table tbody tr:last-of-type {
    border-bottom: 2px solid #009879;
}
.styled-table tbody tr.active-row {
    font-weight: bold;
    color: #009879;
}

#footer {
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
    padding:5px;
    position:   relative;
	margin:0 auto;
    data-position="fixed";
    
}  