.slider{
        position: fixed;
        transition: all 0.5s ease;
        left: 0px;
        height: 100%;
        top: 0px;
        z-index: 4;
        background:#262D2F;
        padding:20px 0px;
        min-width: 250px;
        border: 1px solid black;
        color: white;
        font-size: 14px;
        overflow-y: auto;
    }

    .sliderclose{
        left: -100%;
    }

    .slider .header {
        margin: 20px 0;
        padding: 0px 20px;
    }    

    .slider .topmenu{
        padding: 10px 0px 10px 5px;
        border-top:1px solid #434548;

    }

    .slider .topmenuopen .submenu{
        display: block;
        opacity: 1;
        height: auto;
        margin-top:5px;
        padding: 10px 0px 10px 5px;
        background-color: #3d4547;

    }

    .slider .submenu{
        display: none;
        transition: opacity 1s ease-out;
        opacity: 0; 
        height: 0;
        overflow: hidden;
        padding: 10px 0;
    }

    .slider a {
      color :  #A9A8AA;
      text-decoration: none;

    }
    .slider span.glyphicon {
         display: inline-block;
    height: 30px;
    width: 30px;
    line-height: 30px;
    -moz-border-radius: 15px;
    border-radius: 15px;
     background-color: #3EA6CE;  
    color: #222;
    text-align: center;
    -webkit-box-shadow: 0px 0px 0px 3px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 0px 3px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 0px 3px rgba(0,0,0,0.75);
    margin-right: 10px;
    }