/* General styles for all menus */
.cbp-spmenu {background: #213447; position: fixed; height:100%; overflow-x:hidden; overflow-y:auto;}
.cbp-spmenu h3 {color: #4e80b1; font-size:18px; padding: 10px; margin: 0; font-weight:700; background: #000; text-transform:uppercase;}
.cbp-spmenu a {display: block; color: #fff; font-size: 1.1em; font-weight: 300;}
.cbp-spmenu a:hover {color: #afdefa;}
.cbp-spmenu a:active {color: #afdefa;}

/* Orientation-dependent styles for the content of the menu */

.cbp-spmenu-vertical {width:350px; height: 100%; top: 0; z-index:99999;}
.cbp-spmenu-vertical ul{ padding:1.4em; width:100%; float:left; margin:0; list-style:none;}
.cbp-spmenu-vertical a {padding:0; line-height:32px; }

.cbp-spmenu-vertical ul.submenu{padding:5px 10px;}

/* Vertical menu that slides from the left or right */
.cbp-spmenu-left {left: -350px;}
.cbp-spmenu-right {right: -320px;}
.cbp-spmenu-left.cbp-spmenu-open {left: 0px;}
.cbp-spmenu-right.cbp-spmenu-open {right: 0px;}


/* Push classes applied to the body */
.cbp-spmenu-push {overflow-x: hidden; position: relative; left: 0;}
.cbp-spmenu-push-toright {left: 240px;}
.cbp-spmenu-push-toleft {left: -420px;}

/* Transitions */
.cbp-spmenu, .cbp-spmenu-push{-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease;}

/* Example media queries */



@media only screen and (max-width:767px){
.cbp-spmenu-vertical {width:300px;}
.cbp-spmenu-left {left: -300px;}
.cbp-spmenu-right {right: -300px;}

}