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

@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  src: local("Roboto"), local("Roboto-Regular"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-v20-latin-ext_latin_cyrillic-ext_cyrillic-regular.woff2") format("woff2"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-v20-latin-ext_latin_cyrillic-ext_cyrillic-regular.woff") format("woff"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-v20-latin-ext_latin_cyrillic-ext_cyrillic-regular.ttf") format("truetype");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  src: local("Roboto Bold"), local("Roboto-Bold"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-v20-latin-ext_latin_cyrillic-ext_cyrillic-700.woff2") format("woff2"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-v20-latin-ext_latin_cyrillic-ext_cyrillic-700.woff") format("woff"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-v20-latin-ext_latin_cyrillic-ext_cyrillic-700.ttf") format("truetype");
}
@font-face {
  font-family: "Roboto Condensed";
  font-style: normal;
  font-weight: 400;
  src: local("Roboto Condensed"), local("RobotoCondensed-Regular"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-condensed-v18-latin-ext_latin_cyrillic-ext_cyrillic-regular.woff2") format("woff2"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-condensed-v18-latin-ext_latin_cyrillic-ext_cyrillic-regular.woff") format("woff"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-condensed-v18-latin-ext_latin_cyrillic-ext_cyrillic-regular.ttf") format("truetype");
}
@font-face {
  font-family: "Roboto Condensed";
  font-style: normal;
  font-weight: 700;
  src: local("Roboto Condensed Bold"), local("RobotoCondensed-Bold"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-condensed-v18-latin-ext_latin_cyrillic-ext_cyrillic-700.woff2") format("woff2"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-condensed-v18-latin-ext_latin_cyrillic-ext_cyrillic-700.woff") format("woff"), url("https://promo-cdn.worldofwarships.com/global_static/fonts/roboto-condensed-v18-latin-ext_latin_cyrillic-ext_cyrillic-700.ttf") format("truetype");
}
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: black;
}
body:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: black;
  opacity: 0;
  -webkit-transition: opacity 0.3s;
  -o-transition: opacity 0.3s;
  transition: opacity 0.3s;
  z-index: -1;
}
body.body--darked-bg:before {
  opacity: 0.5;
}

.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;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media screen and (max-width: 980px) {
  body {
    background-image: url(https://promo-cdn.worldofwarships.com/glows-31312/src/images/bg_Bismarck.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center right;
  }

  .video-bg__container {
    display: none;
  }
}
@media screen and (max-width: 460px) {
  body {
    font-size: 12px;
  }
}
.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/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4MCA4MCI+PHBhdGggZmlsbD0iI0ZGRiIgZD0iTTU1IDUzczEuOC43IDIuNSAxLjFjLjEuMS4xLjIgMCAuMy0zIDIuOC01LjkgNC42LTEwLjUgNC42LTMuNSAwLTUtMi45LTUtNlYzM2guMUw1NSAzMXYtMmwtMS0xSDQydi0ybC0xLTF2LS4xYzIuOC0uNSA1LTIuOSA1LTUuOSAwLTMuMy0yLjctNi02LTZzLTYgMi43LTYgNmMwIDMgMi4yIDUuNCA1IDUuOXYuMWwtMSAxdjJIMjZsLTEgMXYybDEzIDJ2MjBjMCAzLjEtMS41IDYtNSA2LTQuNiAwLTcuNS0xLjgtMTAuNS00LjYtLjEtLjEtLjEtLjIgMC0uMy43LS40IDIuNS0xLjEgMi41LTEuMS0xLjItLjgtNi4yLTQtOC03djFjLjEgMiAuNSA3LjEgMyAxMSAwIDAgLjktMS44IDEuMS0yLjEuMS0uMS4yLS4xLjMgMCAuNy44IDQuMSA0LjEgOS43IDYuNyA1LjIgMi4zIDguMSA0IDguOSA0LjQuOC0uNSAzLjctMi4xIDguOS00LjQgNS42LTIuNiA5LTUuOSA5LjctNi43LjEtLjEuMi0uMS4zIDAgLjIuMyAxLjEgMi4xIDEuMSAyLjEgMi41LTMuOSAyLjktOSAzLTExdi0xYy0xLjggMy02LjggNi4yLTggN3pNMzYgMTljMC0yLjIgMS44LTQgNC00czQgMS44IDQgNGMwIDEuOC0xLjIgMy4zLTIuOCAzLjhsLjgtLjhzMC0yLTIuMS0yLTEuOSAyLTEuOSAybC44LjhjLTEuNi0uNS0yLjgtMi0yLjgtMy44eiIvPjwvc3ZnPg==);
  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/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMDAgMjAwIiBmaWxsPSJub25lIiBjb2xvcj0iI2ZmZiI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIj48c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLW9wYWNpdHk9IjAiIHN0b3AtY29sb3I9ImN1cnJlbnRDb2xvciIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1vcGFjaXR5PSIuNSIgc3RvcC1jb2xvcj0iY3VycmVudENvbG9yIi8+PC9saW5lYXJHcmFkaWVudD48bGluZWFyR3JhZGllbnQgaWQ9ImIiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9ImN1cnJlbnRDb2xvciIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1vcGFjaXR5PSIuNSIgc3RvcC1jb2xvcj0iY3VycmVudENvbG9yIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PGcgc3Ryb2tlLXdpZHRoPSI4Ij48cGF0aCBzdHJva2U9InVybCgjYSkiIGQ9Ik00IDEwMGE5NiA5NiAwIDAxMTkyIDAiLz48cGF0aCBzdHJva2U9InVybCgjYikiIGQ9Ik0xOTYgMTAwYTk2IDk2IDAgMDEtMTkyIDAiLz48L2c+PC9zdmc+);
  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;
  }
}
.video-bg__container {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  z-index: -2;
}
.video-bg__container video {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center right;
     object-position: center right;
}

