sidey/dist/sidey.min.css

Quickly and easily add an offcanvas sidebar to any page

.sidey-leftactive{transform:translate3d(0,0,0) !important;-webkit-transform:translate3d(0,0,0) !important;transition:all .2s ease-in-out}.sidey-rightactive{transform:translate3d(25%,0,0) !important;-webkit-transform:translate3d(25%,0,0) !important;transition:all .2s ease-in-out}.sidey-right{position:fixed;background-color:white;overflow-x:hidden;transform:translate3d(120%,0,0);transition:all .2s ease-in-out;width:80%;bottom:0;top:0;transform:translate3d(120%,0,0);-webkit-transform:translate3d(120%,0,0)}.sidey-left{position:fixed;background-color:white;overflow-x:hidden;transition:all .2s ease-in-out;width:80%;bottom:0;top:0;transform:translate3d(-100%,0,0);-webkit-transform:translate3d(-100%,0,0)}.sidey-content{position:relative;min-height:100%;width:100%;transition:all .2s ease-in-out;transform:translate3d(0,0,0);-webkit-transform:translate3d(0,0,0)}.sidey-leftpush{position:fixed;overflow-x:hidden;width:100%;transform:translate3d(80%,0,0);-webkit-transform:translate3d(80%,0,0)}.sidey-rightpush{position:fixed;overflow-x:hidden;width:100%;transform:translate3d(-80%,0,0);-webkit-transform:translate3d(-80%,0,0)}.sidey-blur{background:rgba(113,113,113,0.5) !important}@media only screen and (min-width :762px){.sidey-leftpush{transform:translate3d(-50%,0,0);-webkit-transform:translate3d(-50%,0,0)}.sidey-left{width:50%;transform:translate3d(-100%,0,0);-webkit-transform:translate3d(-100%,0,0)}.sidey-rightpush{transform:translate3d(-50%,0,0);-webkit-transform:translate3d(-50%,0,0)}.sidey-right{right:0;width:50%}.sidey-rightactive{transform:translate3d(0,0,0) !important;-webkit-transform:translate3d(0,0,0) !important}}@media only screen and (min-width :992px){.sidey-leftpush{transform:translate3d(20%,0,0);-webkit-transform:translate3d(20%,0,0)}.sidey-left{width:20%;transform:translate3d(-100%,0,0);-webkit-transform:translate3d(-100%,0,0)}.sidey-leftactive{transform:translate3d(0,0,0) !important;-webkit-transform:translate3d(0,0,0) !important}.sidey-rightpush{transform:translate3d(-20%,0,0);-webkit-transform:translate3d(-20%,0,0)}.sidey-right{right:0;width:20%}.sidey-rightactive{transform:translate3d(0,0,0) !important;-webkit-transform:translate3d(0,0,0) !important}}