.ui-panel {
	min-height: 100%;
	border-width:0;
	top: 0;
	display: block;
	width: 21em;
}
.ui-panel-closed {
	width: 0;
	overflow: hidden;
}

/* animate class is added to panel and wrapper, toggling on transitions */
.ui-panel-animate {
	-webkit-transition: -webkit-transform 350ms ease;
	-moz-transition: -moz-transform 350ms ease;
	-o-transition: -o-transform 350ms ease;
	-ms-transition: -ms-transform 350ms ease;
	transition: transform 350ms ease;
}

/* a bit of hardware acceleration for iOS 6 blinking */
.ui-panel-3dtransforms.ui-panel-content-wrap,
.ui-panel-3dtransforms ~.ui-panel-content-wrap .ui-header {
	-webkit-backface-visibility: hidden;
}

/* don't animate reveal - it stays in place */
.ui-panel-display-reveal {
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	-ms-transition: none;
	transition: none;
}


/* z stacking */
.ui-panel-display-overlay,
.ui-panel-display-push,
.ui-panel-content-wrap,
.ui-panel-dismiss {
	z-index: 99999;
}
.ui-panel-display-reveal {
	z-index: 0;
}
.ui-panel,
.ui-panel.ui-panel-unfixed {
	position: absolute;
}
/* display and reveal */
.ui-panel-3dtransforms {
	position: fixed;
}

/* panel default positions */
.ui-panel-position-left,
.ui-panel-3dtransforms.ui-panel-position-left.ui-panel-open,
.ui-panel-3dtransforms.ui-panel-position-left.ui-panel-display-reveal {
	left: -21em;
}
.ui-panel-position-right,
.ui-panel-3dtransforms.ui-panel-position-right.ui-panel-open,
.ui-panel-3dtransforms.ui-panel-position-right.ui-panel-display-reveal {
	right: -21em;
}
/* non-3d positioning */
.ui-panel-position-left.ui-panel-open {
	left: 0;
}
.ui-panel-position-right.ui-panel-open {
	right: 0;
}

/* panel open positions */
.ui-panel-3dtransforms.ui-panel-open,
.ui-panel-3dtransforms.ui-panel-position-left.ui-panel-display-reveal {
	-webkit-transform: translateX(21em);
	-moz-transform: translateX(21em);
	-ms-transform: translateX(21em);
	-o-transform: translateX(21em);
	transform: translateX(21em);
}
/* this exception is here to keep reveal in place until the closed class is added, which is after hide */
.ui-panel-3dtransforms.ui-panel-display-reveal.ui-panel-closed {
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	-o-transform: translateX(0);
	transform: translateX(0);
}
.ui-panel-3dtransforms.ui-panel-open.ui-panel-position-right,
.ui-panel-3dtransforms.ui-panel-position-right.ui-panel-display-reveal {
	-webkit-transform: translateX(-21em);
	-moz-transform: translateX(-21em);
	-ms-transform: translateX(-21em);
	-o-transform: translateX(-21em);
	transform: translateX(-21em);
}

/* dismiss */
.ui-panel-dismiss{
	position: absolute;
	top: 0;
	left:0;
	height: 100%;
	width: 100%;
	display: none;
}
.ui-panel-dismiss-open{
	display: block;
}

/* content-wrap */
.ui-panel-content-wrap {
	position: relative;
	background: inherit;
	z-index: 1;
	left: 0;
}
.ui-panel-content-wrap-display-overlay {
	position: static;
}
/* a bit of hardware acceleration for iOS 6 blinking */
.ui-panel-3dtransforms ~.ui-panel-content-wrap ,
.ui-panel-3dtransforms ~.ui-panel-content-wrap .ui-header-fixed {
	-webkit-backface-visibility: hidden;
}
.ui-panel-3dtransforms ~.ui-panel-content-wrap .ui-header:not(.ui-header-fixed), /* ios4 fix */
.ui-panel-content-wrap-closed {
	position: static;
}

