@import url(https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@400&display=swap);
/*
	HTML5 Reset :: style.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:

	Eric Meyer					:: https://meyerweb.com
	HTML5 Doctor				:: https://html5doctor.com
	and the HTML5 Boilerplate	:: https://html5boilerplate.com

-------------------------------------------------------------------------------*/
/* Let's default this puppy out
-------------------------------------------------------------------------------*/
html, body, 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, menu, nav, section, time, mark, audio, video, details, summary {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-weight: normal;
  vertical-align: baseline;
  background: transparent;
}

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

/* Handle box-sizing while better addressing child elements:
   https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
html {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

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

/* consider resetting the default cursor: https://gist.github.com/murtaugh/5247154 */
/* Responsive images and other embedded objects
*/
img,
object,
embed {
  max-width: 100%;
}

/*
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
	 In fact, it *will* cause problems with Google Maps' controls at small size.
	If this is the case for you, try uncommenting the following:

#map img {
		max-width: none;
}
*/
/* force a vertical scrollbar to prevent a jumpy page */
html {
  overflow-y: scroll;
}

/* we use a lot of ULs that aren't bulleted.
	don't forget to restore the bullets within content. */
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;
}

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;
}

th {
  font-weight: bold;
  vertical-align: bottom;
}

td {
  font-weight: normal;
  vertical-align: top;
}

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

input, select {
  vertical-align: middle;
}

pre {
  white-space: pre;
  /* CSS2 */
  white-space: pre-wrap;
  /* CSS 2.1 */
  white-space: pre-line;
  /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word;
  /* IE */
}

input[type=radio] {
  vertical-align: text-bottom;
}

input[type=checkbox] {
  vertical-align: bottom;
}

.ie7 input[type=checkbox] {
  vertical-align: baseline;
}

.ie6 input {
  vertical-align: text-bottom;
}

select, input, textarea {
  font: 99% sans-serif;
}

table {
  font-size: inherit;
  font: 100%;
}

small {
  font-size: 85%;
}

strong {
  font-weight: bold;
}

td, td img {
  vertical-align: top;
}

/* Make sure sup and sub don't mess with your line-heights https://gist.github.com/413930 */
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* standardize any monospaced elements */
pre, code, kbd, samp {
  font-family: monospace, sans-serif;
}

/* hand cursor on clickable elements */
.clickable,
label,
input[type=button],
input[type=submit],
input[type=file],
button {
  cursor: pointer;
}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {
  margin: 0;
}

/* make buttons play nice in IE */
button,
input[type=button] {
  width: auto;
  overflow: visible;
}

/* scale images in IE7 more attractively */
.ie7 img {
  -ms-interpolation-mode: bicubic;
}

/* prevent BG image flicker upon hover
   (commented out as usage is rare, and the filter syntax messes with some pre-processors)
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}
*/
/* let's clear some floats */
.clearfix:before, .clearfix:after {
  content: " ";
  display: block;
  height: 0;
  overflow: hidden;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  zoom: 1;
}

body {
  position: relative;
  width: 100%;
  min-width: 320px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: white;
  background-color: #001428;
  overflow: hidden;
}
body.body--active-side-left .screen__background-left {
  z-index: 1;
  -webkit-animation: transformationsSideLeft 0.4s forwards;
          animation: transformationsSideLeft 0.4s forwards;
}
body.body--active-side-left .screen__background-right,
body.body--active-side-left .content__side--right {
  -webkit-animation: brightnessScaling 0.4s forwards;
          animation: brightnessScaling 0.4s forwards;
}
body.body--active-side-right .screen__background-right {
  z-index: 1;
  -webkit-animation: transformationsSideRight 0.4s forwards;
          animation: transformationsSideRight 0.4s forwards;
}
body.body--active-side-right .screen__background-left,
body.body--active-side-right .content__side--left {
  -webkit-animation: brightnessScaling 0.4s forwards;
          animation: brightnessScaling 0.4s forwards;
}

