::selection {
  background: #FF004D;
  color: white;
  text-shadow: none; }

a:link {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.2); }

body, input {
  font-size: 20px;
  font-family: system, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Lucida Grande", "Roboto", "Arial", sans-serif;
  color: white;
  -webkit-font-smoothing: antialiased; }

#homepage {
  position: relative; }
  #homepage #container {
    display: flex;
    flex-direction: column; }
  #homepage .platform-wrap {
    padding: 3em 1em;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden; }
  #homepage video {
    max-width: 90%;
    max-height: 80vh;
    min-height: 20em; }
  #homepage #mobile-video {
    max-width: 25%; }
  @media screen and (max-width: 414px) {
    #homepage #mobile-video {
      max-width: 75%; } }
  @media screen and (max-width: 800px) {
    #homepage #mobile-video {
      max-width: 50%; } }
  #homepage #mac-video {
    min-width: 32em; }
  #homepage .buttons {
    font-size: .8em;
    margin: 1em 0 2em; }
  #homepage #link-mail-container {
    flex-shrink: 0;
    margin: 1em 0 2em; }
  #homepage #mac-download-button-wrapper {
    flex-direction: column;
    align-items: center;
    font-size: .85em; }
    #homepage #mac-download-button-wrapper #download-mac-button {
      background-color: #FF004D;
      position: relative; }
    #homepage #mac-download-button-wrapper #also-span {
      font-size: .9em;
      margin-top: .75em; }
    #homepage #mac-download-button-wrapper #also-span, #homepage #mac-download-button-wrapper #also-span a {
      font-weight: 500;
      color: #999999; }
  #homepage button, #homepage input {
    font-size: .8em; }
  #homepage [type="email"] {
    background-color: #F1F1F1 !important; }
  #homepage .title {
    font-size: 1.6em;
    font-weight: 900;
    position: relative;
    text-align: center;
    color: rgba(0, 0, 0, 0.8); }
  #homepage #mac-title:before {
    content: "NEW";
    font-size: .5em;
    font-weight: 900;
    color: white;
    padding: .2em .4em;
    background-color: #FF004D;
    position: absolute;
    top: -1.2em;
    left: -2.5em;
    border-radius: .25em;
    transform: rotate(-15deg); }
  @media screen and (max-width: 560px) {
    #homepage #mac-title:before {
      top: -2.5em;
      left: calc(50% - 1.5em);
      transform: rotate(0deg); } }
  #homepage hr {
    margin: 0;
    opacity: .4; }
  #homepage #another-device-link {
    text-align: center;
    font-weight: 500;
    font-size: .75em;
    padding: 4em 1em;
    color: #999999;
    text-decoration: none;
    display: block;
    cursor: pointer; }
  #homepage #another-device-popup {
    display: none; }
    #homepage #another-device-popup #article-wrapper {
      padding: 4em 2em; }
    #homepage #another-device-popup h2 {
      padding-top: 0; }

header {
  background-color: white;
  border-bottom: 1px solid #CCCCCC;
  padding: 1.5em;
  align-items: center;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; }
  header #logo-conteiner {
    transition: .2s;
    cursor: pointer;
    display: inline-block; }
  header #logo-conteiner:hover {
    transform: scale(1.04); }
  header #logo-conteiner:active {
    transform: scale(0.9); }
  header .buttons {
    font-size: .7em; }
  header #logo-conteiner {
    width: 10em;
    height: 1.6em; }

