@font-face {
  font-family: 'Noyh';
  src: url("../../assets/fonts/typesketchbook-noyhblack-webfont.woff2") format("woff2"), url("../../assets/fonts/typesketchbook-noyhblack-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

body {
  font-family: 'Lato', sans-serif;
  font-weight: 300;
  background: url("../../assets/img/waves-white.svg") center top;
  color: #52382b;
  margin: 0; }

a {
  color: inherit;
  text-decoration: none; }
  a:hover {
    text-decoration: underline; }

strong {
  font-weight: 900; }

#game-container {
  background: #210d06 url("../../assets/img/waves-brown.svg") center top;
  padding-bottom: 100px; }
  #game-container nav {
    margin: auto;
    max-width: 1280px;
    padding: calc(1.5625vw + 20px) 0;
    text-align: right; }
    #game-container nav a {
      color: white;
      text-decoration: none;
      display: inline-block;
      width: 70px; }
      #game-container nav a:hover {
        font-weight: bold; }
  #game-container #game {
    padding-bottom: calc(1.5625vw + 20px);
    margin: auto;
    max-width: 1280px;
    max-height: 720px; }

#sobre {
  position: relative;
  margin: -100px auto 0;
  max-width: 1000px;
  padding: calc(1.5625vw + 20px) 20px 0;
  font-size: calc(0.75vw + 13.6px);
  line-height: 1.5;
  text-align: center; }
  #sobre h1 {
    margin: 0; }
    #sobre h1 img {
      width: 300px; }
  #sobre .share {
    text-align: center;
    padding: 10px 0; }

#main-quote {
  margin: 50px auto 0;
  max-width: 1000px;
  padding: 0 20px;
  font-size: calc(1vw + 10.8px);
  line-height: 1.5;
  text-align: center;
  background: url("../../assets/img/loga-rip.svg") center top no-repeat;
  padding-top: 200px; }
  #main-quote .ref {
    font-size: calc(0.625vw + 8px);
    margin-top: calc(0.625vw + 8px); }

#other-quotes {
  font-size: calc(0.125vw + 13.6px);
  color: #ef4e23;
  margin: calc(3.125vw + 40px) auto;
  max-width: 1000px;
  line-height: 1.5; }
  #other-quotes p {
    margin: 30px; }
  #other-quotes .ref {
    font-size: 12px; }

#medalha {
  position: relative; }
  #medalha div {
    overflow: hidden;
    position: absolute;
    top: calc(-11.875vw + 328px);
    right: 0; }
  #medalha img {
    transform: translateX(47%);
    width: calc(21.875vw + 130px); }

#testimonials {
  margin: 100px auto;
  max-width: 1000px;
  padding: 0; }
  #testimonials li {
    list-style: none;
    text-align: center;
    margin: 60px 40px; }
  #testimonials div {
    position: relative; }
  #testimonials .avatar {
    background: #ccc;
    border-radius: 50%;
    margin: 0 50px;
    width: calc(10.625vw + 146px); }
  #testimonials .cocolito {
    position: absolute;
    top: calc(-1.5625vw + -20px);
    left: 50%;
    margin-left: calc(-0.9375vw + -22px);
    width: calc(1.875vw + 44px); }
  #testimonials .caveira {
    position: absolute;
    bottom: calc(-1.5625vw + -20px);
    left: 50%;
    margin-left: calc(-0.9375vw + -22px);
    width: calc(1.875vw + 44px);
    animation: caveira 0.1s linear infinite alternate; }

@keyframes caveira {
  0% {
    transform: rotate(-15deg); }
  100% {
    transform: rotate(15deg); } }
  #testimonials .testimonial {
    color: #ef4e23;
    font-size: calc(0.625vw + 14px); }
  #testimonials .person {
    font-size: calc(0.125vw + 11.6px);
    color: #a6a6a6;
    text-transform: uppercase;
    font-weight: bold; }

footer {
  background: url("../../assets/img/footer.svg") center bottom no-repeat;
  background-size: contain;
  height: calc(38.75vw + 36px); }
  footer .load-font {
    font-family: 'Noyh';
    color: rgba(255, 255, 255, 0); }

@media (min-width: 960px) {
  #highlight header {
    position: relative;
    max-width: 1280px;
    margin: auto; }
    #highlight header .share {
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
      padding-top: 0; }
  #other-quotes {
    display: flex;
    flex-wrap: wrap; }
    #other-quotes p {
      width: calc(50% - 100px);
      margin: 30px 50px; }
  #testimonials li {
    display: flex;
    align-items: center;
    text-align: left; }
    #testimonials li:nth-child(even) {
      flex-direction: row-reverse;
      text-align: right; } }

/*# sourceMappingURL=style.css.map */