.screen {
  position: relative;
  display: block;
  width: 100%;
  min-height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.screen__backgrounds {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../images/bg_main-2.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 0;
}

.screen__background-left,
.screen__background-right {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../images/bg_main-2-compiled.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  z-index: 0;
}

.screen__background-left {
  -webkit-mask-image: url(../images/bg_main-2-mask-alliance.png);
          mask-image: url(../images/bg_main-2-mask-alliance.png);
}

.screen__background-right {
  -webkit-mask-image: url(../images/bg_main-2-mask-empire.png);
          mask-image: url(../images/bg_main-2-mask-empire.png);
}

@media screen and (min-width: 980px) and (max-width: 1600px) {
  body.body--active-side-left .screen__background-left {
    z-index: 1;
    -webkit-animation: transformationsSideLeftCorrected 0.4s forwards;
            animation: transformationsSideLeftCorrected 0.4s forwards;
  }
  body.body--active-side-right .screen__background-right {
    z-index: 1;
    -webkit-animation: transformationsSideRightCorrected 0.4s forwards;
            animation: transformationsSideRightCorrected 0.4s forwards;
  }

  .screen__background-left,
.screen__background-right {
    -webkit-transform: translateY(-70px);
        -ms-transform: translateY(-70px);
            transform: translateY(-70px);
  }
}
@-webkit-keyframes transformationsSideLeft {
  0% {
    -webkit-transform: scale(1) translate(0, 0);
            transform: scale(1) translate(0, 0);
  }
  100% {
    -webkit-transform: scale(1.1) translate(0.7%, -2%);
            transform: scale(1.1) translate(0.7%, -2%);
  }
}
@keyframes transformationsSideLeft {
  0% {
    -webkit-transform: scale(1) translate(0, 0);
            transform: scale(1) translate(0, 0);
  }
  100% {
    -webkit-transform: scale(1.1) translate(0.7%, -2%);
            transform: scale(1.1) translate(0.7%, -2%);
  }
}
@-webkit-keyframes transformationsSideRight {
  0% {
    -webkit-transform: scale(1) translate(0, 0);
            transform: scale(1) translate(0, 0);
  }
  100% {
    -webkit-transform: scale(1.1) translate(-0.7%, -2%);
            transform: scale(1.1) translate(-0.7%, -2%);
  }
}
@keyframes transformationsSideRight {
  0% {
    -webkit-transform: scale(1) translate(0, 0);
            transform: scale(1) translate(0, 0);
  }
  100% {
    -webkit-transform: scale(1.1) translate(-0.7%, -2%);
            transform: scale(1.1) translate(-0.7%, -2%);
  }
}
@-webkit-keyframes transformationsSideLeftCorrected {
  0% {
    -webkit-transform: scale(1) translate(0, -70px);
            transform: scale(1) translate(0, -70px);
  }
  100% {
    -webkit-transform: scale(1.1) translate(0.7%, calc(-70px + -2%));
            transform: scale(1.1) translate(0.7%, calc(-70px + -2%));
  }
}
@keyframes transformationsSideLeftCorrected {
  0% {
    -webkit-transform: scale(1) translate(0, -70px);
            transform: scale(1) translate(0, -70px);
  }
  100% {
    -webkit-transform: scale(1.1) translate(0.7%, calc(-70px + -2%));
            transform: scale(1.1) translate(0.7%, calc(-70px + -2%));
  }
}
@-webkit-keyframes transformationsSideRightCorrected {
  0% {
    -webkit-transform: scale(1) translate(0, -70px);
            transform: scale(1) translate(0, -70px);
  }
  100% {
    -webkit-transform: scale(1.1) translate(-0.7%, calc(-70px + -2%));
            transform: scale(1.1) translate(-0.7%, calc(-70px + -2%));
  }
}
@keyframes transformationsSideRightCorrected {
  0% {
    -webkit-transform: scale(1) translate(0, -70px);
            transform: scale(1) translate(0, -70px);
  }
  100% {
    -webkit-transform: scale(1.1) translate(-0.7%, calc(-70px + -2%));
            transform: scale(1.1) translate(-0.7%, calc(-70px + -2%));
  }
}
@-webkit-keyframes brightnessScaling {
  0% {
    -webkit-filter: brightness(1);
            filter: brightness(1);
  }
  100% {
    -webkit-filter: brightness(0.3);
            filter: brightness(0.3);
  }
}
@keyframes brightnessScaling {
  0% {
    -webkit-filter: brightness(1);
            filter: brightness(1);
  }
  100% {
    -webkit-filter: brightness(0.3);
            filter: brightness(0.3);
  }
}
.loader {
  display: none;
}

body.loading.loading--fade-out .loader {
  -webkit-animation: loaderFadeOut 0.5s linear forwards;
          animation: loaderFadeOut 0.5s linear forwards;
}
body.loading .loader {
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  z-index: 99;
  opacity: 1;
}
body.loading .loader:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
}
body.loading .loader__processing {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  display: block;
  width: 78px;
  height: 78px;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAE4AAABOCAMAAAC5dNAvAAAC31BMVEVHcExFNDA7JBxhUEuLbkukflJCLChhVFFbRDw8JB50aGUfDAo1GhI9IBU9IBhKKBpyY115X0MlEA20h1gwGRJhQCpbSkROKx0gDQo6IBhvTTaNdlcqFBFKMCBePCtzXEyOeGaghF5SMirayKdXNSK8o4OynH1lTDiUcFJrRyytilm5j1SQZTwAAAAEBAIIBwYBBgcOCwpHPzsMDw4CDQobGBUUDw0DExEiGxc2NDIfHR0OBwQVDAgjFxE8ODUaEg8xHBQEKCFCOTM8KyEJGhQqFw8pKCcMExRcUUkJLCU5LipNRD6VjopXS0VHKRw3Jh0TEhFTUE0xKiQtJSFUMB8IOjF8dXGKhYE7IBUZIDECChBcVFFBPjpjWlQ9My8pHBQ0Ihl5Wjx0cG5TSEJFRUEUHCc0LyhCMSZNSEQlIBujnZhtZmGvragaJTmopZ8uLCsBIRtMLx83PDoEDhlUOSgWGRqBencmJCCWlJJhWk5WWVeblYwNQzq1r6tya2h5cWVeX10FMSkKEwYPIh9iUDtwY1mDYD5MS0icmpUtIRqUdU1OQDdmXlkFFSWvqaILGBu0tLGLgXMVKkMgEAm7t7NuUzhcOCONiodxSS1hQCqWi34RIjZBJBgPIi8KHSa9vLrIwbuiop9tXk4lUlCFgHwQGi5mYl5LOTRmVkouMi92a1wMHxng3do6NykgIyJLNSbDlF7JnmdjZmWEeWppbGmJaUXfqGiaelFkSDCCVjTZ19P/4ZNVRTqykmCklIP98rybbUPtxIQdMzGXhnJrPSYNMil3UjSriFvUzsj64qA4RkOhi3DKx8WBhYKtfUz50ojq5uOfdUmSaT50d3OUgGQSTkjruHQ5ZWXNlVhJVFKMj47fxIu7nGresnW8iVKqlXL99dr/76wjR0TPtIF/akvTqXKEc1+7rIymqqj//e3w4a5kkZjy8O7m1KVSfYC+pXInYFxCcXPGu6hwfX3r38NRwHseAAAA5nRSTlMAN4dj/P5mBBoeEpft0ZbuTPvI/rf0gM3TTMj+cNqOmYX8wP7z2fus0eDD59D//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////v///////////////////v25VdYAABIWSURBVFjDpZiHW5vX9cexDTZxPOOkSZrVjM7f753aW0ggCc2BkAAJCQlZIIkl9h5mbzB7mGFjps0ww2YaD2y8Zx1vx453nNn+Ab2ymzZtM9vzIJ4XnocP33PPec+99+vh8VOxdtPqXz2PVZvWevxv8dKbK19dv+61Y9PT00c1H21c/+rKN1/6L1FrVqz84+azV4sivjxx98Ts3VM7T924NXbB/Nr6lSvW/GKY99uvX56/MDV78MTOPU8+AREzWPvkyScHz82bzc3r3/b+ZUlu8Pzy8o0bdz7/6/KHl2sXFi7fOfXWW6e+WV7+5OCpG+8/GDu27uWfn7T3uw9vHDx45PKjDxfmguQjJiaTATPqFCOuxIL+2trxO3fvnhszb/yZwDWrPT//5MmTbwb7Wo61MyF3wMqkJCHqfmKaRsofPnp68MTs5gMb3/4Za/jSr996+uSTvx5xtXMZ4O+xgXSLZV/uRG5x+r591mEEEOsU/QtPH93/dH/iKz8pcPXm1vvfnD/Vwq0DsOHIfZf2WdLphmtJSdb44eL09HRrrBCCGX6y2g8HvzxUtG71jye64XePHo4fKQjygyGElmtJjxfE5wqudXfX7Jm5lPq4eHjAwKbR6DDE4BcOfj57qyzo5R9JeO2vvzz4yaOdCqAMKdbmnjyZe6Yzynq98/H5ZzWW1KZ41XJXqsVAF8QOg5xHaj8/ccvL9craH6Z9evfgpzv9GBAc37vPYL3+uOZ096XrZ4onJvapBCTVvoma8zXSrvpcOkmQBMF+O795emi+8Yd4a9y0OyNAmlKVHl/8l5rOqNPXrb25VA6JoMRiDU2P01WXZqqk9cs9JCVdgEB1IwsHAe+N78/3OU0DVo02YY0v2dP5+ExJLoGdggUYeYJhurU3xRBrFdCyukqSo05PxJLoBLCCR54euil/5ft477719OllDReCrLnx12pmukFfkCCYxHNmJ1uyk7Oztc5QPTsA4jirYnodqckqEpIEMRVHPp+/H/Tyf9JWNVy+c7mRC8Mq1UB6feel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);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  opacity: 1;
}
body.loading .loader__processing:after {
  content: "";
  position: absolute;
  display: block;
  width: 78px;
  height: 78px;
  background-image: url(data:image/png;base64,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);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  -webkit-animation: loaderSpinning 1.5s linear infinite;
          animation: loaderSpinning 1.5s linear infinite;
}

