html[data-useragent*=idclauncher] .nolauncher { display: none !important; } html[data-useragent*=idclauncher] .noweb-block { display: block !important; } html[data-useragent*=idclauncher] .noweb-flex { display: flex !important; } html[data-useragent*=idclauncher] footer { display: none !important; } html[data-useragent*=idclauncher] main section:first-child .container-fluid.mt-5 { margin-top: 0 !important; } ::-webkit-scrollbar { width: 6px; height: 6px; } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 15px rgba(16, 255, 127, .2); } ::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 10px -10px 6px rgb(16, 255, 127); } .addComments textarea { min-height: 20vh; } .addComments textarea:focus { outline-color: rgba(0, 255, 126, .75); outline-style: auto; outline-width: 1px; } .fa, .far, .fas { font-family: "Font Awesome 5 Free" !important; font-display: swap; } .fab { font-family: "Font Awesome 5 Brands" !important; font-display: swap; } .icon_ok::before { font-family: FontAwesome; content: "\f058"; } .hidden { display: none !important; } .left-0 { left: 0 !important; } .ig-square { position: relative; } .ig-square-4-3 { padding-bottom: calc(3 / 4 * 100%); } .ig-square div:first-child { position: absolute; width: 100%; height: 100%; } .idc-pt-input-otp input { text-align: center; } .idc-pt-input-otp input:disabled { background-color: #1f272f; } .idc-pt-input-otp button { left: 0; } .ml-10\% { margin-left: 10%; } .logo h1 { } .navbar-brand img { position: fixed; top: 10px; padding: 0; background-image: radial-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .3), rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)); } @media (min-width: 768px) { .navbar-brand img { height: 80px; margin: 10px; } } @media (min-width: 480px) and (max-width: 767px) { .navbar-brand img { height: 70px; margin: 0; } } @media (max-width: 479px) { .navbar-brand img { height: 50px; margin: 0; } } .nav-item a span { font-size: 1.3rem; line-height: 1.2rem; } @media (min-width: 576px) and (max-width: 767px) { .nav-item a span { font-size: 1.1rem; line-height: 1.2rem; } } .language { padding: 0; height: 25px; margin-top: -5px; } .texture-bg { position: absolute; background-blend-mode: multiply; background-position: center center; background-repeat: no-repeat; height: 100vh; } @media (min-width: 480px) { .texture-bg { background-image: linear-gradient(-115deg, #202328 0, #8f8f8f00 40%, rgba(32, 35, 40, .7) 65%, rgba(0, 0, 0, .9) 100%); overflow: hidden; } } @media (max-width: 479px) { .texture-bg { background-image: -webkit-gradient(linear, left top, left bottom, from(black), color-stop(40%, #8f8f8f00), color-stop(65%, rgba(32, 35, 40, .1)), to(rgba(0, 0, 0, .9))); background-image: linear-gradient(180deg, black 0, #8f8f8f00 40%, rgba(32, 35, 40, .1) 65%, rgba(0, 0, 0, .9) 100%); overflow: unset; } } .videoBg { display: block; width: 100%; position: absolute; overflow: hidden; top: 0; bottom: 0; left: 0; right: 0; margin-left: auto; margin-right: auto; } video { position: fixed; z-index: -1; right: 0; top: 0; min-width: 100%; min-height: 100%; } @media (max-width: 479px) { .videoMobile video { max-width: 100vw; } } .logo h1 { background-position: center bottom; background-repeat: no-repeat; background-size: contain; } @media (min-width: 576px) { .logo h1 { height: 25vh; max-height: 362px;} } @media (min-width: 480px) and (max-width: 575px) { .logo h1 { height: 120px; } } @media (max-width: 479px) { .logo h1 { height: 80px; } } .fontPrimaryMedium { font-family: Jura,sans-serif; font-weight: 600; font-size: 1rem;} @media (min-width: 480px) and (max-width: 575px) { .text h2 { text-align: center; } } @media (max-width: 479px) { .text h2 { text-align: center; font-size: .9rem; } } .contentLanding { position: absolute; width: 100vw; } @media (min-width: 992px) and (max-width: 1199px) { .contentLanding { height: calc(100vh - (20vh + 100px)); } } @media (min-width: 768px) and (max-width: 991px) { .contentLanding { height: calc(100vh - (20vh + 60px)); } } @media (min-width: 576px) and (max-width: 767px) { .contentLanding { height: calc(100vh - (20vh + 75px)); } } @media (min-width: 480px) and (max-width: 575px) { .contentLanding { height: calc(100vh - (15vh + 140px)); margin-top: 100px; } } @media (max-width: 479px) { .contentLanding { height: calc(85vh - 70px); margin-top: 70px; } } @media (min-width: 480px) { .contentContainer { background-image: radial-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .3), rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)); } } @media (min-width: 1200px) { .contentContainer { max-width: 40vw; margin: 110px 0 0 6rem; } } @media (min-width: 992px) and (max-width: 1199px) { .contentContainer { max-width: 40vw; margin-left: 3rem; } } @media (min-width: 768px) and (max-width: 991px) { .contentContainer { max-width: 40vw; margin-left: 3rem; } } @media (min-width: 576px) and (max-width: 767px) { .contentContainer { max-width: 40vw; margin-left: 2.5rem; } } @media (min-width: 480px) and (max-width: 575px) { .contentContainer { max-width: 100vw; margin: 0 auto; padding: 10px 20px; height: calc(100vh - (25vh + 140px)); } } @media (max-width: 479px) { .contentContainer { max-width: 100vw; margin: 0 auto; padding: 10px 20px; height: calc(85vh - 70px); background-image: none; } } @media (min-width: 576px) { .btns { max-height: 120px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } } @media (min-width: 480px) and (max-width: 575px) { .btns { position: absolute; bottom: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-line-pack: center; align-content: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; width: calc(100vw - 40px); } } @media (max-width: 479px) { .btns { position: absolute; bottom: 10px; max-height: unset; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: distribute; justify-content: space-around; width: calc(100vw - 40px); } } #stopVideoBtn, #stopAudioBtn { cursor: pointer; padding: 10px; } @media (min-width: 576px) { .videoControlsBtns { margin: 5px 30px; } } @media (min-width: 480px) and (max-width: 575px) { .videoControlsBtns { position: absolute; top: 90%; right: 15px; } } @media (max-width: 479px) { .videoControlsBtns { position: absolute; bottom: 50%; top: 50%; } } #lottie, #lottieAudio { background-color: transparent; } @media (min-width: 480px) { #lottie, #lottieAudio { width: 40px; height: 40px; } } @media (max-width: 479px) { #lottie, #lottieAudio { width: 30px; height: 30px; } } #lottie svg path { stroke: white; -webkit-transition: all .5s ease; transition: all .5s ease; } #lottie:hover svg path { stroke: #00ff7e; } #lottieAudio svg path { fill: white; -webkit-transition: all .5s ease; transition: all .5s ease; } #lottieAudio:hover svg path { fill: #00ff7e; } .btnLanding { border: 1px solid #00ff7f; color: #00ff7f; background: rgba(0, 0, 0, .8); letter-spacing: .1rem; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: .2s; transition-duration: .2s; } @media (min-width: 480px) and (max-width: 575px) { .btnLanding { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-item-align: center; align-self: center; width: 260px; text-align: center; } .btns a { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-item-align: center; align-self: center; text-align: center; } } @media (min-width: 480px) { .btnLanding { padding: 15px 50px; } } @media (max-width: 479px) { .btnLanding { font-size: 1em; padding: 10px 18px; } } .btnLanding:hover, .btnLanding:focus, .btnLanding:active { border: 1px solid #202328; color: black; background: rgba(0, 255, 127, .8); } @-webkit-keyframes hvr-pulse-grow { to { -webkit-transform: scale(1.1); transform: scale(1.1); } } @keyframes hvr-pulse-grow { to { -webkit-transform: scale(1.1); transform: scale(1.1); } } .hvr-pulse-grow { -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); } .hvr-pulse-grow:hover, .hvr-pulse-grow:focus, .hvr-pulse-grow:active { -webkit-animation-name: hvr-pulse-grow; animation-name: hvr-pulse-grow; -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate; } .otherGamesSection { position: relative; margin-left: -15px; margin-right: -15px; background-image: -webkit-gradient(linear, left bottom, left top, from(black), color-stop(60%, rgba(0, 0, 0, .7)), to(rgba(0, 0, 0, 0))); background-image: linear-gradient(to top, black 0, rgba(0, 0, 0, .7) 60%, rgba(0, 0, 0, 0) 100%); -webkit-transition: -webkit-transform .5s ease; transition: -webkit-transform .5s ease; transition: transform .5s ease; transition: transform .5s ease, -webkit-transform .5s ease; } @media (min-width: 1200px) { .otherGamesSection { top: 85vh; } } @media (min-width: 992px) and (max-width: 1199px) { .otherGamesSection { top: 80vh; } } @media (min-width: 768px) and (max-width: 991px) { .otherGamesSection { top: 80vh; } } @media (min-width: 576px) and (max-width: 767px) { .otherGamesSection { top: 80vh; } } @media (min-width: 480px) and (max-width: 575px) { .otherGamesSection { top: 85vh; } } @media (max-width: 479px) { .otherGamesSection { top: 84vh; } } @media (min-width: 1200px) { .otherGamesSection:hover { -webkit-transform: translate(0px, -135px); transform: translate(0px, -135px); } } @media (min-width: 992px) and (max-width: 1199px) { .otherGamesSection:hover { -webkit-transform: translate(0px, -100px); transform: translate(0px, -100px); } } @media (min-width: 768px) and (max-width: 991px) { .otherGamesSection:hover { -webkit-transform: translate(0px, -60px); transform: translate(0px, -60px); } } @media (min-width: 576px) and (max-width: 767px) { .otherGamesSection:hover { -webkit-transform: translate(0px, -75px); transform: translate(0px, -75px); } } @media (min-width: 480px) and (max-width: 575px) { .otherGamesSection:hover { -webkit-transform: translate(0px, -140px); transform: translate(0px, -140px); } } @media (max-width: 479px) { .otherGamesSection:hover { -webkit-transform: none; transform: none; } } @media (min-width: 1200px) { .otherGamesTitleContainer { width: 20%; } } @media (min-width: 992px) and (max-width: 1199px) { .otherGamesTitleContainer { width: 25%; } } @media (min-width: 768px) and (max-width: 991px) { .otherGamesTitleContainer { width: 31%; } } @media (min-width: 576px) and (max-width: 767px) { .otherGamesTitleContainer { width: 31%; } } @media (min-width: 480px) and (max-width: 575px) { .otherGamesTitleContainer { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } } @media (max-width: 479px) { .otherGamesTitleContainer { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } } @media (min-width: 1200px) { .lineaHorizontalAncha { width: 100%; } } @media (min-width: 992px) and (max-width: 1199px) { .lineaHorizontalAncha { width: 100%; } } @media (min-width: 768px) and (max-width: 991px) { .lineaHorizontalAncha { width: 100%; } } @media (min-width: 576px) and (max-width: 767px) { .lineaHorizontalAncha { width: 100%; } } @media (min-width: 480px) and (max-width: 575px) { .lineaHorizontalAncha { width: 10%; } } @media (max-width: 479px) { .lineaHorizontalAncha { width: 25%; } } @media (min-width: 576px) { .otherGamesSection h3 { font-family: bebas_kairegular, sans-serif; font-size: 2.2rem; line-height: 2.4rem; } } @media (min-width: 480px) and (max-width: 575px) { .otherGamesSection h3 { font-family: bebas_kairegular, sans-serif; font-size: 1.8rem; line-height: 2rem; margin-left: 1rem; } } @media (max-width: 479px) { .otherGamesSection h3 { font-family: bebas_kairegular, sans-serif; font-size: 1.4rem; line-height: 2rem; margin-left: 1rem; } } .filterThumbnail { position: relative; } .filterThumbnail:after { position: absolute; content: ""; height: 100%; width: 100%; top: 0; left: 0; background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .1)), to(rgba(255, 255, 255, .1))); background-image: linear-gradient(to top, rgba(0, 0, 0, .1), rgba(255, 255, 255, .1)); -webkit-transition-property: opacity; transition-property: opacity; -webkit-transition-duration: .3s; transition-duration: .3s; } .filterThumbnail:hover::after { opacity: 0; } .slick-slide img { -webkit-filter: saturate(0.5); filter: saturate(0.5); -webkit-transition-property: filter; -webkit-transition-property: -webkit-filter; transition-property: -webkit-filter; transition-property: filter; transition-property: filter, -webkit-filter; -webkit-transition-duration: .3s; transition-duration: .3s; height: 330px; } .slick-active:hover img { -webkit-filter: saturate(1); filter: saturate(1); } .hvr-grow { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; } .hvr-grow:hover { -webkit-transform: scale(1.1) translateY(-20px); transform: scale(1.1) translateY(-20px); z-index: 100; margin-bottom: 55px; } @media (max-width: 575px) { .hvr-grow:hover { -webkit-transform: none; transform: none; } } .hvr-grow:focus, .hvr-grow:active { -webkit-transform: scale(1); transform: scale(1); } .slick-list { overflow: unset !important; } .paginator { position: absolute; } .paginator ul { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100vw; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; margin: 0; padding: 0; } .prev { width: 50vw; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-line-pack: center; align-content: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .next { width: 50vw; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-line-pack: center; align-content: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .prev i, .next i { position: relative; z-index: 50; } .prev i { padding: 12% 15px 12% 25px; } @media (max-width: 479px) { .prev i { padding: 55% 15px 12% 25px; } } .next i { padding: 12% 25px 12% 15px; } @media (max-width: 479px) { .next i { padding: 55% 15px 12% 25px; } } .navbar li { list-style: none; } @media (max-width: 991px) { .navbar-collapse ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; color: #fff; } .navbar-collapse ul a { color: #fff; } .navbar-collapse ul li { width: 100%; padding: .25em 0; border-bottom: 1px solid rgba(0, 255, 126, .25); } } @media (min-width: 992px) and (max-width: 1360px) { #navbarNav .fontSecondarySmall { font-size: 1.05rem; } #navbarNav ul { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } #navbarNav .nav-link { padding: .5rem .55rem; } #navbarNav .menu-reduced { display: none; } } .navbar-toggler i { color: #fff; } .navbar-toggler { outline: none !important; } .dropdown-menu-right { right: 0; left: auto; } .flag { -webkit-transform: scale(0.5); transform: scale(0.5); margin: -20px; } .language-menu.dropdown-menu.show { display: flex; flex-direction: row; margin-top: .25rem; width: 92.5vw; justify-content: end; height: auto; flex-wrap: wrap; } .language-menu a.border-right { border-right-color: rgba(0, 255, 126, .25) !important; } .language-menu a { color: #fff; } .language-menu a:hover { color: #66ffb2; } .navbar-collapse.show { display: none; } .modal-content { border: none; box-shadow: 1px 3px 9px 3px rgba(0,0,0,.8); } @media (min-width: 1200px) { .loginModal .modal-lg, .registerModal .modal-lg, .same_width_with_login_modal .modal-lg { max-width: 936px; } } @media (min-width: 992px) and (max-width: 1199px) { .loginModal .modal-lg, .registerModal .modal-lg, .same_width_with_login_modal .modal-lg { max-width: 830px; } } @media (min-width: 768px) and (max-width: 991px) { .loginModal .modal-lg, .registerModal .modal-lg, .same_width_with_login_modal .modal-lg { max-width: 80vw; } } @media (min-width: 576px) and (max-width: 767px) { .loginModal .modal-lg, .registerModal .modal-lg, .same_width_with_login_modal .modal-lg { max-width: 85vw; } } @media (min-width: 768px) { .loginModal .close, .registerModal .close, .hide_close_modal .close { display: none; } } @media (max-width: 767px) { .loginModal .close, .registerModal .close, .hide_close_modal .close { position: absolute; top: 20px; right: 20px; } } .modal-backdrop { position:fixed; top:0; right:0; bottom:0; left:0; z-index:1040; } .modal-backdrop.fade { opacity:0; } .modal-backdrop.show { opacity:.7; } .alredyRegistered p, .noYetRegistered p { font-size: .9rem; } .alredyRegistered { position: absolute; top: 15px; } .noYetRegistered .lineaHorizontalEstrecha { width: 45%; float: right; } @media (max-width: 575px) { .noYetRegistered .lineaHorizontalEstrecha { display: none; } } .alredyRegistered .lineaHorizontalEstrecha { width: 40%; float: right; } @media (max-width: 575px) { .alredyRegistered .lineaHorizontalEstrecha { display: none; } } .modalMainContentContainer { position: relative; max-width: 100%; } .loginModal .btn-cta, .registerModal .btn-cta { font-size: 1.7rem; padding: 1% 5%; } @media (max-width: 575px) { .loginModal .btn-cta, .registerModal .btn-cta { font-size: 1.6rem; padding: 2% 5%; } } .btn-social { max-height: 46px; width: 182px; padding: 10px; text-align: center; border-radius: 2px; white-space: nowrap; } .btn-social:focus { outline:0; box-shadow:0 0 0 .2rem rgba(52,58,64,.5) } @media (max-height: 740px) { .modal .display-4 { font-size: 3rem; font-weight: 700; line-height: 1.2; } .modal .h6 { font-size: 1rem; } .modal h4 { font-size: 1.5rem; } .loginModal .btn-cta.mt-xl-4, .registerModal .btn-cta.mt-xl-4 { margin-top: .25rem !important; } .modalMainContentContainer .mt-xl-5 { margin-top: .75rem !important; } .modalMainContentContainer .pt-xl-4 { padding-top: .5rem !important; } } .btn-social { max-height: 46px; width: 182px; padding: 10px; text-align: center; border-radius: 2px; white-space: nowrap; } .modal .btn-social { max-height: 40px; font-size: .7rem; line-height: .7rem; } .modal .btn-social { width: 190px; } @media (max-width: 507px) { .modal .btn-social { width: 100%; } } .btn-social:focus { outline:0; box-shadow:0 0 0 .2rem rgba(52,58,64,.5) } .btn-msn { color: #000; background-color: #fff; max-height: 41px; border-color: rgba(0, 0, 0, .2); } .btn-msn svg { max-height: 22px; } .btn-msn path { fill: #FFF; } .btn-twitter { color: #fff; background-color: #00a7e7; border-color: rgba(0, 0, 0, .2); } .btn-vk { color: #fff; background-color: #2787f5; border-color: rgba(0, 0, 0, .2); } .btn-steam { color: #fff; background-color: #134b7c; border-color: rgba(0, 0, 0, .2); } .btn-google { color: #fff; background-color: #e34133; border-color: rgba(0, 0, 0, .2); } .btn-facebook { color: #fff; background-color: #3b5998; border-color: rgba(0, 0, 0, .2); } .btn-twitch { color: #FFF; background: #451793; border-color: rgba(0, 0, 0, .2); } .btn-discord { color: #fff; background-color: #5865f2; border-color: rgba(0, 0, 0, .2); } .x-twitter-small { fill: #fff; height: 1.33333em; } .btnLanding { white-space: nowrap;} .steam-link svg {height: 41px; padding: 2px;} .steam-link polygon, .steam-link path { fill: #fff; } .steam-link:hover path,.steam-link:active path,.steam-link:focus path, .steam-link:hover polygon,.steam-link:active polygon,.steam-link:focus polygon { fill: #000; } @media (max-width: 479px) { .btnLanding svg {height: 32px;}} .fontPrimaryMedium { font-family: Jura,sans-serif!important; font-weight: 600; font-size: 1.4rem;} .fontPrimaryMedium:lang(th) { font-family: 'Bai Jamjuree', sans-serif!important; } .fontPrimaryMedium:lang(ja) { font-family:'M PLUS Rounded 1c',sans-serif!important; } .btn-social:lang(th) { font-family: 'Bai Jamjuree', sans-serif!important; } .btn-social:lang(ja) { font-family:'M PLUS Rounded 1c',sans-serif!important; } .videoBg{ background-image: linear-gradient(-115deg, rgba(32, 35, 40, 0) 0, rgba(32, 35, 40, .2) 40%, rgba(32, 35, 40, .4) 65%, rgba(0, 0, 0, .6) 100%); }