div.main-page#main {
  background-color:transparent;
  margin:0px;
  padding:0px;
}
@media (min-width: 1200px) {
  div.main-page#main {
    margin:auto;
  }
}
div.community-reel {
  padding:30px;
}
div.main-page div.darkmyst,
div.main-page div.welcome {
  display:block;
  box-sizing:border-box;
  background-color:hsla(177, 29%, 15%, 0.9);
  color:#fff;
}
div.main-page div.welcome {
  padding:10px;
}
div.main-page div.welcome::after {
  display:block;
  content:"";
  clear:both;
}
div.main-page div.welcome > p {
  float:left;
  box-sizing:border-box;
  width:calc(33% - 10px);
  margin-bottom:10px;
  margin:5px;
  padding:5px;
}
div.main-page div.welcome > a {
  box-sizing:border-box;
  width:33%;
  margin:auto;
  border-width:0px;
  border-radius:5px;
  text-shadow:0 0.075em 0.075em rgba(0,0,0,0.65);
  background-color:rgb(5,131,124);
  font-size:1.5em;
}
div.main-page div.welcome > a:hover {
  background-color:rgb(17,165,156);
  color:white;
}
h2.home-title {
  color:hsla(177, 29%, 15%, 0.95);
  text-shadow:0 0 3px #fff, 0 0 5px #b3ffff;
  font-size:2em;
  letter-spacing:-0.035em;
  font-family:"Teko",sans-serif;
  font-style:normal;
  font-weight:500;
  margin:0px;
  padding:0px;
  padding-top:10px;
  border-bottom:0px;
}
div.main-page div.darkmyst {
  padding:30px;
}

div.main-page div.darkmyst p {
  margin-bottom:0px;
}
div.main-page div.darkmyst + p {
  display:none;
}
div.main-page div.darkmyst h2 {
  color:#d8fcf5;
  font-family:"Teko",sans-serif;
  font-style:normal;
  font-weight:normal;
  margin:0px;
  padding:0px;
  border-bottom:0px;
}

@media (max-width: 599px) {
  div.main-page div.welcome > a {
    width:auto;
    padding:10px;
    margin:5px;
    margin-bottom:10px;
    font-size:1.5em;
    line-height:1.5em;
    font-weight:normal;
    letter-spacing:0.05em;
    text-transform:uppercase;
  }
  div.main-page div.welcome > p {
    float:none;
    width:auto;
  }
  div.main-page div.darkmyst > img {
    display:none;
  }
}

@media (min-width: 600px) {
  div.main-page div.welcome > p:first-of-type {
    text-align:right;
  }
  div.main-page div.welcome > p:first-of-type + p {
    text-align:center;
  }
  div.main-page div.darkmyst > img {
    display:block;
    width:30%;
    float:right;
    margin:30px;
    margin-left:50px;
    max-width:300px;
  }
  div.main-page div.darkmyst::after {
    content:"";
    display:block;
    clear:both;
  }
}

@media (min-width: 1600px) {
  div.main-page div.welcome > a {
    float:left;
    width:calc(25% - 45px);
    margin:10px;
  }
  div.main-page div.welcome > p {
    width:calc(25% - 10px);
  }
}