nav.site {
    z-index: 2;
    position: fixed;
    right: 0;
    top:0;
    padding:2%;
    text-align: right;
}

nav.site ol {
    display: block;
    padding-bottom: 20px;

    transform: translateX(300px);
    transition: 200ms;
    transition-timing-function: cubic-bezier(.19,-0.38,.8,1.38);
}

nav.site ol.active {
    transform: translateX(0px);
}

nav.site li {
    display: block;
    margin-bottom: 10px;
    text-align: right;
}

nav.site a {
    display: inline-block;
    
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 6px;
    
    color: #ffffff;
    background-color: #7b7b7b;
    
    text-decoration: none;
    cursor: pointer;
}

nav.site a.current_item {
    color: #000000;
}

nav.site a:hover {
    text-decoration: none;
    color: #f1f1f1;
    background-color: #222222;
}

nav.site button.nav_burger {
    margin-bottom: 20px;
    width: 40px;
    height: 36px;
    padding: 10px;
    border-radius: 6px;
    
    background-color: #2d2d2d;
    background-image: url("http://othermaterials.com/images/ui/icon_burger.svg");
    background-repeat: no-repeat;
    background-position: center center;
    
    cursor: pointer;
}

nav.site button.nav_burger_close {
    background-image: url("http://othermaterials.com/images/ui/icon_burger_close.svg");
}