body {
font-family : sans-serif;
background : #ffffff ;
padding : 0.5%;
margin : 0.5%;
color : #3c5385;
max-width: 60em;
margin-left:auto;
margin-right:auto;
}
h1 {
font-size : 220%;
color : #3c5385;
margin : 5%0%0%0%;
padding : 0.5%;
text-align : left;
}
h2 { font-size: 125%; }
h3 { font-size: 100%; }
blockquote { font-style: italic; }
.head { text-align: center; max-width:100%; margin: 1%; padding: 1%; background: #cccccc; }
.left { float: left; max-width:10%;  margin: 1%; padding: 1%; }
.right { float: right; max-width:10%; margin: 0% 20% 0% 0%; padding: 1%; }
.tail { text-align: center; clear: both; max-width:100%; margin: 1%; padding: 1%; background: #cccccc; }
.body { float: left; max-width:55%; margin: 0% 5% 0% 5%; padding: 1%; }
.menu-ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #cccccc;
border-top: solid;
border-right: none;
border-left: none;
border-bottom: none;
clear: left;
}

.menu-li {
    float: left;
}

.menu-li a, .dropbtn {
    display: inline-block;
    color: #dce7d0;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

.menu-li a:hover, .dropdown:hover .dropbtn {
    background-color: #cccccc;
    color : #3c5385;
}

.dropdown {
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #cccccc;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown-content a {
    color: #3c5385;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
}
.right-200 {
margin : 0.5%;
padding : 0%;
text-align : left;
float : right;
width : 300px;
}