.c-offcanvas,
.c-offcanvas-content-wrap {
 -webkit-transform:translate3d(0,0,0);
 transform:translate3d(0,0,0);
 -webkit-backface-visibility:hidden;
 backface-visibility:hidden
}
.c-offcanvas,
.c-offcanvas-bg.c-offcanvas-bg--push,
.c-offcanvas-bg.c-offcanvas-bg--reveal,
.c-offcanvas-content-wrap {
 -webkit-transition:-webkit-transform .3s cubic-bezier(.4,0,.6,1);
 transition:-webkit-transform .3s cubic-bezier(.4,0,.6,1);
 transition:transform .3s cubic-bezier(.4,0,.6,1);
 transition:transform .3s cubic-bezier(.4,0,.6,1),-webkit-transform .3s cubic-bezier(.4,0,.6,1)
}
.c-offcanvas.is-open {
 -webkit-transform:translate3d(0,0,0);
 transform:translate3d(0,0,0);
 visibility:visible
}
.c-offcanvas-content-wrap {
 position:relative;
 overflow:hidden;
 background:#fff
}
.c-offcanvas {
 position:fixed;
 min-height:100%;
 max-height:none;
 top:0;
 display:block;
 background:#fff;
 overflow-x:hidden;
 overflow-y:auto
}
.c-offcanvas--opening {
 -webkit-transition-timing-function:cubic-bezier(.4,0,.6,1);
 transition-timing-function:cubic-bezier(.4,0,.6,1)
}
.c-offcanvas.is-closed {
 max-height:100%;
 overflow:hidden;
 visibility:hidden;
 box-shadow:none
}
.c-offcanvas--overlay {
 z-index:6
}
.c-offcanvas-bg {
 position:fixed;
 top:0;
 height:100%;
 width:100%;
 z-index:5;
 left:-100%;
 background-color:transparent;
 -webkit-transition:background-color .4s cubic-bezier(.23,1,.32,1) 0s;
 transition:background-color .4s cubic-bezier(.23,1,.32,1) 0s
}
.c-offcanvas-bg.is-animating,
.c-offcanvas-bg.is-open {
 left:0;
 background-color:rgba(0,0,0,.68);
 visibility:visible
}
.c-offcanvas-bg.is-closed {
 visibility:hidden
}
.c-offcanvas--left {
 height:100%;
 width:17em;
 -webkit-transform:translate3d(-17em,0,0);
 transform:translate3d(-17em,0,0)
}
.c-offcanvas--right {
 height:100%;
 width:17em;
 right:0;
 -webkit-transform:translate3d(17em,0,0);
 transform:translate3d(17em,0,0)
}
.c-offcanvas--bottom,
.c-offcanvas--top {
 left:0;
 right:0;
 height:12.5em;
 min-height:auto;
 width:100%
}
.c-offcanvas--top {
 top:0;
 -webkit-transform:translate3d(0,-12.5em,0);
 transform:translate3d(0,-12.5em,0)
}
.c-offcanvas--bottom {
 top:auto;
 bottom:0;
 -webkit-transform:translate3d(0,12.5em,0);
 transform:translate3d(0,12.5em,0)
}
.c-offcanvas-content-wrap--reveal.c-offcanvas-content-wrap--left.is-open {
 -webkit-transform:translate3d(17em,0,0);
 transform:translate3d(17em,0,0)
}
.c-offcanvas-content-wrap--reveal.c-offcanvas-content-wrap--right.is-open {
 -webkit-transform:translate3d(-17em,0,0);
 transform:translate3d(-17em,0,0)
}
.c-offcanvas--reveal {
 z-index:0;
 -webkit-transform:translate3d(0,0,0);
 transform:translate3d(0,0,0)
}
.c-offcanvas-bg.c-offcanvas-bg--reveal.c-offcanvas-bg--left.is-open {
 -webkit-transform:translate3d(17em,0,0);
 transform:translate3d(17em,0,0)
}
.c-offcanvas-bg.c-offcanvas-bg--reveal.c-offcanvas-bg--right.is-open {
 -webkit-transform:translate3d(-17em,0,0);
 transform:translate3d(-17em,0,0)
}
.c-offcanvas--push {
 z-index:6
}
.c-offcanvas--push--opening {
 -webkit-transition-timing-function:cubic-bezier(0,0,.2,1);
 transition-timing-function:cubic-bezier(0,0,.2,1)
}
.c-offcanvas-content-wrap {
 z-index:3
}
.c-offcanvas-content-wrap--push.c-offcanvas-content-wrap--left.is-open {
 -webkit-transform:translate3d(17em,0,0);
 transform:translate3d(17em,0,0)
}
.c-offcanvas-content-wrap--push.c-offcanvas-content-wrap--right.is-open {
 -webkit-transform:translate3d(-17em,0,0);
 transform:translate3d(-17em,0,0)
}
.c-offcanvas-bg.c-offcanvas-bg--push.c-offcanvas-bg--left.is-open {
 -webkit-transform:translate3d(17em,0,0);
 transform:translate3d(17em,0,0)
}
.c-offcanvas-bg.c-offcanvas-bg--push.c-offcanvas-bg--right.is-open {
 -webkit-transform:translate3d(-17em,0,0);
 transform:translate3d(-17em,0,0)
}
