/* SLIDE LEFT MENU */

.slide_left_close{
    position:fixed;
    left:-100px;
}

#slide_left {
    width: 100%;
    height: 30px;
    position: fixed;
    top: 0;
    left: 0;
    margin-top: 0px;
    margin-left: 0px;
    z-index: 9999;
    filter:alpha(Opacity=50);
    -moz-opacity:0.5;
    opacity: 0.5;
}

.slide_left_open{
    left:0px;
}

#slide_left > ul{
    float:left;
    background-color:#3498db;
 }

#slide_left > ul > h2{
    border-bottom:solid 1px #2980b9;
}

#slide_left ul li{
    background-color:#6badda;
}

#slide_left ul li:hover{
    background-color:#4fa3dc;
}

/* RESET */

#slide_left a{
    text-decoration:none;
    color:inherit;
    display:block;
}

#slide_left h1,h2,h3,h4,h5,p,div{
    margin:0;
    padding:0;
}
#slide_left{
    z-index: 9999900;
}
/* CONTENT */

.envato{
    margin:0 10px;
    outline:none;
    border:none;
    background-color:#666;
    color:#fff;
    font-family:'Raleway',sans-serif;
    height:30px;
    width:135px;
    cursor:pointer;
}

.graphicriver:hover{
    background-color:#308EB1;
}

.codecanyon:hover{
    background-color:#E78733;
}

.rate{
    font-size:15px;
}

/****************************************************/
/* OVERALL MENUS STYLES */
/*****************************************************************************/

/* BODY */

.body_close{
    overflow-x:hidden;
    position:relative;
    left:0;
}

.body_open_left{
    left:220px;
}

.body_open_right{
    left:-220px;
}

/* OVERALL MENUS */

.srl_menu{
    margin-top:150px;
    height:100%;
}

.prl_menu{
    margin-top:105px;
    height:100%;
}

.list_menu{
    list-style:none;
    padding:0;
    margin:0;
    width:100px;
}

.list_menu h2{
    color:#f5f5f5;
    padding:12px 0 0 12px;
    height:30px;
    font-size:19px;
}

.list_menu li{
    display: block;
    color:#f5f5f5;
    width:100px;
    padding:14px 0 14px 20px;
}

/* BUTTONS */

.z-index-over{/*Just for presentation purposes, to appear over the Push Left Menu (activated with javascript, please see .js file) - you can use it if you have the two, but it's not required*/
    z-index:99999;
}

.button{
    border:none;
    outline:none;
    width:45px;
    height:45px;
    padding:0;
    cursor:pointer;
}

.button img{
    margin-right:2px;
    margin-top:4px;
}

.sbutton{
    background-color:#3498db;
    border-bottom:solid 1px #2980b9;
}

.pbutton{
    background-color:#3498db;
    border-bottom:solid 1px #2980b9;
}

/* TRANSITIONS */

.slide_left_open,.slide_left_close,.slide_right_open,.slide_right_close,.slide_top_open,.slide_top_close,.slide_bottom_open,.slide_bottom_close,.push_left_open,.push_left_close,.body_close,.body_open_left,.body_open_right,.push_right_open,.push_right_close,.button_top_close,.button_top_open,.button_bottom_close,.button_bottom_open{
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

/* MEDIA QUERIES ONLY FOR THE EXAMPLE PAGE - MENU MEDIA QUERIES CAN BE FOUND AT THE END OF MENUS.CSS */

@media only screen and (max-width : 480px) {
    
    body{
        min-width:320px;
    }
    
    .graphicriver{
        margin-bottom:15px;
    }
    
}