* Shuran Yang: CSS code for Transformation layout. */
    
header h2{
    text-align: center;     
}

header{
    background-color: #cc99ff;
    width: 100%;
    border-bottom: 2px double cadetblue;
    margin-top: -0.5em;
 }

header img{
    width: 100%;
    opacity: 0.5;
}

  #container {
    position: relative;
    top: 50px;
} 
            
#outer {
    position: relative;
    left: 80px;
    top: -120px;
    margin: 20px;
            }
            
 nav {
    background-color: #ff8080;
    float: left;
    width: 20%;
    clear: left;
    min-height: 1980px;
    border-right: 1px solid cadetblue;
 }

nav h3 {
    color: white;
    margin-bottom: -0.5em;
    margin-left: 0.5em;
}
.menu {
    width: 20%;
}

.menu li {
 list-style-type: none;
 margin-right: 0.5em;  
 margin-left: -2.5em;
 background-color: #00cca3; 
}

.menu a { 
    color: white; 
    display: block;
    padding: 10px;
    text-decoration: none;
}

.menu a:hover {
    background-color: #e6005c;
}


 section {
    float: left;
    width: 78%;
    padding-left: 1em;
    background-color: #99e6ff;
}

 footer {
    clear: both;
    border-top: 2px double cadetblue;
    text-align: center;
    background-color: #ddccff;
 }