@media screen and (max-width: 980px) {
  .video-bg__container {
    display: none;
  }
}
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;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  padding-top: 2.5em;
  padding-bottom: 2.6875em;
  min-height: 565px;
}

@media screen and (max-width: 980px) {
  main {
    padding-top: 2em;
  }
}
.logo__wrapper {
  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: 90%;
  max-width: 740px;
  opacity: 1;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
.logo__wrapper.logo__wrapper--shrinked {
  max-width: 400px;
  -webkit-animation: logoShrinking 0.3s forwards;
          animation: logoShrinking 0.3s forwards;
}
.logo__wrapper svg {
  display: block;
  width: 100%;
  -webkit-filter: drop-shadow(0px 5px 15px rgba(0, 0, 0, 0.25));
          filter: drop-shadow(0px 5px 15px rgba(0, 0, 0, 0.25));
}
@media screen and (min-width: 1920px) {
  .logo__wrapper {
    max-width: 1040px;
  }
}

@-webkit-keyframes logoShrinking {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  100% {
    opacity: 1;
    width: 400px;
  }
}

@keyframes logoShrinking {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  100% {
    opacity: 1;
    width: 400px;
  }
}
.button-wrapper .button {
  margin-top: 1em;
}

main .button.button--floating {
  margin-bottom: 5.625em;
}

.button {
  display: none;
  position: relative;
  -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.8125em 1.5625em;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
  font-size: 2em;
  line-height: 1;
  color: #FFFFFF;
  text-transform: uppercase;
  text-decoration: none;
  text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.55);
  border: 3px solid rgba(0, 180, 185, 0.8);
  border-radius: 0;
  background: rgba(0, 180, 185, 0.35);
  opacity: 0.9;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  outline: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
}
.button:hover, .button:focus, .button:focus-visible {
  background: rgb(0, 180, 185);
  opacity: 1;
}
.button:active {
  opacity: 0.8;
}
.button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.button:disabled:hover {
  background: rgba(0, 180, 185, 0.35);
}
.button.button--showed {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media screen and (max-width: 1279px) {
  .button {
    font-size: 1.5em;
  }
}
.content-button {
  position: relative;
  -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.6875em 2.53125em;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
  font-size: 1em;
  line-height: 1;
  color: #FFFFFF;
  text-transform: uppercase;
  text-decoration: none;
  text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.25);
  background-color: rgba(255, 255, 255, 0.5);
  border: none;
  border-radius: 0;
  opacity: 0.8;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
}
.content-button span {
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  text-decoration: inherit;
  text-transform: inherit;
  color: inherit;
}
.content-button:hover, .content-button:focus-visible {
  opacity: 1;
}
.content-button:active {
  opacity: 0.8;
}

.socials-button {
  position: relative;
  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;
  padding: 0.5em 1.6429em;
  width: 24%;
  min-width: 143px;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
  font-size: 0.875em;
  line-height: 1;
  color: #FFFFFF;
  text-transform: uppercase;
  text-decoration: none;
  text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.25);
  background-color: rgba(255, 255, 255, 0.8);
  border: none;
  border-radius: 0;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
}
.socials-button svg,
.socials-button img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  margin-right: 0.3571em;
}
.socials-button span {
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  text-decoration: inherit;
  text-transform: inherit;
  color: inherit;
}
.socials-button:hover, .socials-button:focus-visible {
  background-color: rgb(255, 255, 255);
}
.socials-button:active {
  opacity: 0.8;
}

.socials-button.socials-button--youtube {
  background-color: rgba(230, 33, 23, 0.8);
}
.socials-button.socials-button--youtube:hover, .socials-button.socials-button--youtube:focus-visible {
  background-color: rgb(230, 33, 23);
}

.socials-button.socials-button--facebook {
  background-color: rgba(66, 103, 178, 0.8);
}
.socials-button.socials-button--facebook:hover, .socials-button.socials-button--facebook:focus-visible {
  background-color: rgb(66, 103, 178);
}

.socials-button.socials-button--twitch {
  background-color: rgba(100, 65, 164, 0.8);
}
.socials-button.socials-button--twitch:hover, .socials-button.socials-button--twitch:focus-visible {
  background-color: rgb(100, 65, 164);
}

.socials-button.socials-button--instagram {
  background-color: rgba(221, 42, 123, 0.8);
}
.socials-button.socials-button--instagram:hover, .socials-button.socials-button--instagram:focus-visible {
  background-color: rgb(221, 42, 123);
}

.socials-button.socials-button--twitter {
  background-color: rgba(40, 170, 225, 0.8);
}
.socials-button.socials-button--twitter:hover, .socials-button.socials-button--twitter:focus-visible {
  background-color: rgb(40, 170, 225);
}

.button-sn-reg {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-negative: 1;
      flex-shrink: 1;
  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;
  padding: 0.5em 2em;
  font-size: 1em;
  color: #FFFFFF;
  text-decoration: none;
  text-transform: uppercase;
  background-color: rgba(0, 180, 185, 0.8);
  border-radius: 1px;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  outline: none;
}
@media (pointer: fine) {
  .button-sn-reg:hover, .button-sn-reg:focus-visible {
    background-color: rgba(0, 180, 185, 0.15);
  }
  .button-sn-reg:active {
    -webkit-transition: all 0s;
    -o-transition: all 0s;
    transition: all 0s;
    background-color: rgba(0, 180, 185, 0.8);
    opacity: 0.8;
  }
}
@media (pointer: coarse) {
  .button-sn-reg:active {
    -webkit-transition: all 0s;
    -o-transition: all 0s;
    transition: all 0s;
    background-color: rgba(0, 180, 185, 0.8);
    opacity: 0.8;
  }
}

