@font-face {
    font-family: 'Fortnite';
    src: url('/fonts/fortnite.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input,button {
    margin: 0;
    padding: 0;
    list-style-type: none;
    border: none;
    outline: none;
    font-family: 'geologica'
}

body {
    background: #18191F;
    color: #FFFFFF;
    margin: 0;
    height: 100%;
    padding: 0;
    font-size: 22px;
    min-width: 300px;
    font-family: 'geologica'
}

h1,h2,h3,h4,h5 {
    line-height: normal;
    font-weight: lighter;
    font-family: 'Fortnite', 'geologica';
}

h1 {
    font-size: 84px;
    line-height: 92px;
    font-weight: 600;
}

h2 {
    font-size: 48px;
    line-height: 62px;
    font-weight: 600;
}

h3 {
    font-size: 36px;
    line-height: 46px;
    font-weight: 600;
}

h4 {
    font-size: 28px;
    line-height: 40px;
    font-weight: 600;
}

h5 {
    font-size: 20px;
}

h6 {
    font-size: 18px;
}

a {
    color: #418bc1;
    text-decoration: underline;
    outline: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
}

a:hover {
    color: #1e73b0;
    text-decoration: underline;
    outline: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
}

a:visited {
    text-decoration: underline;
    outline: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
}

a img {
    border: 0 none
}

div {
    outline: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
}

div:hover {
    outline: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
}

div:visited {
    outline: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
}

div:focus {
    outline: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
}

/* Fonts Geologica */
@font-face {
    font-family: 'geologica';
    src: url(../fonts/geologica.ttf) format("truetype");
    font-style: normal
}

/* ******* ******* ******* HEADER ******* ******* ******* */
header {
    display: inline-block;
    float: left;
    width: 100%;
    position: fixed;
    z-index: 5000;
    top: 0px;
    left: 0px;
    transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
}

/* Logotype & nav */
.logotype-and-nav {
    margin: 0 auto;
    max-width: 1400px;
    display: block;
    position: relative;
    z-index: 100;
    width: 100%;
}

/* Header logotype */
header .logotype {
    z-index: 200;
    float: left;
    display: inline-block;
    left: 0px;
    padding: 42px 27px 0px 40px;
    margin: 0px 0px 0px 0px;
    position: relative;
}

header .logotype div {
    width: 180px;
    height: 52px;
    display: inline-block;
    float: left;
    background-repeat: no-repeat;
    background-size: 180px 52px;
}

.logotype-colorfull {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 650 200"><defs><linearGradient id="blue-gradient" x1="0%" y1="0%" x2="0%" y2="100%"><stop offset="0%" style="stop-color:%2334b9ff;stop-opacity:1" /><stop offset="100%" style="stop-color:%230078d4;stop-opacity:1" /></linearGradient><filter id="outline-filter" x="-20%" y="-20%" width="140%" height="140%"><feMorphology in="SourceAlpha" result="DILATED" operator="dilate" radius="4"></feMorphology><feFlood flood-color="%23000000" result="FLOODED"></feFlood><feComposite in="FLOODED" in2="DILATED" operator="in" result="OUTLINE"></feComposite><feMerge><feMergeNode in="OUTLINE" /><feMergeNode in="SourceGraphic" /></feMerge></filter><filter id="outline-filter-roleplay" x="-20%" y="-20%" width="140%" height="140%"><feMorphology in="SourceAlpha" result="DILATED" operator="dilate" radius="2.5"></feMorphology><feFlood flood-color="%23000000" result="FLOODED"></feFlood><feComposite in="FLOODED" in2="DILATED" operator="in" result="OUTLINE"></feComposite><feMerge><feMergeNode in="OUTLINE" /><feMergeNode in="SourceGraphic" /></feMerge></filter></defs><g filter="url(%23outline-filter)"><text x="325" y="130" font-family="Impact, Arial Black, sans-serif" font-size="100" fill="url(%23blue-gradient)" text-anchor="middle" font-weight="bold">SUBÚRBIO</text></g><g transform="translate(145, 15) scale(0.18)"><path fill="%23FFFFFF" stroke="%23000000" stroke-width="10" stroke-linejoin="round" d="M152.4,113.9c0,0-15.8-13.8-23-14.5c-7.2-0.7-16.7,5.5-16.7,5.5l-6.1,5.5c0,0-4,3-6.1,2.3s-6.1-4-6.1-4l-4-4.8 c0,0-4-4.8-7.6-4s-15.1,13.8-15.1,13.8l-15.1,18.4c0,0-2.5,3.1-6.1,1.5s-6.1-5.5-6.1-5.5l-6.1-6.2c0,0-4-4.8-6.1-4s-4,4-4,4l-4,4.8 c0,0-2.5,3.1-4,1.5s-4-4.8-4-4.8l-11.1-13c0,0-6.1-6.2-11.1-1.5s2,13,2,13l13.1,34.4c0,0,2,4,6.1,4s6.1-4,6.1-4l4-17.6c0,0,2-7.7,6.1-6.2 c4,1.5,4,9.2,4,9.2l-2,29.9c0,0,0,4,4,4s4-4,4-4l2-21.4c0,0,0-4,4-4s4,4,4,4l-2,21.4c0,0,0,4,4,4s4-4,4-4l2-29.9c0,0,0-7.7,4-9.2 s6.1,6.2,6.1,6.2l4,17.6c0,0,2,4,6.1,4s6.1-4,6.1-4l13.1-34.4c0,0,8.1-14.5,2-13s-11.1,1.5-11.1,1.5l-11.1,13c0,0-2.5,3.1-4,4.8 s-4,1.5-4,1.5l-4-4.8c0,0-4-4-6.1-4s-6.1,5.5-6.1,5.5l-6.1,6.2c0,0-2.5,4-6.1,5.5s-6.1-1.5-6.1-1.5L42.2,132c0,0-11.1-12.2-15.1-13.8 c-4-1.5-7.6,4-7.6,4L15.4,127c0,0-2.5,3.1-6.1,4s-6.1-4-6.1-4l-6.1-5.5c0,0-9.4-6.2-16.7-5.5c-7.2,0.7-23,14.5-23,14.5L-151.6,113.9z"/></g><g filter="url(%23outline-filter-roleplay)" transform="translate(420, 115)"><text x="0" y="40" font-family="Brush Script MT, cursive" font-size="50" fill="%23FFFFFF" font-style="italic">Roleplay</text></g></svg>');
}

.logotype-min {
    display: none;
}

.header::before {
    content: '';
    opacity: 0;
    transition: all .2s ease-in-out;
}

.header.background::before {
    content: '';
    width: 600%;
    position: absolute;
    top: 0px;
    opacity: 1;
    height: 183px;
    z-index: 0;
    left: -300%;
    background: linear-gradient(0deg, rgba(24, 25, 31, 0) 0%, rgba(24, 25, 31, 0.6) 50%, rgba(24, 25, 31, 1) 100%);
}

.header::before {
    content: '';
}

.header.background::before {
    content: '';
    width: 600%;
    position: absolute;
    top: 0px;
    height: 95px;
    z-index: 0;
    left: -300%;
    background: linear-gradient(0deg, rgba(24, 25, 31, 0) 0%, rgba(24, 25, 31, 0.6) 40%, rgba(24, 25, 31, 1) 100%);
}

/* Language */
.language {
    display: inline-block;
    float: right;
    margin: 0px 27px 0px 0px;
    font-size: 18px;
    font-weight: 400;
    line-height: 13px;
    padding: 62px 0px 44px 0px;
    cursor: pointer;
    position: relative;
    width: 150px;
}

.language::before {
    content: '';
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"> <path style="fill:%23FFFFFF;" d="M12,0C5.4,0,0,5.4,0,12s5.4,12,12,12s12-5.4,12-12S18.6,0,12,0z M20.3,7.2h-3.5c-0.4-1.6-1-2.9-1.7-4.3 C17.3,3.7,19.2,5.2,20.3,7.2z M12,2.4c1,1.4,1.8,3,2.3,4.8H9.7C10.2,5.5,11,3.8,12,2.4z M2.8,14.4c-0.2-0.7-0.4-1.6-0.4-2.4 s0.1-1.7,0.4-2.4h4.1c-0.1,0.8-0.1,1.6-0.1,2.4s0.1,1.6,0.1,2.4H2.8z M3.7,16.8h3.5c0.4,1.6,1,2.9,1.7,4.3 C6.7,20.3,4.8,18.8,3.7,16.8z M7.2,7.2H3.7c1.2-2,3-3.5,5.2-4.3C8.2,4.3,7.6,5.6,7.2,7.2z M12,21.6c-1-1.4-1.8-3-2.3-4.8h4.6 C13.8,18.5,13,20.2,12,21.6z M9.2,14.4C9.1,13.6,9,12.8,9,12s0.1-1.6,0.2-2.4h5.6c0.1,0.8,0.2,1.6,0.2,2.4s-0.2,1.6-0.4,2.4H9.2z M15.1,21.1c0.7-1.3,1.3-2.8,1.7-4.3h3.5C19.2,18.8,17.3,20.3,15.1,21.1z M17.3,14.4c0.1-0.8,0.1-1.6,0.1-2.4s-0.1-1.6-0.1-2.4h4.1 c0.2,0.7,0.4,1.6,0.4,2.4s-0.1,1.7-0.4,2.4H17.3z"/> </svg>');
    background-size: 24px 24px;
    width: 24px;
    height: 24px;
    display: inline-block;
    background-repeat: no-repeat;
    margin: -5px 0px 0px 10px;
    z-index: 100;
    position: relative;
    /* float: right; */
    position: absolute;
    right: 0px;
    opacity: 0.6;
    transition: opacity .2s ease-in-out;
}

.language:hover .language-selected {
    opacity: 1;
}

.language:hover::before {
    opacity: 1;
}

.language:hover .language-tooltip {
    opacity: 1;
    visibility: visible;
    top: 105px;
}

.language-selected {
    display: inline-block;
    float: left;
    right: 42px;
    opacity: 0.6;
    transition: opacity .2s ease-in-out;
    position: absolute;
}

.language-tooltip {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 100px;
    text-align: center;
    left: calc(50% + 10px);
    transform: translate(-50%, 0px);
    border-radius: 20px;
    width: 200px;
    background: rgba(24, 25, 31, 0.9);
    backdrop-filter: blur(15px);
    transition: all .2s ease-in-out;
}

.language-tooltip a {
    padding: 20px 34px 20px 34px;
    margin: 0px 0px 0px 0px;
    position: relative;
    opacity: 0.6;
    transition: all .2s ease-in-out;
    width: calc(100% - 68px);
    color: #ffffff;
    text-decoration: none;
    font-weight: 300;
    font-size: 16px;
    line-height: 11px;
    float: left;
    display: inline-block;
}

.language-tooltip a:hover {
    opacity: 1;
}

.language-tooltip a:first-child {
    padding: 34px 34px 20px 34px;
}

.language-tooltip a:last-child {
    padding: 20px 34px 34px 34px;
}

.language-tooltip a.active {
    opacity: 1
}

/* Nav download */
.nav-download {
    display: inline-block;
    float: right;
    margin: 40px 40px 0px 0px;
}

.nav-download a {
    width: auto;
    text-align: left;
    position: relative;
    display: inline-block;
    float: left;
    border-radius: 40px;
    color: #FFF;
    text-decoration: none;
    font-size: 18px;
    font-weight: 300;
    line-height: 13px;
    padding: 21px 36px 21px 36px;
    overflow: hidden;
    background: #00A0EC; /* fallback */
    background: linear-gradient(
            0deg,
            #0088C6 0%,   /* azul mais escuro na base */
            #00A0EC 100%  /* azul claro no topo */
    );
}

.nav-download a span {
    position: relative;
    z-index: 100;
}

.nav-download a span::before {
    content: '';
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18.8 20"> <path style="fill:%23FFFFFF;" d="M8.9,14.8C9,14.9,9,14.9,9.1,14.9C9.2,15,9.3,15,9.4,15c0.2,0,0.4-0.1,0.5-0.2l4.4-5c0.2-0.2,0.2-0.4,0.1-0.7 c0-0.1-0.1-0.2-0.2-0.3c-0.1-0.1-0.2-0.1-0.3-0.1h-2.5V0.6C11.2,0.3,11,0,10.6,0H8.1C7.8,0,7.5,0.3,7.5,0.6v8.1H5 c-0.1,0-0.2,0-0.3,0.1S4.5,9,4.4,9.1C4.3,9.3,4.4,9.6,4.5,9.8L8.9,14.8z"/> <path style="fill:%23FFFFFF;" d="M16.2,13.8v3.8H2.5v-3.8H0v5C0,19.4,0.6,20,1.2,20h16.2c0.7,0,1.2-0.6,1.2-1.2v-5H16.2z"/> </svg>');
    background-size: 18px 19px;
    width: 18px;
    height: 19px;
    display: inline-block;
    float: left;
    background-repeat: no-repeat;
    margin: -3px 15px -7px 0px;
    z-index: 100;
    position: relative;
}

.nav-download a::before {
    content: '';
    background: #0088C6;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0;
    transition: all .2s ease-in-out;
}

.nav-download a:hover::before {
    opacity: 1;
}

.nav-download a:active::before {
    opacity: 1;
    transition: all .1s ease-in-out;
    background: #0088C6
}

/* ******* ******* ******* NAV ******* ******* ******* */
nav > ul > li > a:hover::before {
    opacity: 1;
}

.submenu-0lvl ul li.active > a {
    opacity: 1;
}

nav ul.nav-menu li ul {
    display: none;
}

nav ul.nav-menu li.active ul {
    display: inline-block;
}

nav {
    margin: 0 auto;
    max-width: 1400px;
    display: block;
    position: relative;
    z-index: 100;
    width: 100%;
    height: 0px;
}

.nav-menu {
    display: inline-block;
    float: left;
    margin: 0px 0px 0px 0px;
    width: calc(100% - 655px);
    text-align: center;
}

nav ul li {
    display: inline-block;
}

nav ul li.active > a {
    opacity: 1;
}

nav ul li > a {
    padding: 62px 27px 20px 27px;
    margin: 0px 0px 0px 0px;
    position: relative;
    opacity: 0.6;
    transition: all .2s ease-in-out;
    color: #ffffff;
    text-decoration: none;
    font-weight: 400;
    font-size: 18px;
    line-height: 13px;
    float: left;
    display: inline-block;
    user-select: none;
}

nav ul li > a:hover {
    text-decoration: none;
    opacity: 1;
    color: #ffffff;
}

.nav-background {
    display: inline-block;
    z-index: -200;
    left: 0px;
    float: left;
    position: fixed;
    top: 0px;
    height: 100vh;
    width: 100%;
    visibility: hidden;
    opacity: 0;
}

.nav-background.active {
    visibility: visible;
    opacity: 1;
}

/* Responsive nav */
.nav-button {
    display: none;
}

.nav-background.active::after {
    visibility: visible;
    opacity: 1;
}

.nav-background::after {
    content: '';
    background-color: rgba(24, 25, 31, 0.8);
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0px;
    top: 0px;
    visibility: hidden;
    opacity: 0;
    z-index: 100;
    transition: all .2s ease-in-out;
    backdrop-filter: blur(20px);
}

/* Nav socialmedia */
.nav-socialmedia {
    display: none;
}

/* ******* ******* ******* MAIN ******* ******* ******* */
main {
    position: relative;
    float: left;
    width: 100%;
    overflow: hidden;
    display: inline-block;
    display: flex;
    flex-direction: column;
    align-items: center;
}

section {
    width: 100%;
    position: relative;
    margin: 0 auto;
    max-width: 1400px;
    display: block;
}

.subtitle {
    display: inline-block;
    width: 100%;
    margin: 30px 0px 0px 0px;
    float: left;
    z-index: 400;
    position: relative;
}

.subtitle p {
    display: inline-block;
    margin: -5px 0px -6px 0px;
    font-size: 22px;
    line-height: 27px;
    font-weight: 200;
    opacity: 0.7;
    width: 100%;
}

section:nth-child(1)::before {
    content: '';
    width: 600%;
    position: absolute;
    top: 0px;
    height: 183px;
    z-index: 400;
    left: -300%;
    background: linear-gradient(0deg, rgba(24, 25, 31, 0) 0%, rgba(24, 25, 31, 0.6) 50%, rgba(24, 25, 31, 1) 100%);
}

/* Start play */
.startplay {
    width: calc(100% - 80px);
    display: inline-block;
    float: left;
    margin: 115px 40px 0px 40px;
    position: relative;
    text-align: center;
    z-index: 400;
}

.startplay-container {
    max-width: 1200px;
    width: 100%;
    display: inline-block;
    margin: 18px 0px 0px 0px;
    position: relative;
    min-height: 724px;
}

.startplay-background-element {
    width: 1920px;
    height: 1555px;
    position: absolute;
    display: inline-block;
    float: left;
    top: -200px;
    left: 50%;
    transform: translate(-50%, 0%);
    background-image: url(../images/background-element-ellipse.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -1;
    filter: blur(20px);
    border-radius: 100%;
}

.startplay-container::before {
    width: calc(100% + 0px);
    content: '';
    background-size: contain;
    background-image: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 300"> <text x="50%" y="50%" font-family="Montserrat, sans-serif" font-weight="800" font-size="200" fill="white" text-anchor="middle" dominant-baseline="middle"> SUBÚRBIO </text> </svg>');
    max-width: 1213px;
    height: 271px;
    display: inline-block;
    opacity: 0.03;
    float: left;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    position: absolute;
    top: 0px;
    left: calc(50% - 0px);
    transform: translate(-50%, 0px);
}

.startplay-button a {
    padding: 13px 50px 15px 50px;
    color: #FFF;
    width: auto;
    display: inline-block;
    text-decoration: none;
}

.startplay-button a:hover::before {
    background: rgba(0, 120, 200, 0.72); /* azul médio */
}

.startplay-button a:active::before {
    background: rgba(0, 80, 150, 0.72); /* azul escuro */
}

.startplay-button a::before {
    content: '';
    position: absolute;
    top: -16px;
    left: -16px;
    width: calc(100% + 32px);
    height: calc(100% + 32px);
    border-radius: 60px;
    overflow: hidden;
    background: rgba(0, 160, 236, 0.72); /* azul claro */
    transition: all .2s ease-in-out;
    backdrop-filter: blur(2px);
}

.startplay-button a::after {
    content: '';
    animation: topaboutlink 3s cubic-bezier(0.22, 0.61, 0.32, 1.13) infinite;
    display: inline-block;
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 1;
    border-radius: 120px;
    border: 1px solid #0077CC; /* borda azul vibrante */
    top: 50%;
    z-index: 100;
    left: 50%;
    transform: translate(-50%, -50%);
}


@keyframes topaboutlink {
    from {
        height: 100%;
        width: 100%;
        opacity: 0.5;
    }

    to {
        height: calc(100% + 100px);
        width: calc(100% + 100px);
        opacity: 0;
    }
}

.startplay-button a span {
    position: relative;
    z-index: 100;
    font-size: 18px;
    font-weight: 300;
    line-height: 13px;
}

.startplay-button a .startplay-button-element::before {
    content: '';
    background: #0088C6;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0;
    transition: all .2s ease-in-out;
}

.startplay-button a:hover .startplay-button-element::before {
    opacity: 1;
}

.startplay-button a:active .startplay-button-element::before {
    background: #0088C6;
}

.startplay-button a .startplay-button-element {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    border-radius: 40px;
    overflow: hidden;
    background: #00A0EC; /* fallback */
    background: linear-gradient(
            0deg,
            #0088C6 0%,   /* azul mais escuro na base */
            #00A0EC 100%  /* azul claro no topo */
    );
}

.startplay-button {
    display: inline-block;
    float: left;
    margin: 0px 0px 0px 0px;
    position: absolute;
    left: 0px;
    position: absolute;
    bottom: 278px;
    left: calc(50% + 18px);
    transform: translate(-50%, 0px);
    z-index: 1800;
}

.startplay h1 {
    display: inline-block;
    margin: 25px 0px 0px 0px;
    font-size: 22px;
    line-height: 27px;
    font-weight: 200;
    opacity: 0.7;
    width: 100%;
    max-width: 550px;
}

.startplay-onlineplayers-socialmedia {
    display: inline-block;
    margin: 0px auto -8px auto;
    position: relative;
}

.startplay-onlineplayers-txt {
    display: inline-block;
    float: left;
}

.startplay-onlineplayers-txt span:nth-child(2) {
    display: none;
}

.startplay-onlineplayers {
    position: relative;
    display: inline-block;
    opacity: 1;
    float: left;
    border-radius: 40px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    margin: 0px 0px 0px 0px;
    background-color: rgba(255, 255, 255, 0.05);
    font-size: 18px;
    line-height: 22px;
    font-weight: 400;
    padding: 17px 21px 16px 21px;
    color: rgba(255, 255, 255, 0.6);
    min-width: 235px;
    backdrop-filter: blur(10px);
}

.counter-value-onlineplayers {
    font-size: 24px;
    line-height: 18px;
    font-weight: 400;
    float: left;
    display: inline-block;
    margin: 3px 0px 0px 13px;
    color: #FFF;
}

.startplay-socialmedia {
    display: inline-block;
    float: left;
    /* margin: 2px 0px 0px 50px; */
    margin: 2px 0px 0px 0px;
    position: relative;
}

.startplay-socialmedia a {
    width: 52px;
    height: 52px;
    display: inline-block;
    opacity: 1;
    float: left;
    border-radius: 40px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    transition: all .2s ease-in-out;
    margin: 0px 10px 0px 10px;
    background-color: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
}

.startplay-socialmedia a:hover {
    background-color: rgba(255, 255, 255, 0.3);
}

.startplay-socialmedia a:active {
    background-color: rgba(255, 255, 255, 0.5);
}

.startplay-socialmedia a:first-child {
    margin: 0px 10px 0px 0px;
}

.startplay-socialmedia a:last-child {
    margin: 0px 0px 0px 10px;
}

.startplay-socialmedia-x {
    background-size: 27px 27px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"> <path style="fill:%23FFFFFF;" d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/> </svg>');
}

.startplay-socialmedia-facebook {
    background-size: 16px 32px;
    background-image: url('data:image/svg+xml;utf8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 8.7 17.4" style="enable-background:new 0 0 8.7 17.4;" xml:space="preserve"><path style="fill:%23FFFFFF;" d="M5.4,17.4H2.2V8.7H0V5.4h2.2V3.7C2.2,1.3,3.2,0,6,0h2.7v3.3H6.9c-1.1,0-1.5,0-1.5,0.8v1.4h3L8.1,8.7H5.4V17.4z"/></svg>');
}

.startplay-socialmedia-reddit {
    background-size: 32px 31px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 680"> <path style="fill:%23FFFFFF;" d="M800,332.5c0-50.7-40.6-91.9-90.6-91.9c-23,0-44.8,8.7-61.4,24.3c-59.8-39.5-139.9-65-228.6-68.5l48.9-151.4 l128.5,30.7c0,41.7,33.5,75.6,74.6,75.6s74.6-34,74.6-75.7S712.6,0,671.4,0c-30.8,0-57.2,19-68.6,46 c-27.7-6.6-126.6-30.3-154.3-36.9l-60.4,187c-92,1.7-175.4,27.1-237.5,67.5c-16.4-14.8-37.7-23.1-60-23.1 C40.6,240.6,0,281.9,0,332.5c0,32.2,16.6,61.7,43,78.2C18.9,555.3,186.8,680,398.3,680c210.6,0,378-123.7,355.6-267.4 C782.3,396.5,800,366.3,800,332.5z M223.7,394c0-30.9,25.5-56.8,56-56.8c30.4,0,55.1,25.9,55.1,56.8c0,30.9-24.7,55.9-55.1,55.9 C249.2,449.9,223.7,424.9,223.7,394z M528.9,553.2c-26.9,27.3-69.1,40.5-129,40.5c-59.9,0-102-13.3-128.9-40.5 c-5.8-5.9-5.8-15.5,0-21.5c5.8-5.9,15.3-5.9,21.1,0c21,21.3,56.2,31.7,107.8,31.7c51.5,0,86.8-10.4,107.8-31.7 c5.8-5.9,15.3-5.9,21.1,0C534.8,537.7,534.8,547.3,528.9,553.2z M521.2,449.9c-30.5,0-56-25-56-55.9c0-30.9,25.6-56.8,56-56.8 c30.4,0,55.1,25.8,55.1,56.8C576.3,424.9,551.6,449.9,521.2,449.9z"/></svg>');
}

.startplay-socialmedia-discord {
    background-size: 30px 23px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30.4 23.2"> <path style="fill:%23FFFFFF;" d="M25.8,2C25.8,1.9,25.8,1.9,25.8,2c-2-0.9-4.1-1.6-6.2-2c0,0-0.1,0-0.1,0c-0.3,0.5-0.6,1.1-0.8,1.6c-2.3-0.3-4.7-0.3-7,0 c-0.2-0.5-0.5-1.1-0.8-1.6c0,0-0.1-0.1-0.1,0C8.7,0.4,6.6,1,4.7,1.9c0,0,0,0,0,0c-3.9,5.9-5,11.6-4.5,17.3c0,0,0,0.1,0,0.1 c2.6,1.9,5.1,3.1,7.6,3.8c0,0,0.1,0,0.1,0c0.6-0.8,1.1-1.6,1.6-2.5c0-0.1,0-0.1-0.1-0.1c-0.8-0.3-1.6-0.7-2.4-1.1 c-0.1,0-0.1-0.1,0-0.2c0.2-0.1,0.3-0.2,0.5-0.4c0,0,0.1,0,0.1,0c5,2.3,10.4,2.3,15.3,0c0,0,0.1,0,0.1,0c0.2,0.1,0.3,0.3,0.5,0.4 c0.1,0,0.1,0.1,0,0.2c-0.8,0.4-1.5,0.8-2.4,1.1c-0.1,0-0.1,0.1-0.1,0.1c0.5,0.9,1,1.7,1.6,2.5c0,0,0.1,0,0.1,0 c2.5-0.8,5-1.9,7.6-3.8c0,0,0,0,0-0.1C30.9,12.7,29.2,7,25.8,2z M10.2,15.8c-1.5,0-2.7-1.4-2.7-3.1c0-1.7,1.2-3.1,2.7-3.1 c1.5,0,2.8,1.4,2.7,3.1C12.9,14.4,11.7,15.8,10.2,15.8z M20.3,15.8c-1.5,0-2.7-1.4-2.7-3.1c0-1.7,1.2-3.1,2.7-3.1 c1.5,0,2.8,1.4,2.7,3.1C23,14.4,21.8,15.8,20.3,15.8z"/> </svg>');
}

.startplay-socialmedia-youtube {
    background-size: 32px 32px;
    background-position: 10px y !important;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 25" style="enable-background:new 0 0 25 25;"><path style="fill:%23FFFFFF;" d="M24.5,6.4c-0.3-1.1-1.1-1.9-2.2-2.2c-1.9-0.5-9.8-0.5-9.8-0.5s-7.8,0-9.8,0.5C1.7,4.5,0.8,5.4,0.5,6.4C0,8.4,0,12.5,0,12.5s0,4.1,0.5,6.1c0.3,1.1,1.1,1.9,2.2,2.2c1.9,0.5,9.8,0.5,9.8,0.5s7.8,0,9.8-0.5c1.1-0.3,1.9-1.1,2.2-2.2c0.5-2,0.5-6.1,0.5-6.1S25,8.4,24.5,6.4z M9.9,16.2V8.8l6.5,3.7L9.9,16.2z"/></svg>');
}

.startplay-socialmedia-telegram {
    background-position: 10px 15px !important;
    background-size: 28px 23px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35 29.2"><path style="fill:%23FFFFFF;" d="M32,0.3c0,0,3.2-1.3,3,1.8c-0.1,1.3-0.9,5.7-1.5,10.5l-2.2,14.2c0,0-0.2,2.1-1.8,2.4c-1.6,0.4-4-1.3-4.5-1.6 c-0.4-0.3-6.7-4.3-9-6.3c-0.6-0.5-1.3-1.6,0.1-2.9l9.4-9c1.1-1.1,2.2-3.6-2.3-0.5l-12.6,8.6c0,0-1.4,0.9-4.1,0.1l-5.8-1.8 c0,0-2.2-1.4,1.5-2.7C11.2,8.6,22.2,4.3,32,0.3z"/></svg>');
}

.startplay-socialmedia-pinterest {
    background-size: 30px 30px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30" ><path style="fill:%23FFFFFF;" d="M28,7.5c-1.3-2.3-3.2-4.1-5.5-5.5c-2.3-1.3-4.8-2-7.5-2c-2.7,0-5.2,0.7-7.5,2C5.2,3.4,3.4,5.2,2,7.5 C0.7,9.8,0,12.3,0,15c0,3,0.8,5.8,2.5,8.3c1.7,2.5,3.8,4.3,6.5,5.5c-0.1-1.4,0-2.5,0.3-3.5l1.9-8.2c-0.3-0.6-0.5-1.4-0.5-2.4 c0-1.1,0.3-2,0.8-2.8c0.6-0.7,1.2-1.1,2.1-1.1c0.7,0,1.2,0.2,1.5,0.6c0.4,0.4,0.5,1,0.5,1.6c0,0.4-0.1,0.9-0.2,1.5 c-0.1,0.6-0.3,1.3-0.6,2c-0.2,0.8-0.4,1.4-0.5,1.8c-0.2,0.8,0,1.5,0.4,2c0.5,0.6,1.1,0.8,1.9,0.8c1.4,0,2.5-0.8,3.4-2.3 c0.9-1.5,1.3-3.4,1.3-5.6c0-1.7-0.6-3.1-1.7-4.2c-1.1-1.1-2.6-1.6-4.6-1.6c-2.2,0-4,0.7-5.3,2.1c-1.4,1.4-2,3.1-2,5.1 c0,1.2,0.3,2.2,1,2.9C9,18,9.1,18.3,9,18.6c0,0.1-0.1,0.3-0.2,0.6c-0.1,0.3-0.1,0.5-0.2,0.6c-0.1,0.4-0.4,0.5-0.7,0.4 c-1-0.4-1.8-1.1-2.3-2.2c-0.5-1-0.8-2.2-0.8-3.6c0-0.9,0.1-1.7,0.4-2.6c0.3-0.9,0.7-1.7,1.3-2.5c0.6-0.8,1.3-1.5,2.1-2.2 c0.8-0.6,1.8-1.1,3-1.5C12.9,5.2,14.2,5,15.6,5c1.8,0,3.5,0.4,5,1.2c1.5,0.8,2.6,1.9,3.4,3.2c0.8,1.3,1.2,2.7,1.2,4.2 c0,2-0.3,3.7-1,5.3c-0.7,1.6-1.6,2.8-2.9,3.7c-1.2,0.9-2.6,1.3-4.2,1.3c-0.8,0-1.5-0.2-2.2-0.6c-0.7-0.4-1.2-0.8-1.4-1.3 c-0.6,2.3-0.9,3.7-1.1,4.1c-0.2,0.9-0.8,2-1.5,3.2c1.4,0.4,2.8,0.6,4.3,0.6c2.7,0,5.2-0.7,7.5-2c2.3-1.3,4.1-3.2,5.5-5.5 c1.3-2.3,2-4.8,2-7.5C30,12.3,29.3,9.8,28,7.5z"/></svg>');
}

.startplay-socialmedia-snapchat {
    background-size: 30px 29px;
    background-position: 11px 11px !important;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 31.2 29.3"><path style="fill:%23FFFFFF;" d="M30.6,21.8c-4.2-0.7-6-5-6.1-5.1c-1.2-2.1,2-1.7,3.2-3c1.2-1.2-0.7-2.6-1.9-2c-0.5,0.2-1.2,0.5-1.7,0.3 c0.1-2,0.4-5.2-0.4-7C21-1,13.1-1.2,9.4,2.3C6.6,5,6.9,7.8,7.2,12c-0.9,0.4-1.8-0.4-2.4-0.4c-0.7,0-1.5,0.4-1.6,1.1 c-0.2,0.9,0.8,1.4,1.6,1.8c1.4,0.5,2.7,0.7,2,2.2c0,0,0,0,0,0c-1,2.4-3.3,4.7-6.1,5.1c-0.5,0.1-0.8,0.6-0.5,1.1v0 C0.5,24,3,24.4,4.2,24.6c0.4,0.7,0.1,2,1.2,2c0.4,0,1.3-0.3,2.4-0.3c1.6,0,2.1,0.3,3.4,1.2c1.3,0.9,2.7,1.8,4.5,1.7 c1.8,0.1,3.2-0.7,4.5-1.7l0,0c1.3-0.9,2.2-1.6,5-1.1c2,0.4,1.4-1,1.9-1.9c1.2-0.2,3.6-0.6,4.1-1.7C31.3,22.4,31,21.9,30.6,21.8z"/> </svg>');
}

.startplay-socialmedia-vk {
    background-size: 30px 23px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30.2 18.9"> <path style="fill:%23FFFFFF;" d="M22.5,9.4C24.9,8,28.3,4.6,29.1,0h-4.9c-1.1,3.7-4.2,7.1-7.2,7.5V0h-4.9v13.1c-3-0.8-6.8-4.4-7-13.1H0 c0.2,11.8,6.1,18.9,16.5,18.9h0.6v-6.7c3.8,0.4,6.7,3.2,7.8,6.7h5.4C28.8,13.5,24.9,10.5,22.5,9.4z"/> </svg>');
}

.startplay-socialmedia-instagram {
    background-size: 26px 26px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25.8 25.8"> <path style="fill:%23FFFFFF;" d="M19.3,0H6.4C2.9,0,0,2.9,0,6.4v12.9c0,3.6,2.9,6.4,6.4,6.4h12.9c3.6,0,6.4-2.9,6.4-6.4V6.4 C25.8,2.9,22.9,0,19.3,0z M12.9,19.3c-3.6,0-6.4-2.9-6.4-6.4c0-3.6,2.9-6.4,6.4-6.4c3.6,0,6.4,2.9,6.4,6.4 C19.3,16.5,16.5,19.3,12.9,19.3z M19.8,7.2c-0.7,0-1.3-0.6-1.3-1.3c0-0.7,0.6-1.3,1.3-1.3s1.3,0.6,1.3,1.3 C21.1,6.7,20.5,7.2,19.8,7.2z"/> <circle style="fill:%23FFFFFF;" cx="12.9" cy="12.9" r="3.9"/> </svg>');
}

.startplay-socialmedia-more {
    display: inline-block;
    float: right;
    position: relative;
    z-index: 2000;
    margin: 0px 10px -12px 10px;
    padding: 0px 0px 12px 0px;
}

.startplay-socialmedia-more-button {
    width: 52px;
    height: 52px;
    display: inline-block;
    opacity: 1;
    float: left;
    border-radius: 40px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    transition: all .2s ease-in-out;
    background-color: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
}

.startplay-socialmedia-more-button::before {
    content: '...';
    line-height: 0px;
    font-size: 40px;
    position: absolute;
    left: 10px;
    top: 14px;
}

.startplay-socialmedia-more .startplay-socialmedia-more-tooltip {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 58px;
    left: calc(50% + 0px);
    transform: translate(-50%, 0px);
    border-radius: 30px;
    width: 412px;
    background: rgba(24, 25, 31, 0.9);
    backdrop-filter: blur(15px);
    transition: all .2s ease-in-out;
    padding: 16px;
}

.startplay-socialmedia-more:hover .startplay-socialmedia-more-tooltip {
    opacity: 1;
    visibility: visible;
    top: 64px;
}

.startplay-socialmedia-more:hover .startplay-socialmedia-more-button {
    background-color: rgba(255, 255, 255, 0.3);
}

.startplay-hero-one {
    animation: hero-one-animation 9s ease-in-out infinite alternate;
    background-image: url(../images/hero-one.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    max-width: 361px;
    width: 100%;
    height: 600px;
    position: absolute;
    left: 147px;
    bottom: 65px;
    z-index: 300;
}

.startplay-hero-two {
    animation: hero-two-animation 2s ease-in-out infinite alternate;
    background-image: url(../images/hero-two.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    max-width: 358px;
    width: 100%;
    height: 658px;
    position: absolute;
    bottom: 66px;
    left: calc(49% + 13px);
    transform: translate(-50%, 0px);
    z-index: 400;
}

.startplay-hero-three {
    animation: hero-three-animation 5s ease-in-out infinite alternate;
    background-image: url(../images/hero-three.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    max-width: 274px;
    width: 100%;
    height: 632px;
    position: absolute;
    right: 136px;
    bottom: 66px;
    z-index: 300;
}

@keyframes hero-one-animation {
    from {
        transform: translateX(0px);
    }

    to {
        transform: translateX(10px);
    }
}

@keyframes hero-two-animation {
    from {
        transform: translateX(-39%);
    }

    to {
        transform: translateX(-40%);
    }
}

@keyframes hero-three-animation {
    from {
        transform: translateX(0px);
    }

    to {
        transform: translateX(-5px);
    }
}

.startplay-phonedemonstration {
    width: 626px;
    height: 306px;
    position: absolute;
    bottom: 151px;
    left: calc(50% + 18px);
    transform: translate(-50%, 0px);
    z-index: 700;
}

.startplay-phonedemonstration::before {
    content: '';
    background-image: url(../images/phonedemonstration.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    width: 626px;
    height: 306px;
    left: 0px;
    top: 0px;
    z-index: 200;
    position: absolute;
}

.startplay-phonedemonstration video,
.startplay-phonedemonstration iframe {
    border-radius: 40px;
    overflow: hidden;
    z-index: 100;
    position: absolute;
    width: calc(100% - 22px);
    height: 278px;
    left: 11px;
    top: 15px;
    border: none;
}

.startplay-phonedemonstration img {
    border-radius: 40px;
    overflow: hidden;
    width: calc(100% - 22px);
    position: absolute;
    left: 11px;
    top: 15px;
    z-index: 100;
}

.startplay-car-one {
    background-image: url(../images/car-one.png);
    background-position: 0% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    max-width: 681px;
    width: 100%;
    height: 303px;
    position: absolute;
    left: 30px;
    bottom: -46px;
    z-index: 1000;
}

.startplay-car-two {
    background-image: url(../images/car-two.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    max-width: 611px;
    width: 100%;
    height: 200px;
    position: absolute;
    right: 30px;
    bottom: 20px;
    z-index: 900;
}

.startplay-background-element-boom {
    width: 1210px;
    height: 889px;
    position: absolute;
    display: inline-block;
    bottom: 0px;
    left: 50%;
    transform: translate(-50%, 0%);
    z-index: 0;
    top: 0px;
}

.startplay-background-element-boom::before {
    content: '';
    animation: element-boom-animation-two 10s ease-in-out infinite alternate;
    background-image: url(../images/background-element-boom.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    width: 694px;
    height: 638px;
    position: absolute;
    left: 112px;
    bottom: -81px;
}

.startplay-background-element-boom::after {
    content: '';
    animation: element-boom-animation-three 11s ease-in-out infinite alternate;
    background-image: url(../images/background-element-boom.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    width: 694px;
    height: 638px;
    position: absolute;
    right: 65px;
    bottom: -75px;
    transform: scale(-1, 1);
    rotate: -10deg;
}

@keyframes element-boom-animation-two {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(15deg);
    }
}

@keyframes element-boom-animation-three {
    from {
        transform: rotate(15deg);
    }

    to {
        transform: rotate(0deg);
    }
}

/* How start play */
.howstartplay {
    display: inline-block;
    float: left;
    width: calc(100% - 80px);
    margin: 214px 40px 0px 40px;
    position: relative;
    text-align: center;
}

.howstartplay-buttons {
    display: inline-block;
    width: 100%;
    margin: 64px 0px 0px 0px;
    max-width: 384px;
}

.howstartplay-buttons a {
    width: calc(100% - 52px);
    text-align: left;
    position: relative;
    transition: all .2s ease-in-out;
    display: inline-block;
    float: left;
    border-radius: 20px;
    color: #FFF;
    text-decoration: none;
    font-size: 18px;
    padding: 16px 26px 16px 26px;
    overflow: hidden;
    background: #232429;
}

.howstartplay-buttons a:nth-child(2) {
    margin: 16px 0px 0px 0px;
}

.howstartplay-buttons a span {
    display: inline-block;
    float: left;
    width: calc(100% - 90px);
    margin: 10px 0px 0px 18px;
}

.howstartplay-buttons a span:nth-child(1) {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 200;
    line-height: 10px;
    margin: 16px 0px 0px 18px;
}

.howstartplay-buttons a span:nth-child(2) {
    font-size: 24px;
    font-weight: 400;
    line-height: 18px;
}

.howstartplay-buttons a:hover {
    background-color: #42434A;
}

.howstartplay-buttons a:active {
    background-color: #747173;
}

.howstartplay-button-iphone::before {
    content: '';
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="27" height="33" viewBox="0 0 27 33"><path style="fill:%23FFFFFF;" class="cls-1" d="M348.937,644c-3.606,1.24-6.416,2.481-6.015,7.857C346.527,651.03,349.738,648.962,348.937,644Zm-11.451,7.464A8.957,8.957,0,0,0,329,660.5c0,8.25,5.4,16.5,8.486,16.5,2.314,0,4.243-1.571,5.785-1.571s3.086,1.571,5.4,1.571c3.086,0,6.558-4.714,7.329-9.036-2.7-1.964-4.629-3.142-4.629-6.678,0-2.357,1.929-4.715,4.243-6.679a7.832,7.832,0,0,0-5.785-3.143c-2.315,0-4.8,1.865-6.558,1.965C341.729,653.429,339.8,651.464,337.486,651.464Z" transform="translate(-329 -644)"/></svg>');
    width: 72px;
    height: 72px;
    display: inline-block;
    opacity: 1;
    float: left;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

.howstartplay-button-android::before {
    content: '';
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 67.5 72"> <path style="fill:%232196F3;" d="M37.4,34.6L2.6,69.4C0.9,67.8,0,65.7,0,63.3V8.7c0-2.4,0.9-4.5,2.7-6.2L37.4,34.6z"/> <path style="fill:%23FFC107;" d="M67.5,36c0,3.1-1.7,5.9-4.5,7.5L53,49L40.8,37.7l-3.4-3.1l13-13l12.6,6.9C65.8,30.1,67.5,32.9,67.5,36z"/> <path style="fill:%234CAF50;" d="M37.4,34.6L2.7,2.5c0.4-0.4,1-0.9,1.6-1.2c2.8-1.7,6.3-1.8,9.2-0.1l36.9,20.4L37.4,34.6z"/> <path style="fill:%23F44336;" d="M53.1,49L13.5,70.8c-1.4,0.8-3,1.2-4.5,1.2c-1.6,0-3.2-0.4-4.7-1.3c-0.6-0.4-1.2-0.8-1.7-1.3l34.8-34.8l3.4,3.1 L53.1,49z"/></svg>');
    width: 72px;
    height: 72px;
    display: inline-block;
    opacity: 1;
    float: left;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
;}

.howstartplay-qr {
    display: inline-block;
    width: 100%;
    margin: 64px 0px 0px 25px;
    padding: 16px;
    background: #232429;
    border-radius: 20px;
    max-width: 192px;
}

.howstartplay-qr img {
    display: inline-block;
    float: left;
    width: 100%;
    border-radius: 12px;
}

.howstartplay .subtitle p {
    max-width: 350px;
}

/* Choose your side */
.chooseyourside {
    display: inline-block;
    float: left;
    width: calc(100% - 80px);
    margin: 214px 40px 0px 40px;
    position: relative;
    text-align: center;
    position: relative;
    z-index: 300;
}

.chooseyourside-slider {
    display: inline-block;
    float: left;
    width: calc(100% - 576px);
    margin: 87px 40px 0px 0px;
}

.chooseyourside-gallery {
    display: inline-block;
    float: left;
    width: 535px;
    margin: 87px 0px 0px 0px;
}

.chooseyourside .subtitle p {
    max-width: 650px;
}

.chooseyourside-gallery-content {
    display: inline-block;
    float: left;
    width: 100%;
}

.chooseyourside-gallery-content-mainpic {
    position: relative;
    display: inline-block;
    float: left;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    overflow: hidden;
}

.chooseyourside-gallery-content-mainpic img {
    cursor: pointer;
    width: 100%;
    float: left;
    border-radius: 20px;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: all .2s ease-in-out;
    display: none;
}

.chooseyourside-gallery-content-mainpic img.active {
    opacity: 1;
    visibility: visible;
    display: inline-block;
}

.chooseyourside-gallery-content-pic-buttons img {
    width: calc(33.33% - 28px);
    cursor: pointer;
    display: inline-block;
    float: left;
    border-radius: 14px;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, 0);
    margin: 12px;
    transition: all .2s ease-in-out;
}

.chooseyourside-gallery-content-pic-buttons img.active {
    border: 2px solid rgba(255, 255, 255, 1);
}

.chooseyourside-gallery-content-pic-buttons img:hover {
    border: 2px solid rgba(255, 255, 255, 1);
}

.chooseyourside-gallery-content-pic-buttons-more {
    position: relative;
    width: calc(33.33% - 28px);
    cursor: pointer;
    display: flex;
    float: left;
    border-radius: 20px;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, 0);
    margin: 12px;
    transition: all .2s ease-in-out;
    min-height: 89px;
    background: #232429;
    text-align: left;
    align-content: center;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.chooseyourside-gallery-content-pic-buttons-more:hover {
    background-color: #42434A;
}

.chooseyourside-gallery-content-pic-buttons-more:active {
    background-color: #747173;
}

.chooseyourside-gallery-content-pic-buttons-more::after {
    background-position: 0px 0px;
    content: '';
    background-repeat: no-repeat;
    transform: rotate(-90deg);
    transition: all .3s ease-in-out;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21 12"> <path style="fill:%23FFFFFF;" d="M19.6,0c-0.4,0-0.7,0.2-1,0.4l-8.1,8.2L2.4,0.4C2.1,0.2,1.8,0,1.4,0C0.6,0,0,0.6,0,1.4c0,0.4,0.1,0.7,0.4,1l9,9.1c0.3,0.3,0.7,0.5,1.1,0.5s0.8-0.2,1.1-0.5l9-9.1c0.3-0.3,0.4-0.6,0.4-1C21,0.6,20.4,0,19.6,0z"/></svg>');
    width: 22px;
    height: 12px;
    background-size: 22px 12px;
    opacity: 0.5;
    display: inline-block;
    margin: 0px 15px 0px 0px;
}

.chooseyourside-gallery-content-pic-buttons-more span {
    font-size: 22px;
    line-height: 27px;
    font-weight: 200;
    opacity: 0.7;
    position: relative;
    max-width: 90px;
    display: inline-block;
    text-align: left;
    margin: 0px 0px 0px 20px;
}

.chooseyourside-gallery-content-pic-buttons {
    position: relative;
    display: inline-block;
    float: left;
    width: calc(100% + 24px);
    margin: 12px 0px 0px -12px;
}

/* Choose your side - gallery modal */
.chooseyourside-gallery-modal-box {
    display: inline-block;
    float: left;
    margin: auto;
    width: 100%;
    height: 100%;
    z-index: 400;
    position: relative;
}

.chooseyourside-gallery-modal {
    top: 0px;
    padding: 80px 0px 80px 0px;
    width: calc(100% - 0px);
    height: calc(100% - 160px);
    float: left;
    position: fixed;
    left: 0px;
    z-index: 12000;
    display: none;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    overflow: hidden;
}

.swiper {
    width: 100%;
    height: 100%;
}

.chooseyourside-gallery-content-swiperslide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.chooseyourside-gallery-content-swiperslide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.swiper {
    width: 100%;
    height: 300px;
    margin-left: auto;
    margin-right: auto;
}

.chooseyourside-gallery-content-swiperslide {
    background-size: cover;
    background-position: center;
}

.chooseyourside-gallery-content-swiper-mainpic {
    height: calc(100% - 124px);
    width: 100%;
}

.chooseyourside-gallery-content-swiper-mainpic .swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex ;
    transition-property: transform;
    transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
    box-sizing: content-box;
}

.chooseyourside-gallery-content-swiper-mainpic .swiper-slide {
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-size: cover;
    background-position: center;
    text-align: center;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    height: 100%;
    position: relative;
    float: initial;
    transition-property: transform;
}

.chooseyourside-gallery-content-swiper-mainpic .swiper-slide img {
    max-width: calc(100% - 160px);
    max-height: calc(100% - 0px);
    width: auto;
    height: auto;
    object-fit: initial;
    border-radius: 14px;
    overflow: hidden;
}

.chooseyourside-gallery-content-swiper-pic {
    margin: 40px 0px 0px 0px;
    height: 84px;
    width: 100%;
    display: inline-block;
    float: left;
}

.chooseyourside-gallery-content-swiper-pic.swiper {
    width: 100%;
}

.chooseyourside-gallery-content-swiper-pic .swiper-wrapper {
    display: flex;
    height: 100%;
}

.chooseyourside-gallery-content-swiper-pic .swiper-wrapper .swiper-slide {
    flex-shrink: 0;
    height: 100%;
}

.chooseyourside-gallery-content-swiper-pic .swiper-wrapper .swiper-slide.swiper-slide-active img {
    border: 2px solid rgba(255, 255, 255, 1);
    opacity: 1;
}

.chooseyourside-gallery-content-swiper-pic .chooseyourside-gallery-content-swiperslide-active {
    opacity: 1;
}

.chooseyourside-gallery-content-swiper-pic .chooseyourside-gallery-content-swiperslide {
    width: 25%;
    height: 100%;
    opacity: 0.4;
}

.chooseyourside-gallery-content-swiper-pic .swiper-wrapper .swiper-slide img {
    cursor: pointer;
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    margin: 0px 0px 0px 0px;
    border-radius: 14px;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, 0);
    transition: all .2s ease-in-out;
    opacity: 0.4;
    object-fit: cover;
}

.chooseyourside-gallery-content-swiper-pic .swiper-wrapper .swiper-slide img:hover {
    border: 2px solid rgba(255, 255, 255, 1);
}

.chooseyourside-gallery-content-swiper-pic .swiper-wrapper .swiper-slide.swiper-slide-thumb-active img {
    border: 2px solid rgba(255, 255, 255, 1);
    opacity: 1;
}

.chooseyourside-gallery-content-swiper-pic .chooseyourside-gallery-content-swiperslide-thumb-active {
    opacity: 1;
}

.chooseyourside-gallery-content-swiperslide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.chooseyourside-gallery-modal.active {
    display: flex;
}

.chooseyourside-gallery-modal::before {
    content: '';
    background-color: rgba(24, 25, 31, 0.8);
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0px;
    top: 0px;
    visibility: hidden;
    opacity: 0;
    z-index: 100;
    transition: all .2s ease-in-out;
    backdrop-filter: blur(20px);
}

.chooseyourside-gallery-modal.active::before {
    visibility: visible;
    opacity: 1;
}

.chooseyourside-gallery-modal-close {
    padding: 80px 80px 40px 40px;
    display: inline-block;
    float: left;
    background-position: 36px 40px;
    height: 22px;
    width: 22px;
    background-size: 22px 22px;
    position: absolute;
    background-repeat: no-repeat;
    cursor: pointer;
    z-index: 9000;
    top: 0px;
    right: 0px;
}

.chooseyourside-gallery-modal-close::before {
    content: '';
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 20"> <path style="fill:%23FFFFFF;" d="M13.6,10l8.3-9.2C22.2,0.5,21.9,0,21.5,0h-3.8c-0.1,0-0.3,0.1-0.4,0.2l-6.3,7l-6.3-7C4.6,0.1,4.4,0,4.3,0H0.5 C0.1,0-0.2,0.5,0.1,0.8L8.4,10l-8.3,9.2C-0.2,19.5,0.1,20,0.5,20l3.8,0c0.1,0,0.3-0.1,0.4-0.2l6.3-7l6.3,7c0.1,0.1,0.2,0.2,0.4,0.2 l3.8,0c0.4,0,0.7-0.5,0.4-0.8L13.6,10z"/></svg>');
    background-size: 22px 20px;
    width: 22px;
    height: 20px;
    display: inline-block;
    background-repeat: no-repeat;
    margin: 0px 0px 0px 0px;
    z-index: 100;
    position: relative;
    float: right;
    opacity: 0.5;
    transition: opacity .2s ease-in-out;
}

.chooseyourside-gallery-modal-close:hover::before {
    opacity: 1;
}

.chooseyourside-gallery-modal-close:active::before {
    opacity: 1;
}

.modal-active {
    overflow: hidden;
}

.chooseyourside-gallery-content-swiper-mainpic-button-prev {
    width: 100px;
    height: 100px;
    position: absolute;
    cursor: pointer;
    top: calc(50% - 42px);
    left: 80px;
    z-index: 9000;
    display: inline-block;
    opacity: 1;
    border-radius: 80px;
    background-position: 50% 55%;
    background-repeat: no-repeat;
    transition: all .2s ease-in-out;
    background-color: rgba(255, 255, 255, 0.03);
    transform: rotate(90deg) translate(-40%, 0px);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21 12"> <path style="fill:%23FFFFFF;" d="M19.6,0c-0.4,0-0.7,0.2-1,0.4l-8.1,8.2L2.4,0.4C2.1,0.2,1.8,0,1.4,0C0.6,0,0,0.6,0,1.4c0,0.4,0.1,0.7,0.4,1l9,9.1c0.3,0.3,0.7,0.5,1.1,0.5s0.8-0.2,1.1-0.5l9-9.1c0.3-0.3,0.4-0.6,0.4-1C21,0.6,20.4,0,19.6,0z"/></svg>');
    background-size: 31px 18px;
    backdrop-filter: blur(10px);
}

.chooseyourside-gallery-content-swiper-mainpic-button-next {
    position: absolute;
    height: 100px;
    width: 100px;
    cursor: pointer;
    display: inline-block;
    z-index: 9000;
    opacity: 1;
    border-radius: 80px;
    background-position: 50% 55%;
    background-repeat: no-repeat;
    transition: all .2s ease-in-out;
    background-color: rgba(255, 255, 255, 0.03);
    top: calc(50% - 150px);
    right: 80px;
    transform: rotate(-90deg) translate(-40%, 0px);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21 12"> <path style="fill:%23FFFFFF;" d="M19.6,0c-0.4,0-0.7,0.2-1,0.4l-8.1,8.2L2.4,0.4C2.1,0.2,1.8,0,1.4,0C0.6,0,0,0.6,0,1.4c0,0.4,0.1,0.7,0.4,1l9,9.1c0.3,0.3,0.7,0.5,1.1,0.5s0.8-0.2,1.1-0.5l9-9.1c0.3-0.3,0.4-0.6,0.4-1C21,0.6,20.4,0,19.6,0z"/></svg>');
    background-size: 31px 18px;
    backdrop-filter: blur(10px);
}

.chooseyourside-gallery-content-swiper-mainpic-button-next:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.chooseyourside-gallery-content-swiper-mainpic-button-next:active {
    background-color: rgba(255, 255, 255, 0.4);
}

.chooseyourside-gallery-content-swiper-mainpic-button-prev:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.chooseyourside-gallery-content-swiper-mainpic-button-prev:active {
    background-color: rgba(255, 255, 255, 0.4);
}

.chooseyourside-gallery-content-swiper-mainpic-button-prev.swiper-button-disabled {
    display: none;
}

.chooseyourside-gallery-content-swiper-mainpic-button-next.swiper-button-disabled {
    display: none;
}

/* Choose your side - gallery modal smartphone */
.chooseyourside-gallery-modal-smartphone {
    display: none;
}

.chooseyourside-gallery-modal-smartphone {
    top: 0px;
    padding: 0px 0px 0px 0px;
    width: calc(100% - 0px);
    height: calc(100% - 176px);
    float: left;
    position: relative;
    left: 0px;
    z-index: 12000;
    display: none;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    overflow: hidden;
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone {
    height: 80%;
    width: 100%;
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone .swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex ;
    transition-property: transform;
    transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
    box-sizing: content-box;
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone .swiper-slide {
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-size: cover;
    background-position: center;
    text-align: center;
    font-size: 18px;
    /* background: #fff; */
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    height: 100%;
    position: relative;
    float: initial;
    transition-property: transform;
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone .swiper-slide img {
    max-width: calc(100% - 0px);
    max-height: calc(100% - 0px);
    width: auto;
    height: auto;
    object-fit: initial;
    border-radius: 14px;
    overflow: hidden;
    margin: 0px 0px 0px 0px;
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone-button-prev {
    display: none;
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone-button-next {
    display: none;
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone-button-next:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone-button-next:active {
    background-color: rgba(255, 255, 255, 0.4);
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone-button-prev:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone-button-prev:active {
    background-color: rgba(255, 255, 255, 0.4);
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone-button-prev.swiper-button-disabled {
    display: none;
}

.chooseyourside-gallery-content-swiper-mainpic-smartphone-button-next.swiper-button-disabled {
    display: none;
}

.chooseyourside-gallery-content-swiper-pic-smartphone {
    margin: 12px 0px 0px 0px;
    width: 100%;
    max-width: 1600px;
    position: relative;
}

.chooseyourside-gallery-content-swiper-pic-smartphone:before {
    content: '';
    position: absolute;
    left: 0px;
    height: calc(100% + 10px);
    width: 40px;
    top: -5px;
    z-index: 70;
    background: linear-gradient(to right, rgba(24, 25, 31, 1) 0%, rgba(24, 25, 31, 0) 100%);
}

.chooseyourside-gallery-content-swiper-pic-smartphone:after {
    content: '';
    position: absolute;
    right: 0px;
    height: calc(100% + 10px);
    width: 40px;
    top: -5px;
    z-index: 70;
    background: linear-gradient(to right, rgba(24, 25, 31, 0) 0%,rgba(24, 25, 31, 1) 100%);
}

.chooseyourside-gallery-content-swiper-pic-smartphone.swiper {
    width: 100%;
}

.chooseyourside-gallery-content-swiper-pic-smartphone .swiper-wrapper {
    display: flex;
}

.chooseyourside-gallery-content-swiper-pic-smartphone .swiper-wrapper .swiper-slide {
    flex-shrink: 0;
    height: 60px;
}

.chooseyourside-gallery-content-swiper-pic-smartphone .chooseyourside-gallery-content-swiperslide {
    width: 25%;
    height: 100%;
    opacity: 0.4;
}

.chooseyourside-gallery-content-swiper-pic-smartphone .swiper-wrapper .swiper-slide img {
    cursor: pointer;
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    margin: 0px 0px 0px 0px;
    border-radius: 14px;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, 0);
    transition: all .2s ease-in-out;
    opacity: 0.4;
    object-fit: cover;
}

.chooseyourside-gallery-content-swiper-pic-smartphone .swiper-wrapper .swiper-slide img:hover {
    border: 2px solid rgba(255, 255, 255, 1);
}

.chooseyourside-gallery-content-swiper-pic-smartphone .swiper-wrapper .swiper-slide.swiper-slide-thumb-active img {
    border: 2px solid rgba(255, 255, 255, 1);
    opacity: 1;
}

.chooseyourside-gallery-content-swiper-pic-smartphone .chooseyourside-gallery-content-swiperslide-thumb-active {
    opacity: 1;
}

.chooseyourside-gallery-content-swiper-pic-smartphone .swiper-wrapper .swiper-slide.swiper-slide-active img {
    border: 2px solid rgba(255, 255, 255, 1);
    opacity: 1;
}

.chooseyourside-gallery-content-swiper-pic-smartphone .chooseyourside-gallery-content-swiperslide-active {
    opacity: 1;
}

/* Choose your side - slider fade */
.chooseyourside-slider-swiper-fade {
    width: 100%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
    display: block;
    margin: 0px 0px 0px 0px;
}

.chooseyourside-slider-swiper-fade-slide {
    background-position: center;
    background-size: cover;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
    display: block;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    pointer-events: none;
    transition-property: opacity;
    opacity: 0 !important;
}

.chooseyourside-slider-swiper-fade-slide.swiper-slide-prev {
    opacity: 0 !important;
}

.chooseyourside-slider-swiper-fade-slide.swiper-slide-next {
    opacity: 0 !important;
}

.chooseyourside-slider-swiper-fade-slide.swiper-slide-active {
    opacity: 1 !important;
    z-index: 500;
    position: relative;
    pointer-events: initial;
}

.chooseyourside-slider-swiper-fade-slide img {
    display: block;
    width: calc(100% - 160px);
    margin: 0px 80px 0px 80px;
}

.chooseyourside-slider-swiper-fade .swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    transition-property: transform;
    transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
    box-sizing: content-box;
    transform: translate3d(0px, 0, 0);
    z-index: 500;
}

.chooseyourside-slider-swiper-fade-button-prev {
    width: 74px;
    height: 74px;
    position: absolute;
    cursor: pointer;
    top: calc(57% - 10px);
    left: 0px;
    z-index: 9000;
    display: inline-block;
    opacity: 1;
    border-radius: 80px;
    background-position: 50% 55%;
    background-repeat: no-repeat;
    transition: all .2s ease-in-out;
    background-color: rgba(255, 255, 255, 0.03);
    transform: rotate(90deg) translate(-40%, 0px);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21 12"> <path style="fill:%23FFFFFF;" d="M19.6,0c-0.4,0-0.7,0.2-1,0.4l-8.1,8.2L2.4,0.4C2.1,0.2,1.8,0,1.4,0C0.6,0,0,0.6,0,1.4c0,0.4,0.1,0.7,0.4,1l9,9.1c0.3,0.3,0.7,0.5,1.1,0.5s0.8-0.2,1.1-0.5l9-9.1c0.3-0.3,0.4-0.6,0.4-1C21,0.6,20.4,0,19.6,0z"/></svg>');
    background-size: 26px 15px;
    /* backdrop-filter: blur(10px); */
}

.chooseyourside-slider-swiper-fade-button-next {
    position: absolute;
    height: 74px;
    width: 74px;
    cursor: pointer;
    display: inline-block;
    z-index: 9000;
    opacity: 1;
    border-radius: 80px;
    background-position: 50% 55%;
    background-repeat: no-repeat;
    transition: all .2s ease-in-out;
    background-color: rgba(255, 255, 255, 0.03);
    top: calc(57% - 70px);
    right: 0px;
    transform: rotate(-90deg) translate(-40%, 0px);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21 12"> <path style="fill:%23FFFFFF;" d="M19.6,0c-0.4,0-0.7,0.2-1,0.4l-8.1,8.2L2.4,0.4C2.1,0.2,1.8,0,1.4,0C0.6,0,0,0.6,0,1.4c0,0.4,0.1,0.7,0.4,1l9,9.1c0.3,0.3,0.7,0.5,1.1,0.5s0.8-0.2,1.1-0.5l9-9.1c0.3-0.3,0.4-0.6,0.4-1C21,0.6,20.4,0,19.6,0z"/></svg>');
    background-size: 26px 15px;
    backdrop-filter: blur(10px);
}

.chooseyourside-slider-swiper-fade-button-next:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.chooseyourside-slider-swiper-fade-button-next:active {
    background-color: rgba(255, 255, 255, 0.4);
}

.chooseyourside-slider-swiper-fade-button-prev:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.chooseyourside-slider-swiper-fade-button-prev:active {
    background-color: rgba(255, 255, 255, 0.4);
}

.chooseyourside-slider-swiper-fade-button-prev.swiper-button-disabled {
    display: none;
}

.chooseyourside-slider-swiper-fade-button-next.swiper-button-disabled {
    display: none;
}

.chooseyourside-slider-swiper-fade.swiper {
    width: 100%;
    height: auto;
    padding: 0px 0px 24px 0px;
    overflow: initial;
}

.chooseyourside-slider-swiper-fade.swiper::before {
    content: '';
    width: 806px;
    height: 745px;
    position: absolute;
    display: inline-block;
    float: left;
    left: 50%;
    top: -90px;
    opacity: 0.7;
    transform: translate(-50%, 0%);
    background-image: url(../images/background-element-ellipse.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -1;
    filter: blur(30px);
    border-radius: 100%;
}

.chooseyourside-slider-swiper-fade-pagination {
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translate(-50%, 0%);
    z-index: 9000;
    display: inline-block;
    opacity: 1;
    border-radius: 80px;
    background-position: 50% 55%;
    background-repeat: no-repeat;
    transition: all .2s ease-in-out;
    background-color: rgba(255, 255, 255, 0.03);
}

.chooseyourside-slider-swiper-fade-pagination .swiper-pagination-bullet {
    background-color: #42434A;
    width: 45px;
    height: 6px;
    text-align: left;
    position: relative;
    display: inline-block;
    float: left;
    border-radius: 40px;
    color: #FFF;
    text-decoration: none;
    font-size: 18px;
    font-weight: 300;
    line-height: 13px;
    cursor: pointer;
    margin: 0px 2px 0px 2px;
}

.swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: #00A0EC; /* fallback */
}

.chooseyourside-slider-swiper-button {
    display: inline-block;
    float: right;
    margin: 0px 0px 0px 0px;
    z-index: 200;
    left: 50%;
    transform: translate(-50%, 64px);
    position: absolute;
}

.chooseyourside-slider-swiper-button a {
    width: auto;
    text-align: left;
    position: relative;
    display: inline-block;
    float: left;
    border-radius: 40px;
    color: #FFF;
    text-decoration: none;
    font-size: 18px;
    font-weight: 300;
    line-height: 13px;
    padding: 21px 36px 21px 36px;
    overflow: hidden;
    background: #00A0EC; /* fallback */
    background: linear-gradient(
            0deg,
            #0088C6 0%,   /* azul mais escuro na base */
            #00A0EC 100%  /* azul claro no topo */
    );
    min-width: 278px;
    text-align: center;
}

.chooseyourside-slider-swiper-button a span {
    position: relative;
    z-index: 100;
}

.chooseyourside-slider-swiper-button a::before {
    content: '';
    background: #0088C6;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0;
    transition: all .2s ease-in-out;
}

.chooseyourside-slider-swiper-button a:hover::before {
    opacity: 1;
}

.chooseyourside-slider-swiper-button a:active::before {
    opacity: 1;
    transition: all .1s ease-in-out;
    background: #0088C6
}

.chooseyourside-slider-swiper-title {
    font-size: 70px;
    line-height: 62px;
    font-weight: 600;
    opacity: 0.3;
    display: inline-block;
    float: right;
    margin: 0px 0px 0px 0px;
    z-index: 200;
    left: 50%;
    transform: translate(-50%, -77px);
    position: absolute;
}

.chooseyourside-slider-swiper-element {
    display: inline-block;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
}

.chooseyourside-slider-swiper-element-one {
    display: inline-block;
    position: absolute;
    width: 18%;
    height: 23%;
    left: 30%;
    top: 0%;
    cursor: pointer;
    z-index: 1400;
}

.chooseyourside-slider-swiper-element-two {
    display: inline-block;
    position: absolute;
    width: 37%;
    height: 44%;
    right: 11%;
    top: 8%;
    cursor: pointer;
    z-index: 1400;
}

.img-chooseyourside-slider-swiper-element-one {
    position: absolute;
    top: 0px;
    left: 0px;
    opacity: 0;
}

.img-chooseyourside-slider-swiper-element-two {
    position: absolute;
    top: 0px;
    left: 0px;
    opacity: 0;
}

.img-chooseyourside-slider-swiper-element-one.active {
    opacity: 1;
}

.img-chooseyourside-slider-swiper-element-two.active {
    opacity: 1;
}

.img-chooseyourside-slider-swiper-element-three.disabled {
    opacity: 0;
}

/* Join the 1000000 */
.jointhemillion {
    display: inline-block;
    float: left;
    width: calc(100% - 80px);
    margin: 214px 40px 0px 40px;
    position: relative;
    text-align: center;
    position: relative;
    z-index: 300;
}

.jointhemillion-buttons {
    display: inline-block;
    width: 100%;
    margin: 80px 0px 0px 0px;
    max-width: 984px;
}

.jointhemillion-buttons a {
    width: calc(50% - 56px);
    text-align: left;
    position: relative;
    transition: all .2s ease-in-out;
    display: inline-block;
    float: left;
    border-radius: 20px;
    color: #FFF;
    text-decoration: none;
    font-size: 18px;
    padding: 20px 24px 20px 24px;
    overflow: hidden;
    background: #232429;
}

.jointhemillion-buttons a::after {
    content: '';
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18.8 20"> <path style="fill:%23FFFFFF;" d="M8.9,14.8C9,14.9,9,14.9,9.1,14.9C9.2,15,9.3,15,9.4,15c0.2,0,0.4-0.1,0.5-0.2l4.4-5c0.2-0.2,0.2-0.4,0.1-0.7 c0-0.1-0.1-0.2-0.2-0.3c-0.1-0.1-0.2-0.1-0.3-0.1h-2.5V0.6C11.2,0.3,11,0,10.6,0H8.1C7.8,0,7.5,0.3,7.5,0.6v8.1H5 c-0.1,0-0.2,0-0.3,0.1S4.5,9,4.4,9.1C4.3,9.3,4.4,9.6,4.5,9.8L8.9,14.8z"/> <path style="fill:%23FFFFFF;" d="M16.2,13.8v3.8H2.5v-3.8H0v5C0,19.4,0.6,20,1.2,20h16.2c0.7,0,1.2-0.6,1.2-1.2v-5H16.2z"/> </svg>');
    background-size: 18px 19px;
    width: 18px;
    height: 19px;
    display: inline-block;
    float: left;
    background-repeat: no-repeat;
    z-index: 100;
    position: absolute;
    right: 15px;
    top: calc(50% - 10px);
    transform: translate(-50%, 0%);
    opacity: 0.6;
}

.jointhemillion-buttons a:nth-child(1) {
    margin: 0px 8px 0px 0px;
}

.jointhemillion-buttons a:nth-child(2) {
    margin: 0px 0px 0px 8px;
}

.jointhemillion-buttons a span {
    display: inline-block;
    float: left;
    width: calc(100% - 90px);
    margin: 14px 0px 0px 18px;
}

.jointhemillion-buttons a span:nth-child(2) {
    font-size: 24px;
    font-weight: 400;
    line-height: 18px;
    margin: 16px 0px 0px 18px;
}

.jointhemillion-buttons a span:nth-child(3) {
    font-size: 16px;
    font-weight: 200;
    line-height: 10px;
    opacity: 0.6;
}

.jointhemillion-buttons a:hover {
    background-color: #42434A;
}

.jointhemillion-buttons a:active {
    background-color: #747173;
}

.jointhemillion-button-iphone .icon::before {
    content: '';
    width: 72px;
    height: 72px;
    display: inline-block;
    opacity: 1;
    float: left;
    position: absolute;
    border-radius: 14px;
    background: linear-gradient(0deg, rgba(0, 115, 246, 1) 0%, rgba(0, 191, 252, 1) 100%);
}

.jointhemillion-button-iphone .icon::after {
    content: '';
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52.4 46.3" > <path style="fill:%23FFFFFF;" d="M29.4,29.2H19.2l14-24.3c0.9-1.6,0.4-3.6-1.2-4.5c-1.6-0.9-3.6-0.4-4.5,1.2l-1.5,2.5l-1.4-2.5 c-0.9-1.6-2.9-2.1-4.5-1.2c-1.6,0.9-2.1,2.9-1.2,4.5l3.3,5.8L11.6,29.2H3.3c-1.8,0-3.3,1.5-3.3,3.3c0,1.8,1.5,3.3,3.3,3.3h29.8 C34.5,33.1,32.6,29.2,29.4,29.2z"/> <path style="fill:%23FFFFFF;" d="M7,37.3l-2.3,4c-0.9,1.6-0.4,3.6,1.2,4.5c1.6,0.9,3.6,0.4,4.5-1.2l3.1-5.5C11.8,37.1,9.6,36.5,7,37.3z"/> <path style="fill:%23FFFFFF;" d="M49.1,29.3h-8.5c-4.3-7.4-7.5-13-9.7-16.7c-1.9,1.6-3.9,6.4-1.2,11.1c2.7,4.7,6.7,11.6,12.1,21 c0.9,1.6,2.9,2.1,4.5,1.2c1.6-0.9,2.1-2.9,1.2-4.5l-3.2-5.5h4.7c1.8,0,3.3-1.5,3.3-3.3C52.4,30.7,50.9,29.3,49.1,29.3z"/> </svg>');
    width: 44px;
    height: 44px;
    display: inline-block;
    opacity: 1;
    float: left;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.jointhemillion-buttons a .icon {
    width: 72px;
    height: 72px;
    display: inline-block;
    opacity: 1;
    float: left;
    position: relative;
}

.jointhemillion-button-android .icon::before {
    content: '';
    width: 72px;
    height: 72px;
    display: inline-block;
    opacity: 1;
    float: left;
    position: absolute;
    border-radius: 14px;
    background: #FFF;
}

.jointhemillion-button-android .icon::after {
    content: '';
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 67.5 72"> <path style="fill:%232196F3;" d="M37.4,34.6L2.6,69.4C0.9,67.8,0,65.7,0,63.3V8.7c0-2.4,0.9-4.5,2.7-6.2L37.4,34.6z"/> <path style="fill:%23FFC107;" d="M67.5,36c0,3.1-1.7,5.9-4.5,7.5L53,49L40.8,37.7l-3.4-3.1l13-13l12.6,6.9C65.8,30.1,67.5,32.9,67.5,36z"/> <path style="fill:%234CAF50;" d="M37.4,34.6L2.7,2.5c0.4-0.4,1-0.9,1.6-1.2c2.8-1.7,6.3-1.8,9.2-0.1l36.9,20.4L37.4,34.6z"/> <path style="fill:%23F44336;" d="M53.1,49L13.5,70.8c-1.4,0.8-3,1.2-4.5,1.2c-1.6,0-3.2-0.4-4.7-1.3c-0.6-0.4-1.2-0.8-1.7-1.3l34.8-34.8l3.4,3.1 L53.1,49z"/></svg>');
    width: 44px;
    height: 44px;
    display: inline-block;
    opacity: 1;
    float: left;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.jointhemillion h2 span {
    display: inline-block;
    font-size: 84px;
    line-height: 61px;
    font-weight: 700;
    width: 100%;
    margin: 28px 0px 0px 0px;
}

/* Don't miss out on the news */
.dontmissnews {
    display: inline-block;
    float: left;
    width: calc(100% - 80px);
    margin: 214px 40px 0px 40px;
    position: relative;
    text-align: center;
    position: relative;
    z-index: 100;
}

.dontmissnews-buttons {
    display: inline-block;
    margin: 0px 0px 0px 0px;
    position: relative;
    z-index: 400;
    text-align: center;
}

.dontmissnews-button-txt {
    display: inline-block;
}

.dontmissnews-button-youtube {
    background: #FF0033;
}

.dontmissnews-button-facebook {
    background: #137AF0;
}

.dontmissnews-button-x {
    background: #18191F;
}

.dontmissnews-button-telegram {
    background: #37AEE2;
}

.dontmissnews-button-discord {
    background: #586AEA;
}

.dontmissnews-buttons span::after {
    content: '';
    background-size: 100% 100%;
    background-position: 50% 50%;
    width: 40px;
    height: 40px;
    display: inline-block;
    background-repeat: no-repeat;
    margin: -11px 0px -20px 14px;
    z-index: 100;
    position: relative;
    float: right;
}

.dontmissnews-button-youtube span::after {
    content: '';
    background-size: 40px;
    width: 40px;
    height: 40px;
    display: inline-block;
    background-repeat: no-repeat;
    margin: -11px 0px -20px 14px;
    z-index: 100;
    position: relative;
    float: right;
    opacity: 1;
    transition: opacity .2s ease-in-out;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 25" style="enable-background:new 0 0 25 25;"><path style="fill:%23FFFFFF;" d="M24.5,6.4c-0.3-1.1-1.1-1.9-2.2-2.2c-1.9-0.5-9.8-0.5-9.8-0.5s-7.8,0-9.8,0.5C1.7,4.5,0.8,5.4,0.5,6.4C0,8.4,0,12.5,0,12.5s0,4.1,0.5,6.1c0.3,1.1,1.1,1.9,2.2,2.2c1.9,0.5,9.8,0.5,9.8,0.5s7.8,0,9.8-0.5c1.1-0.3,1.9-1.1,2.2-2.2c0.5-2,0.5-6.1,0.5-6.1S25,8.4,24.5,6.4z M9.9,16.2V8.8l6.5,3.7L9.9,16.2z"/></svg>');
}

.dontmissnews-button-facebook span::after {
    background-image: url('data:image/svg+xml;utf8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 8.7 17.4" style="enable-background:new 0 0 8.7 17.4;" xml:space="preserve"><path style="fill:%23FFFFFF;" d="M5.4,17.4H2.2V8.7H0V5.4h2.2V3.7C2.2,1.3,3.2,0,6,0h2.7v3.3H6.9c-1.1,0-1.5,0-1.5,0.8v1.4h3L8.1,8.7H5.4V17.4z"/></svg>');
}

.dontmissnews-button-x span::after {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"> <path style="fill:%23FFFFFF;" d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/> </svg>');
}

.dontmissnews-button-telegram span::after {
    background-size: 35px 35px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35 29.2"> <path style="fill:%23FFFFFF;" d="M32,0.3c0,0,3.2-1.3,3,1.8c-0.1,1.3-0.9,5.7-1.5,10.5l-2.2,14.2c0,0-0.2,2.1-1.8,2.4c-1.6,0.4-4-1.3-4.5-1.6 c-0.4-0.3-6.7-4.3-9-6.3c-0.6-0.5-1.3-1.6,0.1-2.9l9.4-9c1.1-1.1,2.2-3.6-2.3-0.5l-12.6,8.6c0,0-1.4,0.9-4.1,0.1l-5.8-1.8 c0,0-2.2-1.4,1.5-2.7C11.2,8.6,22.2,4.3,32,0.3z"/></svg>');
}

.dontmissnews-button-discord span::after {
    background-size: 38px 38px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30.4 23.2"> <path style="fill:%23FFFFFF;" d="M25.8,2C25.8,1.9,25.8,1.9,25.8,2c-2-0.9-4.1-1.6-6.2-2c0,0-0.1,0-0.1,0c-0.3,0.5-0.6,1.1-0.8,1.6c-2.3-0.3-4.7-0.3-7,0 c-0.2-0.5-0.5-1.1-0.8-1.6c0,0-0.1-0.1-0.1,0C8.7,0.4,6.6,1,4.7,1.9c0,0,0,0,0,0c-3.9,5.9-5,11.6-4.5,17.3c0,0,0,0.1,0,0.1 c2.6,1.9,5.1,3.1,7.6,3.8c0,0,0.1,0,0.1,0c0.6-0.8,1.1-1.6,1.6-2.5c0-0.1,0-0.1-0.1-0.1c-0.8-0.3-1.6-0.7-2.4-1.1 c-0.1,0-0.1-0.1,0-0.2c0.2-0.1,0.3-0.2,0.5-0.4c0,0,0.1,0,0.1,0c5,2.3,10.4,2.3,15.3,0c0,0,0.1,0,0.1,0c0.2,0.1,0.3,0.3,0.5,0.4 c0.1,0,0.1,0.1,0,0.2c-0.8,0.4-1.5,0.8-2.4,1.1c-0.1,0-0.1,0.1-0.1,0.1c0.5,0.9,1,1.7,1.6,2.5c0,0,0.1,0,0.1,0 c2.5-0.8,5-1.9,7.6-3.8c0,0,0,0,0-0.1C30.9,12.7,29.2,7,25.8,2z M10.2,15.8c-1.5,0-2.7-1.4-2.7-3.1c0-1.7,1.2-3.1,2.7-3.1 c1.5,0,2.8,1.4,2.7,3.1C12.9,14.4,11.7,15.8,10.2,15.8z M20.3,15.8c-1.5,0-2.7-1.4-2.7-3.1c0-1.7,1.2-3.1,2.7-3.1 c1.5,0,2.8,1.4,2.7,3.1C23,14.4,21.8,15.8,20.3,15.8z"/> </svg>');
}

.dontmissnews .subtitle p {
    max-width: 450px;
}

.dontmissnews-buttons a {
    width: auto;
    text-align: left;
    position: relative;
    display: inline-block;
    border-radius: 16px;
    color: #FFF;
    text-decoration: none;
    font-size: 24px;
    font-weight: 500;
    line-height: 18px;
    padding: 35px 32px 35px 32px;
    overflow: hidden;
    margin: 7px 8px;
}

.dontmissnews-buttons a span {
    position: relative;
    z-index: 100;
}

.dontmissnews-buttons a::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0.2;
    background: linear-gradient(0deg, rgba(35, 36, 41, 1) 0%, rgba(20, 27, 68, 1) 100%);
}

.dontmissnews-buttons a.dontmissnews-button-x::before {
    opacity: 0
}

.dontmissnews-buttons a:hover::after {
    opacity: 1;
}

.dontmissnews-buttons a::after {
    content: '';
    background: #42434A;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0;
    transition: all .2s ease-in-out;
}

.dontmissnews-buttons a:active::after {
    background: #747173;
}

.dontmissnews-button-telegram-container {
    display: inline-block;
    position: relative;
    z-index: 900;
}

.dontmissnews-button-telegram-container:hover .dontmissnews-button-container-tooltip {
    opacity: 1;
    visibility: visible;
    bottom: 101px;
}

.dontmissnews-button-container-tooltip {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    bottom: 90px;
    text-align: center;
    left: calc(50% + 0px);
    transform: translate(-50%, 0px);
    border-radius: 20px;
    width: 529px;
    padding: 0px 0px 30px 0px;
    transition: all .2s ease-in-out;
}

.dontmissnews-button-container-tooltip a {
    max-width: 184px;
    width: calc(100% - 64px);
    float: left;
}

.dontmissnews-button-container-tooltip a::before {
    display: none
}

.dontmissnews-button-container-tooltip a::after {
    display: none
}

.dontmissnews-button-telegram-container .dontmissnews-button-container-tooltip a {
    background-color: #1f1e25;
    margin: 8px 8px 8px 8px;
    transition: all .2s ease-in-out;
}

.dontmissnews-button-telegram-container .dontmissnews-button-container-tooltip a:hover {
    background-color: #42434A;
}

.dontmissnews-button-telegram-container .dontmissnews-button-container-tooltip a:active {
    background-color: #747173;
}

.dontmissnews-background-element {
    position: absolute;
    display: inline-block;
    float: left;
    width: 300%;
    height: 1600px;
    overflow: hidden;
    top: -878px;
    left: 50%;
    transform: translate(-50%, 0%);
    z-index: -2;
}

.dontmissnews-background-element::before {
    content: '';
    width: 1400px;
    height: 1214px;
    position: absolute;
    display: inline-block;
    float: left;
    left: 50%;
    top: 768px;
    opacity: 0.6;
    transform: translate(-50%, 0%);
    background-image: url(../images/background-element-ellipse.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    filter: blur(20px);
    border-radius: 100%;
}

.dontmissnews-container {
    max-width: 832px;
    width: 100%;
    display: inline-block;
    margin: 61px 0px -134px 0px;
    position: relative;
    min-height: 574px;
    z-index: 300;
}

.dontmissnews-hero-one {
    background-image: url(../images/dontmissnews-hero-two.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    max-width: 500px;
    width: 100%;
    height: 575px;
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 300;
}

.dontmissnews-hero-two {
    background-image: url(../images/dontmissnews-hero-one.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    max-width: 472px;
    width: 100%;
    height: 575px;
    position: absolute;
    bottom: 0px;
    right: 0px;
    z-index: 400;
}

.dontmissnews-container::after {
    content: '';
    width: 600%;
    position: absolute;
    bottom: 0px;
    height: 183px;
    z-index: 400;
    left: -300%;
    background: linear-gradient(0deg, rgba(24, 25, 31, 1) 0%, rgba(24, 25, 31, 0.6) 65%, rgba( 24, 25, 31, 0) 100%);
}

.dontmissnews-background-element-boom {
    width: 809px;
    height: 655px;
    position: absolute;
    display: inline-block;
    top: 0px;
    left: 47%;
    transform: translate(-50%, 0%);
    overflow: hidden;
    z-index: -1;
}

.dontmissnews-background-element-boom::before {
    content: '';
    animation: element-boom-animation 10s ease-in-out infinite alternate;
    background-image: url(../images/dontmissnews-background-element-boom.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    width: 809px;
    height: 655px;
    position: absolute;
    left: 1px;
    bottom: -127px;
    rotate: 11deg;
}

@keyframes element-boom-animation {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(-10deg);
    }
}

.dontmissnews h2 {
    z-index: 500;
    position: relative
}

.dontmissnews-button-container-tooltip-modal-title {
    font-size: 24px;
    line-height: 27px;
    font-weight: 500;
    z-index: 600;
    position: relative;
    width: 100%;
    margin: 0px 0px 40px 0px;
    text-align: center;
}

.dontmissnews-button-container-tooltip-modal-title-icon {
    width: auto;
    text-align: left;
    position: relative;
    display: inline-block;
    border-radius: 6px;
    color: #FFF;
    text-decoration: none;
    font-size: 24px;
    font-weight: 500;
    line-height: 18px;
    overflow: hidden;
    margin: 0px 9px -7px 0px;
    width: 32px;
    height: 32px;
    background: #37AEE2;
}

.dontmissnews-button-container-tooltip-modal-title-icon::after {
    content: '';
    background-position: 50% 50%;
    width: 32px;
    height: 32px;
    display: inline-block;
    background-repeat: no-repeat;
    z-index: 100;
    position: relative;
    background-size: 14px 13px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35 29.2"> <path style="fill:%23FFFFFF;" d="M32,0.3c0,0,3.2-1.3,3,1.8c-0.1,1.3-0.9,5.7-1.5,10.5l-2.2,14.2c0,0-0.2,2.1-1.8,2.4c-1.6,0.4-4-1.3-4.5-1.6 c-0.4-0.3-6.7-4.3-9-6.3c-0.6-0.5-1.3-1.6,0.1-2.9l9.4-9c1.1-1.1,2.2-3.6-2.3-0.5l-12.6,8.6c0,0-1.4,0.9-4.1,0.1l-5.8-1.8 c0,0-2.2-1.4,1.5-2.7C11.2,8.6,22.2,4.3,32,0.3z"/></svg>');
}

.dontmissnews-button-container-tooltip-modal.active {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 19000;
    opacity: 1;
    transform: initial;
    visibility: visible;
    bottom: initial;
    display: flex;
}

.dontmissnews-button-container-tooltip-modal.active::before {
    content: '';
    background-color: rgba(24, 25, 31, 0.8);
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0px;
    top: 0px;
    visibility: hidden;
    opacity: 0;
    z-index: 100;
    transition: all .2s ease-in-out;
    backdrop-filter: blur(20px);
}

.dontmissnews-button-container-tooltip-modal.active::before {
    visibility: visible;
    opacity: 1;
}

.dontmissnews-button-container-tooltip-modal {
    top: 0px;
    padding: 0px 0px 0px 0px;
    width: calc(100% - 0px);
    height: calc(100% - 176px);
    float: left;
    position: fixed;
    left: 0px;
    z-index: 12000;
    display: none;
    justify-content: center;
    margin: 0 auto;
    overflow: hidden;
    flex-direction: column;
    align-content: center;
}

.dontmissnews-button-container-tooltip-modal a {
    text-align: left;
    position: relative;
    border-radius: 20px;
    color: #FFF;
    text-decoration: none;
    text-align: center;
    font-size: 18px;
    font-weight: 500;
    line-height: 18px;
    padding: 27px 32px 26px 32px;
    overflow: hidden;
    z-index: 600;
    width: calc(100% - 104px);
    background-color: #1f1e25;
    margin: 10px 20px 10px 20px;
    transition: all .2s ease-in-out;
}

.dontmissnews-button-container-tooltip-modal a:hover {
    background-color: #42434A;
}

.dontmissnews-button-container-tooltip-modal a:active {
    background-color: #747173;
}

.chooseyourside-gallery-modal-close {
    padding: 80px 80px 40px 40px;
}

/* FAQ */
.faq {
    display: inline-block;
    float: left;
    width: calc(100% - 80px);
    margin: 214px 40px 0px 40px;
    position: relative;
    text-align: center;
}

.openhelpsection {
    padding: 21px 26px 20px 26px;
    cursor: pointer;
    user-select: none;
    align-items: center;
    color: rgba(255, 255, 255, 0.5);
    font-size: 24px;
    font-weight: 500;
    line-height: 29px;
    border-radius: 16px;
    transition: all .2s ease-in-out;
    background: rgba(255, 255, 255, 0.05);
    display: inline-block;
    max-width: 820px;
    width: calc(100% - 52px);
    margin: 34px 0px 0px 0px;
    position: relative;
    text-align: center;
    text-decoration: none;
}

.openhelpsection:hover {
    background-color: #42434A;
    color: rgba(255, 255, 255, 0.5);
    text-decoration: none;
}

.openhelpsection:active {
    color: rgba(255, 255, 255, 1);
    background-color: #747173;
}

.openhelpsection::after {
    background-position: 0px 0px;
    position: relative;
    content: '';
    background-repeat: no-repeat;
    transform: rotate(-90deg);
    transition: all .3s ease-in-out;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21 12"> <path style="fill:%23FFFFFF;" d="M19.6,0c-0.4,0-0.7,0.2-1,0.4l-8.1,8.2L2.4,0.4C2.1,0.2,1.8,0,1.4,0C0.6,0,0,0.6,0,1.4c0,0.4,0.1,0.7,0.4,1l9,9.1c0.3,0.3,0.7,0.5,1.1,0.5s0.8-0.2,1.1-0.5l9-9.1c0.3-0.3,0.4-0.6,0.4-1C21,0.6,20.4,0,19.6,0z"/></svg>');
    width: 23px;
    height: 13px;
    background-size: 23px 13px;
    opacity: 0.5;
    display: inline-block;
    margin: 0px 0px 0px 10px;
}

.openhelpsection:active::after {
    opacity: 1;
}

/* Accordion */
.accordion {
    display: inline-block;
    max-width: 870px;
    width: calc(100% - 0px);
    margin: 80px 0px 0px 0px;
    position: relative;
    text-align: center;
}

.accordion-container {
    width: 100%;
    display: inline-block;
    text-align: left;
}

.accordion-container li {
    display: inline-block;
}

.accordion-container li:last-child {
    border-bottom: 0px
}

.accordion-container li:hover {
    position: relative;
}

.accordion-container li p {
    padding: 0px 26px 20px 26px;
    width: calc(100% - 51px);
    display: none;
    font-weight: 300;
    top: -7px;
    display: inline-block;
    float: left;
    top: 0px;
    margin: -5px 0px 0px 0px;
    position: relative;
    opacity: 0.7;
    font-size: 22px;
    line-height: 27px;
    font-weight: 200;
    max-width: initial;
}

.accordion-container li > div {
    display: none;
    float: left;
    top: 0px;
    position: relative;
    max-width: initial;
}

.accordion-container li > div:last-child {
    margin: 0px 0px 14px 0px;
}

.accordion-container .accordion-button:after {
    background-position: 0px 0px;
    position: absolute;
    content: '';
    background-repeat: no-repeat;
    transform: rotate(0deg);
    transition: all .3s ease-in-out;
}

.accordion-container .accordion-button.active:after {
    transform: rotate(180deg);
}

.accordion-content-more {
    top: 0px;
    position: relative;
    text-align: center;
    display: inline-block;
    float: left;
    margin: 31px 0px 26px 0px;
    bottom: 40px;
    text-decoration: none;
    font-weight: 300;
    font-size: 18px;
    padding: 15px 20px 15px 20px;
    line-height: 22px;
    cursor: pointer;
    transition: all .2s ease-in-out;
    opacity: 1;
    border-radius: 4px;
    border: 1px solid #282828;
    color: #282828;
}

.accordion-content-more:hover {
    background-color: #f6f6f6;
}

.accordion-content-more:active {
    background-color: #e8e8e8;
}

.accordion-container li {
    position: relative;
    float: left;
    border-radius: 16px;
    width: calc(100% - 0px);
    transition: all .2s ease-in-out;
    margin: 40px 0px 0px 0px;
    background: rgba(255, 255, 255, 0.05);
}

.accordion-content > ul > li {
    background: initial;
    margin: 0px 0px 0px 0px;
}

.accordion-content > ul {
    margin: -5px 0px 0px 0px;
    position: relative;
    opacity: 0.7;
    font-size: 22px;
    line-height: 27px;
    font-weight: 200;
    padding: 0px 26px 20px 26px;
    width: calc(100% - 51px);
    display: inline-block;
    float: left;
}

.accordion-content > ul > li:hover {
    background: initial;
}

.accordion-container li:first-child {
    margin: 0px 0px 0px 0px;
}

.accordion-container li:hover {
    background-color: #42434A;
}

.accordion-container li:active {
    background-color: #747173;
}

.accordion-container li:active p {
    opacity: 1
}

.accordion-container .accordion-button:after {
    top: 30px;
    right: 26px;
    width: 23px;
    height: 13px;
    background-size: 23px 13px;
    opacity: 0.8;
}

.accordion-container li > div:last-child {
    margin: 0px 0px 0px 0px;
}

.accordion-container .accordion-button {
    width: calc(100% - 100px);
    padding: 21px 74px 20px 26px;
    display: inline-block;
    cursor: pointer;
    user-select: none;
    align-items: center;
    color: #ffffff;
    font-size: 24px;
    font-weight: 500;
    line-height: 29px;
}

.accordion-container .accordion-button:after {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21 12"> <path style="fill:%23FFFFFF;" d="M19.6,0c-0.4,0-0.7,0.2-1,0.4l-8.1,8.2L2.4,0.4C2.1,0.2,1.8,0,1.4,0C0.6,0,0,0.6,0,1.4c0,0.4,0.1,0.7,0.4,1l9,9.1c0.3,0.3,0.7,0.5,1.1,0.5s0.8-0.2,1.1-0.5l9-9.1c0.3-0.3,0.4-0.6,0.4-1C21,0.6,20.4,0,19.6,0z"/></svg>');
}

/* Content info */
.content-info {
    display: inline-block;
    float: left;
    width: calc(100% - 80px);
    margin: 214px 40px 0px 40px;
    position: relative;
    color: #ffffff;
    font-size: 24px;
    font-weight: 300;
    line-height: 36px;
    position: relative;
    z-index: 500;
}

.content-info h1 {
    font-size: 60px;
    line-height: 73px;
    font-weight: 600;
    margin: -15px 0px -16px 0px;
}

.content-info h2 {
    font-size: 48px;
    line-height: 62px;
    font-weight: 600;
    display: inline-block;
    float: left;
    width: calc(100% - 0px);
    margin: 77px 0px -13px 0px;
    position: relative;
}

.content-info h5 {
    display: inline-block;
    float: left;
    width: calc(100% - 0px);
    margin: 50px 0px -4px 0px;
    position: relative;
    color: #ffffff;
    font-size: 24px;
    font-weight: 300;
    line-height: 29px;
}

.content-info p {
    display: inline-block;
    float: left;
    width: 100%;
    margin: 45px 0px -10px 0px;
}

.content-info p:nth-child(2) {
    margin: 51px 0px -10px 0px;
}

.content-info ul {
    display: inline-block;
    float: left;
    width: 100%;
    margin: 7px 0px -10px 0px;
}

.content-info ul li {
}

.content-info ul li::before {
    content: '-'
}

.content-info-image-txt {
    display: flex;
    float: left;
    width: 100%;
    margin: 40px 0px 0px 0px;
    align-items: center;
}

.content-info-image-txt:nth-last-child(3) {
    margin: 50px 0px 0px 0px;
}

.content-info-image {
    display: inline-block;
    float: left;
}

.content-info-image img {
    position: relative;
    display: inline-block;
    float: left;
    border-radius: 20px;
    width: 100%;
}

.content-info-txt {
    display: inline-block;
    float: left;
    width: calc(100% - 680px);
    margin: 0px 0px 0px 80px;
}

.content-info-txt-num {
    display: inline-block;
    float: left;
    width: 100%;
    font-size: 60px;
    line-height: 42px;
    font-weight: 600;
    margin: 0px 0px 0px 0px;
    opacity: 0.3;
}

.content-info-txt p {
    margin: 51px 0px -10px 0px;
}

.content-info-txt p:nth-child(2) {
    margin: 22px 0px 0px 0px;
}

.content-info-txt p span {
    font-weight: 600;
    color: #FF5C01;
}

.content-info a {
    color: #ffffff;
    text-decoration: none;
}

.content-info a:hover {
    text-decoration: none;
}

/* ******* ******* ******* FOOTER ******* ******* ******* */
footer {
    overflow: hidden;
    border-top: 1px solid rgba(255, 246, 241, 0.1);
    margin: 100px 0px 0px 0px;
    display: inline-block;
    float: left;
    width: 100%;
    position: relative;
    bottom: 0px;
    text-align: center;
}

.footer-container {
    position: relative;
    width: 100%;
    display: inline-block;
    max-width: 1320px;
    text-align: left;
    margin: 54px 40px 54px 40px;
    width: calc(100% - 80px);
}

.footer-copyright {
    position: relative;
    float: left;
    display: inline-block;
    width: 270px;
}

.footer-copyright .logotype-colorfull {
    width: 139px;
    height: 40px;
    display: inline-block;
    float: left;
    background-repeat: no-repeat;
}

.footer-copyright-info {
    float: left;
    width: 100%;
    display: inline-block;
    margin: 29px 0px 0px 0px;
    position: relative;
    opacity: 0.5;
    transition: all .2s ease-in-out;
    color: #ffffff;
    text-decoration: none;
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
}

.footer-copyright-info span {
    position: relative;
    float: left;
    width: 100%;
    display: inline-block;
    margin: 15px 0px -4px 0px;
}

.footer-copyright-info span:first-child {
    margin: -5px 0px -4px 0px;
}

.footer-menu {
    position: relative;
    display: inline-block;
    float: left;
    margin: 0px 0px 0px 80px;
    width: calc(100% - 692px);
    text-align: center;
}

.footer-menu a {
    width: 100%;
    padding: 5px 0px 5px 0px;
    margin: 0px 0px 0px 0px;
    position: relative;
    opacity: 0.5;
    transition: all .2s ease-in-out;
    color: #ffffff;
    text-decoration: none;
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    float: left;
    display: inline-block;
}

.footer-menu a:hover {
    opacity: 1;
}

.footer-menu a:nth-child(2) {
    padding: 13px 0px 8px 0px;
}

.footer-menu a.email {
    color: #FF4F00;
    opacity: 1;
}

.footer-menu a.active {
    opacity: 1;
}

.footer-menu-container {
    position: relative;
    float: left;
    width: 100%;
    display: inline-block;
}

.footer-menu-container-title {
    position: relative;
    float: left;
    width: 100%;
    display: inline-block;
    color: #ffffff;
    font-size: 22px;
    font-weight: 300;
    line-height: 27px;
    margin: -5px 0px 13px 0px;
}

.footer-menu-container:nth-child(1) {
    width: calc(35% - 20px);
    margin: 0px 20px 0px 0px;
}

.footer-menu-container:nth-child(2) {
    width: calc(65% - 20px);
    margin: 0px 20px 0px 0px;
}

.footer-menu-box {
    position: relative;
    display: inline-block;
    margin: 0px 0px 0px 0px;
    width: 100%;
    text-align: left;
}

.footer-socialmedia {
    display: inline-block;
    float: right;
    margin: -10px -10px -10px -10px;
    position: relative;
    width: 362px;
}

.footer-socialmedia a {
    width: 52px;
    height: 52px;
    display: inline-block;
    opacity: 1;
    float: left;
    border-radius: 40px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    transition: all .2s ease-in-out;
    margin: 0px 10px 0px 10px;
    background-color: rgba(255, 255, 255, 0.05);
    margin: 10px 10px 10px 10px;
}

.footer-socialmedia a:hover {
    background-color: rgba(255, 255, 255, 0.3);
}

.footer-socialmedia a:active {
    background-color: rgba(255, 255, 255, 0.5);
}

/* ******* ******* ******* SMARTPHONE & TABLET ******* ******* ******* */
/* width max: 1300px */
@media screen and (max-width: 1300px) {
    /* ******* ******* ******* NAV ******* ******* ******* */ nav ul li > a {
    padding: 62px 8px 20px 8px;
}

    /* Start play */
    .startplay-container::before {
        width: calc(100% + 0px);
        left: calc(50% - 0px);
    }

    /* ******* ******* ******* FOOTER ******* ******* ******* */
    .footer-menu {
        margin: 0px 0px 0px 0px;
        width: calc(100% - 613px);
    }

    .footer-menu-container:nth-child(1) {
        width: calc(40% - 20px);
    }

    .footer-menu-container:nth-child(2) {
        width: calc(60% - 20px);
    }
}

/* width max: 1200px */
@media screen and (max-width: 1200px) {
    /* Choose your side */ .chooseyourside-slider-swiper {
    margin: 0px 0px 96px 0px;
}

    .chooseyourside-slider {
        width: calc(100% - 0px);
        margin: 30px 0px 0px 0px;
        min-height: 312px;
    }

    .chooseyourside-gallery {
        width: calc(100% - 0px)
    }

    .chooseyourside-gallery-content {
        display: none;
    }

    .chooseyourside-slider-swiper-fade.swiper::before {
        width: 150%;
        height: 1080px;
        top: -210px;
    }

    /* Choose your side - gallery modal smartphone */
    .chooseyourside-gallery-modal-smartphone {
        display: inline-block;
        z-index: 200;
    }

    /* Choose your side - slider fade */
    .chooseyourside-slider-swiper-element-one {
        width: 21%;
        height: 23%;
        left: 27%;
        top: 1%;
    }

    .chooseyourside-slider-swiper-element-two {
        width: 40%;
        height: 46%;
        right: 7%;
        top: 7%;
    }
}

/* width max: 1100px */
@media screen and (max-width: 1100px) {
    /* Nav download */ .nav-download {
    display: none;
    bottom: 0px;
    position: fixed;
    left: 0px;
    margin: 0px 0px 40px 0px;
    text-align: center;
}

    /* Language */
    .language {
        position: absolute;
        float: right;
        right: 100px;
        padding: 62px 0px 25px 0px;
        margin: 0px 0px 0px 0px;
    }

    /* Start play */
    .startplay-socialmedia {
        display: none;
    }

    .startplay-onlineplayers-txt span:nth-child(1) {
        display: none;
    }

    .startplay-onlineplayers-txt span:nth-child(2) {
        display: inline-block;
    }

    .startplay-onlineplayers {
        min-width: 160px;
        background-color: rgba(255, 255, 255, 0.0);
        padding: 0px 0px 0px 0px;
    }

    .startplay {
        width: calc(100% - 80px);
        margin: 0px 40px 0px 40px;
    }

    .startplay-container {
        margin: 0px 0px 0px 0px;
        min-width: 530px;
    }

    .startplay-onlineplayers-socialmedia {
        margin: 58px auto 30px auto;
    }

    .startplay-car-one {
        width: 60%;
        max-width: initial;
    }

    .startplay-car-two {
        width: 60%;
        max-width: initial;
    }

    .startplay-hero-three {
        right: 20px;
    }

    .startplay-hero-one {
        left: 20px;
    }

    .startplay-hero-three {
        width: 31%;
        min-width: 250px;
    }

    .startplay-hero-one {
        width: 38%;
        min-width: 350px;
    }

    .startplay-hero-two {
        width: 38%;
        min-width: 360px;
    }

    .startplay-background-element-boom {
        height: 759px;
    }

    .startplay-background-element {
        width: 190%;
        top: -330px;
    }

    /* Responsive nav */
    .nav-body-container {
        overflow: hidden;
    }

    .nav-menu {
        visibility: hidden;
        width: calc(100% - 0px);
        opacity: 0;
        position: fixed;
        height: calc(100% - 400px);
        top: 140px;
        display: inline-block;
        left: 0px;
        overflow-x: hidden;
        overflow-y: auto;
        margin: 0px 0px 0px 0px;
        text-align: center;
    }

    nav.active .nav-menu {
        visibility: visible;
        opacity: 1;
    }

    nav.active .nav-menu.active {
        visibility: visible;
        opacity: 1;
    }

    nav.active .elements .search {
        display: inline-block;
    }

    nav.active .search .search-icon-button {
        right: 163px;
        top: 0px;
    }

    .nav-button {
        display: inline-block;
        right: 0px;
        position: absolute;
        padding: 58px 40px 48px 20px;
        cursor: pointer;
        opacity: 0.90;
        width: 34px;
        height: 20px;
        transition: all .2s ease-in-out;
    }

    .nav-button:hover {
        opacity: 0.99;
    }

    .nav-tablet-button {
        width: 34px;
        height: 4px;
    }

    .nav-tablet-button:after {
        width: 21px;
        height: 4px;
    }

    .nav-tablet-button:before {
        width: 34px;
        height: 4px;
    }

    .nav-tablet-button {
        position: relative;
    }

    .nav-tablet-button::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0px;
        transform: skew(-30deg, 0deg);
        background: #ffffff;
        border-radius: 0px 1px 0px 1px;
    }

    .nav-tablet-button::after {
        content: "";
        position: absolute;
        right: 6px;
        top: 16px;
        background: #ffffff;
        transform: skew(-30deg, 0deg);
        border-radius: 0px 1px 0px 1px;
    }

    .nav-tablet-button-element {
        position: absolute;
        background: #ffffff;
        transform: skew(-30deg, 0deg);
        width: 27px;
        height: 4px;
        right: 3px;
        top: 8px;
        border-radius: 0px 1px 0px 1px;
        opacity: 1;
    }

    .nav-tablet-button-element::before {
        content: "";
    }

    .nav-tablet-button-element::after {
        content: "";
    }

    .white .nav-tablet-button,.white .nav-tablet-button:after,.white .nav-tablet-button:before {
        background: #fff;
    }

    nav.active .nav-tablet-button.effect:after {
        top: 8px;
        right: 3px;
        transform: rotate(47deg) skew(-47deg, 0deg);
        transition: top 200ms cubic-bezier(0.23,1,0.32,1),transform 200ms 200ms cubic-bezier(0.23,1,0.32,1);
        width: 27px;
    }

    nav.active .nav-tablet-button.effect:before {
        top: 8px;
        transform: rotate(-47deg) skew(47deg, 0deg);
        transition: bottom 200ms cubic-bezier(0.23,1,0.32,1),transform 200ms 200ms cubic-bezier(0.23,1,0.32,1);
        width: 27px;
        left: 3px;
    }

    nav.active .nav-tablet-button.effect {
        background: rgba(255,255,255,0)!important
    }

    .nav-background::after {
        background: rgba(0, 0, 0, 0.6);
        top: 120px;
        height: calc(100% - 120px);
    }

    nav.active .nav-tablet-button.effect .nav-tablet-button-element {
        opacity: 0;
    }

    .nav-background::after {
        background: rgba(0, 0, 0, 0.6);
        top: 0px;
        height: calc(100% - 0px);
    }

    nav ul li a {
        color: #ffffff;
    }

    nav ul li.active > a {
        color: #ffffff;
        margin: 0px 0px 0px 0px;
    }

    nav a:hover {
        color: #ffffff;
    }

    nav ul li a {
        color: #ffffff;
    }

    nav ul li.active > a {
        color: #ffffff;
        margin: 0px 0px 0px 0px;
    }

    nav a:hover {
        color: #ffffff;
    }

    nav ul li {
        text-align: center;
    }

    nav ul li {
        float: initial;
        width: 100%;
        position: relative;
        text-align: center;
    }

    nav ul li > a {
        height: auto;
        width: calc(100% - 0px);
        padding: 0px 0px 0px 0px;
        opacity: 1;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .nav-menu > li:nth-child(1) {
    }

    nav > ul > li > a {
        line-height: 55px;
    }

    .nav-menu::-webkit-scrollbar {
        width: 5px
    }

    .nav-menu::-webkit-scrollbar-button {
        display: none
    }

    .nav-menu::-webkit-scrollbar-track {
        background: transparent;
    }

    .nav-menu::-webkit-scrollbar-thumb {
        width: 20px;
        background: #00A0EC; /* fallback */
        border-radius: 2px;
    }

    /* Nav socialmedia */
    nav.active .nav-socialmedia {
        visibility: visible;
        width: calc(100% - 0px);
        opacity: 1;
        position: fixed;
        bottom: 0px;
        display: inline-block;
        overflow-x: hidden;
        overflow-y: auto;
        margin: 0px auto 126px auto;
        text-align: center;
        max-width: 341px;
        left: 50%;
        transform: translate(-50%, 0px);
    }

    .nav-socialmedia a {
        width: 52px;
        height: 52px;
        display: inline-block;
        opacity: 1;
        border-radius: 40px;
        background-position: 50% 50%;
        background-repeat: no-repeat;
        transition: all .2s ease-in-out;
        margin: 3px 3px 3px 3px;
        background-color: rgba(255, 255, 255, 0.05);
        backdrop-filter: blur(10px);
    }

    /* Nav download */
    nav.active .nav-download {
        display: inline-block;
        width: 100%;
    }

    .nav-download a {
        float: initial;
        margin: 0px 0px -6px 0px;
    }

    /* Don't miss out on the news */
    .dontmissnews-button-txt {
        display: none;
    }

    .dontmissnews-button-youtube span::after {
        background-size: 32px;
        width: 32px;
        height: 32px;
        margin: 0px 0px 0px 0px;
    }

    .dontmissnews-button-facebook span::after {
        background-size: 16px;
        width: 32px;
        height: 32px;
        margin: 0px 0px 0px 0px;
    }

    .dontmissnews-button-x span::after {
        background-size: 36px;
        width: 32px;
        height: 32px;
        margin: 0px 0px 0px 0px;
    }

    .dontmissnews-button-telegram span::after {
        background-size: 32px;
        width: 32px;
        height: 32px;
        margin: 0px 0px 0px 0px;
    }

    .dontmissnews-button-discord span::after {
        background-size: 32px;
        width: 32px;
        height: 32px;
        margin: 0px 0px 0px 0px;
    }

    .dontmissnews-buttons a {
        padding: 14px 14px 14px 14px;
        margin: 0px 3px;
    }

    .dontmissnews-hero-one {
        width: 60%;
        background-position: 50% 100%;
    }

    .dontmissnews-hero-two {
        width: 60%;
        background-position: 50% 100%;
    }

    .dontmissnews-background-element {
        top: initial;
        bottom: 0px;
    }

    .dontmissnews-background-element::before {
        height: 1224px;
        top: 688px;
        width: 270%;
    }

    .dontmissnews-button-telegram-container:hover .dontmissnews-button-container-tooltip {
        display: none;
    }

    /* Choose your side - gallery modal */
    .chooseyourside-gallery-modal-close {
        padding: 27px 20px 40px 50px;
    }

    /* Content info */
    .content-info-image {
        width: 50%;
    }

    .content-info-txt {
        width: calc(50% - 40px);
        margin: 0px 0px 0px 40px;
    }

    /* ******* ******* ******* FOOTER ******* ******* ******* */
    .footer-socialmedia {
        display: none;
    }

    .footer-menu {
        width: calc(100% - 351px);
        margin: 0px 0px 0px 80px;
    }
}

/* width max: 1000px */
@media screen and (max-width: 1000px) {
    main {
        min-height: calc(100vh - 194px);
    }
}

/* width max: 900px */
@media screen and (max-width: 900px) {
    /* ******* ******* ******* FOOTER ******* ******* ******* */ .footer-copyright {
    width: 100%;
    text-align: center;
}

    .footer-menu {
        width: calc(100% - 0px);
        margin: 10px 0px 0px 0px;
    }

    .footer-menu-box {
        max-width: initial;
    }

    footer {
        border-top: initial;
    }

    .footer-copyright .logotype-colorfull {
        float: initial;
        width: 116px;
        height: 34px;
    }

    .footer-container {
        margin: 0px 40px 64px 40px;
    }

    .footer-menu-container-title {
        font-size: 18px;
        font-weight: 400;
        margin: 16px 0px 8px 0px;
        line-height: 22px;
    }

    .footer-menu-container {
        text-align: center;
    }

    .footer-menu-container:nth-child(1) {
        width: calc(100% - 0px);
        margin: 0px 0px 0px 0px;
    }

    .footer-menu-container:nth-child(2) {
        width: calc(100% - 0px);
        margin: 0px 0px 0px 0px;
    }

    /* Choose your side - slider fade */
    .chooseyourside-slider-swiper-element-one {
        width: 19%;
        height: 23%;
        left: 29%;
        top: 1%;
    }

    .chooseyourside-slider-swiper-element-two {
        width: 37%;
        height: 46%;
        right: 11%;
        top: 7%;
    }
}

/* width max: 800px */
@media screen and (max-width: 800px) {
    h2 {
        font-size: 24px;
        line-height: 31px;
    }

    .subtitle p {
        margin: -3px 0px 0px 0px;
        font-size: 14px;
        line-height: 17px;
    }

    .subtitle {
        margin: 6px 0px 0px 0px;
    }

    /* Header logotype */
    header .logotype {
        padding: 24px 27px 0px 20px;
    }

    header .logotype div {
        width: 40px;
        height: 27px;
        background-size: 93px 27px;
    }

    /* Language */
    .language {
        display: none;
    }

    nav.active .language {
        display: inline-block;
        padding: 26px 10px 25px 10px;
        right: 69px;
        width: 25px;
    }

    .language-selected {
        display: none;
    }

    nav.active .language {
    }

    .language:hover .language-tooltip {
        display: none;
    }

    .language::before {
        margin: 0px 0px 0px 0px;
        right: 10px;
    }

    .language-active .language::before {
        opacity: 1;
    }

    nav.language-active.active .nav-menu {
        visibility: hidden;
        opacity: 0;
    }

    .language-active .language .language-tooltip {
        top: 47px;
        opacity: 1 !important;
        visibility: visible !important;
        display: inline-block;
        background: initial;
        backdrop-filter: initial;
        left: 0px;
        position: fixed;
        transform: initial;
        width: 100%;
    }

    /* Start play */
    .startplay-onlineplayers-socialmedia {
        margin: 31px auto 10px auto;
    }

    /* Responsive nav */
    .nav-button {
        padding: 27px 20px 24px 20px;
    }

    .nav-menu {
        height: calc(100% - 350px);
    }

    /* Start play */
    .startplay-onlineplayers {
        font-size: 16px;
        line-height: 12px;
        font-weight: 300;
        padding: 0px 0px 0px px;
        min-width: 124px;
    }

    .counter-value-onlineplayers {
        font-size: 16px;
        line-height: 12px;
        margin: 0px 0px 0px 10px;
        font-weight: 300;
    }

    /* Responsive nav */
    .nav-menu {
        top: 59px;
    }

    /* Start play */
    .startplay {
        width: calc(100% - 40px);
        margin: 0px 20px 0px 20px;
    }

    .startplay-phonedemonstration {
        width: 340px;
        height: 162px;
        bottom: 151px;
        left: calc(50% + 3px);
    }

    .startplay-phonedemonstration::before {
        width: 335px;
        height: 164px;
    }

    .startplay-phonedemonstration video,
    .startplay-phonedemonstration iframe {
        top: 7px;
        left: 4px;
        border-radius: 20px;
        width: calc(100% - 15px);
        height: 148px;
    }

    .startplay-hero-three {
        max-height: 340px;
        bottom: 119px;
        right: 0px;
        min-width: 239px;
    }

    .startplay-hero-one {
        max-height: 340px;
        bottom: 102px;
        left: 0px;
        min-width: 290px;
    }

    .startplay-hero-two {
        max-height: 340px;
        bottom: 122px;
        min-width: 260px;
    }

    .startplay-button a {
        padding: 6px 22px 9px 22px;
    }

    .startplay-button a::before {
        display: none;
    }

    .startplay-button {
        bottom: 210px;
        left: calc(50% + 0px);
    }

    .startplay-button a span {
        font-size: 16px;
    }

    .startplay-car-one {
        min-width: 320px;
        height: 200px;
        bottom: 7px;
    }

    .startplay-car-two {
        min-width: 320px;
        height: 200px;
    }

    .startplay-container::before {
        height: 170px;
        opacity: 0.1;
    }

    .startplay-background-element-boom {
        height: 536px
    }

    .startplay-background-element-boom::before {
        width: 500px;
        height: 500px;
        left: 240px;
    }

    .startplay-background-element-boom::after {
        width: 500px;
        height: 500px;
        right: 150px;
    }

    .startplay h1 {
        display: none;
    }

    .startplay-container {
        margin: 0px 0px 0px 0px;
        transform: translate(-50%, 0px);
        left: 50%;
        min-height: 560px;
    }

    .startplay-background-element {
        top: -530px;
    }

    /* How start play */
    .howstartplay {
        margin: 10px 20px 0px 20px;
        width: calc(100% - 40px);
    }

    .howstartplay .subtitle p {
        max-width: 220px;
    }

    .howstartplay-buttons a span:nth-child(1) {
        font-size: 8px;
        line-height: 7px;
        margin: 7px 0px 0px 10px;
        width: calc(100% - 48px);
    }

    .howstartplay-buttons a span:nth-child(2) {
        font-size: 16px;
        line-height: 11px;
        margin: 5px 0px 0px 10px;
        width: calc(100% - 48px);
    }

    .howstartplay-button-iphone::before {
        width: 38px;
        height: 38px;
    }

    .howstartplay-button-android::before {
        width: 38px;
        height: 38px;
    }

    .howstartplay-buttons a {
        padding: 8px 0px 8px 14px;
        width: calc(50% - 28px);
        border-radius: 10px
    }

    .howstartplay-buttons a:nth-child(2) {
        margin: 0px 0px 0px 4px;
        width: calc(50% - 18px);
    }

    .howstartplay-buttons a:nth-child(1) {
        margin: 0px 4px 0px 0px;
        width: calc(50% - 18px);
    }

    .howstartplay-buttons {
        margin: 32px 0px 0px 0px;
    }

    .howstartplay-qr {
        display: none;
    }

    /* Choose your side */
    .chooseyourside {
        margin: 80px 0px 0px 0px;
        width: calc(100% - 0px);
    }

    .chooseyourside .subtitle {
        margin: 6px 20px 0px 20px;
        width: calc(100% - 40px);
    }

    .chooseyourside .subtitle p {
        max-width: 420px;
    }

    .chooseyourside-slider-swiper-fade-button-next {
        display: none;
    }

    .chooseyourside-slider-swiper-fade-button-prev {
        display: none;
    }

    .chooseyourside-slider-swiper-title {
        transform: translate(-50%, -27px);
    }

    .chooseyourside-slider-swiper-button {
        transform: translate(-50%, 44px);
        width: 100%;
        text-align: center;
    }

    .chooseyourside-slider-swiper-title {
        font-size: 36px;
        line-height: 24px;
    }

    .chooseyourside-slider-swiper-button a {
        padding: 15px 40px 14px 40px;
        font-size: 16px;
        min-width: initial;
        float: initial;
    }

    .chooseyourside-gallery {
        margin: 80px 0px 0px 0px;
    }

    .swiper-slide img {
        width: calc(100% - 40px);
        margin: 20px 20px 20px 20px;
    }

    .chooseyourside-gallery-content-swiper-mainpic-smartphone .swiper-slide img {
        max-width: calc(100% - 40px);
    }

    .chooseyourside-slider-swiper {
        margin: 0px 0px 63px 0px;
    }

    .chooseyourside-slider-swiper-fade.swiper::before {
        width: 150%;
        height: 1080px;
        top: -260px;
    }

    /* Join the 1000000 */
    .jointhemillion h2 span {
        font-size: 40px;
        line-height: 28px;
        margin: 10px 0px 0px 0px;
        font-weight: 500;
    }

    .jointhemillion {
        width: calc(100% - 40px);
        margin: 80px 20px 0px 20px;
    }

    .jointhemillion-buttons {
        margin: 40px 0px 0px 0px;
    }

    .jointhemillion-buttons a span:nth-child(2) {
        font-size: 18px;
        line-height: 12px;
        margin: 5px 0px 0px 10px;
    }

    .jointhemillion-buttons a span:nth-child(3) {
        font-size: 14px;
        line-height: 10px;
        margin: 9px 0px 0px 10px;
    }

    .jointhemillion-buttons a .icon {
        width: 40px;
        height: 40px;
    }

    .jointhemillion-button-iphone .icon::before {
        width: 40px;
        height: 40px;
        border-radius: 8px;
    }

    .jointhemillion-button-iphone .icon::after {
        width: 29px;
        height: 25px;
    }

    .jointhemillion-button-android .icon::before {
        width: 40px;
        height: 40px;
        border-radius: 8px;
    }

    .jointhemillion-button-android .icon::after {
        width: 29px;
        height: 25px;
    }

    .jointhemillion-buttons a {
        border-radius: 10px;
        padding: 12px 12px 12px 12px;
        width: calc(50% - 32px);
    }

    .jointhemillion-buttons a::after {
        width: 16px;
        background-size: 16px 17px;
        height: 17px;
    }

    /* Don't miss out on the news */
    .dontmissnews {
        margin: 80px 20px 80px 20px;
        width: calc(100% - 40px);
    }

    .dontmissnews-container {
        margin: 20px 0px -134px 0px;
        min-height: 514px;
    }

    .dontmissnews-background-element-boom {
        bottom: -60px;
        top: initial;
    }

    .dontmissnews-buttons {
        min-width: 356px;
        top: 20px;
    }

    .dontmissnews-background-element::before {
        height: 1070px;
        top: 918px;
        width: 60%;
    }

    /* FAQ */
    .faq {
        width: calc(100% - 40px);
        margin: 80px 20px 0px 20px;
    }

    .accordion-container .accordion-button {
        font-size: 16px;
        font-weight: 300;
        line-height: 23px;
        padding: 16px 59px 15px 20px;
        width: calc(100% - 80px);
    }

    .accordion-container li p {
        font-size: 14px;
        line-height: 17px;
        margin: 0px 0px 0px 0px;
        padding: 0px 20px 20px 20px;
        width: calc(100% - 40px);
    }

    .accordion-container .accordion-button:after {
        width: 18px;
        height: 10px;
        right: 20px;
        top: 23px;
        background-size: 18px 10px;
    }

    .accordion-container li {
        margin: 12px 0px 0px 0px;
        border-radius: 15px;
    }

    .openhelpsection {
        font-size: 16px;
        font-weight: 300;
        line-height: 23px;
        padding: 16px 20px 15px 20px;
        margin: 12px 0px 0px 0px;
        width: calc(100% - 40px);
        border-radius: 15px;
    }

    .openhelpsection::after {
        display: none;
    }

    .accordion-content > ul {
        font-size: 14px;
        font-weight: 300;
        line-height: 17px;
        padding: 2px 20px 20px 20px;
        width: calc(100% - 40px);
    }

    .faq .accordion {
        margin: 40px 0px 0px 0px;
    }

    /* Choose your side - slider fade */
    .chooseyourside-slider-swiper-element-one {
        width: 23%;
        height: 22%;
        left: 25%;
        top: 4%;
    }

    .chooseyourside-slider-swiper-element-two {
        width: 44%;
        height: 43%;
        right: 3%;
        top: 10%;
    }

    /* Content info */
    .content-info {
        width: calc(100% - 40px);
        margin: 142px 20px 10px 20px;
        font-size: 18px;
        line-height: 27px;
    }

    .content-info h1 {
        font-size: 48px;
        line-height: 62px;
    }

    .content-info h2 {
        font-size: 36px;
        line-height: 62px;
    }

    .content-info-image-txt {
        flex-direction: column-reverse;
        margin: 50px 0px 0px 0px;
    }

    .content-info-txt {
        width: 100%;
        margin: 0px 0px 0px 0px;
    }

    .content-info-image {
        width: 100%;
    }

    .content-info-txt-num {
        font-size: 48px;
        line-height: 34px;
    }

    .content-info-txt p:nth-child(2) {
        margin: 18px 0px 18px 0px;
    }

    .content-info h5 {
        font-size: 18px;
        line-height: 27px;
    }

    /* ******* ******* ******* FOOTER ******* ******* ******* */
    .footer-container {
        width: calc(100% - 40px);
        margin: 0px 20px 63px 20px;
    }

    .footer-copyright-info {
        font-weight: 200;
        font-size: 14px;
        line-height: 17px;
        margin: 21px 0px 0px 0px;
    }

    .footer-copyright-info span {
        margin: 12px 0px -4px 0px;
    }

    .footer-copyright-info span:first-child {
        margin: -3px 0px -4px 0px;
    }

    .footer-menu a {
        font-weight: 200;
        font-size: 14px;
        line-height: 29px;
        padding: 0px 0px 0px 0px;
    }

    .footer-menu-container-title {
        font-size: 18px;
        font-weight: 400;
        margin: 14px 0px 8px 0px;
        line-height: 22px;
    }

    .footer-menu-container {
        text-align: center;
    }

    .footer-menu-container:nth-child(1) {
        width: calc(100% - 0px);
        margin: 0px 0px 0px 0px;
    }

    .footer-menu-container:nth-child(2) {
        width: calc(100% - 0px);
        margin: 0px 0px 0px 0px;
    }

    .footer-menu a:nth-child(2) {
        padding: 0px 0px 0px 0px;
    }
}

/* width max: 700px */
@media screen and (max-width: 700px) {
    /* Don't miss out on the news */ .dontmissnews-container {
    min-height: 464px;
}
}

/* width max: 600px */
@media screen and (max-width: 600px) {
    /* Start play */ .startplay-container::before {
    max-width: 450px;
}

    /* Join the 1000000 */
    .jointhemillion-buttons a {
        width: calc(100% - 24px);
    }

    .jointhemillion-buttons a:nth-child(1) {
        margin: 0px 0px 0px 0px;
    }

    .jointhemillion-buttons a:nth-child(2) {
        margin: 8px 0px 0px 0px;
    }

    /* Don't miss out on the news */
    .dontmissnews-container {
        min-height: 400px;
    }
}

/* width max: 500px */
@media screen and (max-width: 500px) {
    /* Start play */ .startplay-container::before {
    max-width: 350px;
}

    .startplay-background-element {
        top: -510px;
        width: 280%;
    }

    /* Don't miss out on the news */
    .dontmissnews-container {
        min-height: 290px;
    }

    .dontmissnews-background-element-boom::before {
        width: 439px;
        height: 333px;
        bottom: 75px;
        left: 167px;
    }

    .dontmissnews-buttons {
        margin: 50px 0px 0px 0px;
    }

    .dontmissnews {
        margin: 80px 20px 20px 20px;
    }

    .dontmissnews-background-element::before {
        height: 770px;
        top: 1078px;
        width: 70%;
        opacity: 0.8;
    }

    /* Choose your side */
    .chooseyourside-slider-swiper-fade.swiper::before {
        height: 600px;
        top: -80px;
    }
}

/* width max: 450px */
@media screen and (max-width: 450px) {
    /* Start play */ .startplay-container::before {
    max-width: 330px;
}
}

/* width max: 380px */
@media screen and (max-width: 380px) {
    /* How start play */ .howstartplay-buttons a:nth-child(1) {
    margin: 0px 0px 0px 0px;
    width: calc(100% - 14px);
}

    .howstartplay-buttons a:nth-child(2) {
        margin: 20px 0px 0px 0px;
        width: calc(100% - 14px);
    }
}