@-webkit-keyframes loaderSpinning {
  from {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes loaderSpinning {
  from {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes loaderFadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes loaderFadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
main {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 1.875em auto 0;
  width: 90%;
  max-width: 1600px;
  min-height: 565px;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

@media screen and (max-width: 1200px) {
  main {
    width: 95%;
  }
}
@media screen and (min-width: 1600px) {
  main {
    min-height: 1050px;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  main {
    min-height: 855px;
  }
}
@media screen and (min-width: 980px) and (max-width: 1200px) {
  main {
    min-height: 770px;
  }
}
.legends__label {
  position: absolute;
  top: 0;
  right: 0;
}

.legends__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 90px;
  text-decoration: none;
  text-transform: none;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  opacity: 0.77;
}
.legends__link:hover {
  opacity: 1;
}
.legends__link img {
  display: block;
  width: 100%;
}

@media screen and (max-width: 1360px) {
  .legends__link {
    width: 67px;
  }
}
.content__top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
}

.logos {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  padding-top: 7em;
}

.logo-wrapper {
  display: block;
  width: 513px;
}
.logo-wrapper img {
  display: block;
  width: 100%;
}

.logo-separator {
  display: block;
  width: 2px;
  height: 180px;
  margin: 0 1.875em;
  background-color: #fff;
  opacity: 0.2;
}

@media screen and (max-width: 1920px) {
  .logos {
    padding-top: 5em;
  }

  .logo-wrapper {
    width: 470px;
  }
}
@media screen and (max-width: 1600px) {
  .logos {
    padding-top: 3em;
  }

  .logo-wrapper {
    width: 380px;
  }
}
@media screen and (max-width: 1200px) {
  .logos {
    padding-top: 2em;
  }

  .logo-wrapper {
    width: 260px;
  }
}
@media screen and (max-width: 960px) {
  .logos {
    padding-top: 1em;
  }
}
@media screen and (max-width: 640px) {
  .logo-separator {
    margin: 0 1.625em;
  }

  .logos {
    padding-top: 0;
  }
}
.content__middle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
}

.content__middle .content__container {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 1000px;
  margin: 1.875em 0;
  padding: 5em 0;
}
.content__middle .content__container:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), color-stop(48.96%, #FFFFFF), to(rgba(255, 255, 255, 0)));
  background: -o-linear-gradient(right, rgba(255, 255, 255, 0) 0%, #FFFFFF 48.96%, rgba(255, 255, 255, 0) 100%);
  background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 48.96%, rgba(255, 255, 255, 0) 100%);
  opacity: 0.3;
}
.content__middle .content__container::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), color-stop(48.96%, #FFFFFF), to(rgba(255, 255, 255, 0)));
  background: -o-linear-gradient(right, rgba(255, 255, 255, 0) 0%, #FFFFFF 48.96%, rgba(255, 255, 255, 0) 100%);
  background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 48.96%, rgba(255, 255, 255, 0) 100%);
  opacity: 0.3;
}

.content__h1 {
  font-size: 3.25em;
  line-height: 1.33;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.content__paragraph {
  display: block;
  margin-top: 1.25em;
  font-family: "Roboto", sans-serif;
  font-size: 1.125em;
  line-height: 1.375em;
  text-align: center;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

@media screen and (max-width: 768px) {
  .content__paragraph br {
    display: none;
  }
}
@media screen and (max-width: 640px) {
  .content__paragraph {
    margin-top: 0.625em;
  }
}
.content__bottom {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
}
.content__bottom::before {
  content: "";
  position: absolute;
  bottom: 0%;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
      -ms-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  display: block;
  width: 100vw;
  height: 100vh;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(42.55%, rgba(0, 20, 40, 0)), color-stop(87.61%, rgba(0, 20, 40, 0.82)), to(rgba(0, 20, 40, 0)));
  background: -o-linear-gradient(top, rgba(0, 20, 40, 0) 42.55%, rgba(0, 20, 40, 0.82) 87.61%, rgba(0, 20, 40, 0) 100%);
  background: linear-gradient(180deg, rgba(0, 20, 40, 0) 42.55%, rgba(0, 20, 40, 0.82) 87.61%, rgba(0, 20, 40, 0) 100%);
  pointer-events: none;
}

.content__bottom .content__container {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 1000px;
  padding: 1.875em 0;
}

.content__h2 {
  display: block;
  font-size: 1.5em;
  font-weight: 700;
  line-height: 1.333;
  text-align: center;
}

.content__subtitle {
  display: block;
  margin-top: 0.625em;
  font-family: "Roboto", sans-serif;
  font-size: 1em;
  text-align: center;
  color: #ffffff;
  opacity: 0.54;
}

.content__link {
  margin-top: 0.625em;
  font-family: "Roboto", sans-serif;
  font-size: 1em;
  line-height: 1.375em;
  color: #00B4B9;
  text-decoration: none;
  text-transform: none;
  opacity: 1;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.content__link:hover {
  color: #00CCCC;
}
.content__link:active {
  opacity: 0.5;
  text-decoration: underline;
}

.content__bottom .content__container {
  padding-bottom: 3em;
}

.content__sides-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 85%;
  margin-top: 1.25em;
}

.content__side {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 50%;
}

.content__side-button {
  display: block;
  width: 100%;
}
.content__side-button .button {
  margin: 0 auto;
}

.content__side-paragraph {
  max-width: 340px;
  margin-top: 1.11em;
  font-weight: 700;
  text-shadow: 0px 4px 8px rgba(0, 0, 0, 0.65);
}

.content__side-link {
  font-size: 1.125em;
  text-decoration: underline;
}

.content__information {
  position: relative;
  margin-top: 1.75em;
  padding: 1.25em 0;
}

.content__information-back {
  position: absolute;
  top: 0;
  left: 50%;
  width: 115%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
}

.content__information-back-line {
  position: absolute;
  top: 0;
  left: 0;
  width: 25%;
  height: 100%;
  display: block;
  -webkit-transform: skewX(20deg);
      -ms-transform: skewX(20deg);
          transform: skewX(20deg);
}
.content__information-back-line:nth-child(4n+1) {
  left: 0%;
  background-color: #001428;
  opacity: 0.6;
}
.content__information-back-line:nth-child(4n+2) {
  left: 25%;
  background-color: #001428;
  opacity: 0.3;
}
.content__information-back-line:nth-child(4n+3) {
  left: 50%;
  background-color: #2F3064;
  opacity: 0.3;
}
.content__information-back-line:nth-child(4n+4) {
  left: 75%;
  background-color: #2F3064;
  opacity: 0.6;
}

.content__information-text {
  margin-top: 0;
  line-height: 1.166em;
  opacity: 0.85;
}

@media screen and (max-width: 1360px) {
  .content__middle .content__container {
    padding: 0;
  }
  .content__middle .content__container::before {
    display: none;
  }
  .content__middle .content__container::after {
    display: none;
  }

  .content__h1 {
    font-size: 2.5em;
  }

  .content__h2 {
    font-size: 1.25em;
  }
}
.popup {
  position: fixed;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 20, 40, 0.8);
  z-index: 99;
}
.popup.popup--hidden {
  display: none;
}
.popup.popup--visible {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.popup::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.popup__content {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 916px;
  height: auto;
  padding: 2.5em 3.5em;
  background-color: #08376B;
}
.popup__content::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../images/bg_main-2-planets.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-filter: blur(5px);
          filter: blur(5px);
  opacity: 0.2;
}
.popup__content * {
  position: relative;
  z-index: 1;
}

.popup__close {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
}

.popup__title {
  font-size: 2.25em;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0px 8px 30px rgba(0, 0, 0, 0.65);
  opacity: 0.9;
}

.popup__subtitile {
  display: block;
  margin-top: 0.5em;
  font-size: 1.375em;
  font-weight: 400;
  text-align: center;
  text-shadow: 0px 2px 6px rgba(0, 0, 0, 0.54);
  opacity: 0.9;
}

.popup__bonuses-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  grid-row-gap: 1.25em;
  width: 100%;
  max-width: 604px;
  height: auto;
  max-height: 580px;
  margin-top: 2em;
  overflow-y: auto;
}

