.navigatorbar {
position: fixed;
width: 99%;
top: 0;
padding: 0;
background-color: #B4B3B5;
z-index: 11000;
}

.rightmenu {
position: fixed;
width: 25px;
top: 130px;
left: 80%;
padding: 5px;
z-index: 11000;
background: #B4B3B5;
color: white;
font-family: 'PT Sans', Arial, sans-serif;  
}

.rightmenu a {
color: white;
background: #B4B3B5;
text-decoration: none;
padding: 5px;
font-family: Myriad Pro, Arial, sans-serif;
font-size: 16pt;
line-height: 150%;  
}

.rightmenu a:hover, nav a:active {  
background: white;
color: #E1C730;
}  


h1 {
    color: white;
    font-size: 20pt;
    text-decoration: none;
    font-family: Myriad Pro;
}

body {
background-color: #3D3D3F;
    color: gray;
}

article {
position: relative;
top: 90px;
width: 80%;
font-family: 'PT Sans', Arial, sans-serif;  
padding: 5px;
text-align: left;
font-size: 14pt;
background-color: #3D3D3F;
color: white;
font-weight: none;
}

article a {
    color: grey;
    text-decoration: none;
}
article a:hover {
    color: black;
    text-decoration: underline;
}


nav {  
    height: 120px;
    width: 100%;  
    background-color: #B4B3B5;
    font-size: 14pt;
    font-family: 'PT Sans', Arial, sans-serif;  
    font-weight: bold;  
    position: relative;  
    border-bottom: 0px solid #283744;
}  
nav ul {  
    padding: 0;  
    margin: 0 auto;  
    width: 900px;
    height: 30px;
}  
nav li {  
    display: inline;  
    float: left;  
}  
.clearfix:before,  
.clearfix:after {  
    content: " ";
    display: table;
}
.clearfix:after {  
    clear: both;  
}  
.clearfix {  
    *zoom: 1;
    color: white;
    background-color: #B4B3B5;
    padding: 3px;
}
.menutop {  
    color: white;
    float: right;      
}  
nav a {  
    color: black;
    display: inline-block;  
    width: 150px;
    text-align: center;  
    text-decoration: none;  
    line-height: 40px;  
    text-shadow: 0px 0px 0px #283744;  
}
.hoveractive {  
    color: white;
    background-color: #B4B3B5;

}
.hoveractive a:hover {  
    color: white;  
    background-color: #B4B3B5;
}

nav li a {  
    border-right: 0px solid #576979;  
    background-color: #B4B3B5;
    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 {  
    color: white;  
    background-color: #E1C730;
}
nav a#pull {  
    display: none;  
}  

.footer {
    color: grey;
    font-size: 9pt;
}

.footer a {
    color: grey;
    text-decoration: 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;  
        rightright: 15px;  
        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;  
    }  
}