/* _base */
.dev-errors {
  font-size: 1em;
  text-align: left;
  z-index: 250;
  color: black;
  position: fixed;
  top: 0px;
  left: 0px;
  padding: 10px;
  width: 100%;
  background-color: #ff0;
}
.dev-errors .error-box {
  border: 1px SOLID black;
  background-color: #ffeeee;
  padding: 10px;
}
/*  SIMPLE - START */
.rel {
  position: relative;
}
.abs {
  position: absolute;
}
.fs12 {
  font-size: 0.75em;
}
.fs20 {
  font-size: 1.25em;
}
.fs24 {
  font-size: 1.5em;
}
.em1 {
  height: 1em;
}
.emh {
  height: 0.5em;
}
.ellipsis {
  text-overflow: ellipsis;
  overflow: hidden;
}
.nobr {
  white-space: nowrap;
}
.d-none {
  display: none;
}
.d-fadein {
  opacity: 0;
  transition: 0.5s opacity;
}
.d-fadein.on {
  opacity: 1;
}
.t-center {
  text-align: center;
}
.t-right {
  text-align: right;
}
.t-left {
  text-align: left;
}
.n {
  font-weight: 400;
}
.b {
  font-weight: 700;
}
.pointer {
  cursor: pointer;
}
a,
a:hover,
a:visited,
a:active {
  cursor: pointer;
  text-decoration: none;
}
a,
a:visited,
a:active {
  color: #0099cc;
}
a:hover {
  color: #17c6ff;
}
.smaller {
  font-size: 0.875em;
}
.p100 {
  width: 100%;
}
.clear,
.row {
  clear: both;
}
.f-left {
  float: left;
}
.f-right {
  float: right;
}
.page-centered {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.sc1,
.sc2,
.sc3,
.sc4,
.sc5,
.sc6,
.sc7,
.sc8,
.sc9,
.sc10,
.sc11,
.sc12 {
  box-sizing: border-box;
  float: left;
  padding: 0em 0.5em;
}
.sc1:empty:after,
.sc2:empty:after,
.sc3:empty:after,
.sc4:empty:after,
.sc5:empty:after,
.sc6:empty:after,
.sc7:empty:after,
.sc8:empty:after,
.sc9:empty:after,
.sc10:empty:after,
.sc11:empty:after,
.sc12:empty:after {
  content: "\00a0";
}
.sc1 {
  width: 8.33333333%;
}
.sc2 {
  width: 16.66666667%;
}
.sc3 {
  width: 25%;
}
.sc4 {
  width: 33.33333333%;
}
.sc5 {
  width: 41.66666667%;
}
.sc6 {
  width: 50%;
}
.sc7 {
  width: 58.33333333%;
}
.sc8 {
  width: 66.66666667%;
}
.sc9 {
  width: 75%;
}
.sc10 {
  width: 83.33333333%;
}
.sc11 {
  width: 91.66666667%;
}
.sc12 {
  width: 100%;
}
.c1,
.c2,
.c3,
.c4,
.c5,
.c6,
.c7,
.c8,
.c9,
.c10,
.c11,
.c12 {
  width: 100%;
  box-sizing: border-box;
  padding: 0.5em 0em;
}
@media only screen and (min-width: 500px) {
  .c1,
  .c2,
  .c3,
  .c4,
  .c5,
  .c6,
  .c7,
  .c8,
  .c9,
  .c10,
  .c11,
  .c12 {
    float: left;
    padding: 0em 0.5em;
  }
  .c1 {
    width: 8.33333333%;
  }
  .c2 {
    width: 16.66666667%;
  }
  .c3 {
    width: 25%;
  }
  .c4 {
    width: 33.33333333%;
  }
  .c5 {
    width: 41.66666667%;
  }
  .c6 {
    width: 50%;
  }
  .c7 {
    width: 58.33333333%;
  }
  .c8 {
    width: 66.66666667%;
  }
  .c9 {
    width: 75%;
  }
  .c10 {
    width: 83.33333333%;
  }
  .c11 {
    width: 91.66666667%;
  }
  .c12 {
    width: 100%;
  }
  .c-right {
    float: right;
  }
}
/* SIMPLE END */
html,
body {
  padding: 0;
  margin: 0;
  height: 100%;
  font-family: 'Open Sans', sans-serif;
  font-size: 1rem;
  background-color: white;
  text-align: center;
}
table {
  width: 100%;
  border-collapse: collapse;
  border: 0;
  padding: 0;
  margin: 0;
}
table tr,
table td {
  border: 0;
  padding: 0;
}
#outer-wrapper {
  z-index: 0;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
}
#wrapper,
.wrapper {
  text-align: left;
  position: relative;
  width: 100%;
  font-size: 3.2vw;
}
#footer-text {
  padding: 1.5em 0em 1.5em 0em;
  text-align: center;
  font-size: 1em;
  color: #888;
}
#main {
  clear: both;
  position: relative;
  min-height: calc(93.5vh);
}
body.b-debug #main {
  background-color: rgba(255, 0, 0, 0.5);
}
.slide-container {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 50%;
}
.vid-container {
  width: 100%;
  height: 0;
  padding-bottom: 50%;
  position: absolute;
  opacity: 1;
  transition: left 0.5s linear, opacity 1s;
  left: 0;
  top: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-color: transparent;
  background-size: cover;
  z-index: 1;
}
.vid-container.off {
  opacity: 0;
}
.vid-container.left {
  left: -100%;
}
.vid-container.right {
  left: 100%;
}
.vid-container.pri {
  z-index: 2;
}
.vid-container video {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.5s ease-in;
}
.vid-container video.on {
  opacity: 1;
}
a.button {
  border-radius: 2em;
  -webkit-border-radius: 2em;
  -moz-border-radius: 2em;
  padding: 0.5em 1.5em;
  margin: 0em 0.5em;
  display: inline-block;
  color: #ffffff;
  background-color: #0099cc;
  font-weight: 600;
}
a.button:hover {
  color: #ffffff;
  background-color: #17c6ff;
}
a.button.sq {
  border-radius: 0em;
  -webkit-border-radius: 0em;
  -moz-border-radius: 0em;
}
.wide {
  clear: both;
}
body.b-debug .wide {
  background-color: #0000ff;
}
.normal {
  clear: both;
  margin: 0 auto;
  padding: 0em 1em;
  max-width: 31.25em;
}
body.b-debug .normal {
  background-color: #00ff00;
}
.medium {
  clear: both;
  margin: 0 auto;
  padding: 0em 1em;
  max-width: 50em;
}
body.b-debug .medium {
  background-color: #00ff00;
}
.std {
  clear: both;
  margin: 0 auto;
  padding: 0em 1em;
  max-width: 38.75em;
}
body.b-debug .std {
  background-color: #00ff88;
}
.highlight {
  padding: 1em 2em 0.25em 2em;
  border-radius: 1em;
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  background-color: white;
}
.highlight:hover {
  background-color: #f0f0f0;
}
.button-box {
  display: inline-block;
  text-align: center;
  margin-top: 2em;
  margin-bottom: 2em;
  min-width: 18.75em;
}
.button-box a.button {
  margin: 1em 0em;
  display: block;
}
.bk-hands {
  background-image: url('../tests/img/index/Top-Image-Android-1.jpg');
}
.text-area h1 {
  font-size: 2em;
  padding: 0em 0em 0em 0em;
  margin: 0em 0em 0em 0em;
  font-weight: normal;
}
.text-area p {
  font-weight: normal;
  font-size: 1em;
  line-height: 1.5em;
}
[data-action] {
  cursor: pointer;
}
#ma-slogan {
  float: left;
  background: url("../assets/index/MA-Slogan-323px.png") no-repeat;
  background-size: cover;
  width: 13.6875em;
  height: 5.625em;
}
#ma-logo {
  float: right;
  background: url("../assets/index/SereneScreen-Logo-144px.png") no-repeat;
  background-size: cover;
  width: 9em;
  height: 5.625em;
}
.search-box {
  position: relative;
  padding: 0em;
}
.search-box input[type="text"] {
  box-sizing: border-box;
  width: 100%;
  font-size: 1em;
  padding: 0.5em 2em 0.5em 1em;
  position: relative;
}
.search-box input[type="text"]::placeholder {
  color: #ccc;
}
.search-box .icon {
  position: absolute;
  right: 0.5em;
  top: 0.5em;
  width: 1.625em;
  height: 1.625em;
  background: no-repeat;
  background-size: contain;
}
.search-box input:placeholder-shown + .icon {
  background-image: url('../assets/icons/si-glyph-magnifier.svg');
}
.search-box input:not(:placeholder-shown) + .icon {
  background-image: url('../assets/icons/si-glyph-button-error.svg');
}
.search-box input:not(:placeholder-shown) + .icon:hover {
  background-image: url('../assets/icons/si-glyph-circle-error.svg');
}
ul.sub-line {
  list-style: none;
  padding: 0.75em 0em;
  margin: 0;
}
ul.sub-line li {
  display: inline;
  display: relative;
}
ul.sub-line li label {
  cursor: pointer;
  padding: 0em 0.75em;
}
ul.sub-line li input {
  visibility: hidden;
  position: absolute;
}
ul.sub-line li.label {
  color: #aaa;
  padding-right: 2em;
}
ul.sub-line li input:hover + label {
  color: #17c6ff;
}
ul.sub-line li input:checked + label {
  color: #0099cc;
}
ul.sub-line li input:checked:hover + label {
  color: #0099cc;
}
ul.sub-line li:first-of-type label {
  padding: 0em 0.75em 0em 0em;
}
ul.sub-line li:not(.label) + li:before {
  content: "|";
  color: #999999;
}
/* Tables */
table.top td {
  vertical-align: top;
}
a.buy-now {
  position: relative;
  display: inline-block;
  width: 8.925em;
  height: 2.625em;
  background: url('../assets/index/BuyNow-Button.png') no-repeat;
  background-size: cover;
}
a.buy-now:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  width: 8.925em;
  height: 2.625em;
  background: url('../assets/index/BuyNow-Hover.png') no-repeat;
  background-size: cover;
  transition: opacity 0.25s;
}
a.buy-now:hover:after {
  opacity: 1;
}
a.ios-button,
a.android-button {
  width: 8.925em;
  height: 2.625em;
  background: no-repeat;
  background-size: contain;
  display: inline-block;
}
a.ios-button:hover,
a.android-button:hover {
  opacity: 0.6;
}
a.ios-button {
  background-image: url('../assets/index/app-store.png');
}
a.android-button {
  background-image: url('../assets/index/google-play.png');
}
body:not(.os-windows) .show-windows {
  display: none;
}
body:not(.os-ios) .show-ios {
  display: none;
}
body:not(.os-android) .show-android {
  display: none;
}
body:not(.os-mac) .show-mac {
  display: none;
}
body:not(.os-linux) .show-linux {
  display: none;
}
.sform input[type="text"],
.sform input[type="email"],
.sform select {
  margin: 0.1875em;
  width: 100%;
  font-size: 1em;
  padding: 0.1875em 0.5em;
  box-sizing: border-box;
}
.sform label {
  text-align: right;
  width: 100%;
  display: block;
  padding: 0.1875em 0em;
  font-size: 1em;
  font-weight: 600;
}
.sform input[type="checkbox"] {
  display: inline-block;
  position: relative;
  top: 0.0625em;
}
.sform input[type="checkbox"] + label {
  display: inline-block;
  text-align: left;
  width: auto;
  padding-left: 0.3125em;
}
.sform button[type="submit"] {
  position: relative;
  border: 0;
  display: inline-block;
  width: 7.65em;
  height: 2.25em;
  background: url('../assets/Button.png') no-repeat;
  background-size: cover;
  color: white;
  font-size: 1.25em;
}
.sform button[type="submit"]:hover {
  background: url('../assets/Button-Hover.png') no-repeat;
  background-size: cover;
}
.sform .errbox {
  border: 1px SOLID #ffa217;
  max-width: 25em;
  display: inline-block;
  padding: 1em;
  color: #ffa217;
  font-weight: 600;
  width: 100%;
  margin: 1em 0em;
}
.sform .errbox:empty {
  display: none;
}
.sform .button,
.sform .ebutton {
  cursor: pointer;
  color: white;
  padding: 0.5em 1.25em;
  background: url('../assets/Button.png') no-repeat center;
  background-size: contain;
}
.sform .button:hover,
.sform .ebutton:hover {
  background: url('../assets/Button-Hover.png') no-repeat center;
  background-size: contain;
}
.spinner {
  margin: 100px auto 0;
  width: 70px;
  text-align: center;
}
.spinner > div {
  width: 18px;
  height: 18px;
  background-color: #0099cc;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}
@keyframes sk-bouncedelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.top-bar {
  clear: both;
  margin-top: 0em;
  position: fixed;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 50;
  background-color: white;
  text-align: center;
  color: white;
}
.top-bar .medium {
  margin-top: 1.375em;
  background-color: #0099cc;
}
.top-bar a,
.top-bar a:visited,
.top-bar a:link,
.top-bar .on {
  font-size: 1.5em;
  padding: 0.41666667em 1em 0.41666667em 1em;
  color: white;
}
.top-bar .on {
  display: inline-block;
  position: relative;
  z-index: 5;
  top: -0.41666667em;
  background-color: #5ed7ff;
}
.top-bar-correct {
  height: 3.3125em;
}
@media only screen and (min-width: 500px) {
  #wrapper,
  .wrapper {
    font-size: 1rem;
    max-width: 62.5em;
    width: 100%;
    margin: 0 auto;
  }
}