footer {
  z-index: 1;
  position: relative;
  background-color: white;
  padding: 2.9em;
  font-size: .7em;
  border-top: 1px solid #CCCCCC; }
  footer #footer-top-blocks {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; }
  footer #footer-left-content {
    display: flex;
    flex-wrap: wrap; }
    footer #footer-left-content a, footer #footer-left-content svg {
      color: #999999;
      fill: #999999; }
  footer * {
    font-weight: 500;
    text-decoration: none; }
  footer h1 {
    text-transform: uppercase;
    font-weight: 900;
    color: #666666;
    padding-bottom: .7em; }
  footer li {
    padding-bottom: .35em; }
    footer li svg {
      height: 1em;
      width: 1.3em;
      vertical-align: middle; }
  footer #copyright, footer #copyright a {
    color: #CCCCCC; }
  footer .footer-section {
    width: 11em;
    margin-right: 1.4em;
    margin-bottom: 1.6em; }
  footer .footer-section:not(:last-child) {
    border-right: 1px solid #CCCCCC; }

.buttons {
  display: flex;
  flex-direction: row;
  flex-shrink: 0; }

.button {
  height: 2.7em;
  display: flex;
  align-items: center;
  padding: 0 1em;
  background-color: rgba(0, 0, 0, 0.8);
  border-radius: .4em;
  color: white;
  text-decoration: none;
  margin-right: .7em;
  transition: .3s; }
  .button .button-logo {
    width: 1.3em;
    fill: white; }
  .button .button-small-label, .button .button-big-label {
    display: block; }
  .button .button-label {
    padding-left: .5em;
    text-align: left; }
    .button .button-label .button-small-label {
      font-size: .6em;
      font-weight: 500; }
    .button .button-label .button-big-label {
      font-size: 1em;
      font-weight: 900; }

.button:last-child {
  margin-right: 0; }

.button:hover {
  background-color: rgba(0, 0, 0, 0.4); }

.confetti {
  position: absolute;
  top: -20px; }

@keyframes confetti {
  to {
    top: 100%;
    transform: rotate(360deg); } }
@keyframes confetti2 {
  to {
    top: 100%;
    transform: rotate(-360deg); } }
#article-wrapper {
  padding: 2em 1em 6em;
  color: #999999; }
  #article-wrapper article {
    max-width: 40em;
    margin: 0 auto; }
    #article-wrapper article h1, #article-wrapper article h2, #article-wrapper article h3, #article-wrapper article h4 {
      padding: 1em 0 0;
      color: rgba(0, 0, 0, 0.6); }
    #article-wrapper article h1 {
      padding-top: 0;
      font-size: 3em;
      font-weight: 800;
      color: rgba(0, 0, 0, 0.8); }
    #article-wrapper article h2 {
      font-size: 2em;
      font-weight: 800;
      color: rgba(0, 0, 0, 0.8); }
    #article-wrapper article h3 {
      font-size: 1em;
      font-weight: 700; }
    #article-wrapper article h4 {
      font-size: .7em;
      font-weight: 700;
      text-transform: uppercase; }
    #article-wrapper article p, #article-wrapper article form label, #article-wrapper article input, #article-wrapper article li {
      font-weight: 500;
      line-height: 1.4em; }
    #article-wrapper article p a, #article-wrapper article li a {
      color: #FF004D;
      text-decoration: none;
      transition: .2s;
      word-break: break-word; }
    #article-wrapper article p a:hover {
      color: white;
      background-color: #FF004D; }
    #article-wrapper article p, #article-wrapper article ul {
      padding-bottom: 1em; }
    #article-wrapper article ul {
      list-style: disc; }
    #article-wrapper article ol ul {
      padding-left: 1.5em; }
    #article-wrapper article .mail-link {
      padding: .5em 1em;
      background-color: white;
      border-radius: .25em;
      font-weight: 700;
      display: inline-block;
      margin-top: .25em;
      box-shadow: 0 0.2em 0.5em rgba(0, 0, 0, 0.1);
      transform: .2s; }
    #article-wrapper article .mail-link:hover {
      background-color: white;
      transform: scale(1.05);
      box-shadow: 0 0.2em 0.8em rgba(0, 0, 0, 0.2); }
    #article-wrapper article #press-links a {
      text-decoration: none;
      color: #666666;
      padding: 3em 0;
      display: block;
      border-bottom: 1px solid #CCCCCC; }
      #article-wrapper article #press-links a span {
        color: #999999;
        display: block; }
      #article-wrapper article #press-links a h2 {
        padding: 0; }
      #article-wrapper article #press-links a svg {
        margin-top: 1em;
        height: 1.2em; }
    #article-wrapper article #press-links a:last-child {
      border-bottom: none; }
  #article-wrapper #job ul {
    background-color: #F7F7F7;
    border-radius: .2em;
    list-style-position: outside;
    padding: 1em 2em; }
    #article-wrapper #job ul li {
      padding: 0 0 .3em; }