.popup__bonus-cell {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.popup__bonus-card {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 180px;
  height: 180px;
  background: rgba(89, 69, 71, 0.15);
  z-index: 0;
}
.popup__bonus-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, rgba(14, 11, 56, 0)), to(rgba(26, 34, 63, 0.85)));
  background: -o-linear-gradient(top, rgba(14, 11, 56, 0) 50%, rgba(26, 34, 63, 0.85) 100%);
  background: linear-gradient(180deg, rgba(14, 11, 56, 0) 50%, rgba(26, 34, 63, 0.85) 100%);
  z-index: 1;
}

.popup__bonus-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 0;
}

.popup__bonus-title {
  position: relative;
  width: 100%;
  height: calc(1em * 1.14 * 2);
  margin-bottom: 1em;
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  line-height: 1.14;
  font-size: 0.875em;
  text-align: center;
  z-index: 2;
}

@media screen and (max-width: 960px) {
  .screen__backgrounds {
    width: 100%;
    height: calc(100vw * 13 / 23);
  }
  .screen__backgrounds::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(42.55%, rgba(0, 20, 40, 0.3)), color-stop(87.61%, rgba(0, 20, 40, 0.84)), to(rgba(0, 20, 40, 0)));
    background: -o-linear-gradient(top, rgba(0, 20, 40, 0.3) 42.55%, rgba(0, 20, 40, 0.84) 87.61%, rgba(0, 20, 40, 0) 100%);
    background: linear-gradient(180deg, rgba(0, 20, 40, 0.3) 42.55%, rgba(0, 20, 40, 0.84) 87.61%, rgba(0, 20, 40, 0) 100%);
  }

  main {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }

  .logos {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
  }

  .logo-wrapper {
    width: 30%;
  }

  .content__h1 {
    position: absolute;
    top: calc(100vw * 13 / 23 * 0.63);
    left: 0;
    width: 100%;
    font-size: 1.5em;
  }

  .content__bottom .content__container {
    padding-top: 0;
  }

  .content__sides-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    margin-top: calc(100vw * 13 / 23);
  }

  .content__side {
    width: 100%;
  }

  .content__side.content__side--left::before,
