/* http://jonathanstark.com/labs/rwd */


@media screen and (max-width:959px){    
    nav ul li{
        padding:.4%;
        margin:auto;
    }
    
    nav{       
        text-align:end;
    }    
}
@media screen and (max-width:699px){
    nav ul li{        
        width:48.5%;       
        float:left;
        padding-top: 5px;
        padding-bottom: 5px;

        border:thin black solid;
        text-align: center;
    }
    
    nav ul li a{
        margin-right: auto;
        margin-left: auto;
    }
}
#contact{position: absolute;top:0px;right:0px;color:white;}
/* Header */
@media screen and (min-width:50px) and (max-width:500px){ header{height:220px;} .phoneNumber{color:black;}}
@media screen and (min-width:501px) and (max-width:695px){ header{height:110px;}}

@media screen and (min-width:1px) and (max-width:495px){ #contact{position: relative;}}


/* Navigation */
@media screen and (min-width:1px) and (max-width:300px){ nav ul li{width: 98%;}}
@media screen and (min-width:301px) and (max-width:700px){ nav ul li{width: 48.5%;}}
@media screen and (min-width:701px)and (max-width:1000px){ nav ul li{width: 31%;text-align: center;}}
@media screen and (min-width:1001px)and (max-width:1400px){ nav ul li{width: 12%;text-align: center;}}
@media screen and (min-width:1401px)and (max-width:5400px){ nav ul li{width: 12%;}}

/* Main */


/* Footer */






@media screen and (min-width:500px){ 
    
    #aboveLogo {
        height: auto;
        padding-top: 4px;
        margin-left: 20px;
        margin-top: 10px;
        width:200px;
    }
    
    
    
    #contact {
    color: #C0C0C0;
    display: block;
    float: right;
    height: auto;
    margin-right: 10px;
    margin-top: 1px;
    padding: 4px 10px 10px;
}
    
}

/* Screeens wider than 650px */
@media screen and (min-width:700px){    
    header{
        border-radius:0px;
    }
    
    footer{
        border-radius: 0;
    }
    
   
    #aboveLogo{
        height: auto;
        max-width: 200px;
        padding-top: 4px;
    }
    
    #contact {
        text-align: right;

    }
    
    #main{
        padding-bottom: 50px;
        padding-left: 10px;
        padding-top: 10px;
        width:63%;
    }
    
    #rightarea {
        float: right;
        font-size: 0.8em;
        width: 33%;
        display: inline;
    }    
}

/* Screens wider than 960px */
@media screen and (min-width:960px){ 
    #container{
        border-radius: 10px 10px 10px 10px;
        box-shadow: 0 0 20px #000000;
        margin: 10px;
    }
    
    #aboveLogo{
        height: auto;
        max-width: 200px;
        padding-top: 12px;
        padding-left:20px;
        padding-bottom:12px;
    }
    
    
    
    header{
        border-radius: 10px 10px 0 0;
    }
    
    #main{
        width:65%;
        display: inline-block;
    }
    
    footer{
        border-radius: 0 0 10px 10px;
    }
}

