<!DOCTYPE html>
<html>
<head>
<style>

h1 {font-size: 200%; float: center; color: #330000; margin-left: 5px; padding-left: 5px;}
div {font-size: 100%; float: center; color: #330000;}
h2	{color: #800000; font-family:verdana; text-align: left; font-size: 120%;}
h3 {color: black; font-family: verdana; font-size: 130%;}
h4 {color: #800000; font-family: verdana; font-size: 100%;}
h5 {size: 100%; color: black;}
p    {color: black; padding-right: 5px; font-size: 120%; width: 100%; margin-left: 10px; margin-right: 10px;}
figcaption {color: black; font-family:verdana;}
a {color: #800000; font-family:verdana; display: inline; font-weight: bold; font-size: 100%;} 
title {color:black;}
body    {width: 100%;
        padding-left: 5px;
        padding-right: 10px;
        background-repeat: none;
        background-color: transparent;
        font-family: verdana, sans-serif;}
header {height: 250px;}
footer  {background-color: #262626;
    color: white;
    clear:both;
    float: bottom;
    width: 100%;
    position: absolute;
    padding: 5px;
    margin: 5px;
    text-align: center;}
.jumbotron 
    {font-size: 200%; 
        text-align: center; 
        color: black; 
        width: 100%;}

ul.topnav {list-style-type: none; margin: 0; padding: 0; overflow: hidden; color: #e60000;}
ul li {padding: 2px; margin: 2px;}

li a {display: block;
    color: #800000;
    padding: 50px;
    text-decoration: none;
    border: 5px;
    width: 100px;}

li {display: inline; float: left;}

li a.active {background-color: #800000; color: white;}

li a:hover:not(.active) {background-color: #ff3333; color: white;}

#nav ul {width: 200px;
        height: 200px;
        margin: 0;
        padding: 0;
        list-style: none;}
#nav li ul {padding: 10px 20px;
        margin: 0;
        padding: 0;
        list-style: none;}


</style>

</html>