@font-face {
  font-family: 'u47';
  src: url("../type/u47/2760F4_0_0.eot");
  src: url("../type/u47/2760F4_0_0.eot?#iefix") format("embedded-opentype"), url("../type/u47/2760F4_0_0.woff") format("woff"), url("../type/u47/2760F4_0_0.ttf") format("truetype"), url("../type/u47/2760F4_0_0.svg#wf") format("svg"); }

@font-face {
  font-family: 'u39';
  src: url("../type/u39/276103_0_0.eot");
  src: url("../type/u39/276103_0_0.eot?#iefix") format("embedded-opentype"), url("../type/u39/276103_0_0.woff") format("woff"), url("../type/u39/276103_0_0.ttf") format("truetype"), url("../type/u39/276103_0_0.svg#wf") format("svg"); }

@font-face {
  font-family: 'u67';
  src: url("../type/u67/276103_1_0.eot");
  src: url("../type/u67/276103_1_0.eot?#iefix") format("embedded-opentype"), url("../type/u67/276103_1_0.woff") format("woff"), url("../type/u67/276103_1_0.ttf") format("truetype"), url("../type/u67/276103_1_0.svg#wf") format("svg"); }

@font-face {
  font-family: 'wxFont';
  src: url("../type/wx/weathericons-regular-webfont.eot");
  src: url("../type/wx/weathericons-regular-webfont.eot?#iefix") format("embedded-opentype"), url("../type/wx/weathericons-regular-webfont.woff") format("woff"), url("../type/wx/weathericons-regular-webfont.ttf") format("truetype"), url("../type/wx/weathericons-regular-webfont.svg#wf") format("svg"); }

::selection {
  /*background: #;*/ }

::-moz-selection {
  /*background: #;*/ }

*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

h1, h2, h3, h4, h5, h6 {
  font-family: u67;
  font-weight: normal; }

a {
  text-decoration: none;
  color: #f2efdc;
  border-bottom: 1px #f2efdc dotted; }

b {
  font-weight: normal;
  font-family: u67; }

a img {
  border: none; }

html {
  height: 100%;
  font-family: u47;
  font-size: 16px; }

body {
  margin: 0;
  padding: 0;
  background-color: #024959;
  font-family: u47;
  color: #f2efdc;
  overflow-x: hidden; }
  @media (min-width: 768px) {
    body {
      padding: 10px; } }

input, textarea {
  font-family: u47;
  font-size: 14px;
  padding: 2px;
  margin: 0px;
  border: 0px;
  width: 100%;
  outline: 0px; }

.container {
  margin: auto; }

#master {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%; }

.mobile_header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 50px;
  background-color: #f2efdc;
  z-index: 100;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out; }
  .mobile_header.sidebarOpen {
    left: 250px; }
    .mobile_header.sidebarOpen .menu {
      background-color: #024959; }
      .mobile_header.sidebarOpen .menu span {
        background-color: #f2efdc; }
  .mobile_header div {
    height: 100%;
    position: relative;
    width: 50px; }
  .mobile_header .menu {
    float: left;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    border-bottom: 1px solid #f2efdc; }
    .mobile_header .menu span {
      height: 1px;
      width: 20px;
      left: 15px;
      position: absolute;
      background-color: #024959;
      -webkit-transition: all 0.2s ease-in-out;
      -moz-transition: all 0.2s ease-in-out;
      -o-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out; }
    .mobile_header .menu span:nth-of-type(1) {
      top: 20px; }
    .mobile_header .menu span:nth-of-type(2) {
      top: 25px; }
    .mobile_header .menu span:nth-of-type(3) {
      top: 30px; }
  .mobile_header .add {
    float: right; }
    .mobile_header .add span {
      position: absolute;
      background-color: #024959;
      top: 50%;
      left: 50%;
      -webkit-transition: all 0.2s ease-in-out;
      -moz-transition: all 0.2s ease-in-out;
      -o-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out; }
    .mobile_header .add .vert {
      height: 50%;
      width: 1px;
      margin: -25% 0px 0px -1px; }
    .mobile_header .add .horiz {
      width: 50%;
      height: 1px;
      margin: -1px 0px 0px -25%; }
  .mobile_header .undo {
    float: right;
    background-image: url(../img/spritesheet.png);
    background-size: 150px auto;
    background-position: -100px 0px; }
  @media (min-width: 768px) {
    .mobile_header {
      display: none; } }

.mobile_actions {
  position: fixed;
  height: 50px;
  width: 100%;
  bottom: -50px;
  left: 0px;
  background-color: #f2efdc;
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px); }
  @media (min-width: 768px) {
    .mobile_actions {
      display: none; } }
  .focused_true .mobile_actions {
    -webkit-transform: translateY(-50px);
    -moz-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    -o-transform: translateY(-50px);
    transform: translateY(-50px); }
  .mobile_actions div {
    width: 20%;
    height: 50px;
    position: relative;
    float: left; }
    .mobile_actions div:before {
      content: '';
      position: absolute;
      height: 50px;
      width: 50px;
      top: 50%;
      left: 50%;
      margin: -25px 0 0 -25px;
      background-image: url(../img/spritesheet.png);
      background-size: 150px auto; }
  .mobile_actions .lineUp:before {
    background-position: 0px 0px; }
  .mobile_actions .lineDown:before {
    background-position: -50px 0px; }
  .mobile_actions .hideKeyboard:before {
    background-position: -100px -50px; }
  .mobile_actions .lineIn:before {
    background-position: 0px -50px; }
  .mobile_actions .lineOut:before {
    background-position: -50px -50px; }

.modalBG {
  position: fixed;
  top: 0px;
  left: 0%;
  height: 100%;
  width: 100%;
  background-color: rgba(2, 73, 89, 0.87);
  z-index: 800;
  opacity: 0;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -o-transform: scale(1.5);
  transform: scale(1.5); }
  .startingUp .modalBG, .viewingAbout .modalBG, .viewingVersion .modalBG {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }
  .modalClear .modalBG {
    display: none; }

.modalCloser {
  height: 50px;
  width: 50px;
  position: absolute;
  top: 20px;
  left: 20px;
  background-color: #f2efdc;
  border-radius: 50px;
  cursor: pointer; }
  .modalCloser .crossbar1,
  .modalCloser .crossbar2 {
    position: absolute;
    height: 30px;
    width: 1px;
    background-color: #024959;
    top: 50%;
    left: 50%;
    margin: -15px 0px 0px 0px; }
  .modalCloser .crossbar1 {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg); }
  .modalCloser .crossbar2 {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg); }
  .modalCloser:before {
    content: '';
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    border: 1px #f2efdc solid;
    border-radius: 50px;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out; }
  .modalCloser:hover:before {
    height: 120%;
    width: 120%;
    top: -10%;
    left: -10%; }

