@font-face { font-family: 'Steelers_2023 Stencil'; src: url("Steelers2023Stencil-B.eot"); src: url("Steelers2023Stencil-B.eot?#iefix") format("embedded-opentype"), url("Steelers2023Stencil-B.woff2") format("woff2"), url("Steelers2023Stencil-B.woff") format("woff"), url("Steelers2023Stencil-B.ttf") format("truetype"); font-weight: normal; font-style: normal; font-display: swap; } @keyframes arrow-down { 0%, 30%, 60%, 100% { transform: translateY(-15px); } 40%, 50% { transform: none; } } body { position: relative; background-color: #0A0B09; font-family: 'prometo'; font-style: normal; font-weight: 400; font-size: 0px; letter-spacing: 0px; color: #FFFFFF; overflow-x: hidden; } body::-webkit-scrollbar { width: 7px; } body::-webkit-scrollbar-track { background: #000000; } body::-webkit-scrollbar-thumb { background: #FFB612; border-radius: 4px; } body.no-scroll { overflow: hidden; } div.mainContainer { display: block; visibility: hidden; position: relative; width: 100%; max-width: 100vw; height: auto; padding: 0px; margin: 0px; overflow: hidden; } @media (max-width: 1000px) { div.mainContainer { overflow-x: hidden; } } div.mainContainer.show { visibility: visible; } div.mainContainer div, div.mainContainer a, div.mainContainer p, div.mainContainer span, div.mainContainer input, div.mainContainer iframe, div.mainContainer img { position: relative; box-sizing: border-box; transition: .5s; } div.mainContainer div::-webkit-scrollbar { width: 7px; } div.mainContainer div::-webkit-scrollbar-track { background: #000000; } div.mainContainer div::-webkit-scrollbar-thumb { background: #FFB612; border-radius: 4px; } div.mainContainer a { text-decoration: none; } div.mainContainer a.disabled { pointer-events: none; cursor: default; } div.mainContainer a.btn { display: inline-flex; justify-content: center; align-items: center; width: auto; min-width: 128px; height: 58px; padding: 10px 25px; border-radius: 29px; background-color: #FFB612; font-family: 'kaneda-gothic'; font-style: normal; font-weight: 700; color: #000000; text-transform: uppercase; text-align: center; font-size: 24px; line-height: 24px; letter-spacing: 1px; white-space: nowrap; box-shadow: 0px 6px 30px 0px #00000040; } div.mainContainer a.btn.disabled { opacity: .5; pointer-events: none; cursor: default; } div.mainContainer a.btn.bg-black { background: #000000; color: #FFFFFF; } @media (max-width: 1280px) { div.mainContainer a.btn { height: 52px; } } @media (max-width: 1000px) { div.mainContainer a.btn { height: 42px; padding: 10px 20px; min-width: 110px; border-radius: 21px; font-size: 20px; line-height: 20px; } } div.mainContainer div.mainContent { display: block; position: relative; width: 100%; padding-top: 0px; background-position: center center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } div.mainContainer div.mainContent div.nav { z-index: 1000; display: block; position: fixed; width: 100%; left: 0px; top: 0px; height: 100vh; pointer-events: none; cursor: default; text-transform: uppercase; text-align: center; pointer-events: none; cursor: default; } div.mainContainer div.mainContent div.nav a { pointer-events: auto; cursor: pointer; } div.mainContainer div.mainContent div.nav div.my-content { display: flex; justify-content: center; align-items: center; justify-content: space-between; width: 100%; height: 80px; padding: 0px 30px; background: linear-gradient(180deg, #0A0B09 80%, #000000 100%); } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content { display: flex; justify-content: center; align-items: center; width: 100%; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections { gap: 40px; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-home { flex-shrink: 0; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-home img { height: 60px; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.menu { display: flex; justify-content: center; align-items: center; justify-content: flex-start; gap: 40px; width: auto; flex-grow: 1; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.menu a.btn-section { display: flex; justify-content: center; align-items: center; width: auto; height: auto; padding: 5px 0px; white-space: nowrap; text-transform: uppercase; font-family: 'kaneda-gothic'; font-style: normal; font-weight: 500; color: #FFFFFF; font-size: 23px; line-height: 23px; letter-spacing: 0.4px; } @media (max-width: 1280px) { div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.menu a.btn-section { white-space: normal; } } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.menu a.btn-section span.line { display: block; position: absolute; left: 50%; bottom: 0px; width: 0px; height: 2px; background: #FFB612; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.menu a.btn-section:hover span.line, div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.menu a.btn-section.on span.line { left: 0%; width: 100%; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.menu a.btn-section.on { pointer-events: none; cursor: default; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.menu a.btn-section.hidden, div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.menu a.btn-section.hide { display: none; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.buttons { display: flex; justify-content: center; align-items: center; width: auto; flex-shrink: 0; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-menu { display: none; } @media (max-width: 1440px) { div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections { gap: 20px; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-home img { height: 32px; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.menu { gap: 20px; } } div.mainContainer div.mainContent div.nav div.my-content.my-rep { position: absolute; right: 0px; bottom: 0px; width: auto; border-left: 2px solid #FFB612; } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content { display: block; width: auto; height: auto; } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box { display: flex; justify-content: center; align-items: center; gap: 20px; } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.rep { display: block; width: auto; } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.rep p { width: auto; font-family: 'kaneda-gothic'; font-style: italic; font-weight: 500; color: #FFFFFF; font-size: 46px; line-height: 46px; white-space: nowrap; } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.photo { display: flex; justify-content: center; align-items: center; flex-shrink: 0; width: 54px; height: 54px; background-position: center center; background-repeat: no-repeat; background-size: cover; border-radius: 50%; border: 2px solid #FFB612; } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.your-rep { display: flex; flex-direction: column; align-items: flex-start; gap: 0px; width: auto; height: auto; } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.your-rep p, div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.your-rep span { font-family: 'kaneda-gothic'; font-style: normal; font-weight: 500; color: #FFFFFF; text-transform: uppercase; font-size: 22px; line-height: 22px; } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.your-rep p { font-family: 'kaneda-gothic'; font-style: normal; font-weight: 700; font-size: 28px; line-height: 28px; } @media (max-width: 1280px) { div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.your-rep p { font-size: 22px; line-height: 22px; } } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.contact { display: flex; flex-direction: column; gap: 5px; width: auto; height: auto; } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.contact a { display: flex; align-items: center; gap: 5px; width: auto; height: auto; } @media (max-width: 1280px) { div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.contact a p { font-size: 11px; } } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.contact a span { width: auto; font-family: 'kaneda-gothic'; font-style: normal; font-weight: 500; color: #FFB612; text-transform: uppercase; text-align: left; font-size: 22px; line-height: 22px; letter-spacing: 0px; } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.contact a span.icon { display: flex; justify-content: center; align-items: center; width: 12px; height: auto; } div.mainContainer div.mainContent div.nav div.my-content.my-rep div.content div.box div.contact a span.icon img { width: 100%; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.nav { height: 60px; background: #000000; } div.mainContainer div.mainContent div.nav div.my-content.my-nav { height: 60px; padding: 0px; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections { width: 100%; height: 60px; padding: 0px 20px; justify-content: space-between; align-items: center; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-home { z-index: 10; display: flex; justify-content: center; align-items: center; height: 50px; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-home img { height: 50px; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections div.menu { display: none; background: #000000; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-menu { z-index: 200; display: block; width: 50px; height: 50px; padding: 12px 0px 12px 20px; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-menu div.hamburger { display: inline-block; position: relative; width: 100%; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-menu div.hamburger span.line { display: block; position: absolute; width: 30px; height: 2px; left: 0px; background: #FFB612; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-menu div.hamburger span.line.line0 { top: 5px; transition: .3s; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-menu div.hamburger span.line.line1 { top: 13px; transition: .3s; } div.mainContainer div.mainContent div.nav div.my-content.my-nav div.content.sections a.btn-menu div.hamburger span.line.line2 { top: 21px; transition: .3s; } div.mainContainer div.mainContent div.nav div.my-content.my-rep { display: none; } div.mainContainer div.mainContent div.nav.open { height: 100vh; } div.mainContainer div.mainContent div.nav.open div.my-content.my-nav div.content.sections div.menu { display: flex; position: absolute; flex-direction: column; justify-content: center; align-items: center; justify-content: flex-start; gap: 0px; left: 0px; top: 0px; width: 100vw; height: 100vh; padding: 100px 20px 100px 20px; } div.mainContainer div.mainContent div.nav.open div.my-content.my-nav div.content.sections div.menu a { width: 100%; height: auto; padding: 15px 0px; } div.mainContainer div.mainContent div.nav.open div.my-content.my-nav div.content.sections a.btn-menu div.hamburger span.line.line0 { top: 13px; transform: rotate(45deg); } div.mainContainer div.mainContent div.nav.open div.my-content.my-nav div.content.sections a.btn-menu div.hamburger span.line.line1 { opacity: 0; } div.mainContainer div.mainContent div.nav.open div.my-content.my-nav div.content.sections a.btn-menu div.hamburger span.line.line2 { top: 13px; transform: rotate(-45deg); } div.mainContainer div.mainContent div.nav.open div.my-content.my-rep { display: flex; justify-content: center; align-items: center; position: absolute; width: 100%; height: auto; bottom: 0px; left: 0px; padding: 15px; border-left: 0px; border-top: 2px solid #FFB612; } div.mainContainer div.mainContent div.nav.open div.my-content.my-rep div.content { width: 100%; } div.mainContainer div.mainContent div.nav.open div.my-content.my-rep div.content div.box { width: 100%; } div.mainContainer div.mainContent div.nav.open div.my-content.my-rep div.content div.box div.rep p { font-size: 32px; line-height: 32px; } } div.mainContainer div.mainContent div.main { display: block; width: 100%; height: auto; text-align: center; /*@include backCover; overflow:hidden;*/ } div.mainContainer div.mainContent div.main.section { background-position: center center; background-repeat: no-repeat; background-size: cover; height: auto; padding: 0px; } div.mainContainer div.mainContent div.main.section div.my-content { display: inline-flex; justify-content: center; align-items: center; width: 100%; padding: 0px; height: auto; /*@include backCover; overflow:hidden;*/ } div.mainContainer div.mainContent div.main.section div.my-content div.content { z-index: 101; display: flex; justify-content: center; align-items: center; flex-direction: column; width: 100%; max-width: 1528px; height: auto; } @media (min-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content { min-width: 1000px; } } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block { display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 20px; width: 100%; height: auto; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title { display: flex; flex-direction: column; justify-content: center; align-items: center; width: auto; height: auto; margin-bottom: 20px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title.left { width: 100%; justify-content: flex-start; align-items: flex-start; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title p { display: block; width: 100%; text-align: left; text-transform: uppercase; color: #000000; font-family: 'kaneda-gothic'; font-style: normal; font-weight: 800; font-size: 140px; line-height: 120px; letter-spacing: 2px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title p.sub { font-family: 'kaneda-gothic'; font-style: normal; font-weight: 500; font-size: 60px; line-height: 60px; letter-spacing: 0px; } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title p { font-size: 100px; line-height: 90px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title p.sub { font-size: 48px; line-height: 48px; } } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title p { font-size: 60px; line-height: 54px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title p.sub { font-size: 28px; line-height: 28px; } } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title div.underline { margin-top: 10px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title.center { align-items: center; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title.center p { text-align: center; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title.yellow p { color: #FFB612; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title { align-items: center; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.title p { text-align: center; } } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy { display: block; width: 100%; height: auto; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy p { display: block; width: 100%; height: auto; text-align: left; font-family: 'prometo'; font-style: normal; font-weight: 400; color: #FFFFFF; font-size: 19px; line-height: 26px; margin-top: 15px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy p:first-child { margin-top: 0px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy p a.link { color: #FFFFFF; text-decoration: underline; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy p { font-size: 16px; line-height: 20px; } } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy p strong { font-weight: 600; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy ul { display: block; text-align: left; list-style: outside disc; margin: 2px 0px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy ul li { margin-left: 18px; font-family: 'prometo'; font-style: normal; font-weight: 400; color: #FFFFFF; font-size: 19px; line-height: 24px; padding: 5px 0; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy ul li { font-size: 14px; line-height: 20px; } } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy.black p, div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy.black ul, div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy.black ul li { color: #000000; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy.center p { text-align: center; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy div.download { display: block; width: 100%; height: auto; margin-top: 20px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block div.copy div.download a { display: block; width: auto; color: #000000; font-weight: 700; text-decoration: underline; font-size: 19px; line-height: 24px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-player { flex-direction: row; align-items: flex-end; justify-content: flex-end; pointer-events: none; cursor: default; width: auto; flex-grow: 1; height: 100%; } @media (min-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-player { min-height: 600px; } } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-player div.player { width: 100%; height: 100%; flex-shrink: 0; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-player div.player div.holder { display: flex; justify-content: center; align-items: center; justify-content: flex-end; position: absolute; left: 0px; bottom: 0px; width: 100%; height: 100%; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-player div.player div.holder img { width: auto; height: auto; flex-shrink: 0; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-player.right div.player div.holder { justify-content: flex-start; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-player { order: 2; flex-grow: 0; height: auto; min-height: 100px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-player div.player { width: auto; height: auto; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-player div.player div.holder { position: relative; left: auto; bottom: auto; width: auto; height: auto; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-player div.player div.holder img { max-width: 100vw; max-height: 400px; } } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.photos { display: block; width: 100%; height: 100%; border-radius: 10px; overflow: hidden; background: #000000; @nclude boxShadow; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.photos div.photo { display: block; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover; opacity: 0; pointer-events: none; cursor: default; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.photos div.photo.show { opacity: 1; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control { display: flex; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control.n-1 { display: none; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.buttons { display: flex; justify-content: center; align-items: center; justify-content: space-between; gap: 10px; width: 100%; height: 100%; padding: 0px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.buttons a { display: flex; justify-content: center; align-items: center; width: 56px; height: 50px; padding: 20px; border-radius: 10px 0px 0px 10px; background: #0A0B09; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.buttons a img { max-width: 100%; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.buttons a.btn-prev { border-radius: 0px 10px 10px 0px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.buttons a.disabled { opacity: .5; pointer-events: none; cursor: default; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.buttons a { width: 40px; height: 40px; padding: 10px; border-radius: 5px 0px 0px 5px; } } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.dots { display: flex; justify-content: center; align-items: center; position: absolute; left: 0px; bottom: 0px; width: 100%; height: auto; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.dots div.group { display: flex; justify-content: center; align-items: center; gap: 10px; width: auto; height: 50px; padding: 5px 25px; border-radius: 10px 10px 0px 0px; background: #000000; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.dots div.group a { display: block; width: 14px; height: 14px; border-radius: 50%; background: #FFFFFF; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.dots div.group a.on { pointer-events: none; cursor: default; background: #FFB612; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.dots div.group { height: 32px; padding: 5px 10px; border-radius: 5px 5px 0px 0px; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.control div.dots div.group a { width: 10px; height: 10px; } } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery { width: 100vw; max-width: 480px; height: 480px; max-height: 75vw; } div.mainContainer div.mainContent div.main.section div.my-content div.content div.block.with-gallery.gallery div.photos { border-radius: 0px; } } div.mainContainer div.mainContent div.main.section div.my-content div.content.split { align-items: center; } @media (min-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content.split { flex-direction: row; justify-content: space-between; } } div.mainContainer div.mainContent div.main.section div.my-content div.content.split div.block.with-info { align-items: flex-start; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content div.content.split div.block.with-info { justify-content: center; align-items: center; } } div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow { align-items: unset; gap: 30px; padding: 10px; background: linear-gradient(180deg, #FFB612 0%, #F0CB3E 100%); } div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow.reverse-yellow { background: linear-gradient(0deg, #FFB612 0%, #F0CB3E 100%); } div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow div.star-pattern { display: block; width: 58px; height: auto; flex-grow: 0; flex-shrink: 0; background-image: url("../images/star-pattern.svg"); /*@include backContain;*/ background-repeat: repeat-y; background-position: top left; } div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow div.content { padding: 40px 0px; } @media (max-width: 1528px) { div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow { gap: 20px; } div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow div.star-pattern { width: 37px; background-size: auto; background-image: url("../images/star-pattern-small.svg"); } } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow { gap: 10px; } div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow div.star-pattern { width: 12px; } div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow div.content { max-width: calc(100vw - 60px); min-width: 800px; flex-shrink: 0; } } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow { padding: 0px; } div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow div.star-pattern { display: none; } div.mainContainer div.mainContent div.main.section div.my-content.bg-yellow div.content { max-width: calc(100vw - 40px); min-width: calc(100vw - 40px); padding: 0px; } } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame { max-width: 1728px; } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame { z-index: 10; display: block; position: absolute; left: 30px; top: 40px; width: calc(100% - 40px); height: calc(100% - 60px); border: 2px solid #414042; } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame div.inner { display: block; width: 100%; height: 100%; } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame div.inner img.branding, div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame div.inner div.block { display: block; position: absolute; } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame div.inner img.branding.top-right { right: -14px; top: -16px; } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame div.inner img.branding.bottom-left { left: -14px; bottom: -16px; } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame div.inner div.block img { display: block; position: absolute; } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame div.inner div.block img.corner { left: -8px; top: -8px; } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame div.inner div.block img.stars { left: 14px; top: 14px; } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame div.inner div.block.top-left { left: 0px; top: 0px; } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame div.inner div.block.bottom-right { right: 0px; bottom: 0px; transform: rotate(180deg); } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.content { z-index: 20; padding: 140px 60px; max-width: 1648px; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.frame { display: none; } div.mainContainer div.mainContent div.main.section div.my-content.bg-frame div.content { padding: 0px; } } div.mainContainer div.mainContent div.main.section.home { padding-top: 60px; } div.mainContainer div.mainContent div.main.section.home div.my-content { padding: 0px; max-width: 100%; background: linear-gradient(270deg, rgba(0, 0, 0, 0) 36.54%, rgba(0, 0, 0, 0.9) 67.94%); } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.home div.my-content { background: rgba(0, 0, 0, 0.75); } } div.mainContainer div.mainContent div.main.section.home div.my-content div.content { flex-direction: row; justify-content: flex-start; gap: 20px; max-width: 1528px; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.home div.my-content div.content { align-items: center; } } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block { gap: 50px; width: 628px; padding: 0px 20px; } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block { width: 580px; } } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.bar { display: flex; justify-content: center; align-items: center; width: 100%; height: auto; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.bar span { display: block; width: 108px; height: auto; min-height: 200px; /*@include backCover; background-repeat:repeat-y;*/ } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.bar:first-child span { min-height: 66px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; width: 100%; height: auto; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info img.logo-1933 { width: 274px; margin-bottom: 20px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.welcome { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 100%; height: auto; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.welcome p { display: block; width: 100%; text-align: center; text-transform: uppercase; color: #FFFFFF; font-family: 'kaneda-gothic'; font-style: normal; font-weight: 500; font-size: 58px; line-height: 64px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.welcome p.name { font-family: 'Steelers_2023 Stencil'; font-size: 76px; line-height: 84px; letter-spacing: 1px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.welcome p.name.long { font-size: 52px; line-height: 60px; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.welcome p { font-size: 40px; line-height: 40px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.welcome p.name { font-size: 48px; line-height: 54px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.welcome p.name.long { font-size: 32px; line-height: 38px; } } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.copy p { font-size: 24px; line-height: 32px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px; width: 100%; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list div { display: flex; justify-content: center; align-items: center; gap: 10px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list div img { width: 40px; flex-shrink: 0; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list div p { color: #FFFFFF; width: auto; text-align: left; font-family: 'prometo'; font-style: normal; font-weight: 400; font-size: 19px; line-height: 26px; white-space: nowrap; } @media (max-height: 1100px) { div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block { gap: 20px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.bar span { min-height: 50px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.bar:first-child span { min-height: 50px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info img.logo-1933 { width: 240px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info img.logo-1933 div.welcome p { font-size: 40px; line-height: 46px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info img.logo-1933 div.welcome p.name { font-size: 58px; line-height: 68px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info img.logo-1933 div.welcome p.name.long { font-size: 40px; line-height: 46px; } } @media (max-height: 840px) { div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info { gap: 10px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.copy p { font-size: 20px; line-height: 28px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list { gap: 5px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list div { gap: 5px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list div img { width: 28px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list div p { font-size: 16px; line-height: 20px; } } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block { width: 100%; gap: 10px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.bar span { height: 40px; min-height: 40px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.bar:nth-child(2) { display: none; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info { gap: 10px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.copy p { font-size: 20px; line-height: 28px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list { gap: 5px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list div { gap: 5px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list div img { width: 28px; } div.mainContainer div.mainContent div.main.section.home div.my-content div.content div.block div.info div.list div p { font-size: 16px; line-height: 20px; } } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split, div.mainContainer div.mainContent div.main.section.faq div.my-content div.content.split { align-items: unset; gap: 30px; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.left.with-photo, div.mainContainer div.mainContent div.main.section.faq div.my-content div.content.split div.block.left.with-photo { justify-content: center; align-items: unset; flex-grow: 1; width: auto; height: auto; background-position: center center; background-repeat: no-repeat; background-size: cover; box-shadow: 0px 6px 30px 0px #00000040; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.left.with-photo.round-corner, div.mainContainer div.mainContent div.main.section.faq div.my-content div.content.split div.block.left.with-photo.round-corner { border-radius: 4px; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right, div.mainContainer div.mainContent div.main.section.faq div.my-content div.content.split div.block.right { width: 754px; flex-shrink: 0; max-width: 50vw; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split, div.mainContainer div.mainContent div.main.section.faq div.my-content div.content.split { flex-direction: column; align-items: center; gap: 20px; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.left.with-photo, div.mainContainer div.mainContent div.main.section.faq div.my-content div.content.split div.block.left.with-photo { order: 2; width: 100vw; max-width: 480px; height: 480px; max-height: 75vw; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info, div.mainContainer div.mainContent div.main.section.faq div.my-content div.content.split div.block.right.with-info { order: 1; width: 100%; max-width: 100%; justify-content: center; align-items: center; } } div.mainContainer div.mainContent div.main.section.food-beverage { border-top: 1px solid #000000; border-bottom: 1px solid #000000; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.food-beverage { padding: 40px 0px; } } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.frame { height: calc(100% - 80px); } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.title { margin-bottom: 10px; } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.tabs { display: flex; justify-content: center; align-items: center; gap: 60px; width: 100%; height: auto; margin-bottom: 20px; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.tabs { gap: 30px; flex-wrap: wrap; } } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.tabs a { display: flex; justify-content: center; align-items: center; width: auto; height: auto; white-space: nowrap; padding: 3px 0px; border-bottom: 2px solid rgba(0, 0, 0, 0); color: #FFFFFF; font-family: 'kaneda-gothic'; font-style: normal; font-weight: 500; text-transform: uppercase; font-size: 23px; line-height: 24px; letter-spacing: 0.4px; } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.tabs a:hover, div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.tabs a.on { border-bottom: 2px solid #FFB612; } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.tabs a.on { pointer-events: none; cursor: default; } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list { dislay: block; width: 100%; height: auto; } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list div.menu { display: none; justify-content: center; align-items: flex-start; gap: 60px; width: 100%; height: auto; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list div.menu { flex-wrap: wrap; gap: 20px; padding: 0px 20px; max-height: 60vh; overflow-y: auto; } } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list div.menu.show { display: flex; } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list div.menu div.group { display: block; width: 100%; max-width: 496px; height: auto; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list div.menu div.group { max-width: 400px; } } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list div.menu div.group div.copy.category { display: block; width: 100%; height: auto; margin-top: 20px; } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list div.menu div.group div.copy.category:first-child { margin-top: 0px; } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list div.menu div.group div.copy.category p { text-align: center; font-size: 14px; line-height: 22px; margin: 0px; } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list div.menu div.group div.copy.category p.category { font-family: 'kaneda-gothic'; font-style: italic; font-weight: 500; text-transform: uppercase; font-size: 34px; line-height: 40px; } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list div.menu div.group div.copy.category p.item { font-family: 'kaneda-gothic'; font-style: normal; font-weight: 500; text-transform: uppercase; font-size: 28px; line-height: 34px; margin-top: 4px; } div.mainContainer div.mainContent div.main.section.food-beverage div.my-content div.content div.block div.list div.menu div.group div.copy.category p.yellow { color: #FFB612; } div.mainContainer div.mainContent div.main.section.location { border-top: 1px solid #000000; border-bottom: 1px solid #000000; } div.mainContainer div.mainContent div.main.section.location div.my-content { max-width: 100%; } div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.left.with-player div.player div.holder { align-items: flex-end; } div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.left.with-player div.player div.holder img { max-width: 783px; transform: translateY(50px); } @media (max-width: 1440px) { div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.left.with-player div.player div.holder img { max-width: 720px; transform: translateY(20px, 50px); } } @media (max-width: 1200px) { div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.left.with-player div.player div.holder img { max-width: 680px; } } @media (max-width: 1080px) { div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.left.with-player div.player div.holder img { max-width: 600px; transform: translateY(80px, 50px); } } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.left.with-player div.player div.holder img { transform: none; } } div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.right.with-info { justify-content: center; align-items: center; gap: 0px; max-width: 746px; padding: 20px 20px 0px 20px; } @media (max-width: 1440px) { div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.right.with-info { max-width: 680px; } } @media (max-width: 1200px) { div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.right.with-info { max-width: 640px; padding: 20px 0px 0px 0px; } } @media (max-width: 1080px) { div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.right.with-info { max-width: 600px; } } div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.right.with-info div.map { width: 100%; } div.mainContainer div.mainContent div.main.section.location div.my-content div.content.split div.block.right.with-info div.map img { width: 100%; } div.mainContainer div.mainContent div.main.section.questions { z-index: 100; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.questions { padding-top: 40px; } } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info { justify-content: flex-start; gap: 20px; max-width: 828px; padding: 0px 100px; } @media (max-width: 1528px) { div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info { max-width: 740px; padding: 0px 40px; } } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info { max-width: 640px; } } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info { display: flex; justify-content: center; align-items: center; gap: 20px; } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info div.photo { display: block; width: 156px; height: 156px; flex-shrink: 0; border-radius: 50%; border: 2px solid #FFB612; background-position: center center; background-repeat: no-repeat; background-size: contain; } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info div.copy { width: auto; flex-grow: 1; } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info div.copy a { color: #FFB612; width: auto; } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info div.copy a:hover { text-decoration: underline; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info div.photo { width: 100px; height: 100px; } } @media (max-width: 720px) { div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info { flex-direction: column; justify-content: center; align-items: center; } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info div.copy { width: 100%; } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info div.copy p, div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info div.copy a { width: 100%; text-align: center; } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info div.copy p:hover, div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.left.with-info div.info div.copy a:hover { text-decoration: none; } } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.right.with-player { min-height: 480px; justify-content: flex-start; align-items: flex-start; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.right.with-player { min-height: 200px; } } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.right.with-player div.player div.holder { justify-content: flex-start; align-items: flex-start; } div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.right.with-player div.player div.holder img { max-width: 794px; transform: translate(100px, -130px); } @media (max-width: 1528px) { div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.right.with-player div.player div.holder img { max-width: 720px; transform: translate(20px, -130px); } } @media (max-width: 1440px) { div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.right.with-player div.player div.holder img { transform: translate(0px, -130px); } } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.right.with-player div.player div.holder img { transform: translate(-40px, -130px); } } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.questions div.my-content div.content.split div.block.right.with-player div.player div.holder img { transform: none; } } div.mainContainer div.mainContent div.main.section.summary { z-index: 50; } div.mainContainer div.mainContent div.main.section.summary div.my-content div.content.split { align-items: unset; gap: 60px; padding: 80px 280px 80px 20px; } @media (max-width: 1528px) { div.mainContainer div.mainContent div.main.section.summary div.my-content div.content.split { gap: 40px; padding-right: 150px; } } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.summary div.my-content div.content.split { gap: 30px; padding-right: 100px; } } div.mainContainer div.mainContent div.main.section.summary div.my-content div.content.split div.block.left div.title { margin-bottom: 0px; } div.mainContainer div.mainContent div.main.section.summary div.my-content div.content.split div.block.right { max-height: 600px; border-radius: 4px; background-position: center center; background-repeat: no-repeat; background-size: cover; } div.mainContainer div.mainContent div.main.section.summary div.my-content div.content.split div.block.right div.photo { width: auto; height: auto; } div.mainContainer div.mainContent div.main.section.summary div.my-content div.content.split div.block.right div.photo img { max-width: 800px; max-height: 600px; box-shadow: 0px 6px 30px 0px #00000040; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.summary div.my-content div.content.split { flex-direction: column; justify-content: center; align-items: center; gap: 20px; padding: 40px 0px 0px 0px; } div.mainContainer div.mainContent div.main.section.summary div.my-content div.content.split div.block.left div.title p, div.mainContainer div.mainContent div.main.section.summary div.my-content div.content.split div.block.left div.copy p { text-align: center !important; } div.mainContainer div.mainContent div.main.section.summary div.my-content div.content.split div.block.right div.photo img { width: 100vw; max-width: 720px; height: auto; max-height: 80vh; object-fit: contain; box-shadow: none; } } @media (min-width: 1000px) { div.mainContainer div.mainContent div.main.section.summary.no-player-overlay div.my-content div.content.split { padding: 80px 20px; } } div.mainContainer div.mainContent div.main.section.benefits div.my-content, div.mainContainer div.mainContent div.main.section.club div.my-content { padding: 40px 0px; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content, div.mainContainer div.mainContent div.main.section.club div.my-content { padding-bottom: 0px; } } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split { gap: 20px; } } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info { gap: 0px; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.header, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.header { display: flex; justify-content: space-between; align-items: unset; gap: 20px; width: 100%; height: auto; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.header, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.header { flex-direction: column; justify-content: center; align-items: center; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.header div.logo img, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.header div.logo img { height: 120px; } } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.price, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.price { display: flex; width: 100%; height: auto; margin-bottom: 10px; padding: 20px; border: 2px solid #FFB612; background: #000000; box-shadow: 0px 6px 30px 0px #00000040; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.price div.copy p, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.price div.copy p { color: #FFFFFF; text-transform: uppercase; margin-top: 0px; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.price div.copy p.item, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.price div.copy p.item { font-family: 'kaneda-gothic'; font-style: italic; font-weight: 500; color: #FFB612; font-size: 28px; line-height: 32px; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.price div.copy p.price, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.price div.copy p.price { font-family: 'kaneda-gothic'; font-style: normal; font-weight: 800; font-size: 48px; line-height: 52px; } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.price div.copy p.item, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.price div.copy p.item { font-size: 18px; line-height: 20px; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.price div.copy p.price, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.price div.copy p.price { font-size: 40px; line-height: 40px; } } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list { display: flex; gap: 20px; justify-content: flex-start; align-items: unset; flex-wrap: wrap; margin-top: 20px; } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list { gap: 10px; } } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list { justify-content: center; align-items: center; margin-top: 20px; } } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list p.title, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list p.title { display: block; width: 100%; text-align: left; text-transform: uppercase; font-family: 'kaneda-gothic'; font-style: normal; font-weight: 500; color: #000000; font-size: 38px; line-height: 38px; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit { display: flex; justify-content: flex-start; align-items: unset; gap: 20px; width: calc(50% - 10px); height: auto; min-height: 200px; padding: 15px; border: 2px solid #FFB612; background: #000000; box-shadow: 0px 6px 30px 0px #00000040; } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit { width: calc(50% - 5px); } } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit.full, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit.full { width: 100%; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit div.icon, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit div.icon { display: flex; justify-content: center; align-items: center; flex-shrink: 0; width: 56px; height: auto; /*min-height:112px;*/ border-radius: 2px; background: #FFFFFF; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit div.icon img, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit div.icon img { max-width: calc(100% - 20px); } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit div.icon, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit div.icon { width: 48px; } } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit div.copy, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit div.copy { display: flex; flex-direction: column; justify-content: center; align-items: center; width: auto; flex-grow: 1; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit div.copy p, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit div.copy p { margin-top: 5px; color: #FFFFFF; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit div.copy p.item, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit div.copy p.item { margin-top: 0px; font-family: 'kaneda-gothic'; font-style: italic; font-weight: 500; text-transform: uppercase; color: #FFB612; font-size: 34px; line-height: 37px; } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit div.copy p.item, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit div.copy p.item { font-size: 24px; line-height: 26px; } } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit { width: 100%; min-height: 80px; } } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list { margin-top: 0px; align-items: center; gap: 10px; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list p.title, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list p.title { text-align: center; } div.mainContainer div.mainContent div.main.section.benefits div.my-content div.content.split div.block.right.with-info div.list div.benefit, div.mainContainer div.mainContent div.main.section.club div.my-content div.content.split div.block.right.with-info div.list div.benefit { width: 100%; max-width: 400px; gap: 10px; padding: 15px 10px; } } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.experience, div.mainContainer div.mainContent div.main.section.club { padding: 40px 0px 0px 0px; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split { align-items: unset; gap: 40px; } @media (max-width: 1280px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split { gap: 20px; } } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split { justify-content: center; align-items: center; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info { width: 496px; max-width: calc(50vw - 80px); } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info { max-width: 100%; justify-content: center; align-items: center; } div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info div.copy p, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info div.copy p { text-align: center; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info div.list, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info div.list { display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 20px; width: 100%; height: auto; margin-top: 20px; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info div.list, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info div.list { padding: 0px 20px; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info div.list p.title, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info div.list p.title { width: 100%; color: #FFFFFF; text-align: left; text-transform: uppercase; font-family: 'kaneda-gothic'; font-style: normal; font-weight: 500; font-size: 38px; line-height: 38px; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info div.list p.title, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info div.list p.title { text-align: center; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info div.list div.perks, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info div.list div.perks { display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 10px; width: 100%; height: auto; } div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info div.list div.perks div.perk, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info div.list div.perks div.perk { display: flex; justify-content: flex-start; align-items: center; gap: 20px; width: 100%; height: auto; min-height: 60px; padding: 15px; border: 1px solid #343534; } div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info div.list div.perks div.perk div.icon, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info div.list div.perks div.perk div.icon { display: flex; justify-content: center; align-items: center; flex-shrink: 0; width: 40px; height: 40px; } div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info div.list div.perks div.perk div.copy, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info div.list div.perks div.perk div.copy { width: auto; flex-grow: 1; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.left.with-info div.list div.perks div.perk div.copy p, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.left.with-info div.list div.perks div.perk div.copy p { text-align: left; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.right.with-gallery, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.right.with-gallery { justify-content: center; align-items: unset; flex-grow: 1; width: auto; height: auto; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.experience div.content.split div.block.right.with-gallery, div.mainContainer div.mainContent div.main.section.club div.my-content.experience div.content.split div.block.right.with-gallery { width: 100vw; max-width: 480px; height: 480px; max-height: 75vw; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow { padding: 40px 20px 100px 20px; } @media (max-width: 540px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow { padding: 20px 20px 60px 20px; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content { max-width: 100%; min-width: 100%; } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.photos { display: flex; justify-content: flex-start; align-items: center; gap: 20px; width: 100%; height: 500px; } @media (max-width: 540px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.photos { height: calc(100vw - 40px); } } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.photos div.photo, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.photos div.photo { display: block; width: 500px; height: 100%; flex-shrink: 0; border-radius: 10px; background-position: center center; background-repeat: no-repeat; background-size: cover; } @media (max-width: 540px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.photos div.photo, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.photos div.photo { width: calc(100vw - 40px); } } @media (min-width: 4620px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.photos { justify-content: center; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.buttons, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.buttons { display: flex; justify-content: center; align-items: center; justify-content: space-between; gap: 10px; width: 100%; height: 100%; flex-shrink: 0; } @media (min-width: 1000px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.buttons, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.buttons { padding: 20px; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.buttons a, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.buttons a { display: flex; justify-content: center; align-items: center; width: 56px; height: 50px; } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.dots, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.dots { display: flex; justify-content: center; align-items: center; gap: 10px; width: auto; height: 50px; margin-top: 20px; } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.dots a, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.dots a { display: none; width: 14px; height: 14px; border-radius: 50%; border: 1px solid #FFFFFF; background: rgba(255, 255, 255, 0.3); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s0, div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s1, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s0, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s1 { display: block; } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.on, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.on { pointer-events: none; cursor: default; background: #FFB612; border-color: #FFB612; } @media (min-width: 4620px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control { display: none; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-0 div.control div.buttons a.btn-prev, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-0 div.control div.buttons a.btn-prev { opacity: .5; pointer-events: none; cursor: default; } @media (max-width: 1040px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.dots a, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.dots a { display: block; } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos { transform: translateX(calc(-520px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-2 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-2 div.photos { transform: translateX(calc(-1040px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-3 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-3 div.photos { transform: translateX(calc(-1560px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-4 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-4 div.photos { transform: translateX(calc(-2080px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-5 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-5 div.photos { transform: translateX(calc(-2600px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-6 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-6 div.photos { transform: translateX(calc(-3120px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-7 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-7 div.photos { transform: translateX(calc(-3640px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-8 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-8 div.photos { transform: translateX(calc(-4160px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-8 div.control div.buttons a.btn-next, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-8 div.control div.buttons a.btn-next { opacity: .5; pointer-events: none; cursor: default; } } @media (max-width: 540px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos { transform: translateX(calc(-100vw + 20px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-2 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-2 div.photos { transform: translateX(calc(-200vw + 40px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-3 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-3 div.photos { transform: translateX(calc(-300vw + 60px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-4 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-4 div.photos { transform: translateX(calc(-400vw + 80px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-5 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-5 div.photos { transform: translateX(calc(-500vw + 100px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-6 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-6 div.photos { transform: translateX(calc(-600vw + 120px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-7 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-7 div.photos { transform: translateX(calc(-700vw + 140px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-8 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-8 div.photos { transform: translateX(calc(-800vw + 160px)); } } @media screen and (min-width: 1040px) and (max-width: 1560px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s2, div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s3, div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s4, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s2, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s3, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s4 { display: block; } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos { transform: translateX(calc(-1040px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-2 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-2 div.photos { transform: translateX(calc(-2080px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-3 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-3 div.photos { transform: translateX(calc(-3120px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-4 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-4 div.photos { transform: translateX(calc(-4160px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-4 div.control div.buttons a.btn-next, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-4 div.control div.buttons a.btn-next { opacity: .5; pointer-events: none; cursor: default; } } @media screen and (min-width: 1560px) and (max-width: 2080px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s2, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s2 { display: block; } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos { transform: translateX(calc(-1560px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-2 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-2 div.photos { transform: translateX(calc(-3120px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-2 div.control div.buttons a.btn-next, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-2 div.control div.buttons a.btn-next { opacity: .5; pointer-events: none; cursor: default; } } @media screen and (min-width: 2080px) and (max-width: 2600px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s2, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow div.control div.dots a.s2 { display: block; } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos { transform: translateX(calc(-2080px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-2 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-2 div.photos { transform: translateX(calc(-4160px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-2 div.control div.buttons a.btn-next, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-2 div.control div.buttons a.btn-next { opacity: .5; pointer-events: none; cursor: default; } } @media screen and (min-width: 2600px) and (max-width: 4620px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-1 div.photos { transform: translateX(calc(-2600px)); } div.mainContainer div.mainContent div.main.section.experience div.my-content.slideshow div.content div.block.slideshow.p-1 div.control div.buttons a.btn-next, div.mainContainer div.mainContent div.main.section.club div.my-content.slideshow div.content div.block.slideshow.p-1 div.control div.buttons a.btn-next { opacity: .5; pointer-events: none; cursor: default; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split { align-items: unset; gap: 30px; padding-top: 80px; padding-bottom: 100px; } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.left.with-gallery, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.left.with-gallery { justify-content: center; flex-grow: 1; width: auto; height: 100%; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.left.with-gallery, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.left.with-gallery { order: 2; width: 100vw; max-width: 640px; height: 480px; max-height: 75vw; } } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.right.with-info, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.right.with-info { width: 496px; max-width: calc(50vw - 80px); } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.right.with-info div.list, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.right.with-info div.list { gap: 10px; } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.right.with-info div.list div.benefit, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.right.with-info div.list div.benefit { width: 100%; min-height: 108px; } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.right.with-info div.button, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.right.with-info div.button { margin-top: 20px; } @media (max-width: 1000px) { div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split { justify-content: center; align-items: center; gap: 20px; padding: 0px; } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.left.with-gallery, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.left.with-gallery { justify-content: center; align-items: center; width: 100vw; max-width: 640px; height: 60vw; max-height: 480px; } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.right.with-info, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.right.with-info { width: 100%; max-width: 496px; } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.right.with-info div.copy p, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.right.with-info div.copy p { text-align: center; } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.right.with-info div.list, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.right.with-info div.list { margin-top: 20px; } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.right.with-info div.list div.benefit, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.right.with-info div.list div.benefit { min-height: 80px; } div.mainContainer div.mainContent div.main.section.experience div.my-content.club div.content.split div.block.right.with-info div.list div.benefit div.copy p, div.mainContainer div.mainContent div.main.section.club div.my-content.club div.content.split div.block.right.with-info div.list div.benefit div.copy p { text-align: left; } } div.mainContainer div.mainContent div.main.footer { display: flex; justify-content: center; align-items: center; height: 92px; background: #0A0B09; } div.mainContainer div.mainContent div.main.footer div.my-content { display: block; width: 100%; height: auto; } div.mainContainer div.mainContent div.main.footer div.my-content div.content { display: flex; justify-content: center; align-items: center; width: 100%; } div.mainContainer div.mainContent div.main.footer div.my-content div.content div.logo { display: block; width: auto; height: auto; } div.mainContainer div.mainContent div.main.footer div.my-content div.content div.logo a { display: flex; justify-content: center; align-items: center; gap: 10px; width: auto; height: auto; } div.mainContainer div.mainContent div.main.footer div.my-content div.content div.logo a img { height: 65px; } /*# sourceMappingURL=steelers.css.map */