body {
  margin: 0;
  padding: 0;
  background: #5e8edc;
  background: linear-gradient(180deg, #35507d 0px, #5e8edc 450px);
  font-family: verdana, helvetica, sans-serif;
  color: #fff;
  font-size: 0.9em;
}
img {
  border: 0;
}
a {
  color: #fff;
}
#head {
  position: relative;
  background: url("landing/images/gen2/head20th.png") no-repeat;
  width: 980px;
  height: 330px;
}
.webp #head {
  background-image: url("landing/images/gen2/head20th.webp");
}
#body {
  margin: 15px auto 0;
  padding: 0;
  position: relative;
  width: 980px;
  min-height: 300px;
  min-width: 980px;
  overflow: visible;
  box-shadow: 0 0 10px #000;
  border-radius: 5px;
}
#top-corners-fixup {
  background: url("landing/images/top_corners_fixup.jpg") no-repeat top center;
  width: 100%;
  height: 31px;
  min-width: 980px;
  margin-bottom: -31px;
  zoom: 1;
}
.webp #top-corners-fixup {
  background-image: url("landing/images/top_corners_fixup.webp");
}
#bottom-corners-fixup {
  background: url("landing/images/bottom_corners_fixup.jpg") no-repeat top
    center;
  width: 100%;
  height: 35px;
  min-width: 980px;
  margin-bottom: -31px;
  z-index: 1;
}
.webp #bottom-corners-fixup {
  background-image: url("landing/images/bottom_corners_fixup.webp");
}
#page {
  background-color: #000;
  border-radius: 5px;
  margin-left: auto;
  margin-right: auto;
  width: 980px;
}
#nav-bar {
  position: relative;
  width: 980px;
  height: 77px;
  top: 257px;
  left: 0;
  background: url("landing/images/gen2/nav_bar_back.png");
}
.webp #nav-bar {
  background-image: url("landing/images/gen2/nav_bar_back.webp");
}
#download-button {
  width: 240px;
  height: 77px;
  top: 0;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