.button-sn-reg--color-facebook {
  background-color: rgb(66, 103, 178);
}
@media (pointer: fine) {
  .button-sn-reg--color-facebook:hover, .button-sn-reg--color-facebook:focus-visible {
    background-color: rgba(66, 103, 178, 0.8);
  }
  .button-sn-reg--color-facebook:active {
    background-color: rgba(66, 103, 178, 0.6);
  }
}
@media (pointer: coarse) {
  .button-sn-reg--color-facebook:active {
    background-color: rgba(66, 103, 178, 0.6);
  }
}

.button-sn-reg--color-twitch {
  background-color: rgb(100, 65, 164);
}
@media (pointer: fine) {
  .button-sn-reg--color-twitch:hover, .button-sn-reg--color-twitch:focus-visible {
    background-color: rgba(100, 65, 164, 0.8);
  }
  .button-sn-reg--color-twitch:active {
    background-color: rgba(100, 65, 164, 0.6);
  }
}
@media (pointer: coarse) {
  .button-sn-reg--color-twitch:active {
    background-color: rgba(100, 65, 164, 0.6);
  }
}

.button-sn-reg--color-google {
  background-color: rgb(255, 255, 255);
}
@media (pointer: fine) {
  .button-sn-reg--color-google:hover, .button-sn-reg--color-google:focus-visible {
    background-color: rgba(255, 255, 255, 0.8);
  }
  .button-sn-reg--color-google:active {
    background-color: rgba(255, 255, 255, 0.6);
  }
}
@media (pointer: coarse) {
  .button-sn-reg--color-google:active {
    background-color: rgba(255, 255, 255, 0.6);
  }
}

.button-sn-reg--color-amazon {
  background-color: rgb(97, 106, 115);
}
@media (pointer: fine) {
  .button-sn-reg--color-amazon:hover, .button-sn-reg--color-amazon:focus-visible {
    background-color: rgba(97, 106, 115, 0.8);
  }
  .button-sn-reg--color-amazon:active {
    background-color: rgba(97, 106, 115, 0.6);
  }
}
@media (pointer: coarse) {
  .button-sn-reg--color-amazon:active {
    background-color: rgba(97, 106, 115, 0.6);
  }
}

.forms__close-button {
  position: fixed;
  top: 2.625em;
  right: 2.625em;
  cursor: pointer;
}
.forms__close-button svg {
  display: block;
  width: 36px;
  height: 36px;
  opacity: 0.8;
}

.forms__container {
  display: none;
  position: relative;
  width: 100%;
  max-width: 680px;
  margin: 1.5em auto 0;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.forms__container.form--showed {
  display: block;
}

.forms {
  display: block;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.8);
}