#link-bar {
  text-align: center;
  border-top: 2px solid white;
  padding: .5em 0; }
  #link-bar ul {
    margin: .5em 0;
    text-align: center; }
    #link-bar ul li {
      display: inline-block; }
      #link-bar ul li a {
        padding: 0.5em 1em;
        margin: 0.25em 0.5em;
        background: white;
        border-radius: .3em;
        border: 2px solid rgba(0, 0, 0, 0.03);
        text-decoration: none;
        color: #808080;
        font-weight: 700;
        transition: .2s;
        display: inline-block; }
  #link-bar ul li a:hover {
    background: #808080;
    border: 2px solid transparent;
    color: white; }

#article-wrapper #jobs-article {
  max-width: 47em;
  text-align: center; }
  #article-wrapper #jobs-article p {
    margin: 0 auto;
    max-width: 33em; }

article #lever {
  padding: .5em 0; }
  article #lever #loading-indicator {
    width: 2em;
    fill: #CCCCCC;
    margin: 6em auto 4em;
    display: block;
    animation: spinning 1s infinite ease-in-out; }
  article #lever h3 {
    font-size: 1em;
    padding-bottom: 1em;
    text-transform: uppercase;
    color: #999999;
    font-weight: 800; }
  article #lever ul {
    margin-bottom: 2em;
    display: flex;
    flex-wrap: wrap; }
    article #lever ul li {
      display: flex;
      align-items: center;
      width: calc(50% - .5em);
      margin: .25em;
      background-color: #FF5C5C;
      border-radius: 1.5em;
      transition: .2s; }
      article #lever ul li a {
        text-align: left;
        font-size: 2em;
        font-weight: 800;
        display: block;
        padding: 1em;
        text-decoration: none;
        color: rgba(255, 255, 255, 0.9);
        min-height: 3.2em;
        line-height: 1em; }
    article #lever ul li:nth-child(2) {
      background-color: #73D89C; }
    article #lever ul li:nth-child(3) {
      background-color: #FF9E2A; }
    article #lever ul li:nth-child(4) {
      background-color: #1DC9EA; }
    article #lever ul li:nth-child(5) {
      background-color: #765CFF; }
    article #lever ul li:nth-child(6) {
      background-color: #A900B5; }
    article #lever ul li:hover {
      box-shadow: 0px 0.25em 0.5em rgba(0, 0, 0, 0.2);
      transform: scale(1.025); }

#location-info {
  display: inline;
  align-items: center; }
  #location-info span {
    font-weight: 500;
    color: #3276FF; }

#photo-box {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  height: 18.5em;
  margin-bottom: 4em; }
  #photo-box * {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    width: calc(50% - .5em);
    margin: .25em; }
  #photo-box #photo-1 {
    background-image: url(../img/photo-1.jpg);
    height: calc(100% - .5em);
    border-radius: 1.5em .25em .25em 1.5em; }
  #photo-box #photo-2 {
    background-image: url(../img/photo-2.jpg);
    height: calc(50% - .5em);
    border-radius: .25em 1.5em .25em .25em; }
  #photo-box #photo-3 {
    background-image: url(../img/photo-3.jpg);
    height: calc(50% - .5em);
    border-radius: .25em .25em 1.5em .25em; }

#cliche-box {
  display: flex;
  justify-content: space-around;
  margin: 4em 0 2em; }
  #cliche-box .cliche-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 28%; }
  #cliche-box p {
    padding-top: 1em; }

#article-wrapper #jobs-article #jobs-header {
  height: 12.4em;
  background-image: url(../img/photo-header.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 1.5em;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column; }
  #article-wrapper #jobs-article #jobs-header h1 {
    color: white;
    margin: 0;
    padding: 0; }

