/*   html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline)  v1.4 2009-07-27 | Authors: Eric Meyer & Richard Clark  html5doctor.com/html-5-reset-stylesheet/*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, hgroup, menu, nav, section, menu,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

article, aside, figure, footer, header,
hgroup, nav, section {
  display: block; }

nav ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none; }

mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help; }

/* tables still need cellspacing="0" in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0; }

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }

input, select {
  vertical-align: middle; }

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

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

img {
  max-width: 100%; }

.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important; }

/* END RESET CSS */
body {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.2em;
  color: #fff; }

p {
  font-size: 1.9rem;
  line-height: 1.2em; }
  @media only screen and (max-width: 60em) {
    p {
      font-size: 1.4rem;
      line-height: 1.2em; } }

em {
  color: #10b0e0;
  font-style: normal; }

body {
  background-color: #2a2a2a; }

img {
  max-width: 100%;
  height: auto; }

.container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
  background-color: #3e3e3e; }
  @media only screen and (max-width: 60em) {
    .container {
      max-width: 400px; } }

.pattern-bg {
  position: relative;
  z-index: 1; }
  .pattern-bg:before {
    position: absolute;
    z-index: -1;
    content: "";
    top: -15%;
    right: 0;
    left: 40%;
    height: 340px;
    width: 60%;
    background-image: url("../assets/pattern--fans--sm.png"); }
    @media only screen and (max-width: 60em) {
      .pattern-bg:before {
        top: -40px; } }
  .pattern-bg.vert:before {
    top: 15%; }
  .pattern-bg.left:before {
    right: 40%;
    left: 0; }

.margin--content {
  margin: 0 0 60px 0; }
  .margin--content--vert {
    margin: 0 0 100px 0; }

.pad--content {
  padding: 0 60px; }
  @media only screen and (max-width: 60em) {
    .pad--content {
      padding: 0 30px; } }

@media only screen and (max-width: 60em) {
  .no-mobile {
    display: none !important; } }

.header {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  padding: 30px 60px; }
  @media only screen and (max-width: 60em) {
    .header {
      padding: 30px 30px; } }
  .header .primary-logo {
    flex: 0 0 444px;
    width: 444px;
    height: auto; }

.content--box {
  padding: 60px;
  background-color: #2a2a2a;
  border-radius: 12px; }
  .content--box .blurb {
    margin-bottom: 28px; }
  @media only screen and (max-width: 60em) {
    .content--box {
      padding: 28px;
      margin: 0 28px; } }

#intro--main .image {
  height: 665px;
  background-image: url("/assets/image--lead.png");
  background-position: center center; }

.images {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center; }

.image--container {
  position: relative; }
  .image--container .image--content {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center; }
    @media only screen and (max-width: 60em) {
      .image--container .image--content {
        flex-direction: column; } }
    .image--container .image--content > img:first-child {
      border-top-left-radius: 8px;
      border-bottom-left-radius: 8px; }
      @media only screen and (max-width: 60em) {
        .image--container .image--content > img:first-child {
          border-top-left-radius: 0;
          border-bottom-left-radius: 0; } }
    .image--container .image--content > img:last-child {
      border-top-right-radius: 8px;
      border-bottom-right-radius: 8px; }
      @media only screen and (max-width: 60em) {
        .image--container .image--content > img:last-child {
          border-top-right-radius: 0;
          border-bottom-right-radius: 0; } }
    .image--container .image--content.vert > img {
      display: block;
      margin: -8px; }
      @media only screen and (max-width: 60em) {
        .image--container .image--content.vert > img:last-child {
          display: none; } }
      @media only screen and (max-width: 60em) {
        .image--container .image--content.vert > img:first-child {
          display: none; } }
      .image--container .image--content.vert > img.z-top {
        z-index: 1; }
  .image--container > figcaption {
    position: absolute;
    bottom: -38px;
    left: 4px;
    font-size: 1.4rem;
    color: #BBB; }
    @media only screen and (max-width: 60em) {
      .image--container > figcaption {
        bottom: -41px;
        font-size: 1rem; } }
  .image--container.grid .image--content {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0; }
    @media only screen and (max-width: 60em) {
      .image--container.grid .image--content {
        gap: 38px; } }
    .image--container.grid .image--content div {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex: 0 0 25%;
      width: inherit;
      height: inherit;
      margin-bottom: 28px; }
      @media only screen and (max-width: 60em) {
        .image--container.grid .image--content div {
          flex: 0 0 39%;
          margin-bottom: 12px; } }
  .image--container.cards .image--content {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 16px; }
    @media only screen and (max-width: 60em) {
      .image--container.cards .image--content > div {
        flex: 0 0 46%; } }
    @media only screen and (max-width: 60em) {
      .image--container.cards .image--content {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: left; } }
  .image--container.cards img {
    border-radius: 8px; }

button {
  background-color: #1c738e;
  color: white;
  padding: 10px 20px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  font-size: 1.2rem; }
  button:hover {
    background-color: #145163; }

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



#intro--main .pattern-bg:before{height: 365px;}
.unlock-items .pad--content {margin-bottom: 80px;}
.clubhouse .pattern-bg{margin-bottom: 180px;}
.clubhouse .margin--content{margin-bottom: 80px;}
.request{width: 80%;}
.image{margin-bottom: 8px;}
.team{margin-bottom: 120px;}
button{width: 300px; padding: 14px;}
    @media only screen and (max-width: 60em) {
      button{width: 230px; padding: 14px;} }

@media only screen and (max-width: 60em) {
      .image--container .image--content > img.bali:first-child {border-radius: 8px; width: 290px;} 
      .image--container .image--content > img.tower {border-radius: 0 0 8px 8px; width: 290px;} 
    }
.unlock-items img{max-width: 186px;}
    @media only screen and (max-width: 60em) {
      .unlock-items img{max-width: 136px;} }