/* support backdrop-filter */
@supports ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
  .forms {
    -webkit-backdrop-filter: blur(5px);
            backdrop-filter: blur(5px);
  }
}
.forms__tabs {
  width: 90%;
  margin: 0 auto;
  padding: 1.5em 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: stretch;
      -ms-flex-pack: stretch;
          justify-content: stretch;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.forms__tab {
  display: block;
  width: 100%;
}
.form__tab-label {
  display: block;
  padding: 0 0.5em;
  font-family: inherit;
  font-size: 1.5em;
  line-height: 1.2;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
}

.forms__subtitle-container {
  width: 90%;
  margin: 0 auto;
  padding: 0.5em 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: stretch;
      -ms-flex-pack: stretch;
          justify-content: stretch;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.forms__subtitle-container::before, .forms__subtitle-container::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #FFFFFF;
  opacity: 0.25;
}

.forms__subtitle {
  display: inline-block;
  margin: 0 1em;
  font-size: 1em;
  line-height: 1.3;
  color: #FFFFFF;
  opacity: 0.7;
  white-space: nowrap;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.forms__sn-reg-container {
  width: 90%;
  margin: 0 auto;
  padding: 0.5em 0;
  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;
}
@media screen and (max-width: 1279px) {
  .forms__sn-reg-container {
    display: grid;
    grid-gap: 12px;
    grid-template-columns: 1fr 1fr;
  }
}

.button-sn-reg {
  margin: 0 0.375em;
}
.button-sn-reg:first-child {
  margin-left: 0;
}
.button-sn-reg:last-child {
  margin-right: 0;
}
@media screen and (max-width: 1279px) {
  .button-sn-reg {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}

.form {
  width: 100%;
  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: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding-top: 0.5em;
}

.form__row {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  padding: 0 5%;
  margin: 0.75em auto 0;
}
.form__row:first-child {
  margin-top: 0;
}
.form__row:last-child {
  margin-top: 2.5em;
}
.form__row.form__row--hidden {
  display: none;
}

.form__input-wrapper {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  -webkit-animation: showField 0.3s forwards;
          animation: showField 0.3s forwards;
}
.form__input-wrapper.form__input-wrapper--half-width {
  width: calc(50% - 6px);
}
.form__input-wrapper.form__input-wrapper--hidden {
  display: none;
}

@-webkit-keyframes showField {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: -webkit-box;
    display: flex;
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes showField {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.form__input {
  display: block;
  width: 100%;
  padding: 0.9375em 6em 0.9375em 1.125em;
  font-family: "Roboto", sans-serif;
  font-size: 0.9em;
  line-height: 1.375;
  color: rgba(255, 255, 255, 0.5);
  background-color: rgba(0, 180, 185, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 0;
  opacity: 1;
  outline: none;
}
.form__input:disabled {
  opacity: 0.3;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.form__input:disabled + * {
  opacity: 0.3;
  cursor: auto;
}
.form__input::-webkit-input-placeholder {
  font-size: 0.9em;
  color: #ffffff;
  opacity: 0.54;
  -webkit-user-select: none;
          user-select: none;
}
.form__input::-moz-placeholder {
  font-size: 0.9em;
  color: #ffffff;
  opacity: 0.54;
  -moz-user-select: none;
       user-select: none;
}
.form__input:-ms-input-placeholder {
  font-size: 0.9em;
  color: #ffffff;
  opacity: 0.54;
  -ms-user-select: none;
      user-select: none;
}
.form__input::-ms-input-placeholder {
  font-size: 0.9em;
  color: #ffffff;
  opacity: 0.54;
  -ms-user-select: none;
      user-select: none;
}
.form__input::placeholder {
  font-size: 0.9em;
  color: #ffffff;
  opacity: 0.54;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.form__input:-webkit-autofill {
  background: rgba(0, 180, 185, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.3);
}
.form__input:-webkit-autofill, .form__input:autofill {
  background: rgba(0, 180, 185, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.3);
}
.form__input[name=login], .form__input[name=invite_code] {
  padding-right: 1.125em;
}
.form__input[type=password]::-ms-reveal {
  display: none;
}

.form__input:focus,
.form__input:focus-visible {
  color: rgb(255, 255, 255);
  background-color: rgba(0, 180, 185, 0.15);
  border: 1px solid rgba(0, 180, 185, 0.9);
}

.form__password-visibility {
  position: absolute;
  top: 50%;
  right: 4em;
  -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
          transform: translate(0, -50%);
  display: block;
  width: 1em;
  height: 1em;
  opacity: 0.54;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.form__password-visibility svg {
  display: block;
  width: 100%;
  height: 100%;
}

.form__hint-icon {
  position: absolute;
  top: 50%;
  right: 1.5em;
  -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
          transform: translate(0, -50%);
  display: block;
  width: 1.5em;
  height: 1.5em;
  opacity: 0.54;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.form__hint-icon svg {
  display: block;
  width: 100%;
  height: 100%;
}
.form__hint-icon.form__hint-icon--inline {
  position: relative;
  display: inline-block;
  width: 1.125em;
  height: 1.125em;
  line-height: 1;
  color: transparent;
  opacity: 1;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOSAuNzJDNC40MzEuNzIuNzIgNC40MzEuNzIgOWMwIDQuNTY5IDMuNzExIDguMjggOC4yOCA4LjI4IDQuNTY5IDAgOC4yOC0zLjcxMSA4LjI4LTguMjhDMTcuMjggNC40MzEgMTMuNTY5LjcyIDkgLjcyem0wIC43MmM0LjE4IDAgNy41NiAzLjM4IDcuNTYgNy41NlMxMy4xOCAxNi41NiA5IDE2LjU2IDEuNDQgMTMuMTggMS40NCA5IDQuODIgMS40NCA5IDEuNDR6bS4xMDQgMy4wNjNjLTEuMzQzIDAtMi4yMzMuODEzLTIuNDI3IDIuMDUzLS4wMTMuMDc4LjAyNS4xMjkuMTAzLjE0MmwuODE0LjE0M2MuMDc3LjAxMy4xMjktLjAyNi4xNDItLjEwNC4xNTUtLjc4Ny42Mi0xLjIyNyAxLjM0Mi0xLjIyNy43MzYgMCAxLjI1Mi40NjUgMS4yNTIgMS4yMDEgMCAuNDQtLjE1NC43MzYtLjYwNiAxLjM1Nkw4Ljg2IDkuMjU1Yy0uMjcxLjM3NC0uMzg3LjY0Ni0uMzg3IDEuMTYydi41M2MwIC4wNzcuMDUxLjEyOS4xMjkuMTI3aC44NTJjLjA3NyAwIC4xMjgtLjA1MS4xMjgtLjEyOXYtLjQxMmMwLS40MzkuMDc4LS42Mi4zMzctLjk2OGwuODY0LTEuMTg5Yy40NC0uNjA3LjY1OS0xLjA1OC42NTktMS42NzggMC0xLjI3OC0uOTQzLTIuMTk1LTIuMzM3LTIuMTk1em0tLjU2NyA3LjU1NGMtLjA3OCAwLS4xMy4wNTItLjEzLjEzdjEuMTFjMCAuMDc3LjA1MS4xMjguMTMuMTI4aC45ODFjLjA3NyAwIC4xMjktLjA1LjEyOS0uMTI4di0xLjExYzAtLjA3Ny0uMDUxLS4xMy0uMTI5LS4xM2gtLjk4MXoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=);
  background-position: center;
  background-size: cover;
  position: relative;
  top: 0;
  right: 0;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
}

.form__hint-text {
  position: absolute;
  bottom: 50%;
  left: calc(95% - 1em);
  display: none;
  padding: 1em 2em;
  width: 100%;
  max-width: 335px;
  font-family: "Roboto", sans-serif;
  font-size: 1em;
  line-height: 1.375;
  background-color: #323234;
  z-index: 1;
}
.form__hint-text.form__hint-text--left-item {
  left: calc(50% - 6px - 1em);
}
.form__hint-text.form__hint-text--visible {
  display: block;
}

.form__hidden-row-button {
  margin-top: 1em;
  margin-left: 5%;
  background: transparent;
  -webkit-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
  border: none;
  opacity: 0.7;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.form__hidden-row-button:hover, .form__hidden-row-button:focus-visible {
  outline: 0;
  opacity: 1;
}
.form__hidden-row-button span {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  line-height: 1.375em;
  color: #00B4B9;
  text-decoration: underline;
}

.form__row#captchaRow {
  margin-top: 1.1em;
}

.form__input-wrapper.form__input-wrapper--captcha {
  background: #FFFFFF;
  opacity: 0.8;
}
.form__input-wrapper.form__input-wrapper--captcha img {
  margin-left: auto;
  margin-right: auto;
  height: 47px;
}

.form__checkbox-label {
  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;
  width: 100%;
}

.form__checkbox-label-text {
  display: block;
  width: calc(100% - 1.5em - 1.875em);
  margin-left: 1.5em;
  font-family: "Roboto", sans-serif;
  font-size: 0.9em;
  line-height: 1.375;
  color: rgba(255, 255, 255, 0.5);
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-transition: color 0.2s;
  -o-transition: color 0.2s;
  transition: color 0.2s;
}

.form__checkbox {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -999;
  opacity: 0;
}
.form__checkbox + .form__checkbox-custom {
  position: relative;
  display: inline-block;
  width: 1.875em;
  height: 1.875em;
}
.form__checkbox + .form__checkbox-custom::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 50%;
  -webkit-transform: translate(50%, -50%);
      -ms-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
  display: block;
  width: 1.875em;
  height: 1.875em;
  border: 1px solid #ffffff;
  opacity: 0.5;
}
.form__checkbox + .form__checkbox-custom::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 50%;
  -webkit-transform: translate(50%, -50%);
      -ms-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
  content: "";
  display: block;
  width: 1.375em;
  height: 1.375em;
  background-color: #ffffff;
  opacity: 0;
}
.form__checkbox:hover ~ .form__checkbox-custom::before, .form__checkbox:focus-visible ~ .form__checkbox-custom::before {
  opacity: 1;
}
.form__checkbox:checked + .form__checkbox-custom::before {
  opacity: 1;
  border: 1px solid rgba(0, 180, 185, 0.9);
}
.form__checkbox:checked + .form__checkbox-custom::after {
  opacity: 1;
  background-color: rgba(0, 180, 185, 0.9);
}
.form__checkbox:checked:hover + .form__checkbox-custom::before {
  border: 1px solid rgb(0, 180, 185);
}
.form__checkbox:checked:hover + .form__checkbox-custom::after {
  background-color: rgb(0, 180, 185);
}
.form__checkbox:hover ~ .form__checkbox-label-text, .form__checkbox:focus-visible ~ .form__checkbox-label-text {
  color: rgb(255, 255, 255);
}
.form__checkbox:checked ~ .form__checkbox-label-text {
  color: rgba(255, 255, 255, 0.8);
}
.form__checkbox:checked:hover ~ .form__checkbox-label-text, .form__checkbox:checked:focus-visible ~ .form__checkbox-label-text {
  color: rgb(255, 255, 255);
}

.form__button-wrapper {
  margin-top: 1.5em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 100%;
}

.form__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.8333em 1.5625em;
  width: 100%;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 700;
  font-size: 1.5em;
  line-height: 1;
  color: #FFFFFF;
  text-transform: uppercase;
  text-decoration: none;
  text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.55);
  border: none;
  border-radius: 0;
  background: rgba(0, 180, 185, 0.8);
  opacity: 0.9;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
}
.form__button span {
  position: relative;
}
.form__button:hover, .form__button:focus-visible, .form__button:focus {
  background: rgb(0, 180, 185);
  opacity: 1;
  outline: 0;
}
.form__button:active {
  opacity: 0.8;
}
.form__button:disabled {
  color: rgba(255, 255, 255, 0.3);
  text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.25);
  background: rgb(15, 86, 88);
  cursor: not-allowed;
}
.form__button:disabled:hover {
  background: rgba(0, 180, 185, 0.35);
}
.form__button.form__button--loading span::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 20px;
  height: 20px;
  background-image: url(https://promo-cdn.worldofwarships.com/glows-31312/src/images/icon_spinner.png);
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-transform: translate(-130%, -50%) rotate(0deg);
      -ms-transform: translate(-130%, -50%) rotate(0deg);
          transform: translate(-130%, -50%) rotate(0deg);
  -webkit-animation-name: spinerRotaion;
          animation-name: spinerRotaion;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}

.forms__footer {
  margin-top: 1.5em;
}

.forms__footer-title-container {
  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: 90%;
  margin: 0 auto;
}

.forms__footer-line {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  display: block;
  height: 1px;
  background-color: #FFFFFF;
  opacity: 0.25;
}

.forms__footer-title {
  display: block;
  margin: 0 0.8em;
  font-size: 1.25em;
  line-height: 1.3;
  color: #FFFFFF;
  opacity: 0.7;
  white-space: nowrap;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.forms__footer-links {
  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;
  margin-top: 1em;
  padding: 1em 0;
  background-color: rgba(0, 0, 0, 0.8);
}

.forms__footer-side {
  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;
  width: calc((100% - 1px) / 2);
  padding: 0 5%;
}

.forms__footer-separator {
  display: block;
  width: 1px;
  height: 3em;
  background-color: #FFFFFF;
  opacity: 0.1;
}

.forms__footer-link {
  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;
  -webkit-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  opacity: 0.8;
}
.forms__footer-link:hover, .forms__footer-link:focus-visible, .forms__footer-link:focus {
  outline: none;
  opacity: 1;
}
.forms__footer-link:active {
  opacity: 0.8;
}

.hidden {
  display: none;
}

.b-message {
  width: 90%;
  margin: 1em auto 0;
  padding: 0.875em 1.125em;
  font-family: "Roboto", sans-serif;
  font-size: 0.9em;
  line-height: 1.1875;
  text-align: left;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.b-message-info {
  background-color: rgba(0, 255, 127, 0.1);
  color: rgb(153, 197, 155);
}
.b-message-info .b-message-icon__error {
  display: none;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.b-message-error {
  background-color: rgba(255, 0, 0, 0.4);
  color: rgb(255, 174, 174);
}

.b-message-error_content {
  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;
  color: rgba(255, 255, 255, 0.7);
}
.b-message-error_content svg {
  margin-right: 0.75em;
}
.b-message-error_content p span {
  color: rgb(255, 255, 255);
}
.b-message-error_content p span:hover {
  color: rgba(255, 255, 255, 0.8);
  text-decoration: underline;
}
.b-message-error_content p span:active {
  color: rgb(255, 255, 255);
  text-decoration: underline;
}
.b-message-error_content a {
  color: #FFFFFF;
  text-decoration: none;
}
.b-message-error_content a:hover {
  opacity: 0.8;
  text-decoration: underline;
}

input.text-input__error {
  color: rgba(255, 174, 174, 0.6);
  background-color: rgba(255, 0, 0, 0.08);
  border: 1px solid rgba(255, 0, 0, 0.4);
}
input.text-input__error:hover, input.text-input__error:focus-visible {
  color: rgb(255, 174, 174);
  background-color: rgba(255, 0, 0, 0.15);
  border: 1px solid rgba(255, 0, 0, 0.4);
}

.label-eula_error .form__checkbox + .form__checkbox-custom:before {
  border-color: rgba(255, 0, 0, 0.4);
}
.label-eula_error .form__checkbox:hover ~ .form__checkbox-label-text, .label-eula_error .form__checkbox:focus-visible ~ .form__checkbox-label-text {
  color: rgb(255, 174, 174);
}
.label-eula_error .form__checkbox-label-text {
  color: rgba(255, 174, 174, 0.6);
}

/* support backdrop-filter */
@supports ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
  .forms__footer-links {
    -webkit-backdrop-filter: blur(5px);
            backdrop-filter: blur(5px);
  }
}
@media screen and (max-width: 1279px) {
  .logo__wrapper.logo__wrapper--shrinked {
    max-width: 250px;
  }

  .forms__tabs,
.forms__subtitle-container,
.forms__sn-reg-container,
.b-message,
.forms__footer-title-container {
    width: 95%;
  }

  .form__row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 0 2.5%;
    margin: 0;
  }
  .form__row:first-child {
    margin-top: 0;
  }
  .form__row:last-child {
    margin-top: 0;
  }

  .forms__close-button {
    top: 2em;
    right: 2.5%;
  }
  .forms__close-button svg {
    width: 24px;
    height: 24px;
  }

  .form__input-wrapper.form__input-wrapper--half-width {
    width: 100%;
  }

  .form__input-wrapper,
.form__checkbox-label {
    margin-top: 0.75em;
  }

  .form__input {
    padding-left: 1em;
    padding-right: 5em;
    font-size: 16px;
  }
  .form__input[name=nickname] {
    padding-right: 3em;
  }
  .form__input[name=login], .form__input[name=invite_code] {
    padding-right: 1em;
  }

  .form__hint-icon {
    right: 1em;
  }

  .form__hint-text {
    position: relative;
    bottom: 0;
    left: 0;
    max-width: 100%;
    padding: 1em 1em;
  }
  .form__hint-text.form__hint-text--left-item {
    left: 0;
  }

  .form__input-wrapper-password {
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
  }

  .form__hint-password {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }

  .form__input-wrapper-repassword {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }

  .form__hint-repassword {
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
  }

  .form__password-visibility {
    right: 3.5em;
  }

  .form__hidden-row-button {
    margin-left: 2.5%;
  }

  .forms__footer-links {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 0;
  }

  .forms__footer-side {
    width: 100%;
    max-width: 375px;
    padding: 1.5em 5%;
  }

  .forms__footer-link.forms__footer-link--windows svg {
    width: 40px;
    height: 40px;
  }
  .forms__footer-link.forms__footer-link--steam svg {
    width: 127px;
    height: 38px;
  }
  .forms__footer-link.forms__footer-link--egs svg {
    width: 42px;
    height: 50px;
  }
  .forms__footer-link.forms__footer-link--xbox svg {
    width: 90px;
    height: 27px;
  }
  .forms__footer-link.forms__footer-link--ps svg {
    width: 160px;
    height: 21px;
  }

  .forms__footer-separator {
    width: 90%;
    height: 1px;
  }
}
@-webkit-keyframes spinerRotaion {
  0% {
    -webkit-transform: translate(-130%, -50%) rotate(0deg);
            transform: translate(-130%, -50%) rotate(0deg);
  }
  100% {
    -webkit-transform: translate(-130%, -50%) rotate(360deg);
            transform: translate(-130%, -50%) rotate(360deg);
  }
}
@keyframes spinerRotaion {
  0% {
    -webkit-transform: translate(-130%, -50%) rotate(0deg);
            transform: translate(-130%, -50%) rotate(0deg);
  }
  100% {
    -webkit-transform: translate(-130%, -50%) rotate(360deg);
            transform: translate(-130%, -50%) rotate(360deg);
  }
}
.message-wrapper {
  display: none;
  position: relative;
  width: 100%;
  max-width: 700px;
  margin: 1.5em auto 0;
  -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;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.message-wrapper.message--showed {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.message {
  display: block;
  width: 100%;
  max-width: 600px;
  background-color: rgba(0, 0, 0, 0.8);
}
.message.message--success .message__header::before,
.message.message--success .message__header::after {
  background-color: rgba(0, 180, 185, 0.9);
}
.message.message--success .message__title {
  color: #00B4B9;
}

/* support backdrop-filter */
@supports ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
  .message {
    -webkit-backdrop-filter: blur(5px);
            backdrop-filter: blur(5px);
  }
}
.message__header {
  width: 90%;
  margin: 0 auto;
  padding: 1.5em 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: stretch;
      -ms-flex-pack: stretch;
          justify-content: stretch;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-family: inherit;
  font-size: 1.5em;
  line-height: 1.2;
  color: #ffffff;
  text-align: center;
}
.message__header::before, .message__header::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #FFFFFF;
  opacity: 0.5;
}

.message__title {
  display: block;
  white-space: nowrap;
  margin: 0 1em;
}

.message__content {
  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%;
  padding: 0 5% 2em;
  margin-top: 1em;
}

.message__content-text {
  display: block;
  width: 100%;
  margin-top: 1em;
  font-size: 1.125em;
  line-height: 1.3333;
  text-align: center;
}

.message__content-email {
  display: block;
  color: #00B4B9;
}

.message__content .content-button {
  margin-top: 1.5em;
}

.message__button {
  margin-top: 0;
}

.message.message--success .message__header::before,
.message.message--success .message__header::after {
  background-color: rgba(0, 180, 185, 0.9);
}
.message.message--success .message__title {
  color: #00B4B9;
}

.message-additional {
  max-width: 600px;
  margin: 0 auto;
}

.message-additional__header {
  width: 90%;
  margin: 0 auto;
  padding: 2em 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: stretch;
      -ms-flex-pack: stretch;
          justify-content: stretch;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-family: inherit;
  font-size: 1.5em;
  line-height: 1.2;
  color: #ffffff;
  text-align: center;
}
.message-additional__header::before, .message-additional__header::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #FFFFFF;
  opacity: 0.5;
}

.message-additional__title {
  display: block;
  white-space: nowrap;
  margin: 0 1em;
}

.message-additional__content {
  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%;
  padding: 0 5%;
}

.message-additional__content-text {
  display: block;
  width: 100%;
  margin-top: 0.8889em;
  font-size: 1.125em;
  line-height: 1.3333;
  text-align: center;
}

.message-additional__button-wrapper {
  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;
  margin-top: 1.5em;
}

.message-socials {
  width: 100%;
}

.message-socials__header {
  width: 90%;
  margin: 0 auto;
  padding: 2em 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: stretch;
      -ms-flex-pack: stretch;
          justify-content: stretch;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-family: inherit;
  font-size: 1.5em;
  line-height: 1.2;
  color: #ffffff;
  text-align: center;
}
.message-socials__header::before, .message-socials__header::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #FFFFFF;
  opacity: 0.5;
}

.message-socials__title {
  display: block;
  white-space: nowrap;
  margin: 0 1em;
}

.message-socials__content {
  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;
  width: 100%;
  margin-top: 1.5em;
}

@media screen and (max-width: 1279px) {
  .message-socials__content {
    width: 90%;
    margin-right: auto;
    margin-left: auto;
    display: grid;
    grid-gap: 10px;
    grid-template-columns: 1fr 1fr;
  }
  .message-socials__content .socials-button {
    width: 100%;
  }
}
@media screen and (max-width: 480px) {
  .message-socials__content {
    grid-template-columns: 1fr;
  }
}
.footer {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding-bottom: 1.5em;
  width: 100%;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(26, 26, 26, 0)), to(#161616));
  background: -o-linear-gradient(top, rgba(26, 26, 26, 0) 0%, #161616 100%);
  background: linear-gradient(180deg, rgba(26, 26, 26, 0) 0%, #161616 100%);
  background-blend-mode: multiply;
}

/* support backdrop-filter */
@supports ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
  .footer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-backdrop-filter: blur(2px);
            backdrop-filter: blur(2px);
    z-index: -1;
  }
}
.footer-container {
  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: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 90%;
}

.footer__links-wrapper {
  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;
  width: 100%;
  margin: 0 auto;
}

.footer__links {
  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;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: 100%;
  margin-top: 1em;
}

.footer__link {
  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;
  margin: 0.5em 1em;
  font-family: "Roboto", sans-serif;
  font-size: 1em;
  color: rgb(0, 180, 185);
  text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.25);
  white-space: nowrap;
  text-decoration: none;
  -webkit-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  opacity: 0.75;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.footer__link:hover, .footer__link:focus-visible {
  opacity: 1;
}
.footer__link:active {
  text-decoration: underline;
}
.footer__link * {
  display: block;
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  text-decoration: inherit;
  text-transform: inherit;
  color: inherit;
  text-shadow: inherit;
  white-space: inherit;
}

.footer__copyright-wrapper {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-size: 1em;
  line-height: 1.375;
  color: #FFFFFF;
  opacity: 0.54;
}
.footer__copyright-wrapper * {
  display: inline-block;
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  text-decoration: inherit;
  text-transform: inherit;
  color: inherit;
}

.language-switcher-wrapper {
  margin-left: 1.25em;
}

.age-ratings-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 100%;
  margin-top: 1em;
}

@media screen and (max-width: 1279px) {
  .footer__links {
    -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;
  }

  .footer__copyright-wrapper {
    width: 100%;
    margin-top: 1.5em;
    text-align: center;
  }

  .language-switcher-wrapper {
    margin: 1.5em auto 0;
  }

  .age-ratings-wrapper {
    margin-top: 0.25em;
  }
}
body #ot-sdk-btn.ot-sdk-show-settings {
  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;
  margin: 0.5em 1em;
  font-family: "Roboto", sans-serif;
  font-size: 1em;
  color: rgb(0, 180, 185) !important;
  text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.25);
  white-space: nowrap;
  text-decoration: none;
  -webkit-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  opacity: 0.75;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  padding: 0;
  border: none !important;
}
body #ot-sdk-btn.ot-sdk-show-settings:hover, body #ot-sdk-btn.ot-sdk-show-settings:focus-visible {
  color: rgb(0, 180, 185);
  opacity: 1;
  border: none !important;
}
body #ot-sdk-btn.ot-sdk-show-settings:active {
  text-decoration: underline;
}