#maps-and-modes-button {
  position: absolute;
  left: 20px;
  top: 0;
}
#forums-button {
  position: absolute;
  left: 200px;
  top: 0;
}
#documentation-button {
  position: absolute;
  left: 295px;
  top: 0;
}
#developers-button {
  position: absolute;
  left: 603px;
  top: 0;
}
#heroes-button {
  position: absolute;
  left: 740px;
  top: 0;
}
#hosting-button {
  position: absolute;
  left: 845px;
  top: 0;
}
.down {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  -moz-opacity: 0;
}
.up {
  position: absolute;
  top: 0;
  left: 0;
}
#below-head {
  position: relative;
}
#intro {
  position: relative;
  left: 0;
  width: 980px;
  height: 844px;
  overflow: hidden;
}
#welcome-box {
  position: absolute;
  left: 550px;
  width: 350px;
}
#news {
  height: 267px;
}
#news-box {
  position: absolute;
  left: 30px;
  width: 470px;
}
#news-button {
  position: absolute;
  left: 347px;
  top: 7px;
}
#ryden-pic {
  background: url("landing/images/ryden_uber_pic.jpg") no-repeat;
  position: absolute;
  top: 250px;
  width: 980px;
  height: 676px;
}
.webp #ryden-pic {
  background-image: url("landing/images/ryden_uber_pic.webp");
}
#ryden-pic-left {
  background: url("landing/images/ryden_uber_pic_left.jpg") no-repeat;
  position: absolute;
  margin-top: 107px;
  margin-left: -107px;
  width: 107px;
  height: 200px;
  display: inline;
}
.webp #ryden-pic-left {
  background-image: url("landing/images/ryden_uber_pic_left.webp");
}
#ryden-pic-right {
  background: url("landing/images/ryden_uber_pic_right.jpg") no-repeat;
  position: absolute;
  margin-top: 59px;
  margin-left: 980px;
  width: 30px;
  height: 107px;
  display: inline;
}
.webp #ryden-pic-right {
  background-image: url("landing/images/ryden_uber_pic_right.webp");
}
#ryden-pic-blurb {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 750px;
  top: 530px;
  text-align: justify;
}
#news-details {
  font-size: 0.8em;
}
#social-sites {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  width: 800px;
  height: 85px;
  margin-top: 75px;
}
#social-sites > picture img {
  position: relative;
}
#social-sites .button {
  float: left;
  position: relative;
  height: 56px;
}
#potd {
  background-color: #232323;
  padding: 10px 40px 10px 40px;
  position: relative;
  height: 150px;
  cursor: pointer;
}
#potd #potd-right {
  position: absolute;
  top: 55px;
  right: 39px;
  z-index: 99;
}
#potd #potd-left {
  position: absolute;
  top: 55px;
  left: -19px;
  z-index: 99;
}
#potd-wrapper {
  position: relative;
  overflow: hidden;
  height: 150px;
}
#potd #potd-inner {
  overflow: hidden;
  width: 900px;
}
#potd #potd-inner div {
  height: 150px;
  white-space: nowrap;
  position: absolute;
  left: 0;
}
#potd #potd-inner img {
  margin-right: 40px;
}
.potd-preview {
  position: fixed;
  background-color: #000;
  opacity: 0.6;
  -moz-opacity: 0.6;
  z-index: 100;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.potd-img {
  position: fixed;
  vertical-align: center;
  left: 15%;
  top: 10%;
  width: 70%;
  z-index: 101;
}
#talidan-pic {
  position: relative;
  background: url("landing/images/talidan_pic.jpg") no-repeat;
  width: 980px;
  height: 834px;
  font-size: 105%;
}
.webp #talidan-pic {
  background-image: url("landing/images/talidan_pic.webp");
}
#talidan-pic a {
  text-decoration: none;
  font-weight: 700;
}
#talidan-pic a:hover {
  text-decoration: underline;
}
#talidan-pic-right {
  background: url("landing/images/talidan_pic_right.jpg") no-repeat 5px 5px;
  position: absolute;
  margin-top: 468px;
  margin-left: 975px;
  width: 48px;
  height: 155px;
}
.webp #talidan-pic-right {
  background-image: url("landing/images/talidan_pic_right.webp");
}
#reliable-and-accurate {
  width: 550px;
  float: right;
  background: url("landing/images/box.png");
  margin-top: 10px;
  margin-right: 10px;
}
.webp #reliable-and-accurate {
  background-image: url("landing/images/box.webp");
}
#reliable-and-accurate div {
  clear: both;
  padding: 60px 8px 8px 8px;
  background: url("landing/images/title_sync.png") no-repeat 8px 8px;
}
.webp #reliable-and-accurate div {
  background-image: url("landing/images/title_sync.webp");
}
#great-community {
  float: left;
  margin-top: 160px;
  background: url("landing/images/title_community.png") no-repeat 50px 8px;
  padding: 70px 8px 8px 50px;
  width: 400px;
}
.webp #great-community {
  background-image: url("landing/images/title_community.webp");
}
#open-source {
  margin-left: auto;
  margin-right: auto;
  width: 350px;
  padding-top: 60px;
  clear: both;
}
#footer {
  margin-top: 15px;
  color: #000;
  font-size: 10px;
  text-align: center;
}
#jump-to-content {
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  padding: 1em;
  background: #000;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
}
#jump-to-content:focus,
#jump-to-content:hover {
  cursor: pointer;
  pointer-events: initial;
  opacity: 1;
}
#onlinePlayers {
  padding-left: 1em;
  position: relative;
}
@media (min-width: 980px) {
  #onlinePlayers {
    margin-left: auto;
  }
}
@keyframes onlinePlayers {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
#onlinePlayers:not(:empty)::before {
  animation: onlinePlayers 1s infinite forwards alternate;
  background: #90ee90;
  border-radius: 100px;
  content: "";
  display: block;
  height: 6px;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 7px;
  width: 6px;
}
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #000;
  border: 2px solid #fff;
  min-width: 186px;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
  margin-top: 58px;
  margin-left: 26px;
  z-index: 2;
  border-radius: 5px;
}
.dropdown-content a {
  color: #fff;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}
.dropdown-content a:hover {
  background-color: #f1f1f1;
  color: #000;
}