body {
        background-color: #c6dbff;
        margin: 0px;
        font-family: Verdana, Georgia, serif;
        font-size: 14px;
}

#header {
        background-color: #5086e0;
        margin: 10px;       
        height: 90px;
        border-radius: 5px;
}  


.main {
        background-color: #adccff;
        margin-left: 10px;
        margin-right: 320px;
        margin-top: 10px;
        margin-bottom: 10px;
        border-radius: 5px;
        padding: 20px;
        font-size: 110%;        
} 

h1 {
        font-size: 250%;
        text-align: center;
        color: #e5e4d7;
        font-family: "Century Gothic", "Arial","serif";
        margin: 0px;
        position: relative;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
} 

h2 {
        font-size: 125%;        
}

.sideright {
        background-color: #adccff;
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 0px;
        margin-bottom: 10px;     
        border-radius: 5px;
        padding: 20px;
        font-size: 105%;
        float: right;
        width: 260px;
        clear: right;
} 

@media(max-width: 580px){
    .main { 
        margin: 10px;
        width: auto;
        float: None;
        clear: None;
    }
    .sideright {
        margin: 10px;
        width: auto;
        float: None;
        clear: None;
    }
    h1 { 
        font-size: 150%;
}