@charset "UTF-8"; /*** The new CSS reset - version 1.9 (last updated 19.6.2023) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36) */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; } /* reset default text opacity of input placeholder */ ::placeholder { color: unset; } /* remove default dot (•) sign */ ::marker { content: initial; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable="false"])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable="true"]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; } body { outline: none; background: #000; margin: 0; padding: 0; } a { cursor: pointer; } body { display: flex; min-height: 100vh; flex-direction: column; } main { flex: 1; } * { box-sizing: border-box; font-family: 'Montserrat', sans-serif; color: #fff; } .heading-first { color: #fff; font-size: 44px; font-weight: 700; line-height: 127.273%; text-align: center; } .heading-first.tablet { display: none; } .heading-second { text-align: center; font-size: 44px; font-weight: 700; line-height: 120%; } .download-btn { display: flex; justify-content: center; align-items: center; position: relative; height: 50px; margin: 0 auto 7px; padding: 16px 32px; white-space: nowrap; background: #F16436; color: #fff; text-align: center; font-size: 16px; font-weight: 600; line-height: 110%; text-transform: uppercase; transition: all .2s ease-in-out; } .download-btn:hover { background: #ff784d; } .download-btn .mobile { display: none; } .download-buttons { display: flex; justify-content: center; margin: 36px auto 0; } .download-btn .first-hidden { display: none; } .download-btn .first-hidden.visible { display: flex; } .download-btn .first-visible { display: flex; } .download-btn .first-visible.hidden { display: none; } .download-btn.mac.hidden, .download-btn.pc.hidden { display: none; } .cf-forge-mob { display: none; } .bottom { position: relative; width: 100%; overflow: hidden; } .to-top { display: flex; flex-direction: column; align-items: center; margin: 16px auto 0; color: #B2B2B2; font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 500; line-height: normal; } .to-top svg { width: 24px; height: 24px; margin: 0 0 10px; } .to-top-section { display: flex; justify-content: center; max-width: 500px; margin: 0 auto; } .to-top-section .content-wrapper { padding-top: 41px; } @keyframes OpacityLinkAppear { 0% { opacity: 0; } 50% { opacity: 0; } to { opacity: 1; } } header { position: fixed; top: 0; left: 0; width: 100%; background: #000; padding: 0; opacity: 1; z-index: 27; } header.fixed.mob { display: none; } header .download-buttons { display: flex; justify-content: center; flex-direction: row; } header .download-buttons.desktop { display: flex; flex-grow: 1; justify-content: flex-end; flex-direction: row; } header .content-wrapper { display: flex; align-items: center; justify-content: space-between; width: 100%; max-width: 1920px; margin: 0 auto; padding: 15px 22px 16px 15px; } header .hero-logo.mob { max-width: unset; width: auto; height: 26px; margin: 0 0 0 12px; display: flex; justify-content: flex-start; align-items: center; } header .hero-logo.desktop { display: flex; align-items: center; max-width: unset; width: auto; height: 34px; } header .download-buttons { margin: 0; } .header-link { margin-left: 1px; padding: 7px 25px; color: #DFDFDF; text-align: center; font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 500; line-height: 140%; border: 1px solid transparent; background: transparent; transition: .3s ease-in-out; } .header-link:hover { color: #F18536; } .header-link.border { margin-left: 40px; padding: 7px 29px; border: 1px solid #DFDFDF; color: #DFDFDF; text-align: center; font-weight: 600; line-height: 24px; opacity: 0; transition: .2s ease; } .header-link.border:hover { color: #fff; background: #F18536; border: 1px solid #F18536; } .header-link.border.mac, .header-link.border.pc { animation: OpacityLinkAppear 1s linear forwards; animation-delay: .3s; } .header-link.border.mac.hidden, .header-link.border.pc.hidden { display: none; } .header-link.orange { color: #FFF; text-align: center; font-size: 16px; text-transform: uppercase; background-color: #EB622B; text-align: center; font-weight: 600; line-height: 24px; max-width: 284px; margin: 0 auto 120px; padding: 11px 30px; white-space: nowrap; } .header-link.orange:hover { background: #F18536; } .header-buttons { flex-direction: row; } .site-header { width: 100%; position: fixed; top: 0; background-color: #000; z-index: 100; transition: .3s; } .site-header .download-btn { padding: 16px 32px; } .site-header .header-inner .logo { display: flex; align-items: center; justify-content: center; column-gap: 24px; row-gap: 2px; } .site-header .header-inner { display: flex; max-width: 1720px; margin: 0 auto; padding: 11px 20px; position: relative; z-index: 10; transition: .3s; min-height: 80px; align-items: center; justify-content: flex-start; } .site-header .header-inner nav { margin-left: auto; display: flex; align-items: center; } .submenu-icon { display: none; } .site-header .header-inner nav ul li { margin: 0 12px; } .site-header .header-inner nav ul li.mob-only.decor a { font-size: 16px; font-weight: 600; line-height: 24px; } .site-header .header-inner nav ul.header-menu { display: flex; } .site-header .hamburger-menu-button { display: none; margin-left: 8px; } .header-link-container { display: flex; align-items: flex-end; flex-grow: 1; } .hamburger-menu-button { z-index: 1; display: block; background: transparent; width: 24px; height: 24px; outline: none; border: none; cursor: pointer; padding: 0; } .hamburger-menu-button > div { position: relative; width: 24px; height: 20px; left: 2px; right: 0; margin: 0 auto; transition: .4s ease-in-out; } .hamburger-menu-button > div span { background: white; display: block; width: 100%; max-width: 20px; height: 2px; position: absolute; transition: .4s ease-in-out; border-radius: 0; } .hamburger-menu-button > div span:first-child { top: 3px; left: 0; } .hamburger-menu-button > div span:nth-child(2) { top: 9px; left: 0; } .hamburger-menu-button > div span:nth-child(3) { top: 15px; left: 0; } .hamburger-menu-button.close > div span { background: #DFDFDF; } .hamburger-menu-button.close > div span:first-child { transform: translateY(4px) rotate(45deg); } .hamburger-menu-button.close > div span:nth-child(2) { transform: scaleX(0); } .hamburger-menu-button.close > div span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); } .site-header .header-inner nav .header-menu .header-menu-inner { max-height: 0; overflow: hidden; transition: max-height .2s ease-out; position: relative; } .site-header .header-inner nav .header-menu svg { width: 24px; height: 24px; margin-right: 15px; transition: all .15s; fill: #D6D6D6; position: absolute; right: 18px; top: 12px; bottom: 0; margin: 0 auto; } .header-link.mob { position: relative; display: none; } .header-link.mob::before { position: absolute; top: 50%; left: 0; width: 4px; height: 24px; transform: translateY(-50%); content: ''; background-color: #EB622B; opacity: 0; height: 0; transition: .2s ease-in-out; } .header-link.mob.active::before { opacity: 1; height: 24px; } .header-link.mob :hover { color: #D6D6D6; } .opening-section { max-width: 100%; background-position: top; background-attachment: fixed; background-size: cover; background-repeat: no-repeat; position: relative; padding: 140px 20px 0; background-color: #191919; background: url("./../images/ArchiveHeroBG.webp") no-repeat 100% 50%; background-size: cover; z-index: 2; } .opening-section .small-text { display: none; margin: 23px 0 10px; font-family: Lato, sans-serif; font-size: 16px; font-weight: 500; line-height: 130%; color: rgba(255, 255, 255, 0.5); text-align: center; } .opening-section * { box-sizing: border-box; } .opening-section .intro-text-container { max-width: 1680px; margin: 0 auto; position: relative; z-index: 2; } .opening-section .intro-text-container p.txt { font-family: 'Montserrat', sans-serif; line-height: 145%; color: #dfdfdf; max-width: 734px; margin: 23px auto 49px; align-self: stretch; font-size: 22px; font-weight: 500; line-height: 145.455%; text-align: center; } .opening-section .intro-text-content { display: flex; flex-direction: column; align-items: center; padding-bottom: 0; } .opening-section .shadow-bg { position: absolute; width: 100%; right: 0; bottom: -2px; z-index: 1; overflow: hidden; max-width: 100%; } .opening-section .shadow-bg img { display: flex; width: 100%; } .tags-content { display: flex; justify-content: center; position: relative; margin: 0 auto; padding: 0 20px; flex-wrap: wrap; } .tags-content .tag-item { display: flex; align-items: center; margin: 4px; border: 1px solid #9F9F9F; padding: 6px 12px 5px; color: #9F9F9F; text-align: center; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 500; line-height: 140%; cursor: pointer; transition: .2s ease-in-out; } .tags-content .tag-item.active { background: #EB622B; border: 1px solid #EB622B; color: #fff; } @keyframes a { 0% { transform: scale(1); } to { transform: scale(0.8); } } .btn-link { display: flex; justify-content: center; margin: 24px auto 0; color: #9F9F9F; text-align: center; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 500; line-height: 140%; text-decoration-line: underline; cursor: pointer; } .btn-link.border { margin-left: 36px; padding: 7px 29px; border: 1px solid #DFDFDF; color: #DFDFDF; text-align: center; font-weight: 600; line-height: 24px; opacity: 0; transition: .2s ease; } .btn-link.border:hover { color: #fff; background: #F18536; border: 1px solid #F18536; } @keyframes OpacityLinkAppear { 0% { opacity: 0; } 50% { opacity: 0; } to { opacity: 1; } } .scroll-down-block { display: flex; margin: 21px auto 64px; flex-grow: 1; flex-direction: column; justify-content: flex-end; color: #808080; text-align: center; font-size: 15px; font-weight: 500; line-height: 150%; z-index: 10; position: relative; } .scroll-down { position: relative; display: flex; justify-content: center; margin: 0 auto; } .features-section { position: relative; z-index: 2; padding: 20px 0 80px; z-index: 2; background: url("./../images/ModsChoiceBG.webp") no-repeat 50% 100%, #000; background-size: 100%; } .features-section .content-wrapper { display: flex; flex-direction: column; position: relative; max-width: 1912px; min-height: 900px; padding: 0px 10px 72px; margin: 0 auto; } .features-section .archive-block { position: relative; display: flex; justify-content: center; flex-wrap: wrap; width: 100%; margin-top: 0; } .features-section .archive-item { display: flex; position: relative; overflow: hidden; max-height: 560px; max-width: 544px; margin: 12px; transition: .2s ease-in-out; cursor: pointer; height: auto; background: #101010; } .features-section .archive-item img { display: block; width: 100%; height: 100%; object-fit: cover; } .features-section .archive-item img.img-mod-mob { display: none; } .features-section .archive-item-img img { transform: translateY(0px); transition: .6s ease-in-out; } .features-section .archive-item-block { display: flex; flex-direction: column; position: relative; overflow: hidden; width: 100%; flex-grow: 1; height: 100%; justify-content: stretch; } .features-section .archive-item-text { display: flex; flex-direction: column; align-items: center; padding: 0 0 44px; justify-content: space-between; transform: translateY(0px); flex-grow: 1; } .features-section .archive-item-text-wrapper { display: flex; align-items: flex-start; justify-content: center; width: 100%; flex-grow: 1; } .features-section .archive-item-text-top { display: flex; flex-direction: column; align-items: flex-start; width: 100%; flex-grow: 1; } .features-section .archive-item-text-bottom { display: flex; flex-direction: column; align-items: flex-start; width: 100%; padding: 0; padding-bottom: 7px; } .features-section .archive-item-title { display: inline-block; margin: 0 auto; padding: 24px 0 22px; color: #fff; text-align: center; font-size: 32px; font-weight: 700; line-height: 116.67%; } .btn-view, .btn-action { display: flex; align-items: center; justify-content: center; width: 156px; height: 39px; margin: 3px 10px; padding: 6px 16px 6px 12px; white-space: nowrap; text-decoration: none; transition: all .2s ease-in-out; cursor: pointer; text-transform: uppercase; color: #fff; text-align: center; font-family: Lato, sans-serif; font-size: 18px; font-weight: 400; line-height: 150%; } .btn-view { display: flex; justify-content: center; align-items: center; background: transparent; border: 1px solid #DFDFDF; height: 48px; width: unset; margin: 3px 10px; padding: 16px 32px; white-space: nowrap; text-decoration: none; transition: all .2s ease-in-out; cursor: pointer; text-transform: uppercase; color: #DFDFDF; font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 600; line-height: 24px; text-transform: uppercase; } .btn-view:hover { background: #EB622B; border: 1px solid #EB622B; color: #fff; } .archives-numeration { display: flex; justify-content: center; align-items: center; padding: 0 20px; opacity: 0; position: absolute; z-index: -100; } .archives-numeration .arrow { height: 20px; min-width: 20px; opacity: 0.3; cursor: pointer; transition: .2s ease-in-out; } .archives-numeration .arrow.active, .archives-numeration .arrow:hover { opacity: 1; } .archives-numeration .archives-num { position: relative; margin: 0 4px; padding: 0 4px; cursor: pointer; color: #9F9F9F; text-align: center; font-family: Lato, sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; } .archives-numeration .archives-num:hover, .archives-numeration .archives-num.active { transition: .2s ease-in-out; color: #fff; } .subscribe-section { background: #000 url("./../images/SubscriptionFormBGDesktop_Palworld.webp") no-repeat 50% 50%; background-size: cover; } .subscribe-section .content-wrapper { max-width: 827px; display: flex; flex-direction: column; align-items: center; margin: 0 auto; padding: 157px 20px 263px; } .subscribe-section .main-text { max-width: 460px; color: #DFDFDF; text-align: center; font-size: 22px; font-weight: 500; line-height: 160%; margin: 21px auto 48px; } .subscr-alarm { width: 150px; height: 148px; margin-bottom: 47px; } .bottom-section { background-size: cover; position: relative; } .bottom-section .heading-third { width: 100%; max-width: 460px; } .bottom-section .heading-third br { display: none; } .bottom-section .content-wrapper { display: flex; justify-content: center; max-width: 1471px; margin: 0 auto; padding: 292px 20px 103px; position: relative; z-index: 2; } .bottom-section .content-wrapper-inner { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; max-width: 602px; margin: 0; text-align: left; } .bottom-section .bottom-characters { position: absolute; left: 2%; bottom: 0px; width: 999.35px; height: 740px; margin: 0; } .bottom-section .heading-second { text-align: left; } .bottom-section .download-btn { height: 62px; margin: 0 auto 5px; } .bottom-character-mob { display: none; } .download-buttons { display: flex; justify-content: flex-start; margin: 39px 0 0; flex-direction: column; } .download-btn.standalone { opacity: 0; z-index: -2; transition: .2s ease-in-out; } .download-btn.standalone.visible { opacity: 1; z-index: 1; } .btn-divider.hero, .btn-divider.bottom { display: flex; justify-content: center; align-items: center; position: relative; transition: .2s ease-in-out; height: 25px; cursor: pointer; width: 264px; } .btn-divider.hero span, .btn-divider.bottom span { display: flex; position: absolute; top: 0%; left: 50%; transform: translate(-50%, 0%); white-space: nowrap; color: #808080; text-align: center; font-family: Lato, sans-serif; font-size: 13px; font-style: normal; font-weight: 500; line-height: normal; text-decoration-line: underline; width: 100%; width: 264px; display: block; text-align: center; justify-content: center; } .btn-divider.hero .visible, .btn-divider.bottom .visible { display: flex; text-decoration: underline; } .btn-divider.hero .visible.hide, .btn-divider.bottom .visible.hide { display: none; } .btn-divider.hero .hidden, .btn-divider.bottom .hidden { display: flex; text-decoration: none; } .btn-divider.hero .hidden.hide, .btn-divider.bottom .hidden.hide { display: none; } .btn-divider.hero.mob, .btn-divider.bottom.mob { display: none; } .btn-divider.hero { margin: 0; } .btn-divider.bottom { margin: 0 16px; } img { pointer-events: none; } .footer { position: relative; z-index: 1; padding: 0; display: flex; flex-direction: column; align-items: center; } .footer .content-wrapper { display: flex; flex-direction: column; align-items: center; position: relative; width: 100%; max-width: px; margin: 0 auto; padding: 30px 20px 18px; } .footer-line { display: flex; width: 100%; justify-content: space-between; background: #101010; width: 100%; } .footer-line .content-wrapper { position: relative; flex-direction: column; max-width: 1678px; width: 100%; margin: 0 auto; padding: 15px 10px; } .footer-line p, .footer-line span, .footer-line a { color: #9F9F9F; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 500; line-height: 140%; } .footer-line a { text-decoration-line: underline; transition: .2s ease-in-out; } .footer-line a:hover { color: #fff; } .footer-line-left { display: flex; flex-direction: column; } .footer-line-left ul { display: flex; align-items: center; } .footer-line-left ul li { color: #9F9F9F; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 500; line-height: 140%; } .footer-line-right { display: flex; } .footer-line-right p, .footer-line-right span, .footer-line-right a, .footer-line-right li { color: #9F9F9F; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 500; line-height: 140%; } .footer-col { display: flex; flex-direction: column; align-items: flex-start; margin: 0 0 48px; width: 100%; } .footer-col p { margin-top: 24px; } .footer-col p, .footer-col span, .footer-col a { color: #B2B2B2; font-family: Lato, sans-serif; font-size: 14px; font-weight: 400; line-height: 140%; transition: .2s ease-in-out; } .footer-col a { text-decoration: underline; transition: .2s ease-in-out; } .footer-col a:hover { color: #fff; } .footer-fire { position: absolute; top: -47px; right: -100px; width: 375px; max-height: 228px; } .footer-logo { width: 177px; } .footer-socials { display: flex; margin-top: -2px; } .footer-socials-item { margin-left: 20px; } .footer-line ul.mob-only { display: none; } @media only screen and (min-width: 768px) { .features-section .archive-block { display: flex; grid-template-columns: 50% 50%; margin-top: 45px; } } @media only screen and (min-width: 1025px) { header .content-wrapper { min-height: 80px; } .header-link { opacity: 0; animation: OpacityLinkAppear 1s linear forwards; animation-delay: .3s; } .opening-section .small-text { display: block; text-align: left; } .tags-content .tag-item:hover { border: 1px solid #fff; color: #fff; } .btn-link:hover { color: #fff; transition: .2s ease-in-out; } .features-section .archive-item-text-bottom { padding-bottom: 7px; } .subscribe-section .main-text br { display: none; } .bottom-section .content-wrapper { justify-content: flex-end; } .footer { padding: 0; } .footer .content-wrapper { max-width: 1720px; padding: 70px 20px 0; align-items: flex-start; } .footer-line .content-wrapper { flex-direction: row; justify-content: space-between; max-width: 1720px; margin: 0 auto; padding: 16px 20px; } .footer-line-left { flex-direction: row; } .footer-line-left ul li { margin-left: 32px; } } @media only screen and (min-width: 1100px) { .site-header .header-inner nav ul li ul.header-menu-inner { display: none; } } @media only screen and (min-width: 1225px) { .features-section .archive-block { grid-template-columns: 32% 32% 32%; } } @media only screen and (min-width: 1725px) { .features-section .archive-block { grid-template-columns: 33% 33% 33%; } } @media only screen and (max-width: 1800px) { .footer-fire { right: -3vw; } } @media only screen and (max-width: 1324px) { .bottom-section .bottom-characters { left: -13%; } } @media only screen and (max-width: 1250px) { .site-header .header-inner nav ul li { margin: 0; } } @media only screen and (max-width: 1175px) { .bottom-section .bottom-characters { left: -19%; } } @media only screen and (max-width: 1100px) { .site-header .hamburger-menu-button { display: block; } .submenu-icon { display: flex; } .site-header .header-inner .action-items { width: fit-content; margin: auto auto 10vh; display: flex; gap: 8px; } .site-header .header-inner nav .header-menu { position: absolute; left: 0; top: 75px; margin: 0; flex-direction: column; background-color: #202020; text-align: center; width: 100%; overflow: overlay; height: 100vh; padding-top: 21px; padding-bottom: 64px; gap: 0; flex-grow: 1; } .site-header .header-menu-inner { background: #000; } .site-header .header-inner nav { position: fixed; top: 0; left: 0; height: 100%; width: 100%; opacity: 0; transition: opacity .3s ease-out; animation: quick-hide-mobile-menu .2s 1; } .site-header .header-inner nav ul li { margin-left: unset; display: flex; justify-content: flex-start; position: relative; width: 100%; margin: 0; flex-direction: column; } .site-header .header-inner nav ul li a { display: flex; align-items: center; } .site-header .header-inner nav ul li a.download-btn { max-width: 224px; } @keyframes quick-hide-mobile-menu { 0% { opacity: 0; } to { opacity: 0; } } .site-header .header-inner nav.is-open { opacity: 1; } .site-header .header-inner nav:not(.is-open) { pointer-events: none; } .site-header .header-inner nav ul::-webkit-scrollbar { width: 4px; height: 4px; background-color: #808080; } .site-header .header-inner nav ul::-webkit-scrollbar-thumb { border-width: 0; background-color: #808080; background-clip: padding-box; } } @media only screen and (max-width: 1024px) { .heading-first { max-width: 400px; margin: 0 auto; text-align: center; font-weight: 700; font-size: 32px; line-height: 125%; } .heading-second { font-size: 32px; } .download-btn { width: 210px; margin: 0px auto; padding: 8px; font-size: 16px; } .download-btn .desktop { display: none; } .download-buttons { display: none; } .cf-forge-mob { display: flex; margin: 39px auto 0; } .to-top { margin: 13px auto 0; font-size: 16px; } .to-top-section .content-wrapper { padding-top: 0; } header.fixed.desktop { display: none; } header.fixed.mob { display: flex; } header .download-buttons { flex-direction: column; } header .download-buttons.desktop { display: none; } header { display: none; } .header-link { margin-left: 0; margin-bottom: 25px; font-size: 18px; line-height: 28px; opacity: 1; } .opening-section { background-size: cover; display: flex; flex-direction: column; height: unset; width: 100%; padding: 0; background-attachment: unset; height: unset; background: none; } .opening-section .header-link.orange { opacity: 1; margin: 0 auto 59px; } .opening-section .intro-text-container { padding: 0 20px; } .opening-section .intro-text-container p.txt { margin: 8px auto 31px; max-width: 474px; text-align: center; font-size: 18px; line-height: 160%; } .opening-section .intro-text-container p.txt br { display: none; } .opening-section .intro-text-content { display: flex; flex-direction: column; padding-top: 120px; padding-bottom: 0px; } .opening-section .shadow-bg img { min-width: 1920px; } .tags-content { padding: 0; } .btn-link { margin: 22px auto 0; } .btn-link.border { opacity: 1; } .scroll-down-block { display: none; } .features-section { padding: 0 0 68px; } .features-section .content-wrapper { min-height: 296px; padding: 0 20px; } .features-section .archive-item { display: flex; margin-bottom: 40px; } .features-section .archive-item-img { overflow: hidden; position: relative; } .features-section .archive-item-text { padding: 0 0 26px; } .features-section .archive-item-title { padding: 12px 0 6px; font-size: 24px; line-height: 160%; } .archives-numeration { padding-bottom: 56px; } .subscribe-section { background: #000 url("./../images/SubscriptionFormBGMobile_Palworld.webp") no-repeat 50% 50%; background-size: cover; } .subscribe-section .heading-second { font-size: 32px; } .subscribe-section .content-wrapper { padding: 81px 20px 130px; } .subscribe-section .main-text { font-size: 18px; line-height: 28px; margin: 12px auto 35px; } .subscr-alarm { width: 126px; height: 108.811px; margin-bottom: 38px; } .bottom-section { margin: 0 auto; padding: 5px 0 0; overflow: hidden; margin: 0; background-size: cover; } .bottom-section .heading-third { margin-bottom: 24px; text-align: center; font-size: 32px; font-weight: 700; line-height: 120%; letter-spacing: -0.16px; } .bottom-section .heading-third br { display: flex; } .bottom-section .content-wrapper { display: flex; flex-direction: column; align-items: center; padding: 76px 20px 0; background-size: cover; } .bottom-section .content-wrapper-inner { align-items: center; } .bottom-section .bottom-characters { display: none; } .bottom-section .heading-second { text-align: center; } .bottom-section .download-btn { height: 56px; } .bottom-character-mob { display: flex; width: 100%; margin-top: -7px; } .download-buttons { margin: 40px 0 0; } .download-btn { display: none; } .download-buttons-mob .download-btn { display: flex; } .btn-divider.hero, .btn-divider.bottom { width: 256px; margin: 7px 16px; } .btn-divider.hero span, .btn-divider.bottom span { font-family: 'Montserrat', sans-serif; font-size: 14px; } .btn-divider.hero.desktop, .btn-divider.bottom.desktop { display: none; } .btn-divider.hero.mob, .btn-divider.bottom.mob { display: flex; z-index: 3; } .footer-line { flex-direction: column; align-items: center; } .footer-col { align-items: center; margin: 0 auto 8px; } .footer-col p { margin-top: 30px; text-align: center; } .footer-fire { display: none; } .footer-logo { width: 140px; } .footer-socials { margin-top: 44px; justify-content: center; margin: 29px auto 6px; } .footer-line ul.mob-only { display: flex; justify-content: space-between; width: 100%; padding: 0px 16px 16px; } .footer-line ul.mob-only li { margin: 0 4px; } .footer-line ul.desktop-only { display: none; } .footer-socials-item { margin-left: unset; margin: 0 10px; } .footer-socials-item:first-of-type { order: 1; } .footer-socials-item:nth-of-type(2) { order: 3; } .footer-socials-item:last-of-type { order: 2; } } @media only screen and (max-width: 767px) { .features-section .archive-item { width: 100%; margin: 0; margin-bottom: 40px; } .features-section .archive-item img { display: none; } .features-section .archive-item img.img-mod-mob { display: block; height: unset; object-fit: unset; width: 100%; max-inline-size: unset; max-block-size: unset; } .features-section .archive-item-img { height: 156px; min-height: 156px; } } @media only screen and (max-width: 350px) { .features-section .archive-item { max-width: 280px; min-width: 280px; height: auto; } } @media only screen and (min-width: 425px) and (max-width: 1024px) { .heading-first { display: none; } .heading-first.tablet { display: flex; } } @media only screen and (max-width: 1260px) and (min-width: 1024px) { .bottom-section { background-size: cover; } }