.content__side.content__side--right::before {
    content: "";
    display: block;
    width: 100%;
    max-width: 350px;
    height: 90vw;
    max-height: 350px;
    background-image: url(../images/bg_main-2-compiled.jpg);
    background-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
  }

  .content__side.content__side--left::before {
    background-size: 240%;
    background-position: 20% center;
    -webkit-mask-size: 240%;
            mask-size: 240%;
    -webkit-mask-position: 20% center;
            mask-position: 20% center;
    -webkit-mask-image: url(../images/bg_main-2-mask-alliance.png);
            mask-image: url(../images/bg_main-2-mask-alliance.png);
  }

  .content__side.content__side--right::before {
    background-size: 240%;
    background-position: 80% center;
    -webkit-mask-size: 240%;
            mask-size: 240%;
    -webkit-mask-position: 80% center;
            mask-position: 80% center;
    -webkit-mask-image: url(../images/bg_main-2-mask-empire.png);
            mask-image: url(../images/bg_main-2-mask-empire.png);
  }

  .content__side-link {
    display: none;
  }
}
@media screen and (max-width: 640px) {
  .content__h1 {
    font-size: 1.1em;
  }
}
.footer {
  display: block;
  padding: 1.3125em 0;
  width: 100%;
  background-color: #001428;
}

