body {  font-family: Verdana;  padding: 10px;  background-color: white;}

/* Style the top navigation bar */         
.topnav {  overflow: hidden;  background: #ccffff;}

/* Style the topnav links */
.topnav a {  float: left;  display: block;  color: black;  text-align: center;  padding: 14px 16px;  text-decoration: none;}

/* Header */
.header {  padding: 10px;  text-align: center;  background: #ccffff;  height: 80px;}
.h1 {    padding: 10px;  text-align: center;  background: #ccffff;  height: 20px;}
.h2 {    padding: 10px;  text-align: center;  background: #ccffff;  height: 50px;}
.homeheader {  padding: 10px;  text-align: center;  background: #ccffff;  height: 100px;}


/* Footer */
.leftfoot { float: left;  width: 25%;  height: 100px;  text-align: left;  background: #ddd;  margin-top: 20px;}
.midfoot {  float: left;  width: 50%;  height: 100px; text-align: left;  background: #ddd;  margin-top: 20px;}
.rightfoot { float: right;  width: 25%;  height: 100px;  text-align: right;  background: #ddd;  margin-top: 20px;}

/* On screens that are 600px wide or less, make the menu links stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {  .topnav a {    float: none;    width: 100%;}  }

/* Responsive layout - when the screen is less than 800px wide, make the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {  .leftcolumn, .middlecolumn, .rightcolumn {       width: 100%;    padding: 0;  }}

/* Responsive layout - when the screen is less than 800px wide, make the three footers stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {  .leftfoot, .midfoot, rightfoot  {width:100%;}  }