/* things we always want */
body {
  font-family: 'Helvetica Neue', 'Nimbus Sans L', Arial, sans-serif;
}
/* allow hw-accelerated scrolling on platforms that support it */
body.webkitOverflowScrolling {
  -webkit-overflow-scrolling: touch;
}
/* for apps */
.enyo-document-fit {
  margin: 0;
  height: 100%;
  /* note: giving html overflow: auto is odd and was only ever done to avoid duplication
		however, android 4.04 sometimes does not hide nodes when their display is set to none
		if document is overflow auto.
	*/
  position: relative;
}
.enyo-body-fit {
  margin: 0;
  height: 100%;
  /* helps prevent ios page scroll */
  overflow: auto;
  position: relative;
}
.enyo-no-touch-action {
  -ms-touch-action: none;
}
.enyo-untouchable {
  pointer-events: none;
}
.enyo-untouchable > * {
  pointer-events: auto;
}
/* user selection */
.enyo-unselectable {
  cursor: default;
  -ms-user-select: none;
  -webkit-user-select: none;
  -moz-user-select: -moz-none;
  user-select: none;
}
.enyo-selectable {
  cursor: auto;
  -ms-user-select: element;
  -webkit-user-select: text;
  -moz-user-select: text;
  user-select: text;
}
.enyo-selectable::selection,
.enyo-selectable ::selection {
  background: #3297FD;
  color: #FFF;
}
/* layout */
body .enyo-fit {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.enyo-clip {
  overflow: hidden;
}
.enyo-border-box {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
/* compositing */
.enyo-composite {
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}
.enyo-inline {
  display: inline-block;
}
.enyo-positioned {
  position: relative;
}
.enyo-fill {
  position: relative;
  width: 100%;
  height: 100%;
}

.enyo-viewlayout {
  position: relative;
  overflow: hidden;
}
.enyo-viewlayout > .enyo-view,
.enyo-viewlayout > .enyo-viewlayout {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.enyo-viewlayout-slide > .enyo-view {
  -webkit-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
  -webkit-transition-property: none;
  transition-property: none;
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
}
.enyo-viewlayout-slide:not(.dragging) > .enyo-view.transitioning {
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
}
.enyo-viewlayout-slide.horizontal > .enyo-view.forward {
  -webkit-transform: translate3d(100%, 0, 0);
  transform: translate3d(100%, 0, 0);
}
.enyo-viewlayout-slide.horizontal > .enyo-view.back {
  -webkit-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
}
.enyo-viewlayout-slide.horizontal > .enyo-view.active {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.enyo-viewlayout-slide.vertical > .enyo-view.forward {
  -webkit-transform: translateY(0, -100%, 0);
  transform: translateY(0, -100%, 0);
}
.enyo-viewlayout-slide.vertical > .enyo-view.back {
  -webkit-transform: translateY(0, 100%, 0);
  transform: translateY(0, 100%, 0);
}
.enyo-viewlayout-slide.vertical > .enyo-view.active {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.enyo-viewlayout-slide.cover > .enyo-view {
  z-index: 5;
}
.enyo-viewlayout-slide.cover > .enyo-view.stationary {
  z-index: 0;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.enyo-viewlayout-slide.cover.dragging > .enyo-view {
  z-index: 0;
}
.enyo-viewlayout-slide.cover.dragging > .enyo-view.active {
  z-index: 10;
}

/* Accessibility */
*[tabindex] {
  /* remove outline in case dom has tabindex attribute */
  outline: none;
  /* remove tap highlight in case dom has tabindex attribute */
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* Fullscreen */
:-webkit-full-screen {
  width: 100% !important;
  height: 100% !important;
}
:-moz-full-screen {
  width: 100% !important;
  height: 100% !important;
}
:-ms-fullscreen {
  width: 100% !important;
  height: 100% !important;
}
:-o-full-screen {
  width: 100% !important;
  height: 100% !important;
}
:fullscreen {
  width: 100% !important;
  height: 100% !important;
}
/* Fallback Fullscreen */
body .enyo-fullscreen {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  box-sizing: border-box !important;
}
.enyo-fit:-webkit-full-screen-ancestor,
.enyo-fill:-webkit-full-screen-ancestor {
  padding: 0 !important;
  margin: 0 !important;
}
.enyo-fit:-moz-full-screen-ancestor,
.enyo-fill:-moz-full-screen-ancestor {
  padding: 0 !important;
  margin: 0 !important;
}
.enyo-fit:-ms-fullscreen-ancestor,
.enyo-fill:-ms-fullscreen-ancestor {
  padding: 0 !important;
  margin: 0 !important;
}
.enyo-fit:-o-full-screen-ancestor,
.enyo-fill:-o-full-screen-ancestor {
  padding: 0 !important;
  margin: 0 !important;
}
.enyo-fit:fullscreen-ancestor,
.enyo-fill:fullscreen-ancestor {
  padding: 0 !important;
  margin: 0 !important;
}

.enyo-thumb {
  position: absolute;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  background: #333;
  border: 1px solid #666;
  opacity: 0.75;
  z-index: 1;
}
.enyo-vthumb {
  top: 0;
  right: 2px;
  width: 4px;
}
.enyo-hthumb {
  left: 0;
  bottom: 2px;
  height: 4px;
}

.enyo-image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.enyo-image.sized {
  display: inline-block;
}
.enyo-image.contain {
  background-size: contain;
}
.enyo-image.cover {
  background-size: cover;
}

.enyo-scrollable {
  overflow: hidden;
}

.enyo-new-drawer {
  -webkit-transform: scale3d(1, 1, 1);
  -webkit-transform-origin: 0 0 0;
  overflow: hidden;
}
.enyo-new-drawer .enyo-new-drawer-client {
  -webkit-transform: scale3d(1, 1, 1);
  -webkit-transform-origin: 0 0 0;
}

.enyo-new-thumb {
  position: absolute;
  z-index: 1;
  -webkit-transform-origin: 0 0 0;
  transform-origin: 0 0 0;
  background: #666;
  opacity: 0.75;
  width: 3px;
  height: 3px;
  transition: opacity 0.1s linear;
  -moz-transition: opacity 0.1s linear;
  -webkit-transition: opacity 0.1s linear;
}
.enyo-new-thumb.hidden {
  opacity: 0;
}

.enyo-scrim {
  z-index: 1;
  /*
		note: by using pointer-events we allow tapping on scrim
		while it is fading out; however, this requires any showing classes
		to set pointer events to auto or scrim will not function as expected.
	*/
  pointer-events: none;
}
.enyo-scrim.enyo-scrim-translucent {
  pointer-events: auto;
  background-color: #000000;
  opacity: 0.65;
  filter: alpha(opacity=65);
}
.enyo-scrim.enyo-scrim-transparent {
  pointer-events: auto;
  background: transparent;
}

.enyo-viewmanager > .enyo-viewmanager {
  z-index: 20;
}
.enyo-viewmanager-scrim {
  background: #fff;
  opacity: 0;
  pointer-events: none;
  transition: opacity 300ms linear;
  z-index: 10;
}
.enyo-viewmanager-scrim.showing {
  opacity: 0.5;
  pointer-events: auto;
}

.enyo-tool-decorator {
  display: inline-block;
}
.enyo-tool-decorator > * {
  display: inline-block;
  vertical-align: middle;
}

.enyo-richtext {
  overflow: hidden;
  word-wrap: break-word;
}

.enyo-light-panels {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  overflow: hidden;
  direction: ltr;
}
.enyo-light-panels.horizontal.forwards > .panels-container > .shifted {
  transform: translateX(100%);
  -webkit-transform: translateX(100%);
}
.enyo-light-panels.horizontal.backwards > .panels-container {
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
}
.enyo-light-panels.horizontal.backwards > .panels-container > * {
  transform: translateX(100%);
  -webkit-transform: translateX(100%);
}
.enyo-light-panels.horizontal.backwards > .panels-container > .shifted {
  transform: translateX(0%);
  -webkit-transform: translateX(0%);
}
.enyo-light-panels.horizontal > .panels-container {
  width: 200%;
  height: 100%;
}
.enyo-light-panels.horizontal > .panels-container > * {
  width: 50%;
}
.enyo-light-panels.vertical.forwards > .panels-container > .shifted {
  transform: translateY(100%);
  -webkit-transform: translateY(100%);
}
.enyo-light-panels.vertical.backwards > .panels-container {
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}
.enyo-light-panels.vertical.backwards > .panels-container > * {
  transform: translateY(100%);
  -webkit-transform: translateY(100%);
}
.enyo-light-panels.vertical.backwards > .panels-container > .shifted {
  transform: translateY(0%);
  -webkit-transform: translateY(0%);
}
.enyo-light-panels.vertical > .panels-container {
  width: 100%;
  height: 200%;
}
.enyo-light-panels.vertical > .panels-container > * {
  height: 50%;
}
.enyo-light-panels > .panels-container {
  position: relative;
}
.enyo-light-panels > .panels-container > * {
  display: inline-block;
  vertical-align: top;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  box-sizing: border-box;
}
.enyo-light-panels > .panels-container > .offscreen {
  visibility: hidden;
}
.enyo-locale-right-to-left .enyo-light-panels > .panels-container > * {
  direction: rtl;
}

.enyo-popup {
  position: absolute;
  z-index: 10;
}

/* reset */
button {
  font-size: inherit;
  font-family: inherit;
}
button::-moz-focus-inner {
  border: 0;
  padding: 0;
}

.enyo-sprite-animation {
  overflow: hidden;
}
.enyo-sprite-animation .enyo-sprite-animation-image {
  background-size: initial;
  -webkit-animation-play-state: running;
  animation-play-state: running;
}
.enyo-sprite-animation.paused .enyo-sprite-animation-image {
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}

.enyo-scroller {
  position: relative;
}
.enyo-fit.enyo-scroller {
  position: absolute;
}
.enyo-touch-scroller {
  overflow: hidden;
}
.enyo-touch-scroller-client::after,
.enyo-touch-scroller-client::before {
  content: "";
  display: table-cell;
}
.enyo-touch-strategy-container {
  overflow: hidden;
}
.enyo-scrollee-fit {
  height: 100%;
}
.enyo-flex-item.flex .enyo-scrollee-fit {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.enyo-data-list {
  overflow: hidden;
  position: relative;
  height: 100%;
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.enyo-data-list .active {
  position: relative;
  overflow: hidden;
}
.enyo-data-list .buffer {
  height: 100%;
  overflow: hidden;
}
.enyo-data-list .page {
  position: absolute;
  visibility: hidden;
  width: 100%;
}
.enyo-data-list.transitions .page {
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 300ms ease-out;
  -moz-transition: opacity 300ms ease-out;
  -ms-transition: opacity 300ms ease-out;
  -o-transition: opacity 300ms ease-out;
  transition: opacity 300ms ease-out;
}
.enyo-data-list.rendered .page {
  visibility: visible;
}
.enyo-data-list.rendered.transitions .page {
  opacity: 1;
  filter: alpha(opacity=100);
}
.enyo-data-list.debug .page1 {
  background: #99CCFF;
}
.enyo-data-list.debug .page2 {
  background: #CC99FF;
}
.enyo-data-list.horizontal .active {
  white-space: nowrap;
}
.enyo-data-list.horizontal .page > * {
  display: inline-block !important;
}
.enyo-data-list.horizontal .page {
  width: auto;
}

.enyo-data-grid-list .item {
  display: block;
  position: absolute !important;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.enyo-data-grid-list.transitions.reset.rendered .item {
  -webkit-transition: top 300ms ease-out, left 300ms ease-out, width 300ms ease-out, height 300ms ease-out;
  -moz-transition: top 300ms ease-out, left 300ms ease-out, width 300ms ease-out, height 300ms ease-out;
  -ms-transition: top 300ms ease-out, left 300ms ease-out, width 300ms ease-out, height 300ms ease-out;
  -o-transition: top 300ms ease-out, left 300ms ease-out, width 300ms ease-out, height 300ms ease-out;
  transition: top 300ms ease-out, left 300ms ease-out, width 300ms ease-out, height 300ms ease-out;
}