.footer__row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: 90%;
  max-width: 1600px;
  margin: 0 auto;
}
.footer__row:nth-child(n+2)::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  margin: 1.25em 0;
  background-color: #fff;
  opacity: 0.1;
}

.footer__wargaming-logo {
  display: block;
  margin-right: 3.5625em;
}

.footer__wargaming-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #ffffff;
  text-decoration: none;
  text-transform: none;
}

.footer__menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.footer__links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-right: 3.5625em;
}

.footer__link-wrapper {
  display: inline-block;
  margin-right: 2.5em;
}

.footer__link {
  display: block;
  font-size: 1em;
  font-weight: 400;
  color: #ffffff;
  opacity: 0.54;
  text-decoration: none;
  text-transform: uppercase;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
.footer__link:hover {
  opacity: 1;
}
.footer__link:active {
  text-decoration: underline;
}

.footer__language-picker {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  opacity: 0.54;
  cursor: pointer;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
.footer__language-picker:hover {
  opacity: 1;
}
.footer__language-picker:active {
  opacity: 0.7;
}

.language-picker__icon {
  display: block;
  width: 41px;
  margin-right: 0.25em;
}
.language-picker__icon img {
  display: block;
  width: 100%;
}

.language-picker__language {
  display: block;
  margin-right: 0.25em;
  font-family: "Roboto", sans-serif;
  font-size: 0.75em;
}

.language-picker__realm {
  display: block;
  margin-right: 0.25em;
  font-family: "Roboto", sans-serif;
  font-size: 0.75em;
}

.language-picker__arrow {
  display: block;
  width: 16px;
  height: 16px;
}
.language-picker__arrow svg {
  display: block;
  width: 100%;
  height: 16px;
}

.footer__texts {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

.footer__copyright {
  font-family: "Roboto", sans-serif;
  font-size: 0.75em;
  line-height: 1.16;
  opacity: 0.54;
}

.footer__age-ratings {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-decoration: none;
}

.footer__age-rating {
  display: block;
  height: 50px;
  opacity: 0.8;
}
.footer__age-rating img {
  display: block;
  height: 100%;
}

@media screen and (max-width: 1200px) {
  .footer__row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }

  .footer__wargaming-logo {
    margin: 0;
  }

  .footer__menu {
    margin-top: 1.875em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }

  .footer__links {
    margin: 1.875em 0 0;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }

  .footer__link-wrapper {
    margin: 0 1.25em;
  }

  .footer__texts {
    text-align: center;
  }

  .footer__age-ratings {
    margin-top: 1.25em;
  }
}
@media screen and (max-width: 640px) {
  .footer__links {
    margin-top: 1.25em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }

  .footer__link-wrapper {
    margin: 1.25em 0 0;
  }
  .footer__link-wrapper:first-child {
    margin: 0;
  }
}
.button {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.66em 1em;
  width: 100%;
  max-width: 300px;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.4em;
  line-height: 1.33;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  background-color: #F56914;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
  opacity: 0.9;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  -webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
          box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
.button:hover {
  -webkit-box-shadow: 0px 0px 8px #8A8A9B;
          box-shadow: 0px 0px 8px #8A8A9B;
}
.button:active {
  -webkit-transition: 0.05s;
  -o-transition: 0.05s;
  transition: 0.05s;
  outline: transparent;
  -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.8);
          box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.8);
}
.button.button--empire {
  background-color: #BE2E28;
}
.button.button--alliance {
  background-color: #4970CA;
}
.button.button--windows, .button.button--ps, .button.button--xbox, .button.button--modal {
  opacity: 1;
}
.button.button--windows::before, .button.button--ps::before, .button.button--xbox::before, .button.button--modal::before {
  content: "";
  display: block;
  width: 1.55em;
  height: 1.55em;
  margin-right: 0.6em;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.button.button--ps {
  -webkit-box-shadow: 0 0 0 #003D91;
          box-shadow: 0 0 0 #003D91;
  background-color: #003D91;
}
.button.button--ps:hover {
  -webkit-box-shadow: 0 8px 30px #003D91;
          box-shadow: 0 8px 30px #003D91;
}
.button.button--ps:active, .button.button--ps:focus {
  background-color: #003D91;
  outline: transparent;
}
.button.button--xbox {
  -webkit-box-shadow: 0 0 0 #51A81B;
          box-shadow: 0 0 0 #51A81B;
  background-color: #51A81B;
}
.button.button--xbox:hover {
  -webkit-box-shadow: 0 8px 30px #51A81B;
          box-shadow: 0 8px 30px #51A81B;
}
.button.button--xbox:active, .button.button--xbox:focus {
  background-color: #51A81B;
  outline: transparent;
}
.button.button--modal {
  -webkit-box-shadow: 0 0 0 #000000;
          box-shadow: 0 0 0 #000000;
  background-color: rgba(0, 0, 0, 0.75);
}
.button.button--modal:hover {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.button.button--modal:active, .button.button--modal:focus {
  background-color: none;
  outline: transparent;
}
.button.button--rounded-bottom {
  border-bottom-right-radius: 12px;
  border-bottom-left-radius: 12px;
}

.button__label {
  display: block;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  text-align: center;
  text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5);
}

@media screen and (max-width: 1200px) {
  .button {
    max-width: 250px;
    font-size: 1.125em;
  }
}
body #ot-sdk-btn.ot-sdk-show-settings {
  display: none;
  padding: 0;
  color: #ffffff;
  border: none;
  height: auto;
  white-space: normal;
  word-wrap: break-word;
  font-size: inherit;
  line-height: inherit;
  cursor: pointer;
}

body #ot-sdk-btn.ot-sdk-show-settings:hover {
  background-color: transparent;
  border-bottom: none;
}