sgdrawer.css

.drawer {
	position: fixed;
	top: 0;
	background-color: #ccc;
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-transform: translate3d(0,0,0);
	-moz-transform: translate3d(0,0,0);
	-ms-transform: translate3d(0,0,0);
	-o-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	-webkit-box-shadow: 0 0 20px #000000;
	-moz-box-shadow: 0 0 20px #000000;
	box-shadow: 0 0 20px #000000;
}

.sg-drawer-wrapper {

}

.drawer-left {
	left: 0;
}

.drawer-right {
	right: 0;
}

.drawer-handle {
	position: fixed;
	background-color: transparent;
	top: 0;
	width: 15px;
}

#sg-drawer-mask {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background-color: #000;
	opacity: 0;
	-webkit-transform: translate3d(0,0,0);
	-moz-transform: translate3d(0,0,0);
	-ms-transform: translate3d(0,0,0);
	-o-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
	transition: all .3s ease-out;
}

.slide {
	width: 100%; height: 100%;
	display: inline-block;
	background-size: cover;
}

.animate {
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
	transition: all .3s ease-out;
}