#hjp-nav{
    z-index:3;
}
.hjp-img{
	top: 65px;
	width: 50%;
	height: 300px;
	background-color: dimgray;
	display: inline-block;
}

#hjp-floating-buttons {
    position:fixed;
    bottom:25px;
    right:25px;
}

body {
    background-color:grey;
}
#hjp-sidebar {
    background-color:lightgrey;
    border: 1px solid white;
    position:fixed;
    top:60px;
    height:90%;
    width:98%;
    box-shadow: rgba(0,0,0,0.5) 0px -1px 4px;
    transition-duration:300ms;
    transition-property:left;
    pointer-events:all;
    overflow-y:auto;
    overflow-x:hidden;
}

.hjp-sidebar-closed {
    left:-100%;
}

.hjp-close-sidebar{
    position:absolute;
    top:5px;
    right:18px;
    opacity:0.3;
}
.hjp-sidebar-inner {
    width:96%;
    left:2%;
    position:relative;
}

.z1 {
    z-index:1;
}

.glyphicon-collapse-down {
 opacity:0.6;
 left:-15px;
 position:relative;
}

#hjp-main{
    transition-duration:300s;
    transition-property:top;
    position:relative;
}

 .hjp-main-compensate{
    top:72px;
 }
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    #hjp-sidebar {
        top:190px;
    }
}