@keyframes spinning {
  to {
    transform: rotate(360deg); } }
#mac-app-svg {
  margin: 1em;
  max-width: 14em; }

#mc_embed_signup_scroll {
  display: flex; }

#link-mail-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 1em; }
  #link-mail-container h2 {
    font-weight: 700;
    text-align: center;
    padding-bottom: 1em; }

#link-mail-form {
  display: flex;
  width: 100%; }

#link-mail-form #email-textfield {
  background-color: white;
  border: none; }

#callback-text {
  margin: 1em 0 0;
  font-size: .75em;
  font-weight: 700;
  padding: .5em 1em;
  border-radius: .2em;
  background-color: rgba(0, 0, 0, 0.2);
  transition: .2s; }

#mc_embed_signup label, #mc_embed_signup input, #link-mail-form label, #link-mail-form input {
  font-weight: 500;
  line-height: 1.4em; }
#mc_embed_signup [type="email"], #link-mail-form [type="email"] {
  height: 3em;
  border: 2px solid #CCCCCC;
  padding: .5em 1em;
  border-radius: .5em 0 0 .5em;
  border-right: none;
  color: #999999;
  outline: none;
  background-color: #eaeaea;
  transition: .2s;
  -webkit-appearance: none;
  width: 100%; }
#mc_embed_signup [type="email"]::placeholder, #link-mail-form [type="email"]::placeholder {
  color: #CCCCCC; }
#mc_embed_signup [type="email"]:focus, #link-mail-form [type="email"]:focus {
  background-color: white; }
#mc_embed_signup [type="submit"], #mc_embed_signup [type="button"], #link-mail-form [type="submit"], #link-mail-form [type="button"] {
  height: 3em;
  background-color: #FF004D;
  color: white;
  border: none;
  text-transform: uppercase;
  font-weight: 800;
  display: inline-block;
  border-radius: 0 .5em .5em 0;
  -webkit-appearance: none;
  padding: 0 1em; }

#old-os-warning {
  position: absolute;
  color: #FF004D;
  font-weight: 700;
  font-size: .75em;
  width: 26em;
  top: .6em;
  left: 110%; }

/* Media queries
-------------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  article #lever, article #jobs-header {
    font-size: 16px; }

  footer #footer-top-blocks #footer-left-content {
    flex-direction: column;
    width: 8em; }
    footer #footer-top-blocks #footer-left-content .footer-section {
      border-right: none; } }
@media screen and (max-width: 670px) {
  header {
    flex-direction: column;
    padding: 1em; }
    header #logo-conteiner {
      transform: scale(0.8); }
    header .buttons {
      margin-top: 1.4em; } }
@media screen and (max-width: 520px) {
  #photo-box {
    height: auto; }
    #photo-box * {
      width: 100%;
      height: 8em !important;
      border-radius: 1em !important; }

  article #lever ul li {
    width: 100%; }

  #cliche-box {
    flex-direction: column; }
    #cliche-box .cliche-item {
      width: 100%; }
      #cliche-box .cliche-item svg {
        height: 5em; }

  footer #contact-list {
    left: -8em; } }
@media screen and (max-width: 414px) {
  body, input {
    font-size: 16px; }

  #article-wrapper {
    padding: 2em 2em 6em; }
    #article-wrapper article h1 {
      font-size: 2em; }
    #article-wrapper article h2 {
      font-size: 1.5em; }
    #article-wrapper article input.email {
      border-radius: .5em;
      border: 2px solid #CCCCCC; }
    #article-wrapper article input.button {
      margin: .5em 0;
      border-radius: .5em; }
    #article-wrapper article #mac-app-svg {
      max-width: 10em; }

  #app-store-button {
    padding: .4em 1.4em; }

  header h1 {
    display: block;
    vertical-align: baseline; }

  #mc_embed_signup_scroll {
    flex-direction: column; } }
@media screen and (max-width: 375px) {
  footer #contact-list {
    left: -3.6em; } }