button.primary {
  position: absolute;
  height: 80px;
  width: 80px;
  top: 50%;
  left: 50%;
  margin: -40px 0px 0px -40px;
  border-radius: 100px;
  text-align: center;
  border: 0px;
  background-color: #f2efdc;
  color: #024959;
  cursor: pointer;
  font-family: u67;
  font-size: 16px;
  z-index: 10;
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  -o-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out; }
  button.primary:before {
    content: '';
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: -1;
    border: 1px #f2efdc solid;
    border-radius: 100px;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out; }
  button.primary:hover:before {
    height: 110%;
    width: 110%;
    top: -5%;
    left: -5%; }
  button.primary:focus {
    outline: 0px; }
    button.primary:focus:before {
      height: 110%;
      width: 110%;
      top: -5%;
      left: -5%; }
  .active button.primary {
    background-color: #024959;
    color: #f2efdc; }
    .active button.primary:before {
      height: 110%;
      width: 110%;
      top: -5%;
      left: -5%;
      border: 1px #024959 solid; }
    .active button.primary:hover:before, .active button.primary:focus:before {
      border: 3px #024959 solid; }

button.secondary {
  width: 100%;
  height: 50px;
  line-height: 50px;
  background-color: #024959;
  border-top: 1px #024959 solid;
  border-right: 1px #024959 solid;
  border-bottom: 1px #024959 solid;
  border-left: 1px #024959 solid;
  border-radius: 0px 0px 5px 5px;
  cursor: pointer;
  color: #f2efdc;
  font-family: u47;
  font-size: 14px;
  text-transform: uppercase; }
  button.secondary:hover {
    background-color: #024959;
    border-top: 1px #f2efdc solid;
    color: #f2efdc; }
  button.secondary:focus {
    outline: 0;
    border-right: 1px #024959 dashed;
    border-bottom: 1px #024959 dashed;
    border-left: 1px #024959 dashed; }

.hello {
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0px;
  left: 0px;
  background-color: #024959;
  z-index: 1000;
  opacity: 1;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1); }
  .yesLetsGo .hello {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
    opacity: 0; }
  .upUpAndAway .hello {
    display: none; }
  .hello .andWelcome {
    position: relative;
    width: 100%;
    max-width: 1024px;
    margin: auto;
    padding: 10px; }
    @media (min-width: 768px) {
      .hello .andWelcome {
        height: 100%;
        padding: 20px; } }
    .hello .andWelcome div {
      position: relative;
      float: left; }
      @media (min-width: 768px) {
        .hello .andWelcome div {
          top: 50%; } }
    .hello .andWelcome .one {
      width: 50%;
      background-image: url(../img/logo.png);
      background-size: 100px 100px;
      background-repeat: no-repeat;
      background-position: center center;
      height: 100px; }
      @media (min-width: 768px) {
        .hello .andWelcome .one {
          height: 250px;
          width: 100%;
          margin-top: -375px; } }
    @media (min-width: 768px) {
      .hello .andWelcome .two,
      .hello .andWelcome .three,
      .hello .andWelcome .four {
        border-top: 5px #f2efdc solid;
        border-bottom: 5px #f2efdc solid;
        margin-top: -125px !important;
        width: 33.33333%;
        height: 250px; } }
    .hello .andWelcome .two {
      width: 50%;
      display: table;
      margin: 10px 0; }
      @media (min-width: 768px) {
        .hello .andWelcome .two {
          width: 33.33333%; } }
      .hello .andWelcome .two p {
        display: table-cell;
        vertical-align: middle; }
        .hello .andWelcome .two p span {
          font-family: u67;
          letter-spacing: 2px; }
    .hello .andWelcome .disclaimer,
    .hello .andWelcome .error {
      position: absolute;
      text-align: center;
      width: 100%;
      margin-top: 5px;
      left: 0px;
      color: #f2efdc;
      font-size: 14px; }
      @media (min-width: 768px) {
        .hello .andWelcome .disclaimer,
        .hello .andWelcome .error {
          margin-top: 25px; } }
    .hello .andWelcome .disclaimer {
      top: 100%; }
    .hello .andWelcome .three,
    .hello .andWelcome .four {
      width: 50%;
      height: 250px; }
      @media (min-width: 768px) {
        .hello .andWelcome .three,
        .hello .andWelcome .four {
          width: 33.33333%; } }
      .hello .andWelcome .three .input,
      .hello .andWelcome .four .input {
        height: 100%;
        width: 200%;
        position: absolute;
        top: -100%;
        left: 0px;
        padding: 0px 10px;
        background-color: #f2efdc;
        -webkit-transition: all 0.35s ease-in-out;
        -moz-transition: all 0.35s ease-in-out;
        -o-transition: all 0.35s ease-in-out;
        transition: all 0.35s ease-in-out;
        opacity: 0;
        border-top: 10px #024959 solid;
        border-bottom: 10px #024959 solid; }
        @media (min-width: 768px) {
          .hello .andWelcome .three .input,
          .hello .andWelcome .four .input {
            width: 100%; } }
        .hello .andWelcome .three .input input,
        .hello .andWelcome .four .input input {
          position: relative;
          float: left;
          width: 100%;
          background-color: #024959;
          border: 1px #f2efdc solid;
          border-radius: 5px;
          margin-top: 10px;
          color: #f2efdc;
          padding: 12px;
          font-size: 20px;
          -webkit-transition: background-color 0.35s ease-in-out;
          -moz-transition: background-color 0.35s ease-in-out;
          -o-transition: background-color 0.35s ease-in-out;
          transition: background-color 0.35s ease-in-out; }
        .hello .andWelcome .three .input .ng-invalid-email,
        .hello .andWelcome .four .input .ng-invalid-email {
          background-color: #c80000; }
      .hello .andWelcome .three button,
      .hello .andWelcome .four button {
        top: 20px;
        margin-top: 0px; }
        @media (min-width: 768px) {
          .hello .andWelcome .three button,
          .hello .andWelcome .four button {
            top: 50%;
            margin-top: -40px; } }
      .hello .andWelcome .three.inactive button,
      .hello .andWelcome .four.inactive button {
        display: none; }
        @media (min-width: 768px) {
          .hello .andWelcome .three.inactive button,
          .hello .andWelcome .four.inactive button {
            display: block; } }
      .hello .andWelcome .three.active button,
      .hello .andWelcome .four.active button {
        margin: 20px 0px 0px -40px;
        top: 50%; }
      .hello .andWelcome .three.active .input,
      .hello .andWelcome .four.active .input {
        top: 0px;
        opacity: 1; }
    .hello .andWelcome .three.active button {
      left: 100%; }
      @media (min-width: 768px) {
        .hello .andWelcome .three.active button {
          left: 50%; } }
    .hello .andWelcome .four .input {
      left: -100%; }
      @media (min-width: 768px) {
        .hello .andWelcome .four .input {
          left: 0; } }
    .hello .andWelcome .four.active button {
      left: 0%; }
      @media (min-width: 768px) {
        .hello .andWelcome .four.active button {
          left: 50%; } }
  .hello .homepageCopyright {
    position: relative;
    float: left;
    bottom: 0px;
    width: 100%;
    text-align: center;
    margin-top: 25px;
    font-size: 14px; }
    @media (min-width: 768px) {
      .hello .homepageCopyright {
        margin-top: 0;
        position: absolute; } }

#startUp {
  position: fixed;
  top: 50%;
  left: 50%;
  height: 250px;
  width: 250px;
  z-index: 1000;
  background-color: #024959;
  border: 3px #f2efdc solid;
  border-radius: 250px;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -webkit-transform: scale(1.5) rotate(0deg);
  -moz-transform: scale(1.5) rotate(0deg);
  -ms-transform: scale(1.5) rotate(0deg);
  -o-transform: scale(1.5) rotate(0deg);
  transform: scale(1.5) rotate(0deg); }
  .startingUp #startUp {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1; }
  .viewingAbout #startUp, .startUp_off #startUp {
    display: none; }
  #startUp:before {
    content: '';
    position: absolute;
    height: 258px;
    width: 258px;
    top: -7px;
    left: -7px;
    border: 1px #024959 solid;
    border-radius: 200px;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out; }
  #startUp .startUpText {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out; }
    #startUp .startUpText .startUpCarousel {
      position: absolute;
      height: 100%;
      width: 1000%;
      top: 0px;
      left: 0px;
      -webkit-transition: left 0.5s ease-in-out;
      -moz-transition: left 0.5s ease-in-out;
      -o-transition: left 0.5s ease-in-out;
      transition: left 0.5s ease-in-out; }
      #startUp .startUpText .startUpCarousel .startUpShow {
        position: relative;
        float: left;
        height: 100%;
        width: 10%;
        display: table;
        padding: 0px 10px;
        -webkit-transition: opacity 0.5s ease-in-out;
        -moz-transition: opacity 0.5s ease-in-out;
        -o-transition: opacity 0.5s ease-in-out;
        transition: opacity 0.5s ease-in-out; }
        #startUp .startUpText .startUpCarousel .startUpShow p {
          font-size: 16px;
          display: table-cell;
          vertical-align: middle; }
          #startUp .startUpText .startUpCarousel .startUpShow p b {
            font-weight: normal;
            font-family: u67; }
  #startUp .startUpExit {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 50px;
    width: 50px;
    margin: -90% 0 0 -20%;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 100; }
  #startUp .startUpButtons {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 250px;
    height: 310px;
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity 0.2s ease-in-out;
    -moz-transition: opacity 0.2s ease-in-out;
    -o-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out; }
    #startUp .startUpButtons .startUpButton {
      width: 120px;
      height: 50px;
      position: absolute;
      bottom: 0px;
      border: 1px #024959 solid;
      background-color: #f2efdc;
      text-transform: uppercase;
      color: #024959;
      text-align: center;
      padding: 0px;
      cursor: pointer;
      font-family: u47;
      border-radius: 5px;
      line-height: 40px; }
      #startUp .startUpButtons .startUpButton:hover {
        background-color: #024959;
        color: #f2efdc;
        border: 1px #f2efdc solid; }
      #startUp .startUpButtons .startUpButton:focus {
        outline: 0px; }
      #startUp .startUpButtons .startUpButton:before {
        font-size: 16px; }
      #startUp .startUpButtons .startUpButton.SUB_left {
        left: -35px; }
      #startUp .startUpButtons .startUpButton.SUB_right {
        right: -35px; }
  #startUp.topLeft {
    -webkit-transform: scale(1) rotate(-180deg);
    -moz-transform: scale(1) rotate(-180deg);
    -ms-transform: scale(1) rotate(-180deg);
    -o-transform: scale(1) rotate(-180deg);
    transform: scale(1) rotate(-180deg); }
    #startUp.topLeft .startUpExit {
      -webkit-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
      margin: 30% 0 0 -70%; }
    #startUp.topLeft .startUpText {
      -webkit-transform: rotate(180deg);
      -moz-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
      -o-transform: rotate(180deg);
      transform: rotate(180deg); }
  #startUp.topRight {
    -webkit-transform: scale(1) rotate(-90deg);
    -moz-transform: scale(1) rotate(-90deg);
    -ms-transform: scale(1) rotate(-90deg);
    -o-transform: scale(1) rotate(-90deg);
    transform: scale(1) rotate(-90deg); }
    #startUp.topRight .startUpExit {
      -webkit-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
      margin: -70% 0 0 30%; }
    #startUp.topRight .startUpText {
      -webkit-transform: rotate(90deg);
      -moz-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      -o-transform: rotate(90deg);
      transform: rotate(90deg); }
  #startUp.rightRight {
    -webkit-transform: scale(1) rotate(-45deg);
    -moz-transform: scale(1) rotate(-45deg);
    -ms-transform: scale(1) rotate(-45deg);
    -o-transform: scale(1) rotate(-45deg);
    transform: scale(1) rotate(-45deg); }
    #startUp.rightRight .startUpExit {
      margin: -90% 0 0 -20%; }
    #startUp.rightRight .startUpText {
      -webkit-transform: rotate(45deg);
      -moz-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      -o-transform: rotate(45deg);
      transform: rotate(45deg); }
  #startUp.leftLeft {
    -webkit-transform: scale(1) rotate(-225deg);
    -moz-transform: scale(1) rotate(-225deg);
    -ms-transform: scale(1) rotate(-225deg);
    -o-transform: scale(1) rotate(-225deg);
    transform: scale(1) rotate(-225deg); }
    #startUp.leftLeft .startUpExit {
      margin: -90% 0 0 -20%; }
    #startUp.leftLeft .startUpText {
      -webkit-transform: rotate(225deg);
      -moz-transform: rotate(225deg);
      -ms-transform: rotate(225deg);
      -o-transform: rotate(225deg);
      transform: rotate(225deg); }
  #startUp.centerCenter {
    margin: -100px 0 0 -100px; }

