@import 'colors';
@import 'fonts';
@import 'responsive';
@import 'utilities';
@import 'icons';
@import 'header';
@import 'shipyard';
@import 'list';
@import 'slot';
@import 'outfit';
@import 'comparison';
@import 'table';
@import 'select';
@import 'modal';
@import 'charts';
@import 'tooltip';
@import 'buttons';
@import 'error';
@import 'sortable';
@import 'loader';

html, body {
  height: 100%;
  width: 100%;
  text-rendering: optimizeLegibility;
  overflow: hidden;
}

body {
  color: @fg;
  margin: 0;
  padding: 0;
  font-family: @fStandard;
  letter-spacing: 0.05em;
}

div, a, li {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

#coriolis {
  width: 100%;
  height: 100%;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}

.page {
  margin: 0;
  padding: 0.5em;
  width: 100%;
  min-height: 100%;
  clear: both;
  text-align: center;
  box-sizing: border-box;

  .largePhone({
    padding: 0.5em 0.25em;
  });
}

.l {
  float: left;
}

.r {
  float: right;
}

.cl {
  clear: left;
}

.cr {
  clear: right;
}

.cb {
  clear: both;
}

.ri {
  text-align: right;
}

.le {
  text-align: left;
}

.cen {
  text-align: center;
}

.cap {
  text-transform: capitalize;
}

.upp {
  text-transform: uppercase;
}

.scroll-x {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.ptr {
  cursor: pointer;
}

h1 {
  font-family: @fTitle;
  color: @primary;
  font-size: 1.6em;
  letter-spacing: 0.1em;
}

h2 {
  text-transform: uppercase;
  font-family: @fStandard;
  font-size: 1.2em;
  font-weight: normal;
}

h3 {
  text-transform: uppercase;
  font-family: @fStandard;
  font-weight: normal;
  font-size: 1em;
  margin: 0.2em 0;
  color: @primary;
}

u { // Unit (Mj, Km, etc)
  font-size: 0.8em;
  text-decoration: none;
  text-transform: none;
}

a, a:visited {
  color: @fg;
}

p {
  text-align: justify;
}

input {
  background: @primary-bg;
  border: 1px solid @primary-disabled;
  color: @primary-disabled;
  outline: none;
}

footer {
  clear: both;
  font-size: 0.6em;
  color: #999;
  padding: 1em;
  overflow: hidden;

  .right {
    float: right;
    text-align: right;
  }
}