/* Bar: Toolbars, dividers, slider track */
.ui-bar-a,
.ui-page-theme-a .ui-bar-inherit,
html .ui-bar-a .ui-bar-inherit,
html .ui-body-a .ui-bar-inherit,
html body .ui-group-theme-a .ui-bar-inherit {
	background-color: 			#e9e9e9 /*{a-bar-background-color}*/;
	border-color:	 		#ddd /*{a-bar-border}*/;
	color: 					#333 /*{a-bar-color}*/;
}
.ui-bar-a {
	border-width: 1px;
	border-style: solid;
}
/* Page and overlay */
.ui-overlay-a,
.ui-page-theme-a,
.ui-page-theme-a .ui-panel-wrapper {
	background-color: 			#f9f9f9 /*{a-page-background-color}*/;
	border-color:	 		#bbb /*{a-page-border}*/;
	color: 					#333 /*{a-page-color}*/;
}
/* Body: Read-only lists, text inputs, collapsible content */
.ui-body-a,
.ui-page-theme-a .ui-body-inherit,
html .ui-bar-a .ui-body-inherit,
html .ui-body-a .ui-body-inherit,
html body .ui-group-theme-a .ui-body-inherit,
html .ui-panel-page-container-a {
	background-color: 			#fff /*{a-body-background-color}*/;
	border-color:	 		#ddd /*{a-body-border}*/;
	color: 					#333 /*{a-body-color}*/;
}
.ui-body-a {
	border-width: 1px;
	border-style: solid;
}

/* Structure */
/* Class ui-disabled deprecated in 1.4. :disabled not supported by IE8 so we use [disabled] */
.ui-disabled,
.ui-state-disabled,
button[disabled],
.ui-select .ui-btn.ui-state-disabled {
	filter: Alpha(Opacity=30);
	opacity: .3;
	cursor: default !important;
	pointer-events: none;
}

/* Viewport */
.ui-mobile-viewport {
	margin: 0;
	overflow-x: visible;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/* Issue #2066 */
body.ui-mobile-viewport,
div.ui-mobile-viewport {
	overflow-x: hidden;
}
/* "page" containers - full-screen views, one should always be in view post-pageload */
.ui-mobile [data-role=page],
.ui-mobile [data-role=dialog],
.ui-page {
	top: 0;
	left: 0;
	width: 100%;
	min-height: 100%;
	position: absolute;
	display: none;
	border: 0;
}
/* On ios4, setting focus on the page element causes flashing during transitions when there is an outline, so we turn off outlines */
.ui-page {
	outline: none;
}
.ui-mobile .ui-page-active {
	display: block;
	overflow: visible;
	overflow-x: hidden;
}
@media screen and (orientation: portrait) {
	.ui-mobile .ui-page {
		min-height: 420px;
	}
}
@media screen and (orientation: landscape) {
	.ui-mobile .ui-page {
		min-height: 300px;
	}
}

/* Accessible content hiding */
/* ui-hide-label deprecated in 1.4. TODO: Remove in 1.5 */
.ui-hide-label > label,
.ui-hide-label .ui-controlgroup-label,
.ui-hide-label .ui-rangeslider label,
.ui-hidden-accessible {
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	clip: rect(1px,1px,1px,1px);
}
/* Used for hiding elements by the filterable widget. You can also use this class to hide list items or buttons in controlgroups; this ensures correct corner styling. */
.ui-screen-hidden {
	display: none !important;
}

/* keyframes for slidein from sides */
@-webkit-keyframes slideinfromright {
    from { -webkit-transform: translate3d(100%,0,0); }
    to { -webkit-transform: translate3d(0,0,0); }
}
@-moz-keyframes slideinfromright {
    from { -moz-transform: translateX(100%); }
    to { -moz-transform: translateX(0); }
}
@keyframes slideinfromright {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}
@-webkit-keyframes slideinfromleft {
    from { -webkit-transform: translate3d(-100%,0,0); }
    to { -webkit-transform: translate3d(0,0,0); }
}
@-moz-keyframes slideinfromleft {
    from { -moz-transform: translateX(-100%); }
    to { -moz-transform: translateX(0); }
}
@keyframes slideinfromleft {
    from { transform: translateX(-100%); }
    to { transform: translateX(0); }
}
/* keyframes for slideout to sides */
@-webkit-keyframes slideouttoleft {
    from { -webkit-transform: translate3d(0,0,0); }
    to { -webkit-transform: translate3d(-100%,0,0); }
}
@-moz-keyframes slideouttoleft {
    from { -moz-transform: translateX(0); }
    to { -moz-transform: translateX(-100%); }
}
@keyframes slideouttoleft {
    from { transform: translateX(0); }
    to { transform: translateX(-100%); }
}
@-webkit-keyframes slideouttoright {
    from { -webkit-transform: translate3d(0,0,0); }
    to { -webkit-transform: translate3d(100%,0,0); }
}
@-moz-keyframes slideouttoright {
    from { -moz-transform: translateX(0); }
    to { -moz-transform: translateX(100%); }
}
@keyframes slideouttoright {
    from { transform: translateX(0); }
    to { transform: translateX(100%); }
}
.slide.out, .slide.in {
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-duration: 350ms;
	-moz-animation-timing-function: ease-out;
	-moz-animation-duration: 350ms;
	animation-timing-function: ease-out;
	animation-duration: 350ms;
}
.slide.out {
	-webkit-transform: translate3d(-100%,0,0);
	-webkit-animation-name: slideouttoleft;
	-moz-transform: translateX(-100%);
	-moz-animation-name: slideouttoleft;
	transform: translateX(-100%);
	animation-name: slideouttoleft;
}
.slide.in {
	-webkit-transform: translate3d(0,0,0);
	-webkit-animation-name: slideinfromright;
	-moz-transform: translateX(0);
	-moz-animation-name: slideinfromright;
	transform: translateX(0);
	animation-name: slideinfromright;
}
.slide.out.reverse {
	-webkit-transform: translate3d(100%,0,0);
	-webkit-animation-name: slideouttoright;
	-moz-transform: translateX(100%);
	-moz-animation-name: slideouttoright;
	transform: translateX(100%);
	animation-name: slideouttoright;
}
.slide.in.reverse {
	-webkit-transform: translate3d(0,0,0);
	-webkit-animation-name: slideinfromleft;
	-moz-transform: translateX(0);
	-moz-animation-name: slideinfromleft;
	transform: translateX(0);
	animation-name: slideinfromleft;
}