.cbp-spmenu {background: #eae9e9;position: fixed;} 
.cbp-spmenu h3 {color: #FFF;font-size: 1.2em;padding: 8px;margin: 0;font-weight: 300;background: #0e72c0;} 
.cbp-spmenu a {display: block;color: #555555;font-size: 1.0em;font-weight: 300;} 
.cbp-spmenu a:hover {color: #FFF;background: #0e72c0;} 
.cbp-spmenu a:active {background:#0e72c0;color: #FFF;} 

.cbp-spmenu-vertical {width: 200px;height: 100%;top: 0;z-index: 1000;}

.cbp-spmenu-vertical a {border-bottom: 1px dashed #d2d2d2;padding:8px;}

.cbp-spmenu-horizontal {width: 100%;height: 150px;left: 0;z-index: 1000;overflow: hidden;}

.cbp-spmenu-horizontal h3 {height: 100%;width: 20%;float: left;}

.cbp-spmenu-horizontal a {float: left;width: 20%;padding: 1.5em;border-left: 1px solid #258ecd;}

/* Vertical menu that slides from the left or right */

.cbp-spmenu-left {left: -200px;}

.cbp-spmenu-right {right: -200px;}

.cbp-spmenu-left.cbp-spmenu-open {left: 0px;}

.cbp-spmenu-right.cbp-spmenu-open {right: 0px;}

/* Horizontal menu that slides from the top or bottom */

.cbp-spmenu-top {top: -150px;} 
.cbp-spmenu-bottom {bottom: -150px;} 
.cbp-spmenu-top.cbp-spmenu-open {top: 0px;} 
.cbp-spmenu-bottom.cbp-spmenu-open {bottom: 0px;} 

.cbp-spmenu-push {overflow-x: hidden;position: relative;left: 0;} 
.cbp-spmenu-push-toright {left: 200px;} 
.cbp-spmenu-push-toleft {left: -200px;} 

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