.language-switcher {
  position: relative;
  display: none;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  opacity: 0.8;
  z-index: 1;
}
.language-switcher:hover, .language-switcher:focus-visible {
  opacity: 1;
}
.language-switcher:active {
  opacity: 0.6;
}
.language-switcher.language-switcher--showed {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.language-switcher.language-switcher--active .language-switcher__arrow {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}

.language-switcher__icon {
  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;
}
.language-switcher__icon img {
  display: block;
  margin-right: 0.4375em;
  width: 34px;
  height: 17px;
}

.language-switcher__label {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-size: 1em;
  line-height: 1.375;
  text-align: center;
}

.language-switcher__arrow {
  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;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
.language-switcher__arrow svg {
  display: block;
  width: 12px;
  height: 12px;
}

.language-popup {
  position: relative;
  position: fixed;
  bottom: 0;
  left: 0;
  display: block;
  padding: 1.65em calc(1.65em + 18px + 1.65em);
  width: 100%;
  color: #FFFFFF;
  background-color: #161616;
  opacity: 1;
  -webkit-transform: translateY(120%);
      -ms-transform: translateY(120%);
          transform: translateY(120%);
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  -o-transition: transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  cursor: default;
  z-index: 1;
}
.language-popup.language-popup--showed {
  -webkit-transform: translateY(0%);
      -ms-transform: translateY(0%);
          transform: translateY(0%);
}

.language-popup__closer {
  position: absolute;
  top: 1.65em;
  right: 1.65em;
  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;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
}
.language-popup__closer svg {
  display: block;
  width: 18px;
  height: 18px;
}

.language-popup__title {
  display: block;
  width: 100%;
  font-size: 1.5em;
  line-height: 1.3;
  text-align: center;
}

.language-popup__realms-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 95%;
  max-width: 834px;
  margin: 1.5em auto 0;
}

.language-popup__realm {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: block;
  width: 150px;
  min-height: 150px;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  padding-left: 16px;
  background-position: 16px 0;
  background-size: 150px auto;
  background-repeat: no-repeat;
}
.language-popup__realm.language-popup__realm--eu {
  background-image: url("https://promo-cdn.worldofwarships.com/glows-31312/src/images/bg_realm-eu.png");
}
.language-popup__realm.language-popup__realm--na {
  background-image: url("https://promo-cdn.worldofwarships.com/glows-31312/src/images/bg_realm-na.png");
}
.language-popup__realm.language-popup__realm--asia {
  background-image: url("https://promo-cdn.worldofwarships.com/glows-31312/src/images/bg_realm-asia.png");
}

.language-popup__realm-title {
  display: block;
  width: 100%;
  font-family: "Roboto", sans-serif;
  font-size: 1em;
  line-height: 1.375;
  color: #FFFFFF;
  text-align: left;
}

.language-popup__realm-languages {
  display: block;
  width: 100%;
  margin-top: 0.75em;
}

.language-popup__language {
  display: block;
  width: 100%;
}
.language-popup__language a {
  width: 100%;
  font-family: "Roboto", sans-serif;
  font-size: 0.875em;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.5);
  text-decoration: none;
  -webkit-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
.language-popup__language a:hover, .language-popup__language a:focus-visible {
  color: rgb(255, 255, 255);
}
.language-popup__language--active {
  position: relative;
}
.language-popup__language--active::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translate(-16px, -50%);
      -ms-transform: translate(-16px, -50%);
          transform: translate(-16px, -50%);
  width: 16px;
  height: 16px;
  background-image: url("https://promo-cdn.worldofwarships.com/glows-31312/src/images/icon_arrow-right.svg");
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
}
.language-popup__language--active a {
  color: rgb(255, 255, 255);
}

