@import url(game.css);
body,
html {
  height: 100%;
  margin: 0;
  overflow: hidden;
  padding: 0;
  width: 100%;
}
body {
  color: #fff;
  font: 18px Baloo\2, cursive;
}
#loading {
  background: rgba(0, 0, 0, 0.075)
    url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIwIiBoZWlnaHQ9IjMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNmZmYiPjxjaXJjbGUgY3g9IjE1IiBjeT0iMTUiIHI9IjE1Ij48YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiBmcm9tPSIxNSIgdG89IjE1IiBiZWdpbj0iMHMiIGR1cj0iMC44cyIgdmFsdWVzPSIxNTs5OzE1IiBjYWxjTW9kZT0ibGluZWFyIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIvPjxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImZpbGwtb3BhY2l0eSIgZnJvbT0iMSIgdG89IjEiIGJlZ2luPSIwcyIgZHVyPSIwLjhzIiB2YWx1ZXM9IjE7LjU7MSIgY2FsY01vZGU9ImxpbmVhciIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiLz48L2NpcmNsZT48Y2lyY2xlIGN4PSI2MCIgY3k9IjE1IiByPSI5IiBmaWxsLW9wYWNpdHk9Ii4zIj48YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiBmcm9tPSI5IiB0bz0iOSIgYmVnaW49IjBzIiBkdXI9IjAuOHMiIHZhbHVlcz0iOTsxNTs5IiBjYWxjTW9kZT0ibGluZWFyIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIvPjxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImZpbGwtb3BhY2l0eSIgZnJvbT0iLjUiIHRvPSIuNSIgYmVnaW49IjBzIiBkdXI9IjAuOHMiIHZhbHVlcz0iLjU7MTsuNSIgY2FsY01vZGU9ImxpbmVhciIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiLz48L2NpcmNsZT48Y2lyY2xlIGN4PSIxMDUiIGN5PSIxNSIgcj0iMTUiPjxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InIiIGZyb209IjE1IiB0bz0iMTUiIGJlZ2luPSIwcyIgZHVyPSIwLjhzIiB2YWx1ZXM9IjE1Ozk7MTUiIGNhbGNNb2RlPSJsaW5lYXIiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIi8+PGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iZmlsbC1vcGFjaXR5IiBmcm9tPSIxIiB0bz0iMSIgYmVnaW49IjBzIiBkdXI9IjAuOHMiIHZhbHVlcz0iMTsuNTsxIiBjYWxjTW9kZT0ibGluZWFyIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIvPjwvY2lyY2xlPjwvc3ZnPg==)
    no-repeat 50%;
  height: 100%;
  position: relative;
  width: 100%;
  z-index: 100;
}
#ima-container {
  bottom: 0;
  display: block;
  height: 100%;
  left: 0;
  overflow: hidden;
  position: fixed;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 99;
}
#ima-container.black-opacity {
  background-color: rgba(0, 0, 0, 0.9);
}
#non-linear-text {
  bottom: 30px;
  color: hsla(0, 0%, 100%, 0.75);
  position: fixed;
  text-align: center;
  width: 100%;
}
#ad-container,
#game-container,
#play {
  height: 100vh;
  width: 100vw;
}
#game-container {
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
}
#error {
  background-color: #803737;
  font-size: 24px;
  position: fixed;
  text-align: center;
  top: 0;
  z-index: 11;
}
#error,
.gameframe-content {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100%;
  -webkit-justify-content: center;
  justify-content: center;
  width: 100%;
}
.gameframe-content {
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.075);
}
.game-item {
  display: inline-block;
}
.game-item .image {
  background-color: rgba(0, 0, 0, 0.15);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  padding: 5px;
}
.game-item .image img {
  display: block;
}
.game-title {
  color: #333;
  font-size: 1.2em;
  font-weight: 400;
  margin: 5px 0 15px;
}
a.play-button {
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-align-items: center;
  align-items: center;
  background-color: #e64944;
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  color: #ffd8d3;
  cursor: pointer;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.5em;
  font-weight: 500;
  -webkit-justify-content: center;
  justify-content: center;
  letter-spacing: 1px;
  padding: 5px 5px 5px 0;
  text-decoration: none;
  -webkit-transition: -webkit-transform 0.15s ease;
  transition: -webkit-transform 0.15s ease;
  -o-transition: -o-transform 0.15s ease;
  -moz-transition: transform 0.15s ease, -moz-transform 0.15s ease;
  transition: transform 0.15s ease;
  transition: transform 0.15s ease, -webkit-transform 0.15s ease,
    -moz-transform 0.15s ease, -o-transform 0.15s ease;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 130px;
}
a.play-button:link,
a.play-button:visited {
  cursor: pointer;
}
a.play-button:hover {
  color: #fff;
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  transform: scale(1.2);
}
a.play-button:active {
  background-color: #f35651;
  color: #fff;
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  transform: scale(1.2);
}
a.play-button > .title {
  line-height: 1.5em;
  text-align: center;
}
a.play-button > .icon {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NzkuODYyIDQ3OS44NjIiPjxwYXRoIGQ9Ik0zNTkuODYyIDE1MS4wNDdjLTE3LjY3MyAwLTMyIDE0LjMyNy0zMiAzMnMxNC4zMjcgMzIgMzIgMzJjMTcuNjczIDAgMzItMTQuMzI3IDMyLTMycy0xNC4zMjctMzItMzItMzJ6bTAgNDhjLTguODM3IDAtMTYtNy4xNjMtMTYtMTZzNy4xNjMtMTYgMTYtMTYgMTYgNy4xNjMgMTYgMTYtNy4xNjQgMTYtMTYgMTZ6bTAgNjRjLTE3LjY3MyAwLTMyIDE0LjMyNy0zMiAzMiAwIDE3LjY3MyAxNC4zMjcgMzIgMzIgMzIgMTcuNjczIDAgMzItMTQuMzI3IDMyLTMyIDAtMTcuNjczLTE0LjMyNy0zMi0zMi0zMnptMCA0OGMtOC44MzcgMC0xNi03LjE2My0xNi0xNnM3LjE2My0xNiAxNi0xNiAxNiA3LjE2MyAxNiAxNi03LjE2NCAxNi0xNiAxNnptLTU2LTEwNGMtMTcuNjczIDAtMzIgMTQuMzI3LTMyIDMyczE0LjMyNyAzMiAzMiAzMmMxNy42NzMgMCAzMi0xNC4zMjcgMzItMzJzLTE0LjMyNy0zMi0zMi0zMnptMCA0OGMtOC44MzcgMC0xNi03LjE2My0xNi0xNnM3LjE2My0xNiAxNi0xNiAxNiA3LjE2MyAxNiAxNi03LjE2NCAxNi0xNiAxNnptMTEyLTQ4Yy0xNy42NzMgMC0zMiAxNC4zMjctMzIgMzJzMTQuMzI3IDMyIDMyIDMyYzE3LjY3MyAwIDMyLTE0LjMyNyAzMi0zMnMtMTQuMzI3LTMyLTMyLTMyem0wIDQ4Yy04LjgzNyAwLTE2LTcuMTYzLTE2LTE2czcuMTYzLTE2IDE2LTE2IDE2IDcuMTYzIDE2IDE2LTcuMTY0IDE2LTE2IDE2em0tMjMyLTQ4aC0zMnYtMzJhOCA4IDAgMCAwLTgtOGgtNDhhOCA4IDAgMCAwLTggOHYzMmgtMzJhOCA4IDAgMCAwLTggOHY0OGE4IDggMCAwIDAgOCA4aDMydjMyYTggOCAwIDAgMCA4IDhoNDhhOCA4IDAgMCAwIDgtOHYtMzJoMzJhOCA4IDAgMCAwIDgtOHYtNDhhOCA4IDAgMCAwLTgtOHptLTggNDhoLTMyYTggOCAwIDAgMC04IDh2MzJoLTMydi0zMmE4IDggMCAwIDAtOC04aC0zMnYtMzJoMzJhOCA4IDAgMCAwIDgtOHYtMzJoMzJ2MzJhOCA4IDAgMCAwIDggOGgzMnYzMnoiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNMzYwLjgzIDExOS4xMDNhNy44MjEgNy44MjEgMCAwIDAtLjk2OC0uMDU2aC0yNDBhNy41MDcgNy41MDcgMCAwIDAtLjk2LjA1NkM1Mi4xNTkgMTIwLjE4Ny0xLjA2OCAxNzUuMTcxLjAxNiAyNDEuOTEzYzEuMDcxIDY1LjkzIDU0Ljc4NyAxMTguODM1IDEyMC43MjYgMTE4LjkwMmExMTkuODg4IDExOS44ODggMCAwIDAgODMuNzYtMzMuNzY4aDcwLjcyYzQ4LjA5NCA0Ni4yNzcgMTI0LjU5NiA0NC44MDQgMTcwLjg3My0zLjI4OWExMjAuODUgMTIwLjg1IDAgMCAwIDMzLjc2Ny04My44MzFjLS4xOTQtNjUuOTUzLTUzLjA4OS0xMTkuNjQ1LTExOS4wMzItMTIwLjgyNHptLTEuODQgMjI1LjcyLS4wMDgtLjAwOGExMDQuMTEzIDEwNC4xMTMgMCAwIDEtNzQuNzY4LTMxLjM2OCA4IDggMCAwIDAtNS42OTYtMi40aC03Ny4zMTJhOCA4IDAgMCAwLTUuNjk2IDIuNGMtNDAuNTg4IDQxLjMwNy0xMDYuOTc3IDQxLjg4OS0xNDguMjgzIDEuMzAxUzUuMzM4IDIwNy43NzEgNDUuOTI2IDE2Ni40NjVhMTA0Ljg1MyAxMDQuODUzIDAgMCAxIDc0LTMxLjM2MmMuMjY3IDAgLjUzNS0uMDE2LjgtLjA0OEgzNTguOTljLjI2Ni4wMzIuNTMzLjA0OC44LjA0OCA1Ny45MTEuNjc2IDEwNC4zMDkgNDguMTcgMTAzLjYzMyAxMDYuMDgtLjY2OCA1Ny4yNjktNDcuMTYxIDEwMy40MDgtMTA0LjQzMyAxMDMuNjR6IiBmaWxsPSIjZmZmIi8+PC9zdmc+);
  height: 32px;
  margin-right: 10px;
  width: 32px;
}
.error-code {
  font-size: 3rem;
  margin-bottom: 15px;
}
.error-raw {
  font-size: 0.5rem;
  margin-top: 15px;
}
.ok-bgr {
  background-color: rgba(0, 0, 0, 0.75);
}
.frame-container {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  background-color: #e29578;
  color: #ffddd2;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  font: 2rem Helvetica Neue, Helvetica, Arial, sans-serif;
  height: 100%;
  -webkit-justify-content: center;
  justify-content: center;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.45);
}
.frame-container h1 {
  text-shadow: 0.05em 0.04em 0 rgba(0, 0, 0, 0.45);
}
.retired-container {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -moz-box-orient: horizontal;
  -moz-box-direction: normal;
  -webkit-box-align: baseline;
  -moz-box-align: baseline;
  -ms-flex-align: baseline;
  -webkit-align-items: baseline;
  align-items: baseline;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  padding: 0 30px 30px;
}
.retired-text {
  max-width: 450px;
  text-align: center;
}
.retired-suggest {
  background-color: rgba(0, 0, 0, 0.05);
  margin-left: 15px;
}
.retired-suggest,
.retired-suggest-container {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}
.retired-suggest-container {
  font-size: 1.25rem;
  padding: 15px;
}
.retired-suggest-game-image {
  background-color: hsla(0, 0%, 100%, 0.2);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  display: inherit;
  margin-bottom: 15px;
  padding: 8px;
}
.retired-suggest-game-title a:link,
.retired-suggest-game-title a:visited {
  background-color: #83c5be;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  color: #006d77;
  display: block;
  padding: 10px 15px;
  text-decoration: none;
  text-shadow: none;
  white-space: nowrap;
}
.retired-suggest-game-title a:hover {
  background-color: #edf6f9;
  color: #1a535c;
}
.retired-arrow {
  fill: rgba(0, 0, 0, 0.35);
  color: rgba(0, 0, 0, 0.35);
  margin-right: 90px;
  padding-left: 45px;
}
.retired-arrow-text {
  font-size: 1.1rem;
  margin: 35px 0 0 -40px;
  position: absolute;
  text-shadow: none;
  -webkit-transform: rotate(-35deg);
  -moz-transform: rotate(-35deg);
  -ms-transform: rotate(-35deg);
  -o-transform: rotate(-35deg);
  transform: rotate(-35deg);
}
.video-thumb {
  height: 75px;
  padding: 5px;
  position: absolute;
  width: 100px;
}
.video-thumb video {
  height: 75px;
  width: 100.2px;
}
.splash-screen {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.075);
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100%;
  -webkit-justify-content: center;
  justify-content: center;
  width: 100%;
}
.splash-loading {
  color: #555;
}
.progress {
  background: rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 0.75rem;
  -moz-border-radius: 0.75rem;
  border-radius: 0.75rem;
  margin-bottom: 15px;
  overflow: hidden;
  width: 200px;
}
.progress-bar {
  -webkit-animation: progress-bar-stripes 0.5s linear infinite;
  -moz-animation: progress-bar-stripes 0.5s linear infinite;
  -o-animation: progress-bar-stripes 0.5s linear infinite;
  animation: progress-bar-stripes 0.5s linear infinite;
  background-color: #e64944;
  background-image: -webkit-linear-gradient(
    45deg,
    hsla(0, 0%, 100%, 0.15) 25%,
    transparent 0,
    transparent 50%,
    hsla(0, 0%, 100%, 0.15) 0,
    hsla(0, 0%, 100%, 0.15) 75%,
    transparent 0,
    transparent
  );
  background-image: -moz-linear-gradient(
    45deg,
    hsla(0, 0%, 100%, 0.15) 25%,
    transparent 25%,
    transparent 50%,
    hsla(0, 0%, 100%, 0.15) 50%,
    hsla(0, 0%, 100%, 0.15) 75%,
    transparent 75%,
    transparent
  );
  background-image: -o-linear-gradient(
    45deg,
    hsla(0, 0%, 100%, 0.15) 25%,
    transparent 25%,
    transparent 50%,
    hsla(0, 0%, 100%, 0.15) 50%,
    hsla(0, 0%, 100%, 0.15) 75%,
    transparent 75%,
    transparent
  );
  background-image: linear-gradient(
    45deg,
    hsla(0, 0%, 100%, 0.15) 25%,
    transparent 0,
    transparent 50%,
    hsla(0, 0%, 100%, 0.15) 0,
    hsla(0, 0%, 100%, 0.15) 75%,
    transparent 0,
    transparent
  );
  -webkit-background-size: 1.5rem 1.5rem;
  -moz-background-size: 1.5rem 1.5rem;
  background-size: 1.5rem 1.5rem;
  height: 1.5rem;
}
@-webkit-keyframes progress-bar-stripes {
  0% {
    background-position: 1.5rem 0;
  }
  to {
    background-position: 0 0;
  }
}
@-moz-keyframes progress-bar-stripes {
  0% {
    background-position: 1.5rem 0;
  }
  to {
    background-position: 0 0;
  }
}
@-o-keyframes progress-bar-stripes {
  0% {
    background-position: 1.5rem 0;
  }
  to {
    background-position: 0 0;
  }
}
@keyframes progress-bar-stripes {
  0% {
    background-position: 1.5rem 0;
  }
  to {
    background-position: 0 0;
  }
}