/* shadows and borders */
.ui-panel-display-reveal {
	-webkit-box-shadow: inset -5px 0 5px rgba(0,0,0,.15);
	box-shadow: inset -5px 0 5px rgba(0,0,0,.15);
}
.ui-panel-position-right.ui-panel-display-reveal {
	-webkit-box-shadow: inset 5px 0 5px rgba(0,0,0,.15);
	-moz-box-shadow: inset 5px 0 5px rgba(0,0,0,.15);
	box-shadow: inset 5px 0 5px rgba(0,0,0,.15);
}
.ui-panel-position-right.ui-panel-display-overlay {
	-webkit-box-shadow: -5px 0px 5px rgba(0,0,0,.15);
	-moz-box-shadow: -5px 0px 5px rgba(0,0,0,.15);
	box-shadow: -5px 0px 5px rgba(0,0,0,.15);
}
.ui-panel-position-left.ui-panel-display-overlay {
	-webkit-box-shadow: 5px 0px 5px rgba(0,0,0,.15);
	-moz-box-shadow: 5px 0px 5px rgba(0,0,0,.15);
	box-shadow: 5px 0px 5px rgba(0,0,0,.15);
}
.ui-panel-display-push.ui-panel-open.ui-panel-position-left {
	border-right-width: 1px;
	margin-right: -1px;
}
.ui-panel-display-push.ui-panel-open.ui-panel-position-right {
	border-left-width: 1px;
	margin-left: -1px;
}

/* dismiss and content wrap open positions */
.ui-panel-content-wrap-open.ui-panel-content-wrap-display-reveal, 
.ui-panel-dismiss-open.ui-panel-dismiss-display-reveal,
.ui-panel-content-wrap-open.ui-panel-content-wrap-display-push, 
.ui-panel-dismiss-open.ui-panel-dismiss-display-push,
.ui-panel-dismiss-open.ui-panel-dismiss-display-overlay {
	left: 21em;
	margin-left: -21em;
}
.ui-panel-3dtransforms ~.ui-panel-content-wrap-open.ui-panel-content-wrap-display-reveal, 
.ui-panel-3dtransforms ~.ui-panel-content-wrap-open.ui-panel-content-wrap-display-push {
	-webkit-transform: translateX(21em);
	-moz-transform: translateX(21em);
	-ms-transform: translateX(21em);
	-o-transform: translateX(21em);
	transform: translateX(21em);
	left: 0;
}
.ui-panel-content-wrap-open.ui-panel-content-wrap-display-reveal.ui-panel-content-wrap-position-right, 
.ui-panel-dismiss-open.ui-panel-dismiss-display-reveal.ui-panel-dismiss-position-right,
.ui-panel-content-wrap-open.ui-panel-content-wrap-display-push.ui-panel-content-wrap-position-right, 
.ui-panel-dismiss-open.ui-panel-dismiss-display-push.ui-panel-dismiss-position-right,
.ui-panel-dismiss-open.ui-panel-dismiss-display-overlay.ui-panel-dismiss-position-right {
	left: -21em;
	margin-left: 21em;
}
.ui-panel-3dtransforms ~.ui-panel-content-wrap-open.ui-panel-content-wrap-display-reveal.ui-panel-content-wrap-position-right, 
.ui-panel-3dtransforms ~.ui-panel-content-wrap-open.ui-panel-content-wrap-display-push.ui-panel-content-wrap-position-right {
	-webkit-transform: translateX(-21em);
	-moz-transform: translateX(-21em);
	-ms-transform: translateX(-21em);
	-o-transform: translateX(-21em);
	transform: translateX(-21em);
	left: 0;
}


/* while open, page x overflow is disabled */
.ui-page-active.ui-panel-page-block{
	overflow-x:hidden;
}



/* wrap push on wide viewports once open */
@media (min-width: 60em){
	.ui-panel-content-wrap.ui-panel-content-wrap-open-complete.ui-panel-content-wrap-display-push,
	.ui-panel-content-wrap.ui-panel-content-wrap-open-complete.ui-panel-content-wrap-display-reveal {
		margin-right: 21em;
	}
	.ui-panel-content-wrap.ui-panel-content-wrap-open-complete.ui-panel-content-wrap-display-push.ui-panel-content-wrap-position-right,
	.ui-panel-content-wrap.ui-panel-content-wrap-open-complete.ui-panel-content-wrap-display-reveal.ui-panel-content-wrap-position-right {
		margin: 0 0 0 21em;
	}
	.ui-panel-dismiss-display-push {
		display: none;
	}
}