@media screen and (max-width: 1279px) {
  .language-popup {
    bottom: 0;
    top: 0;
    padding: 1.65em 0;
    overflow-y: auto;
  }

  .language-popup__realms-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    max-width: 375px;
  }

  .language-popup__title {
    padding: 0 calc(1em + 18px + 5px);
  }

  .language-popup__realm {
    margin-top: 2em;
  }
  .language-popup__realm.language-popup__realm--na {
    min-height: 107px;
    background-size: 120px auto;
  }
  .language-popup__realm.language-popup__realm--eu {
    min-height: 99px;
    background-size: 120px auto;
  }
  .language-popup__realm.language-popup__realm--asia {
    min-height: 87px;
    background-size: 120px auto;
  }

  .language-popup__realm-title {
    font-size: 16px;
  }

  .language-popup__language a {
    font-size: 14px;
  }
}
@media screen and (max-width: 375px) {
  .language-popup__realm.language-popup__realm--na, .language-popup__realm.language-popup__realm--eu, .language-popup__realm.language-popup__realm--asia {
    margin-top: 1.6em;
  }
}
/* FOOTER AGE RATINGS START */
.age-ratings {
  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;
  text-decoration: none;
}

.age-ratings__items {
  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;
}

.age-rating__link {
  display: block;
  height: 55px;
  margin: 0 8px;
  opacity: 0.9;
}

.age-rating__link img {
  display: block;
  height: 100%;
}

.age-ratings__description {
  display: block;
  text-align: center;
  margin-top: 10px;
  font-size: 10px;
  opacity: 0.7;
}

@media screen and (max-width: 1279px) {
  .age-ratings {
    margin-top: 1.25em;
  }
}
/* FOOTER AGE RATINGS END */