body {  
        background-color: #0066FF;  
    }  

    nav {  
        height: 35px;  
        width: 100%;  
        background:#25F1FC;  
        font-size: 10pt;  
        font-family: 'PT Sans', Arial, sans-serif;  
        font-weight: bold;  
        position: relative;  
        border-bottom: 2px solid #0066FF;  
		border-radius:5px;
    }  
    
    nav ul {  
        padding: 0;  
        margin: 0 auto;  
        width: AUTO;  
        height: 35px;  
    }  

    nav li {  
        display: inline;  
        float: left;  
    }  

    .clearfix:before,  
    .clearfix:after {  
        content: " ";  
        display: table;  
    }  
    .clearfix:after {  
        clear: both;  
    }  
    .clearfix {  
        *zoom: 1;  
    }  

    nav a {  
        color: #00F;  
        display: inline-block;  
        width: 165px;  
        text-align: center;  
        text-decoration: none;  
        line-height: 35px;  
        text-shadow: 1px 1px 0px #283744;  
    }  

    nav li a {  
        border-right: 1px solid #576979;  
        box-sizing:border-box;  
        -moz-box-sizing:border-box;  
        -webkit-box-sizing:border-box;  
    }  
    
    nav li:last-child a {  
        border-right: 0;  
    }  

    nav a:hover, nav a:active {  
        background-color: #33CCFF;  
    }  

    nav a#pull {  
    display: none;  
	}   

	    @media screen and (max-width: 600px) {  
        nav {   
            height: auto;  
        }  
        nav ul {  
            width: 100%;  
            display: block;  
            height: auto;  
        }  
        nav li {  
            width: 50%;  
            float: left;  
            position: relative;  
        }  
        nav li a {  
            border-bottom: 1px solid #576979;  
            border-right: 1px solid #576979;  
        }  
        nav a {  
            text-align: left;  
            width: 100%;  
            text-indent: 25px;  
        }  
    }  

        @media only screen and (max-width : 480px) {  
        nav {  
            border-bottom: 0;  
        }  
        nav ul {  
            display: none;  
            height: auto;  
        }  
        nav a#pull {  
            display: block;  
            background-color: #283744;  
            width: 100%;  
            position: relative;  
        }  
        nav a#pull:after {  
            content:"";  
            background: url('nav-icon.png') no-repeat;  
            width: 30px;  
            height: 30px;  
            display: inline-block;  
            position: absolute;  
            right: 20px;  
            top: 10px;  
        }  
    }  

  @media only screen and (max-width : 320px) {  
        nav li {  
            display: block;  
            float: none;  
            width: 100%;  
        }  
        nav li a {  
            border-bottom: 1px solid #576979;  
        }  
    }