/* offcanvas.css */
 .mm-menu_theme-white,.mm-menu--theme-white{
    background-color:#cd1719;
    font-family:Open Sans,Arial,sans-serif,Helvetica;
    color:#fff;
    --mm-color-background: #cd1719;
    --mm-color-text: #fff;
    --mm-color-text-dimmed: #fff
}
.mm-menu_theme-dark{
    background-color:#0272c1;
    font-family:Open Sans,Arial,sans-serif,Helvetica;
    --mm-color-background: #0272c1;
    --mm-color-text: #fff;
    --mm-color-text-dimmed: #fff
}
#offcanvas:not( .mm-menu ){
    display:none
}
a#offcanvasmenu{
    outline: none
}
#offcanvasmenu::before,#offcanvasmenu::after,#offcanvasmenu span{
    width:30px;
    height:3px;
    left:10px;
    position:absolute;
    display:block;
    -webkit-box-shadow:1px 1px 2px 2px rgba(0,0,0,.5);
    box-shadow:1px 1px 2px 2px rgba(0,0,0,.5);
    background: none repeat scroll 0 0 #ffffff;
    content: ""
}
#offcanvasmenu::before{
    top:10px
}
#offcanvasmenu span{
    top:20px
}
#offcanvasmenu::after{
    top:30px
}
#offcanvasmenu::before,#offcanvasmenu::after,#offcanvasmenu span{
    transition-delay: 0.5s;
    transition-duration: 0.5s;
    transition-property: transform, top, bottom, left, opacity;
    transition-timing-function: ease
}
html.mm-opening #offcanvasmenu::before,html.mm-opening #offcanvasmenu::after{
    top:20px
}
html.mm-opening #offcanvasmenu span{
    left:-50px;
    opacity: 0
}
html.mm-opening #offcanvasmenu::before{
    transform: rotate(45deg)
}
html.mm-opening #offcanvasmenu::after{
    transform: rotate(-45deg)
}
.mm-wrapper_opening #offcanvasmenu::before,.mm-wrapper_opening #offcanvasmenu::after{
    top:20px
}
.mm-wrapper_opening #offcanvasmenu span{
    left:-50px;
    opacity: 0
}
.mm-wrapper_opening #offcanvasmenu::before{
    transform: rotate(45deg)
}
.mm-wrapper_opening #offcanvasmenu::after{
    transform: rotate(-45deg)
}