/* The Magic Float Center Code */
.float_center {
  float: right;

  position: relative;
  left: -50%; /* or right 50% */
  text-align: left;
}
.float_center > .child {
  position: relative;
  left: 50%;
}


 
 body {
        font-family: Palatino;
        font-size: 100%
        color: black;
        background-color: #fcfcfc;
     }
     
 h1 {
    font-family: Ariel;
        font-size: 400%
        color: white;
        font-weight: bold;
        text-transform: uppercase;
        text-align: center;
        padding: 20px 4px;
         border-radius: 10px;
        background-color: #cadde4;
        border: 10px ridge #488aa2;
    text-shadow: 2px 2px yellow;
      margin: 20px 0px 20px 0px;
      }

h2 {
     font-family: Ariel;
        font-size: 100%
        color: white;
        background-color: #86afc2;
        border-radius: 5px;
        text-shadow: 1px 1px yellow;
        margin: 5px 0 5px 0;
}

h3 {
    font-family: Palatino;
         font-size: 100%
         color: black;
         text-shadow: 2px 2px #ccccff;
         margin: 5px 0 5px 0;
         background-color: #cadde4;
         border-radius: 5px;
    } 
h4 {
         font-family: Palatino;
         font-size: 100%
         color: black;     
         border-radius: 5px;
         background-color:  #ffffcc;
    } 
h5 {
         font-family: Palatino;
         font-size: 100%
         color: #3333ff;     
         border-radius: 5px;
         background-color:  #ccccff;
    } 


#header1 {
 float: left;
  width: 20%; height: 250px;
  font-family: Impact; font-size: 90px;
  color: black;
  text-shadow: 2px 2px c7b299;
  text-align: right; 
  clear: left; 
}


#header2 {
 float: right;
  width: 20%; height: 250px;
  font-family: impact; font-size: 90px;
  color: black;
  text-shadow: 2px 2px c7b299;
  text-align: right; 
  clear: right; 
}

#left {
  float: left;
  width: 17%;
  overflow: auto;
}

#center {
  float: left;
  width: 59%;
  padding-right: 1%; padding-left: 1%;  padding-top: 1%;  padding-bottom: 1%;  
  overflow: auto;
}
#right {
  float: left;
  width: 17%;
   padding-right: 1%; padding-left: 1%;  padding-top: 1%;  padding-bottom: 1%;  
  overflow: auto;
}

#footer {
   float: left;;
    width: 59%; height: auto;
  background-color: #cadde4;
  border: 15px ridge Lime;
  text-align: center;
  padding-right: .5em; padding-left: .5em;  padding-top: .5em;  padding-bottom: .5em; 
  border-radius: 10px;
  clear: both; 
}




#box1 { 
float: left;
width: 130px; height: 15px;
background-color: #cadde4;
border: 10px ridge #005b7f;
  padding-right: .5em; padding-left: .5em;  padding-top: .5em;  padding-bottom: .5em;  
  border-radius: 10px;
  }
#box2 { 
float: left;
width: 130px; height: 15px;
background-color: #cadde4;
border: 10px ridge #1f6f8e;
  padding-right: .5em; padding-left: .5em;  padding-top: .5em;  padding-bottom: .5em;  
  border-radius: 10px;
  }
#box3 { 
float: left;
width: 130px; height: 15px;
background-color: #cadde4;
border: 10px ridge #488aa2;
opacity: 1;
  padding-right: .5em; padding-left: .5em;  padding-top: .5em;  padding-bottom: .5em;  
  border-radius: 10px;
  }
  #box4 { 
float: left;
width: 130px; height: 15px;
background-color: #cadde4;
border: 10px ridge #86afc2;
opacity: 1;
  padding-right: .5em; padding-left: .5em;  padding-top: .5em;  padding-bottom: .5em;  
  border-radius: 10px;
  }
  #box5 { 
float: left;
width: 130px; height: 15px;
background-color: #cadde4;
border: 10px ridge #cadde4;
opacity: 1;
  padding-right: .5em; padding-left: .5em;  padding-top: .5em;  padding-bottom: .5em;  
  border-radius: 10px;
  }
  #box6 { 
float: left;
width: 130px; height: 15px;
background-color: #cadde4;
border: 10px ridge #fcfcfc;
opacity: 1;
  padding-right: .5em; padding-left: .5em;  padding-top: .5em;  padding-bottom: .5em;  
  border-radius: 10px;
  }