.showingList {
  z-index: 100000; }

.startUp_0 .grid,
.startUp_1 .grid,
.startUp_2 .grid,
.startUp_3 .grid,
.startUp_4 .grid,
.startUp_5 .grid,
.startUp_6 .grid,
.startUp_7 .grid,
.startUp_8 .grid,
.startUp_9 .grid {
  height: 100%; }

.startUp_0 .grid .cell .cover,
.startUp_1 .grid .cell .cover,
.startUp_2 .grid .cell .cover,
.startUp_3 .grid .cell .cover,
.startUp_4 .grid .cell .cover,
.startUp_5 .grid .cell .cover,
.startUp_6 .grid .cell .cover,
.startUp_7 .grid .cell .cover,
.startUp_9 .grid .cell .cover {
  top: 0px;
  opacity: 1; }

.startUp_0 .SUB_left:before,
.startUp_1 .SUB_left:before {
  content: 'NOPE'; }
.startUp_0 .SUB_right:before,
.startUp_1 .SUB_right:before {
  content: 'SURE'; }

.startUp_1 #startUp, .startUp_1 #startUp:before,
.startUp_2 #startUp,
.startUp_2 #startUp:before,
.startUp_3 #startUp,
.startUp_3 #startUp:before,
.startUp_4 #startUp,
.startUp_4 #startUp:before,
.startUp_5 #startUp,
.startUp_5 #startUp:before,
.startUp_6 #startUp,
.startUp_6 #startUp:before,
.startUp_7 #startUp,
.startUp_7 #startUp:before,
.startUp_8 #startUp,
.startUp_8 #startUp:before,
.startUp_9 #startUp,
.startUp_9 #startUp:before {
  border-radius: 200px 200px 0px 200px; }

