// TODO: This might be inefficient?
*, *:before, *:after {
  -moz-box-sizing: border-box; 
  -webkit-box-sizing: 
  border-box; 
  box-sizing: border-box;
 }

// Make sure iOS Safari doesn't scale fonts on orientation changes
html {
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}

body {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: 0;
}

// Remove tap highlight color on Safari
a {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

ul { margin: 0; padding: 0; }

main {
	position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;
  width: 100%;
   -webkit-overflow-scrolling: touch;
}

/* Hack to force all relatively and absolutely positioned elements still render while scrolling
   Note: This is a bug for "-webkit-overflow-scrolling: touch" (via ratchet) */
main > * {
  -webkit-transform: translateZ(0px);
          transform: translateZ(0px);
}

.content-padded {
  padding: $contentPadding;
}

// A section is a wrapper that contains objects that are positioned
// together. For example, the entire contents of a page could
// be a section, to make it easy to drag the section and expose panels
// on the left and right sides of the app.
.section {
  position: fixed;
  z-index: 1;
}
// A full section is like a section but with a full size
.full-section {
  position: fixed;
  z-index: 1;
  width: 100%;
  height: 100%;
}