.startUp_1 #startUp .startUpButton,
.startUp_3 #startUp .startUpButton,
.startUp_4 #startUp .startUpButton,
.startUp_5 #startUp .startUpButton,
.startUp_7 #startUp .startUpButton,
.startUp_8 #startUp .startUpButton {
  display: none; }

.startUp_1 .showingList,
.startUp_2 .showingList,
.startUp_3 .showingList {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  z-index: 10000; }

.startUp_1 .grid .cell.showingList,
.startUp_2 .grid .cell.showingList,
.startUp_3 .grid .cell.showingList,
.startUp_4 .grid .cell.showingList {
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out; }

.startUp_1 .grid .cell.showingList .cover,
.startUp_2 .grid .cell.showingList .cover,
.startUp_3 .grid .cell.showingList .cover,
.startUp_4 .grid .cell.showingList .cover,
.startUp_5 .grid .cell.showingList .cover,
.startUp_6 .grid .cell.showingList .cover {
  top: 100%;
  opacity: 0; }

.startUp_0 #startUp {
  margin: -125px 0 0 -100px;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1); }
  .startUp_0 #startUp .startUpExit {
    opacity: 0; }

.startUp_1 .grid .cell.showingList,
.startUp_2 .grid .cell.showingList {
  margin: -70px 0 0 75px; }
.startUp_1 #startUp,
.startUp_2 #startUp {
  margin: -125px 0 0 -250px;
  -webkit-transform: scale(1) rotate(-45deg);
  -moz-transform: scale(1) rotate(-45deg);
  -ms-transform: scale(1) rotate(-45deg);
  -o-transform: scale(1) rotate(-45deg);
  transform: scale(1) rotate(-45deg); }
  .startUp_1 #startUp .startUpText,
  .startUp_2 #startUp .startUpText {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg); }

.startUp_2 .startUpButtons {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg); }
  .startUp_2 .startUpButtons .SUB_left {
    display: none; }
  .startUp_2 .startUpButtons .SUB_right:before {
    content: 'NO THANKS'; }

.startUp_3 .grid .cell.showingList {
  margin: -250px 0 0 75px; }
.startUp_3 #startUp {
  margin: -125px 0 0 -250px;
  -webkit-transform: scale(1) rotate(-45deg);
  -moz-transform: scale(1) rotate(-45deg);
  -ms-transform: scale(1) rotate(-45deg);
  -o-transform: scale(1) rotate(-45deg);
  transform: scale(1) rotate(-45deg); }
  .startUp_3 #startUp .startUpText {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg); }

.startUp_6 .startUpButtons .SUB_left {
  display: none; }
.startUp_6 .startUpButtons .SUB_right:before {
  content: 'NO THANKS'; }
.startUp_6 .topRight .startUpButtons {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg); }
.startUp_6 .topLeft .startUpButtons {
  top: -60px;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg); }

.startUp_7 .grid .cell .addCell ~ .cover,
.startUp_8 .grid .cell .addCell ~ .cover {
  top: 100%;
  opacity: 0; }

.startUp_9 #startUp .startUpButtons {
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
  transform-origin: 130px 115px; }
.startUp_9 .startUpExit {
  opacity: 0; }
.startUp_9 .SUB_left:before {
  content: 'AGAIN, PLEASE'; }
.startUp_9 .SUB_right:before {
  content: 'SWEET'; }

.startUp_0 #startUp .startUpCarousel {
  left: 0%; }

.startUp_1 #startUp .startUpCarousel {
  left: -100%; }

.startUp_2 #startUp .startUpCarousel {
  left: -200%; }

.startUp_3 #startUp .startUpCarousel {
  left: -300%; }

.startUp_4 #startUp .startUpCarousel {
  left: -400%; }

.startUp_5 #startUp .startUpCarousel {
  left: -500%; }

.startUp_6 #startUp .startUpCarousel {
  left: -600%; }

.startUp_7 #startUp .startUpCarousel {
  left: -700%; }

.startUp_8 #startUp .startUpCarousel {
  left: -800%; }

.startUp_9 #startUp .startUpCarousel {
  left: -900%; }

.aboutTraject,
.versioning {
  position: fixed;
  padding: 10px 15px 20px 100px;
  z-index: 900;
  opacity: 0;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -o-transform: scale(1.5);
  transform: scale(1.5); }
  @media (min-width: 768px) {
    .aboutTraject,
    .versioning {
      padding: 10px 15px 20px; } }
  .modalClear .aboutTraject, .startingUp .aboutTraject, .modalClear
  .versioning, .startingUp
  .versioning {
    display: none; }
  @media (min-width: 768px) {
    .aboutTraject .modalCloser,
    .versioning .modalCloser {
      display: none; } }
  .aboutTraject .logo,
  .versioning .logo {
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 115px;
    background-size: 100px 100px;
    background-image: url(../img/logo.png);
    background-position: top center;
    background-repeat: no-repeat;
    border-bottom: 1px #f2efdc solid; }
    @media (min-width: 768px) {
      .aboutTraject .logo,
      .versioning .logo {
        height: 315px;
        background-size: 300px 300px; } }
  .aboutTraject .text,
  .versioning .text {
    width: 100%;
    position: relative; }
    .aboutTraject .text h1,
    .versioning .text h1 {
      padding-bottom: 10px;
      border-bottom: 1px #f2efdc solid;
      margin: 0 0 10px; }
    .aboutTraject .text h4,
    .versioning .text h4 {
      margin: 5px 0; }
    .aboutTraject .text ul,
    .versioning .text ul {
      padding-left: 0px;
      margin: 5px 0 10px; }
      .aboutTraject .text ul li ul,
      .versioning .text ul li ul {
        margin: 0;
        padding-left: 20px;
        list-style-type: disc; }

.aboutTraject {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  overflow: scroll; }
  @media (min-width: 768px) {
    .aboutTraject {
      height: 720px;
      width: 500px;
      margin: -360px 0 0 -250px;
      top: 50%;
      left: 50%;
      overflow: none; } }

.versioning {
  height: 100%;
  overflow: scroll;
  top: 0px;
  width: 100%;
  left: 0; }
  @media (min-width: 768px) {
    .versioning {
      width: 500px;
      left: 50%;
      margin-left: -250px; } }

.viewingAbout,
.viewingVersion {
  overflow-y: hidden; }

.viewingAbout .versioning,
.viewingVersion .aboutTraject {
  display: none; }

.viewingAbout .aboutTraject,
.viewingVersion .versioning {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  opacity: 1; }

.sidebar {
  position: fixed;
  width: 250px;
  height: 100%;
  background-color: #f2efdc;
  top: 0px;
  left: -250px;
  z-index: 500;
  border-right: 1px #f2efdc solid;
  opacity: 0;
  overflow: hidden;
  -webkit-transition: left 0.2s ease-in-out;
  -moz-transition: left 0.2s ease-in-out;
  -o-transition: left 0.2s ease-in-out;
  transition: left 0.2s ease-in-out; }
  .yesLetsGo .sidebar {
    left: -250px;
    opacity: 1; }
    @media (min-width: 768px) {
      .yesLetsGo .sidebar {
        left: -200px; } }
  .sidebar.sidebar-is-open {
    left: 0px; }
    .sidebar.sidebar-is-open .menu {
      opacity: 1; }
  .sidebar .menu {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    opacity: 0;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out; }
    .sidebar .menu li {
      color: #024959;
      list-style: none;
      width: 100%;
      cursor: pointer;
      height: 50px;
      display: table;
      padding: 10px; }
      .sidebar .menu li span {
        display: table-cell;
        vertical-align: middle;
        text-transform: uppercase;
        letter-spacing: 2px; }
        .sidebar .menu li span a {
          display: block;
          color: #024959;
          border-bottom: 0px; }
      .sidebar .menu li:hover {
        color: #f2efdc;
        background-color: #024959; }
        .sidebar .menu li:hover a {
          color: #f2efdc;
          border-bottom: 0px; }
    .sidebar .menu form {
      margin: 0px; }
    .sidebar .menu .units-toggle {
      position: relative;
      padding-right: 50px; }
      .sidebar .menu .units-toggle:before, .sidebar .menu .units-toggle:after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        border-radius: 50px; }
      .sidebar .menu .units-toggle:before {
        height: 30px;
        width: 100px;
        margin: -15px 0 0 -70px;
        border: 1px solid #024959; }
      .sidebar .menu .units-toggle:after {
        height: 26px;
        width: 26px;
        margin: -13px 0 0 2px;
        background-color: #024959;
        -webkit-transition: margin-left 0.2s ease-in-out;
        -moz-transition: margin-left 0.2s ease-in-out;
        -o-transition: margin-left 0.2s ease-in-out;
        transition: margin-left 0.2s ease-in-out; }
      .sidebar .menu .units-toggle:hover:before {
        border: 1px solid #f2efdc; }
      .sidebar .menu .units-toggle:hover:after {
        background-color: #f2efdc; }
      .sidebar .menu .units-toggle.toggleLeft:after {
        margin-left: -68px; }
      .sidebar .menu .units-toggle span:nth-child(2) {
        text-align: right; }
    .sidebar .menu .units-temp span:after {
      content: "\00b0"; }
    .sidebar .menu .passwordChanger,
    .sidebar .menu .feedbackForm {
      position: relative;
      float: left;
      width: 100%;
      height: 0px;
      overflow: hidden;
      padding: 0px 10px;
      opacity: 0;
      -webkit-transition: all 0.2s ease-in-out;
      -moz-transition: all 0.2s ease-in-out;
      -o-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out; }
      .sidebar .menu .passwordChanger p,
      .sidebar .menu .feedbackForm p {
        position: relative;
        width: 100%;
        display: none;
        color: #024959;
        text-align: center;
        text-transform: uppercase;
        line-height: 170px;
        margin: 0px;
        text-align: center; }
      .sidebar .menu .passwordChanger.actionComplete p,
      .sidebar .menu .feedbackForm.actionComplete p {
        display: block; }
      .sidebar .menu .passwordChanger.actionComplete input,
      .sidebar .menu .passwordChanger.actionComplete textarea, .sidebar .menu .passwordChanger.actionComplete button,
      .sidebar .menu .feedbackForm.actionComplete input,
      .sidebar .menu .feedbackForm.actionComplete textarea,
      .sidebar .menu .feedbackForm.actionComplete button {
        display: none; }
    .sidebar .menu input,
    .sidebar .menu textarea {
      position: relative;
      float: left;
      width: 100%;
      background-color: #f2efdc;
      color: #024959;
      border-top: 1px solid #024959;
      border-right: 1px solid #024959;
      border-left: 1px solid #024959;
      padding: 12px;
      font-size: 16px; }
    .sidebar .menu .oldPassword {
      border-radius: 5px 5px 0px 0px; }
    .sidebar .menu .passwordChanger input {
      text-align: center; }
    .sidebar .menu .feedbackForm textarea {
      border-radius: 5px 5px 0px 0px;
      height: 100px; }
    .sidebar .menu .changingPassword {
      height: 170px;
      padding: 10px;
      opacity: 1;
      border-top: 1px #024959 solid; }
    .sidebar .menu .feedbackOpen {
      height: 170px;
      padding: 10px;
      opacity: 1;
      border-top: 1px #024959 solid; }
  .sidebar .side {
    position: absolute;
    height: 40px;
    width: 50px;
    left: 200px;
    top: 0px;
    z-index: 100; }
    .sidebar .side span {
      height: 1px;
      width: 20px;
      left: 15px;
      position: absolute;
      background-color: #024959;
      display: none; }
      @media (min-width: 768px) {
        .sidebar .side span {
          display: block; } }
    .sidebar .side span:nth-of-type(1) {
      top: 15px; }
    .sidebar .side span:nth-of-type(2) {
      top: 20px; }
    .sidebar .side span:nth-of-type(3) {
      top: 25px; }

.grid {
  margin: auto;
  opacity: 0;
  z-index: 0;
  padding-left: 0px;
  position: absolute;
  left: 0px;
  width: 100%;
  padding: 60px 10px 0;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-transform: scale(0.5);
  -moz-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -o-transform: scale(0.5);
  transform: scale(0.5); }
  @media (min-width: 768px) {
    .grid {
      padding: 0 0 0 60px; } }
  .yesLetsGo .grid {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    display: block; }
  .grid.sidebar-is-open {
    left: 250px; }
    @media (min-width: 768px) {
      .grid.sidebar-is-open {
        left: 200px; } }
  .grid ul {
    padding: 0;
    margin: 0px auto 10px;
    position: relative;
    left: 0;
    width: 100%; }
    @media (min-width: 768px) {
      .grid ul {
        left: 50%;
        position: absolute; } }
    @media screen and (min-width: 768px) {
      .grid ul {
        width: 630px;
        margin-left: -315px; } }
    @media screen and (min-width: 900px) {
      .grid ul {
        width: 840px;
        margin-left: -420px; } }
    @media screen and (min-width: 1110px) {
      .grid ul {
        width: 1050px;
        margin-left: -525px; } }
    @media screen and (min-width: 1320px) {
      .grid ul {
        width: 1260px;
        margin-left: -630px; } }
    @media screen and (min-width: 1530px) {
      .grid ul {
        width: 1470px;
        margin-left: -735px; } }
    @media screen and (min-width: 1740px) {
      .grid ul {
        width: 1680px;
        margin-left: -840px; } }
  .grid .cell {
    list-style: none;
    margin: 0 0 10px;
    border-radius: 5px;
    overflow: hidden;
    height: 200px;
    -webkit-transition: -webkit-box-shadow 0.4s ease-in-out;
    -moz-transition: -webkit-box-shadow 0.4s ease-in-out;
    -o-transition: -webkit-box-shadow 0.4s ease-in-out;
    transition: -webkit-box-shadow 0.4s ease-in-out;
    -webkit-transition: -moz-box-shadow 0.4s ease-in-out;
    -moz-transition: -moz-box-shadow 0.4s ease-in-out;
    -o-transition: -moz-box-shadow 0.4s ease-in-out;
    transition: -moz-box-shadow 0.4s ease-in-out;
    -webkit-transition: box-shadow 0.4s ease-in-out;
    -moz-transition: box-shadow 0.4s ease-in-out;
    -o-transition: box-shadow 0.4s ease-in-out;
    transition: box-shadow 0.4s ease-in-out; }
    @media (max-width: 767px) {
      .grid .cell {
        width: 100% !important; } }
    @media (min-width: 768px) {
      .grid .cell {
        width: 200px;
        padding: 0;
        margin: 0; } }
    .grid .cell .gaze,
    .grid .cell .wristwatch,
    .grid .cell .addCell,
    .grid .cell .list {
      height: 100%;
      width: 100%;
      position: relative;
      top: 0px;
      left: 0px; }
    .grid .cell .gaze,
    .grid .cell .wristwatch,
    .grid .cell .list .grab {
      cursor: all-scroll; }
    .grid .cell.ui-resizable-resizing {
      -webkit-transition: all 0.1s ease-in-out;
      -moz-transition: all 0.1s ease-in-out;
      -o-transition: all 0.1s ease-in-out;
      transition: all 0.1s ease-in-out; }
    .grid .cell.ui-resizable-resizing, .grid .cell.ui-draggable-dragging {
      z-index: 10000 !important;
      -webkit-box-shadow: 0px 3px 8px 0px rgba(50, 50, 50, 0.6);
      -moz-box-shadow: 0px 3px 8px 0px rgba(50, 50, 50, 0.6);
      box-shadow: 0px 3px 8px 0px rgba(50, 50, 50, 0.6); }
  .grid .cellPlaceholder {
    height: 40px; }
  .grid .cell .cover {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 100%;
    left: 0px;
    background-color: rgba(2, 73, 89, 0.87);
    opacity: 0;
    z-index: 1000;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out; }

.cell .gaze {
  background-size: cover;
  background-position: center center;
  border: 4px #f2efdc solid; }
  .cell .gaze .logo {
    position: absolute;
    height: 120px;
    width: 120px;
    top: 50%;
    left: 50%;
    margin: -60px 0px 0px -60px;
    background-image: url(../img/logo.png);
    background-size: 100px 100px;
    background-position: center center;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 110px;
    background-repeat: no-repeat; }

.cell .wristwatch {
  display: table; }
  .cell .wristwatch .wx, .cell .wristwatch .date {
    position: absolute;
    font-size: 14px;
    margin: 0px; }
  .cell .wristwatch .wx {
    top: 5px;
    right: 5px; }
    .cell .wristwatch .wx .deg, .cell .wristwatch .wx .icon {
      position: relative;
      float: right; }
    .cell .wristwatch .wx .deg {
      margin: 2px 0px 0px 5px; }
      .cell .wristwatch .wx .deg:after {
        content: "\00b0"; }
    .cell .wristwatch .wx .icon:before {
      height: 100%;
      width: 100%;
      display: block;
      font-family: wxFont; }
    .cell .wristwatch .wx .w_day_200:before,
    .cell .wristwatch .wx .w_day_201:before,
    .cell .wristwatch .wx .w_day_202:before,
    .cell .wristwatch .wx .w_day_210:before,
    .cell .wristwatch .wx .w_day_211:before,
    .cell .wristwatch .wx .w_day_212:before,
    .cell .wristwatch .wx .w_day_221:before,
    .cell .wristwatch .wx .w_day_230:before,
    .cell .wristwatch .wx .w_day_231:before,
    .cell .wristwatch .wx .w_day_232:before {
      content: "\f00e"; }
    .cell .wristwatch .wx .w_day_300:before,
    .cell .wristwatch .wx .w_day_301:before,
    .cell .wristwatch .wx .w_day_302:before,
    .cell .wristwatch .wx .w_day_310:before,
    .cell .wristwatch .wx .w_day_311:before,
    .cell .wristwatch .wx .w_day_312:before,
    .cell .wristwatch .wx .w_day_321:before {
      content: "\f00b"; }
    .cell .wristwatch .wx .w_day_500:before,
    .cell .wristwatch .wx .w_day_501:before,
    .cell .wristwatch .wx .w_day_502:before,
    .cell .wristwatch .wx .w_day_503:before,
    .cell .wristwatch .wx .w_day_504:before,
    .cell .wristwatch .wx .w_day_511:before,
    .cell .wristwatch .wx .w_day_520:before,
    .cell .wristwatch .wx .w_day_521:before,
    .cell .wristwatch .wx .w_day_522:before {
      content: "\f009"; }
    .cell .wristwatch .wx .w_day_600:before,
    .cell .wristwatch .wx .w_day_601:before,
    .cell .wristwatch .wx .w_day_602:before,
    .cell .wristwatch .wx .w_day_611:before,
    .cell .wristwatch .wx .w_day_621:before {
      content: "\f00a"; }
    .cell .wristwatch .wx .w_day_701:before,
    .cell .wristwatch .wx .w_day_711:before,
    .cell .wristwatch .wx .w_day_721:before,
    .cell .wristwatch .wx .w_day_731:before,
    .cell .wristwatch .wx .w_day_741:before {
      content: "\f003"; }
    .cell .wristwatch .wx .w_day_800:before {
      content: "\f00d"; }
    .cell .wristwatch .wx .w_day_801:before {
      content: "\f002"; }
    .cell .wristwatch .wx .w_day_802:before {
      content: "\f002"; }
    .cell .wristwatch .wx .w_day_803:before {
      content: "\f002"; }
    .cell .wristwatch .wx .w_day_804:before {
      content: "\f013"; }
    .cell .wristwatch .wx .w_day_900:before {
      content: "\f056"; }
    .cell .wristwatch .wx .w_day_901:before {
      content: "\f050"; }
    .cell .wristwatch .wx .w_day_902:before {
      content: "\f050"; }
    .cell .wristwatch .wx .w_day_903:before {
      content: "\f053"; }
    .cell .wristwatch .wx .w_day_904:before {
      content: "\f055"; }
    .cell .wristwatch .wx .w_day_905:before {
      content: "\f021"; }
    .cell .wristwatch .wx .w_day_906:before {
      content: "\f01d"; }
    .cell .wristwatch .wx .w_night_200:before,
    .cell .wristwatch .wx .w_night_201:before,
    .cell .wristwatch .wx .w_night_202:before,
    .cell .wristwatch .wx .w_night_210:before,
    .cell .wristwatch .wx .w_night_211:before,
    .cell .wristwatch .wx .w_night_212:before,
    .cell .wristwatch .wx .w_night_221:before,
    .cell .wristwatch .wx .w_night_230:before,
    .cell .wristwatch .wx .w_night_231:before,
    .cell .wristwatch .wx .w_night_232:before {
      content: "\f02c"; }
    .cell .wristwatch .wx .w_night_300:before,
    .cell .wristwatch .wx .w_night_301:before,
    .cell .wristwatch .wx .w_night_302:before,
    .cell .wristwatch .wx .w_night_310:before,
    .cell .wristwatch .wx .w_night_311:before,
    .cell .wristwatch .wx .w_night_312:before,
    .cell .wristwatch .wx .w_night_321:before {
      content: "\f039"; }
    .cell .wristwatch .wx .w_night_500:before,
    .cell .wristwatch .wx .w_night_501:before,
    .cell .wristwatch .wx .w_night_502:before,
    .cell .wristwatch .wx .w_night_503:before,
    .cell .wristwatch .wx .w_night_504:before,
    .cell .wristwatch .wx .w_night_511:before,
    .cell .wristwatch .wx .w_night_520:before,
    .cell .wristwatch .wx .w_night_521:before,
    .cell .wristwatch .wx .w_night_522:before {
      content: "\f037"; }
    .cell .wristwatch .wx .w_night_600:before,
    .cell .wristwatch .wx .w_night_601:before,
    .cell .wristwatch .wx .w_night_602:before,
    .cell .wristwatch .wx .w_night_611:before,
    .cell .wristwatch .wx .w_night_621:before {
      content: "\f038"; }
    .cell .wristwatch .wx .w_night_701:before,
    .cell .wristwatch .wx .w_night_711:before,
    .cell .wristwatch .wx .w_night_721:before,
    .cell .wristwatch .wx .w_night_731:before,
    .cell .wristwatch .wx .w_night_741:before {
      content: "\f04a"; }
    .cell .wristwatch .wx .w_night_800:before {
      content: "\f02e"; }
    .cell .wristwatch .wx .w_night_801:before {
      content: "\f031"; }
    .cell .wristwatch .wx .w_night_802:before {
      content: "\f031"; }
    .cell .wristwatch .wx .w_night_803:before {
      content: "\f031"; }
    .cell .wristwatch .wx .w_night_804:before {
      content: "\f013"; }
    .cell .wristwatch .wx .w_night_900:before {
      content: "\f056"; }
    .cell .wristwatch .wx .w_night_901:before {
      content: "\f050"; }
    .cell .wristwatch .wx .w_night_902:before {
      content: "\f050"; }
    .cell .wristwatch .wx .w_night_903:before {
      content: "\f053"; }
    .cell .wristwatch .wx .w_night_904:before {
      content: "\f055"; }
    .cell .wristwatch .wx .w_night_905:before {
      content: "\f021"; }
    .cell .wristwatch .wx .w_night_906:before {
      content: "\f01d"; }
  .cell .wristwatch .time {
    height: 58px;
    width: 100%;
    position: absolute;
    top: 50%;
    margin-top: -28px;
    text-align: center;
    font-family: u39;
    font-size: 75px;
    font-weight: normal;
    line-height: 70px; }
  .cell .wristwatch .date {
    left: 0px;
    width: 100%;
    bottom: 5px;
    text-align: center; }
    .cell .wristwatch .date .today {
      font-family: u67; }

.cell .addCell {
  overflow: hidden;
  cursor: pointer;
  position: absolute;
  height: 100%;
  border-radius: 1000px;
  top: 0; }
  .cell .addCell .add {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0px; }
    .cell .addCell .add span {
      position: absolute;
      background-color: #024959;
      top: 50%;
      left: 50%;
      -webkit-transition: all 0.2s ease-in-out;
      -moz-transition: all 0.2s ease-in-out;
      -o-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out; }
    .cell .addCell .add .vert {
      height: 25%;
      width: 1px;
      margin: -12.5% 0px 0px -1px; }
    .cell .addCell .add .horiz {
      width: 25%;
      height: 1px;
      margin: -1px 0px 0px -12.5%; }
  .cell .addCell .undo {
    position: absolute;
    height: 150%;
    width: 150%;
    bottom: -95%;
    right: -95%;
    border: 1px #555555 solid;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    overflow: hidden;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out; }
    .cell .addCell .undo .whoops {
      position: absolute;
      top: 40%;
      left: 0%;
      height: 50px;
      width: 50px;
      overflow: hidden;
      background-image: url(../img/spritesheet.png);
      background-size: 150px auto;
      background-position: -100px 0px;
      -webkit-transform: rotate(-45deg);
      -moz-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      -o-transform: rotate(-45deg);
      transform: rotate(-45deg);
      -webkit-transition: all 0.2s ease-in-out;
      -moz-transition: all 0.2s ease-in-out;
      -o-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out; }
  .cell .addCell.pushPull .add span {
    top: 32%;
    left: 32%; }
  .cell .addCell.pushPull .undo {
    bottom: -78%;
    right: -78%; }
    .cell .addCell.pushPull .undo .whoops {
      left: 8%; }

@media (max-width: 767px) {
  .dragging_active .parent_list {
    height: auto !important; }
    .dragging_active .parent_list .cellHead {
      border-bottom: 0 !important; }
    .dragging_active .parent_list .cellEdit,
    .dragging_active .parent_list .catOpener {
      display: none; } }

.cell .list {
  -webkit-transition: background-color 0.2s ease-in-out;
  -moz-transition: background-color 0.2s ease-in-out;
  -o-transition: background-color 0.2s ease-in-out;
  transition: background-color 0.2s ease-in-out;
  cursor: text; }
  .cell .list .textarea-container {
    position: relative;
    width: 100%;
    padding-bottom: 5px; }
    .cell .list .textarea-container textarea, .cell .list .textarea-container .sizer {
      width: 100%; }
    .cell .list .textarea-container textarea {
      position: absolute;
      top: 0px;
      left: 0px;
      height: 100%;
      resize: none;
      white-space: normal;
      -webkit-transition: padding-left 0.1s ease-in-out, background-color 0.2s ease-in-out;
      -moz-transition: padding-left 0.1s ease-in-out, background-color 0.2s ease-in-out;
      -o-transition: padding-left 0.1s ease-in-out, background-color 0.2s ease-in-out;
      transition: padding-left 0.1s ease-in-out, background-color 0.2s ease-in-out;
      color: #f2efdc;
      z-index: 1; }
    .cell .list .textarea-container .sizer {
      opacity: 0;
      z-index: -1;
      white-space: pre-wrap;
      word-wrap: break-word;
      overflow-wrap: break-word; }
  .cell .list .cellHead {
    position: relative;
    width: 100%;
    top: 0px;
    left: 0px;
    z-index: 10;
    border-bottom: 1px #f2efdc solid; }
    .cell .list .cellHead textarea, .cell .list .cellHead .sizer {
      min-height: 33px;
      padding: 10px 10px 4px 50px;
      font-family: u67; }
      @media (min-width: 768px) {
        .cell .list .cellHead textarea, .cell .list .cellHead .sizer {
          padding: 10px 10px 4px 25px; } }
    .cell .list .cellHead .title {
      border: 0px;
      height: 100%;
      width: 100%;
      position: absolute;
      top: 0px;
      left: 0px;
      font-size: 16px;
      color: #f2efdc; }
      .cell .list .cellHead .title:focus {
        outline: none; }
  .cell .list .cellEdit {
    position: relative;
    float: left;
    width: 100%;
    top: 0px;
    left: 0px;
    padding: 10px 10px 10px 40px;
    border-radius: 0px 0px 5px 0px;
    color: #f2efdc;
    text-align: left; }
    @media (min-width: 768px) {
      .cell .list .cellEdit {
        padding: 10px 10px 10px 15px; } }
    .cell .list .cellEdit textarea, .cell .list .cellEdit .sizer, .cell .list .cellEdit .linker {
      min-height: 20px;
      line-height: 20px;
      font-size: 14px;
      font-family: u47;
      padding: 0px 0px 0px 20px; }
      @media (min-width: 768px) {
        .cell .list .cellEdit textarea, .cell .list .cellEdit .sizer, .cell .list .cellEdit .linker {
          min-height: 17px;
          line-height: 17px; } }
    .cell .list .cellEdit .indent1 .grabber {
      left: 10px; }
    .cell .list .cellEdit .indent1 textarea, .cell .list .cellEdit .indent1 .linker {
      padding: 0px 0px 0px 30px; }
    .cell .list .cellEdit .indent1 .sizer {
      padding-left: 30px; }
    .cell .list .cellEdit .indent1.grabbed textarea, .cell .list .cellEdit .indent1.grabbed .linker {
      padding: 0px 0px 0px 35px; }
    .cell .list .cellEdit .indent2 .grabber {
      left: 20px; }
    .cell .list .cellEdit .indent2 textarea, .cell .list .cellEdit .indent2 .linker {
      padding: 0px 0px 0px 40px; }
    .cell .list .cellEdit .indent2 .sizer {
      padding-left: 40px; }
    .cell .list .cellEdit .indent2.grabbed textarea, .cell .list .cellEdit .indent2.grabbed .linker {
      padding: 0px 0px 0px 45px; }
    .cell .list .cellEdit .sizer {
      padding-left: 20px; }
    .cell .list .cellEdit a textarea {
      cursor: pointer;
      text-decoration: underline;
      opacity: 0; }
      .cell .list .cellEdit a textarea:focus {
        opacity: 1; }
        .cell .list .cellEdit a textarea:focus:focus + .sizer {
          opacity: 0; }
    .cell .list .cellEdit a .sizer {
      opacity: 1; }
      .cell .list .cellEdit a .sizer .delicate {
        border-bottom: 1px #f2efdc dotted; }
    .cell .list .cellEdit .grabber {
      position: absolute;
      width: 30px;
      height: 25px;
      cursor: row-resize;
      z-index: 2;
      left: 0px;
      -webkit-transition: left 0.1s ease-in-out;
      -moz-transition: left 0.1s ease-in-out;
      -o-transition: left 0.1s ease-in-out;
      transition: left 0.1s ease-in-out; }
      .cell .list .cellEdit .grabber span {
        background-color: white;
        position: absolute;
        height: 20px;
        width: 1px;
        top: -1px;
        left: 10px;
        border-radius: 0px;
        -webkit-transition: all 0.1s ease-in-out;
        -moz-transition: all 0.1s ease-in-out;
        -o-transition: all 0.1s ease-in-out;
        transition: all 0.1s ease-in-out; }
        @media (min-width: 768px) {
          .cell .list .cellEdit .grabber span {
            height: 15px;
            width: 1px;
            top: 0px;
            left: 10px;
            border-radius: 0px; } }
    .cell .list .cellEdit .grabbed textarea, .cell .list .cellEdit .grabbed .linker {
      padding: 0px 0px 0px 25px; }
    .cell .list .cellEdit .grabbed .grabber span {
      width: 10px;
      height: 10px;
      left: 6px;
      top: 3px;
      border-radius: 50px; }
    .cell .list .cellEdit .grabbed .sizer {
      padding-left: 25px; }
    .cell .list .cellEdit .linked textarea, .cell .list .cellEdit .linked .sizer {
      display: none; }
    .cell .list .cellEdit .linked .linker {
      display: block; }
  .cell .list .grab {
    position: absolute;
    width: 40px;
    height: 100%;
    left: 0px;
    top: 0px;
    background-color: #f2efdc;
    z-index: 10;
    overflow: hidden; }
    @media (min-width: 768px) {
      .cell .list .grab {
        width: 15px; } }
    .cell .list .grab .catOpener,
    .cell .list .grab .catSelect {
      position: absolute;
      cursor: pointer; }
    .cell .list .grab .catOpener {
      height: 40px;
      width: 39px;
      bottom: 0px;
      left: 0px;
      z-index: 101;
      background-color: #f2efdc;
      border-top: 1px #f2efdc solid;
      -webkit-transition: background-color 0.2s ease-in-out;
      -moz-transition: background-color 0.2s ease-in-out;
      -o-transition: background-color 0.2s ease-in-out;
      transition: background-color 0.2s ease-in-out; }
      @media (min-width: 768px) {
        .cell .list .grab .catOpener {
          height: 20px;
          width: 14px; } }
      .cell .list .grab .catOpener > span {
        position: absolute;
        height: 7px;
        width: 7px;
        top: 16px;
        left: 16px;
        border-radius: 10px;
        display: block;
        overflow: hidden; }
        @media (min-width: 768px) {
          .cell .list .grab .catOpener > span {
            top: 6px;
            left: 4px; } }
        .cell .list .grab .catOpener > span span {
          position: relative;
          float: left;
          height: 3px;
          width: 9px;
          -webkit-transition: background-color 0.2s ease-in-out;
          -moz-transition: background-color 0.2s ease-in-out;
          -o-transition: background-color 0.2s ease-in-out;
          transition: background-color 0.2s ease-in-out; }
    .cell .list .grab .catSelect {
      top: 0px;
      z-index: 100;
      height: 100%;
      left: -39px;
      width: 39px;
      padding-bottom: 39px;
      -webkit-transition: left 0.2s ease-in-out;
      -moz-transition: left 0.2s ease-in-out;
      -o-transition: left 0.2s ease-in-out;
      transition: left 0.2s ease-in-out; }
      @media (min-width: 768px) {
        .cell .list .grab .catSelect {
          left: -14px;
          width: 14px;
          padding-bottom: 20px; } }
      .cell .list .grab .catSelect span {
        height: 33.3333%;
        width: 100%;
        display: block;
        position: relative;
        float: left; }
      .cell .list .grab .catSelect .cat01 {
        background-color: #2f8e90; }
      .cell .list .grab .catSelect .cat02 {
        background-color: #e7614a; }
      .cell .list .grab .catSelect .cat03 {
        background-color: #555555; }
    .cell .list .grab.catSelecting .catOpener span {
      background-color: #f2efdc; }
    .cell .list .grab.catSelecting .catSelect {
      left: 0px; }

.color00 {
  background-color: #f2efdc;
  color: #444; }

.color01 {
  background-color: #2f8e90; }
  .color01 textarea {
    background-color: #2f8e90; }
  .color01 .catOpener span {
    background-color: #2f8e90; }
  .color01 .catSelecting .catOpener {
    background-color: #2f8e90 !important; }

.color02 {
  background-color: #e7614a; }
  .color02 textarea {
    background-color: #e7614a; }
  .color02 .catOpener span {
    background-color: #e7614a; }
  .color02 .catSelecting .catOpener {
    background-color: #e7614a !important; }

.color03 {
  background-color: #555555; }
  .color03 textarea {
    background-color: #555555; }
  .color03 .catOpener span {
    background-color: #555555; }
  .color03 .catSelecting .catOpener {
    background-color: #555555 !important; }

.weAreUpdating {
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0px;
  left: 0px;
  background-color: #024959;
  z-index: 1000;
  opacity: 1;
  display: none; }
  .weAreUpdating.letsUpdate {
    display: block; }
  .weAreUpdating .plshold {
    height: 300px;
    width: 300px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -150px 0 0 -150px; }