/* Theme Name: Alchemia Kina Theme URI: https://alchemiakina.pl Author: CardeaCreations Author URI: https://cardeacreations.pl Version: 1.1 */ @charset "UTF-8"; :root { --off4: 4.333333%; --off8: 8.333333%; --off16: 16.666667%; --off25: 25%; --off33: 33.333333%; --off41: 41.666667%; --off50: 50%; --off58: 58.333333%; --off66: 66.666667%; --off75: 75%; --off83: 83.333333%; --off91: 91.666667%; --lh900: 0.85em; --lh800: 0.9em; --lh700: 0.9em; --lh600: 1em; --lh500: 1em; --lh400: 1em; --lh300: 1em; --lh200: 1.2em; --lh100: 1.2em; --lh: 1.44em; --lh75: 1.6em; --lh50: 1.65em; --ls900: 0.0005em; --ls800: 0.0005em; --ls700: 0.0005em; --ls600: 0.0005em; --ls500: 0.0008em; --ls400: 0.0008em; --ls300: 0.015em; --ls200: 0.015em; --ls100: 0.02em; --ls: 0.025em; --ls75: 0.03em; --ls50: 0.03em; --c0: rgba(0, 18, 11, 1); --c1: rgba(241, 250, 238, 1); --c100: rgba(230, 57, 70, 1); --c150: rgba(255, 63, 78, 1); --c200: rgba(69, 123, 157, 1); --c250: rgba(168, 218, 220, 1); --c300: rgba(29, 53, 87, 1); --ffl: "light", Helvetica, Arial, sans-serif; --ffb: "bold", Helvetica, Arial, sans-serif; --ffh: "head", Helvetica, Arial, sans-serif; --ffhl: "headlight", Helvetica, Arial, sans-serif; } @media (min-width: 2560.001px) { :root { --fs900: 337.53px; --fs800: 253.21px; --fs700: 164.53px; --fs600: 123.43px; --fs500: 92.59px; --fs400: 69.46px; --fs300: 52.11px; --fs200: 39.09px; --fs100: 29.33px; --fs: 22px; --fs75: 16.5px; --fs50: 12.38px; --u158: 177.75px; --u142: 143.13px; --u126: 127.13px; --u110: 111.13px; --u94: 105.75px; --u78: 87.75px; --u62: 69.75px; --u54: 60.75px; --u48: 54px; --u40: 45px; --u32: 36px; --u24: 27px; --u20: 22.5px; --u16: 18px; --u12: 13.5px; --u8: 9px; --u4: 4.5px; } } @media (min-width: 1920.001px) and (max-width: 2560px) { :root { --fs900: clamp(17.26rem, 11.5075rem + 4.7938vw, 19.1775rem); --fs800: clamp(12.948125rem, 8.6319rem + 3.5969vw, 14.386875rem); --fs700: clamp(8.413125rem, 5.61rem + 2.3359vw, 9.3475rem); --fs600: clamp(6.31125rem, 4.2075rem + 1.7531vw, 7.0125rem); --fs500: clamp(4.735rem, 3.1581rem + 1.3141vw, 5.260625rem); --fs400: clamp(3.55375rem, 2.3744rem + 0.9828vw, 3.946875rem); --fs300: clamp(2.664375rem, 1.7737rem + 0.7422vw, 2.96125rem); --fs200: clamp(1.99875rem, 1.3312rem + 0.5563vw, 2.22125rem); --fs100: clamp(1.499375rem, 0.9987rem + 0.4172vw, 1.66625rem); --fs: clamp(1.125rem, 0.75rem + 0.3125vw, 1.25rem); --fs75: clamp(0.84375rem, 0.5625rem + 0.2344vw, 0.9375rem); --fs50: clamp(0.633125rem, 0.4212rem + 0.1766vw, 0.70375rem); --u158: clamp(8.23rem, 3.295rem + 4.1125vw, 9.875rem); --u142: clamp(7.39625rem, 2.96rem + 3.6969vw, 8.875rem); --u126: clamp(6.563125rem, 2.6275rem + 3.2797vw, 7.875rem); --u110: clamp(5.729375rem, 2.2925rem + 2.8641vw, 6.875rem); --u94: clamp(4.89625rem, 1.96rem + 2.4469vw, 5.875rem); --u78: clamp(4.063125rem, 1.6275rem + 2.0297vw, 4.875rem); --u62: clamp(3.229375rem, 1.2925rem + 1.6141vw, 3.875rem); --u54: clamp(2.8125rem, 1.125rem + 1.4063vw, 3.375rem); --u48: clamp(2.5rem, 1rem + 1.25vw, 3rem); --u40: clamp(2.08375rem, 0.835rem + 1.0406vw, 2.5rem); --u32: clamp(1.666875rem, 0.6675rem + 0.8328vw, 2rem); --u24: clamp(1.25rem, 0.5rem + 0.625vw, 1.5rem); --u20: clamp(1.041875rem, 0.4175rem + 0.5203vw, 1.25rem); --u16: clamp(0.833125rem, 0.3325rem + 0.4172vw, 1rem); --u12: clamp(0.625rem, 0.25rem + 0.3125vw, 0.75rem); --u8: clamp(0.416875rem, 0.1675rem + 0.2078vw, 0.5rem); --u4: clamp(0.208125rem, 0.0825rem + 0.1047vw, 0.25rem); } } @media (min-width: 1440.001px) and (max-width: 1920px) { :root { --fs900: clamp(15.341875rem, 9.5875rem + 6.3938vw, 17.26rem); --fs800: clamp(11.509375rem, 7.1931rem + 4.7958vw, 12.948125rem); --fs700: clamp(7.47875rem, 4.6756rem + 3.1146vw, 8.413125rem); --fs600: clamp(5.61rem, 3.5062rem + 2.3375vw, 6.31125rem); --fs500: clamp(4.20875rem, 2.63rem + 1.7542vw, 4.735rem); --fs400: clamp(3.1575rem, 1.9744rem + 1.3146vw, 3.551875rem); --fs300: clamp(2.36875rem, 1.4819rem + 0.9854vw, 2.664375rem); --fs200: clamp(1.776875rem, 1.1112rem + 0.7396vw, 1.99875rem); --fs100: clamp(1.333125rem, 0.8344rem + 0.5542vw, 1.499375rem); --fs: clamp(1rem, 0.625rem + 0.4167vw, 1.125rem); --fs75: clamp(0.75rem, 0.4687rem + 0.3125vw, 0.84375rem); --fs50: clamp(0.5625rem, 0.3506rem + 0.2354vw, 0.633125rem); --u158: clamp(6.58375rem, 1.645rem + 5.4875vw, 8.23rem); --u142: clamp(5.916875rem, 1.4787rem + 4.9313vw, 7.39625rem); --u126: clamp(5.25rem, 1.3106rem + 4.3771vw, 6.563125rem); --u110: clamp(4.58375rem, 1.1469rem + 3.8188vw, 5.729375rem); --u94: clamp(3.916875rem, 0.9787rem + 3.2646vw, 4.89625rem); --u78: clamp(3.25rem, 0.8106rem + 2.7104vw, 4.063125rem); --u62: clamp(2.58375rem, 0.6469rem + 2.1521vw, 3.229375rem); --u54: clamp(2.25rem, 0.5625rem + 1.875vw, 2.8125rem); --u48: clamp(2rem, 0.5rem + 1.6667vw, 2.5rem); --u40: clamp(1.666875rem, 0.4162rem + 1.3896vw, 2.08375rem); --u32: clamp(1.333125rem, 0.3319rem + 1.1125vw, 1.666875rem); --u24: clamp(1rem, 0.25rem + 0.8333vw, 1.25rem); --u20: clamp(0.833125rem, 0.2069rem + 0.6958vw, 1.041875rem); --u16: clamp(0.666875rem, 0.1681rem + 0.5542vw, 0.833125rem); --u12: clamp(0.5rem, 0.125rem + 0.4167vw, 0.625rem); --u8: clamp(0.333125rem, 0.0819rem + 0.2792vw, 0.416875rem); --u4: clamp(0.166875rem, 0.0431rem + 0.1375vw, 0.208125rem); } } @media (min-width: 1024.001px) and (max-width: 1440px) { :root { --fs900: clamp(14.383125rem, 12.0231rem + 3.6875vw, 15.341875rem); --fs800: clamp(10.79rem, 9.0192rem + 2.7668vw, 11.509375rem); --fs700: clamp(7.01125rem, 5.8605rem + 1.7981vw, 7.47875rem); --fs600: clamp(5.259375rem, 4.3963rem + 1.3486vw, 5.61rem); --fs500: clamp(3.945625rem, 3.2979rem + 1.012vw, 4.20875rem); --fs400: clamp(2.96rem, 2.4738rem + 0.7596vw, 3.1575rem); --fs300: clamp(2.220625rem, 1.856rem + 0.5697vw, 2.36875rem); --fs200: clamp(1.665625rem, 1.3918rem + 0.4279vw, 1.776875rem); --fs100: clamp(1.25rem, 1.0454rem + 0.3197vw, 1.333125rem); --fs: clamp(0.9375rem, 0.7837rem + 0.2404vw, 1rem); --fs75: clamp(0.703125rem, 0.5877rem + 0.1803vw, 0.75rem); --fs50: clamp(0.5275rem, 0.4413rem + 0.1346vw, 0.5625rem); --u158: clamp(4.9375rem, 0.8852rem + 6.3317vw, 6.58375rem); --u142: clamp(4.4375rem, 0.7959rem + 5.6899vw, 5.916875rem); --u126: clamp(3.9375rem, 0.7067rem + 5.0481vw, 5.25rem); --u110: clamp(3.4375rem, 0.616rem + 4.4087vw, 4.58375rem); --u94: clamp(2.9375rem, 0.5267rem + 3.7668vw, 3.916875rem); --u78: clamp(2.4375rem, 0.4375rem + 3.125vw, 3.25rem); --u62: clamp(1.9375rem, 0.3467rem + 2.4856vw, 2.58375rem); --u54: clamp(1.6875rem, 0.3029rem + 2.1635vw, 2.25rem); --u48: clamp(1.5rem, 0.2692rem + 1.9231vw, 2rem); --u40: clamp(1.25rem, 0.2238rem + 1.6034vw, 1.666875rem); --u32: clamp(1rem, 0.18rem + 1.2813vw, 1.333125rem); --u24: clamp(0.75rem, 0.1346rem + 0.9615vw, 1rem); --u20: clamp(0.625rem, 0.1127rem + 0.8005vw, 0.833125rem); --u16: clamp(0.5rem, 0.0892rem + 0.6418vw, 0.666875rem); --u12: clamp(0.375rem, 0.0673rem + 0.4808vw, 0.5rem); --u8: clamp(0.25rem, 0.0454rem + 0.3197vw, 0.333125rem); --u4: clamp(0.125rem, 0.0219rem + 0.1611vw, 0.166875rem); } } @media (min-width: 768.001px) and (max-width: 1024px) { :root { --fs900: clamp(13.424375rem, 10.5481rem + 5.9922vw, 14.383125rem); --fs800: clamp(10.070625rem, 7.9125rem + 4.4961vw, 10.79rem); --fs700: clamp(6.54375rem, 5.1412rem + 2.9219vw, 7.01125rem); --fs600: clamp(4.90875rem, 3.8569rem + 2.1914vw, 5.259375rem); --fs500: clamp(3.6825rem, 2.8931rem + 1.6445vw, 3.945625rem); --fs400: clamp(2.7625rem, 2.17rem + 1.2344vw, 2.96rem); --fs300: clamp(2.0725rem, 1.6281rem + 0.9258vw, 2.220625rem); --fs200: clamp(1.555rem, 1.2231rem + 0.6914vw, 1.665625rem); --fs100: clamp(1.16625rem, 0.915rem + 0.5234vw, 1.25rem); --fs: clamp(0.875rem, 0.6875rem + 0.3906vw, 0.9375rem); --fs75: clamp(0.65625rem, 0.5156rem + 0.293vw, 0.703125rem); --fs50: clamp(0.4925rem, 0.3875rem + 0.2188vw, 0.5275rem); --u158: clamp(4.11375rem, 1.6425rem + 5.1485vw, 4.9375rem); --u142: clamp(3.6975rem, 1.4775rem + 4.625vw, 4.4375rem); --u126: clamp(3.280625rem, 1.31rem + 4.1055vw, 3.9375rem); --u110: clamp(2.864375rem, 1.145rem + 3.582vw, 3.4375rem); --u94: clamp(2.4475rem, 0.9775rem + 3.0625vw, 2.9375rem); --u78: clamp(2.030625rem, 0.81rem + 2.543vw, 2.4375rem); --u62: clamp(1.614375rem, 0.645rem + 2.0195vw, 1.9375rem); --u54: clamp(1.40625rem, 0.5625rem + 1.7578vw, 1.6875rem); --u48: clamp(1.25rem, 0.5rem + 1.5625vw, 1.5rem); --u40: clamp(1.04125rem, 0.415rem + 1.3047vw, 1.25rem); --u32: clamp(0.833125rem, 0.3325rem + 1.043vw, 1rem); --u24: clamp(0.625rem, 0.25rem + 0.7813vw, 0.75rem); --u20: clamp(0.520625rem, 0.2075rem + 0.6523vw, 0.625rem); --u16: clamp(0.416875rem, 0.1675rem + 0.5195vw, 0.5rem); --u12: clamp(0.3125rem, -0.25rem + 1.1719vw, 0.5rem); --u8: clamp(0.208125rem, 0.0825rem + 0.2617vw, 0.25rem); --u4: clamp(0.104375rem, 0.0425rem + 0.1289vw, 0.125rem); } } @media (min-width: 480.001px) and (max-width: 768px) { :root { --fs900: clamp(12.465625rem, 10.8677rem + 5.3264vw, 13.424375rem); --fs800: clamp(9.35125rem, 8.1523rem + 3.9965vw, 10.070625rem); --fs700: clamp(6.07625rem, 5.2971rem + 2.5972vw, 6.54375rem); --fs600: clamp(4.558125rem, 3.9737rem + 1.9479vw, 4.90875rem); --fs500: clamp(3.419375rem, 2.9808rem + 1.4618vw, 3.6825rem); --fs400: clamp(2.565625rem, 2.2375rem + 1.0938vw, 2.7625rem); --fs300: clamp(1.924375rem, 1.6775rem + 0.8229vw, 2.0725rem); --fs200: clamp(1.44375rem, 1.2583rem + 0.6181vw, 1.555rem); --fs100: clamp(1.083125rem, 0.9446rem + 0.4618vw, 1.16625rem); --fs: clamp(0.8125rem, 0.7083rem + 0.3472vw, 0.875rem); --fs75: clamp(0.609375rem, 0.5312rem + 0.2604vw, 0.65625rem); --fs50: clamp(0.4575rem, 0.3992rem + 0.1944vw, 0.4925rem); --u158: clamp(3.29125rem, 1.9204rem + 4.5695vw, 4.11375rem); --u142: clamp(2.958125rem, 1.7258rem + 4.1077vw, 3.6975rem); --u126: clamp(2.625rem, 1.5323rem + 3.6424vw, 3.280625rem); --u110: clamp(2.29125rem, 1.336rem + 3.184vw, 2.864375rem); --u94: clamp(1.958125rem, 1.1425rem + 2.7188vw, 2.4475rem); --u78: clamp(1.625rem, 0.949rem + 2.2535vw, 2.030625rem); --u62: clamp(1.29125rem, 0.7527rem + 1.7951vw, 1.614375rem); --u54: clamp(1.125rem, 0.6562rem + 1.5625vw, 1.40625rem); --u48: clamp(1rem, 0.5833rem + 1.3889vw, 1.25rem); --u40: clamp(0.833125rem, 0.4862rem + 1.1563vw, 1.04125rem); --u32: clamp(0.666875rem, 0.3898rem + 0.9236vw, 0.833125rem); --u24: clamp(0.5rem, 0.2917rem + 0.6944vw, 0.625rem); --u20: clamp(0.416875rem, 0.244rem + 0.5764vw, 0.520625rem); --u16: clamp(0.333125rem, 0.1935rem + 0.4653vw, 0.416875rem); --u12: clamp(0.25rem, 0.1458rem + 0.3472vw, 0.3125rem); --u8: clamp(0.166875rem, 0.0981rem + 0.2292vw, 0.208125rem); --u4: clamp(0.083125rem, 0.0477rem + 0.1181vw, 0.104375rem); } } @media (min-width: 320.001px) and (max-width: 480px) { :root { --fs900: clamp(11.506875rem, 9.5894rem + 9.5876vw, 12.465625rem); --fs800: clamp(8.631875rem, 7.1931rem + 7.1938vw, 9.35125rem); --fs700: clamp(5.60875rem, 4.6737rem + 4.675vw, 6.07625rem); --fs600: clamp(4.2075rem, 3.5062rem + 3.5063vw, 4.558125rem); --fs500: clamp(3.15625rem, 2.63rem + 2.6313vw, 3.419375rem); --fs400: clamp(2.368125rem, 1.9731rem + 1.975vw, 2.565625rem); --fs300: clamp(1.77625rem, 1.48rem + 1.4813vw, 1.924375rem); --fs200: clamp(1.3325rem, 1.11rem + 1.1125vw, 1.44375rem); --fs100: clamp(1rem, 0.8337rem + 0.8313vw, 1.083125rem); --fs: clamp(0.75rem, 0.625rem + 0.625vw, 0.8125rem); --fs75: clamp(0.5625rem, 0.4687rem + 0.4688vw, 0.609375rem); --fs50: clamp(0.421875rem, 0.3506rem + 0.3563vw, 0.4575rem); --u158: clamp(2.46875rem, 0.8237rem + 8.2251vw, 3.29125rem); --u142: clamp(2.21875rem, 0.74rem + 7.3938vw, 2.958125rem); --u126: clamp(1.96875rem, 0.6562rem + 6.5625vw, 2.625rem); --u110: clamp(1.71875rem, 0.5812rem + 5.6875vw, 2.2875rem); --u94: clamp(1.46875rem, 0.49rem + 4.8938vw, 1.958125rem); --u78: clamp(1.21875rem, 0.4062rem + 4.0625vw, 1.625rem); --u62: clamp(0.96875rem, 0.3237rem + 3.225vw, 1.29125rem); --u54: clamp(0.84375rem, 0.2812rem + 2.8125vw, 1.125rem); --u48: clamp(0.75rem, 0.25rem + 2.5vw, 1rem); --u40: clamp(0.625rem, 0.2087rem + 2.0813vw, 0.833125rem); --u32: clamp(0.5rem, 0.1662rem + 1.6688vw, 0.666875rem); --u24: clamp(0.375rem, 0.125rem + 1.25vw, 0.5rem); --u20: clamp(0.3125rem, 0.1037rem + 1.0438vw, 0.416875rem); --u16: clamp(0.25rem, 0.0837rem + 0.8313vw, 0.333125rem); --u12: clamp(0.1875rem, 0.0625rem + 0.625vw, 0.25rem); --u8: clamp(0.125rem, 0.0412rem + 0.4188vw, 0.166875rem); --u4: clamp(0.0625rem, 0.0212rem + 0.2063vw, 0.083125rem); } } @media (min-width: 100px) and (max-width: 320px) { :root { --fs900: 184.11px; --fs800: 138.11px; --fs700: 89.74px; --fs600: 67.32px; --fs500: 50.5px; --fs400: 37.89px; --fs300: 28.42px; --fs200: 21.32px; --fs100: 16px; --fs: 12px; --fs75: 9px; --fs50: 6.75px; --u158: 39.5px; --u142: 35.5px; --u126: 31.5px; --u110: 27.5px; --u94: 23.5px; --u78: 19.5px; --u62: 15.5px; --u54: 13.5px; --u48: 12px; --u40: 10px; --u32: 8px; --u24: 6px; --u20: 5px; --u16: 4px; --u12: 3px; --u8: 2px; --u4: 1px; } } @font-face { font-family: "light"; src: url("fonts/Satoshi-Light.woff2") format("woff2"); } @font-face { font-family: "bold"; src: url("fonts/Satoshi-Bold.woff2") format("woff2"); } @font-face { font-family: "head"; src: url("fonts/PlayfairDisplay-Black.woff2") format("woff2"); } @font-face { font-family: "headlight"; src: url("fonts/PlayfairDisplay-Regular.woff2") format("woff2"); } @font-face { font-family: "cardea"; src: url("fonts/cardea.woff2") format("woff2"); font-weight: normal; font-style: normal; font-display: block; } [class^="ico-"], [class*=" ico-"] { font-family: "cardea" !important; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .ico-adress:before { content: "\e900"; } .ico-arrow-bottom:before { content: "\e901"; } .ico-arrow-left:before { content: "\e902"; } .ico-arrow-right:before { content: "\e903"; } .ico-arrow-top:before { content: "\e904"; } .ico-close:before { content: "\e905"; } .ico-facebook:before { content: "\e906"; } .ico-ig:before { content: "\e907"; } .ico-mail:before { content: "\e908"; } .ico-menu:before { content: "\e909"; } .ico-news:before { content: "\e90a"; } .ico-phone:before { content: "\e90b"; } .ico-play:before { content: "\e90c"; } .ico-ticket:before { content: "\e90d"; } .ico-view:before { content: "\e90e"; } .ico-www:before { content: "\e90f"; } *, *::before, *::after { box-sizing: border-box; } html { scroll-behavior: smooth; font: size 16px; } body { font-family: "light", Helvetica, Arial, sans-serif; margin: 0; font-weight: 100; line-height: 1; color: var(--c0); -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); background-color: rgb(252, 252, 252); letter-spacing: 0.5px; } article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; font-size: 1; font-weight: 100; letter-spacing: 0px; line-height: 0.9em; overflow-wrap: break-word; word-wrap: break-word; hyphens: auto; } ol, ul { list-style-type: none; padding: 0; margin: 0; } li { display: inline-block; } p { line-height: 1.6em; margin: 0; padding: 0; font-weight: 100; } img { display: inline-block; height: auto; max-width: 100%; } span { margin: 0; padding: 0; line-height: 1; font-weight: 100; letter-spacing: 0px; } b, strong { font-family: "bold", Helvetica, Arial, sans-serif; font-weight: 100; } i { font-style: normal; } sub, sup { position: relative; font-size: 0.75em; line-height: 0; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } a { background-color: transparent; color: var(--c0); text-decoration: none; } a:hover, a:focus, a:active { text-decoration: none; } a:focus { outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } a:hover { color: var(--c0); text-decoration: none; } a:not([href]):not([class]), a:not([href]):not([class]):hover { color: inherit; outline: 0; text-decoration: none; } img, svg { vertical-align: middle; border: 0; display: inline-block; max-width: 100%; height: auto; } table { caption-side: bottom; border-collapse: collapse; } th { text-align: inherit; text-align: -webkit-match-parent; } thead, tbody, tfoot, tr, td, th { border-color: inherit; border-style: solid; border-width: 0; } label { display: inline-block; } button { border-radius: 0; } button:focus { outline: 0px dotted; outline: 0px auto -webkit-focus-ring-color; } input, button, select, optgroup, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } button, input { overflow: visible; } button, select { text-transform: none; } [role="button"] { cursor: pointer; } select { word-wrap: normal; } [list]::-webkit-calendar-picker-indicator { display: none; } button:not(:disabled), [type="button"]:not(:disabled), [type="reset"]:not(:disabled), [type="submit"]:not(:disabled) { cursor: pointer; } ::-moz-focus-inner { padding: 0; border-style: none; } textarea { resize: vertical; } fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } iframe { border: 0; } [hidden] { display: none !important; } body { font: var(--fs)/var(--lh) var(--ffl); letter-spacing: var(--ls); } .hide { display: none !important; } .show { display: block !important; } .invisible { visibility: hidden; } .text-hide { font: 0px; color: transparent; text-shadow: none; background-color: transparent; border: 0; } .stop-scrolling { height: 100%; overflow-y: hidden; } .overlay-box { visibility: visible !important; opacity: 1; display: flex; transition: opacity 0.6s ease; -moz-transition: opacity 0.6s ease; -webkit-transition: opacity 0.6s ease; } .overlay-box-hide { visibility: hidden !important; opacity: 0; position: relative; z-index: -1; transition: opacity 0.6s ease; -moz-transition: opacity 0.6s ease; -webkit-transition: opacity 0.6s ease; } .video_flip_horizontal { transform: scaleX(-1); } .h25 { min-height: 25vh; } .h33 { min-height: 33vh; } .h50 { min-height: 50vh; } .h75 { min-height: 75vh; } .h100 { min-height: calc(100vh - var(--u24) * 2); } @media (max-width: 1024px) { .bgvdark25 { background-color: rgba(39, 40, 43, 0.25); } .bgvdark50 { background-color: rgba(39, 40, 43, 0.55); } .bgvdark75 { background-color: rgba(39, 40, 43, 0.75); } .bgvlight25 { background-color: rgba(255, 255, 255, 0.25); } .bgvlight50 { background-color: rgba(255, 255, 255, 0.55); } .bgvlight75 { background-color: rgba(255, 255, 255, 0.75); } .cv0 { color: var(--c0); } .cv1 { color: var(--c1); } .cv100 { color: var(--c100); } .cv150 { color: var(--c150); } .cv200 { color: var(--c200); } .cv250 { color: var(--c250); } .cv300 { color: var(--c300); } .bgcv0 { background-color: var(--c0); } .bgcv1 { background-color: var(--c1); } .bgcv100 { background-color: var(--c100); } .bgcv150 { background-color: var(--c150); } .bgcv200 { background-color: var(--c200); } .bgcv250 { background-color: var(--c250); } .bgcv300 { background-color: var(--c300); } } @media (min-width: 1024.001px) { .bgdark25 { background-color: rgba(39, 40, 43, 0.25); } .bgdark50 { background-color: rgba(39, 40, 43, 0.55); } .bgdark75 { background-color: rgba(39, 40, 43, 0.75); } .bglight25 { background-color: rgba(255, 255, 255, 0.25); } .bglight50 { background-color: rgba(255, 255, 255, 0.55); } .bglight75 { background-color: rgba(255, 255, 255, 0.75); } .ch0 { color: var(--c0); } .ch1 { color: var(--c1); } .ch100 { color: var(--c100); } .ch150 { color: var(--c150); } .ch200 { color: var(--c200); } .ch250 { color: var(--c250); } .ch300 { color: var(--c300); } .bgch0 { background-color: var(--c0); } .bgch1 { background-color: var(--c1); } .bgch100 { background-color: var(--c100); } .bgch150 { background-color: var(--c150); } .bgch200 { background-color: var(--c200); } .bgch250 { background-color: var(--c250); } .bgch300 { background-color: var(--c300); } } .fs900 { font-size: var(--fs900); } .fs800 { font-size: var(--fs800); } .fs700 { font-size: var(--fs700); } .fs600 { font-size: var(--fs600); } .fs500 { font-size: var(--fs500); } .fs400 { font-size: var(--fs400); } .fs300 { font-size: var(--fs300); } .fs200 { font-size: var(--fs200); } .fs100 { font-size: var(--fs100); } .fs { font-size: var(--fs); } .fs75 { font-size: var(--fs75); } .fs50 { font-size: var(--fs50); } .ffl { font-family: "light", Helvetica, Arial, sans-serif; } .ffb { font-family: "bold", Helvetica, Arial, sans-serif; } .ffh { font-family: "head", Helvetica, Arial, sans-serif; } .ffhl { font-family: "headlight", Helvetica, Arial, sans-serif; } .c0 { color: var(--c0); } .c1 { color: var(--c1); } .c100 { color: var(--c100); } .c150 { color: var(--c150); } .c250 { color: var(--c250); } .c300 { color: var(--c300); } .bgc0 { background-color: var(--c0); } .bgc1 { background-color: var(--c1); } .bgc100 { background-color: var(--c100); } .bgc150 { background-color: var(--c150); } .bgc200 { background-color: var(--c200); } .bgc250 { background-color: var(--c250); } .bgc300 { background-color: var(--c300); } .btn { display: inline-flex; justify-content: center; align-items: center; flex-basis: min-content; width: -moz-max-content; width: max-content; font-family: var(--ffb); padding: var(--u20) var(--u48) var(--u20) var(--u48); transition: all 0.5s ease-in-out; outline: 0; border-radius: var(--u12); } .btn200 { color: var(--c1); font-size: var(--fs100); letter-spacing: var(--ls100); line-height: var(--lh100); text-transform: uppercase; background-color: var(--c200); } .btn200:hover, .btn200:focus, .btn200:active { background-color: var(--c250); color: var(--c300); } .btn100 { color: var(--c1); font-size: var(--fs); letter-spacing: var(--ls); line-height: var(--lh); text-transform: uppercase; background-color: var(--c100); } .btn100:hover, .btn100:focus, .btn100:active { background-color: var(--c150); color: var(--c1); } .btnnext { display: block; width: -moz-max-content; width: max-content; font-size: var(--u32); padding: var(--u16); transition: all 0.5s ease-in-out; outline: 0; color: var(--c0); background-color: var(--c1); margin: 0 0 0 auto; border-radius: var(--u12); } .btnnext:hover, .btnnext:focus, .btnnext:active { background-color: var(--c150); color: var(--c1); } .btnbuy { display: inline-flex; justify-content: center; align-items: center; flex-basis: min-content; width: 100%; text-transform: uppercase; font: var(--fs100)/var(--lh100) var(--ffb); letter-spacing: var(--ls100); padding: var(--u20) var(--u48) var(--u20) var(--u48); transition: all 0.5s ease-in-out; outline: 0; color: var(--c100); background-color: var(--c1); border-radius: var(--u12); } .btnbuy:hover, .btnbuy:focus, .btnbuy:active { background-color: var(--c0); color: var(--c1); } .btnnextbuy { display: block; width: -moz-max-content; width: max-content; font-size: var(--u32); padding: var(--u16); transition: all 0.5s ease-in-out; outline: 0; color: var(--c0); background-color: var(--c1); margin: 0 0 0 auto; border-radius: var(--u12); } .btnnextbuy:hover, .btnnextbuy:focus, .btnnextbuy:active { background-color: var(--c0); color: var(--c1); } .bgimg { flex: 0 0 auto; position: relative; } .bgimg img { display: inline-block; width: 100%; height: 100%; position: absolute; overflow-x: hidden; min-height: 100%; min-width: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: 50% 50%; object-position: 50% 50%; } .bgbox { min-height: 100%; position: relative; display: flex; } .bgbox .bgimg { position: absolute; z-index: -1; display: flex; min-height: 100%; max-width: 100%; max-height: 100%; min-width: 100%; } .bgbox .bgimg img { display: inline-block; overflow: hidden; -o-object-fit: cover; object-fit: cover; min-width: 100%; min-height: 100%; max-width: 100%; max-height: 100%; } .bgcontent { display: flex; flex-direction: column; width: 100%; } .bgcontentl { align-items: flex-start; text-align: left; } .bgcontentc { align-items: center; text-align: center; } .bgcontentr { align-items: flex-end; text-align: right; } @media (min-width: 1024.001px) { .bgpostl img { -o-object-position: left top; object-position: left top; } .bgpostc img { -o-object-position: 50% top; object-position: 50% top; } .bgpostr img { -o-object-position: right top; object-position: right top; } .bgposml img { -o-object-position: left 50%; object-position: left 50%; } .bgposmc img { -o-object-position: 50% 50%; object-position: 50% 50%; } .bgposmr img { -o-object-position: right 50%; object-position: right 50%; } .bgposbl img { -o-object-position: left bottom; object-position: left bottom; } .bgposbc img { -o-object-position: 50% bottom; object-position: 50% bottom; } .bgposbr img { -o-object-position: right bottom; object-position: right bottom; } .bgctl { justify-content: flex-start; align-items: flex-start; } .bgcml { justify-content: flex-start; align-items: center; } .bgcbl { justify-content: flex-start; align-items: flex-end; } .bgctc { justify-content: center; align-items: flex-start; } .bgcmc { justify-content: center; align-items: center; } .bgcbc { justify-content: center; align-items: flex-end; } .bgctr { justify-content: flex-end; align-items: flex-start; } .bgcmr { justify-content: flex-end; align-items: center; } .bgcbr { justify-content: flex-end; align-items: flex-end; } } @media (max-width: 1024px) { .bgvpostl img { -o-object-position: left top; object-position: left top; } .bgvpostc img { -o-object-position: 50% top; object-position: 50% top; } .bgvpostr img { -o-object-position: right top; object-position: right top; } .bgvposml img { -o-object-position: left 50%; object-position: left 50%; } .bgvposmc img { -o-object-position: 50% 50%; object-position: 50% 50%; } .bgvposmr img { -o-object-position: right 50%; object-position: right 50%; } .bgvposbl img { -o-object-position: left bottom; object-position: left bottom; } .bgvposbc img { -o-object-position: 50% bottom; object-position: 50% bottom; } .bgvposbr img { -o-object-position: right bottom; object-position: right bottom; } .bgvctl { justify-content: flex-start; align-items: flex-start; } .bgvcml { justify-content: flex-start; align-items: center; } .bgvcbl { justify-content: flex-start; align-items: flex-end; } .bgvctc { justify-content: center; align-items: flex-start; } .bgvcmc { justify-content: center; align-items: center; } .bgvcbc { justify-content: center; align-items: flex-end; } .bgvctr { justify-content: flex-end; align-items: flex-start; } .bgvcmr { justify-content: flex-end; align-items: center; } .bgvcbr { justify-content: flex-end; align-items: flex-end; } } .row { display: flex; flex: 1 0 100%; flex-direction: row; flex-wrap: wrap; max-width: 100vw; width: 100%; margin: 0 auto; overflow: hidden; padding: var(--u24) var(--u48); } .box { display: flex; flex: 1 0 100%; flex-direction: row; flex-wrap: wrap; width: 100%; margin: 0 auto; overflow: hidden; } .home_box_1_actor { display: grid; grid-template-columns: 33.333% 25% 1fr; grid-template-rows: 1fr 1fr; gap: var(--u48); grid-auto-flow: row; grid-template-areas: "hb1a_poster hb1a_actor hb1a_info" "hb1a_poster hb1a_time hb1a_info"; } .hb1a_poster { grid-area: hb1a_poster; } .hb1a_actor { grid-area: hb1a_actor; } .hb1a_time { grid-area: hb1a_time; } .hb1a_info { grid-area: hb1a_info; } .home_box_2_actor { display: grid; grid-template-columns: 1fr 1fr 1fr 33.333%; grid-template-rows: 1fr 1fr; gap: var(--u48); grid-auto-flow: row; grid-template-areas: "hb2a_info hb2a_info hb2a_info hb2a_poster" "hb2a_actor1 hb2a_actor2 hb2a_time hb2a_poster"; } .hb2a_poster { grid-area: hb2a_poster; } .hb2a_actor1 { grid-area: hb2a_actor1; } .hb2a_actor2 { grid-area: hb2a_actor2; } .hb2a_time { grid-area: hb2a_time; } .hb2a_info { grid-area: hb2a_info; } .home_box_info { display: grid; grid-template-columns: 58.333% 1fr 1fr; grid-template-rows: 1fr 1fr 1fr; gap: var(--u48); grid-auto-flow: row; grid-template-areas: "hbi_boxhero hbi_program hbi_program" "hbi_boxhero hbi_photo hbi_contact" "hbi_boxhero hbi_date hbi_buyticket"; } .hbi_boxhero { grid-area: hbi_boxhero; } .hbi_program { grid-area: hbi_program; } .hbi_photo { grid-area: hbi_photo; } .hbi_contact { grid-area: hbi_contact; } .hbi_date { grid-area: hbi_date; } .hbi_buyticket { grid-area: hbi_buyticket; } .home_box_redactor3 { display: grid; grid-template-columns: 33.333% 1fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: var(--u48); grid-auto-flow: row; grid-template-areas: "hbr_redactor hbr_actor1 hbr_actor2 hbr_actor3" "hbr_redactor hbr_info hbr_info hbr_info"; } .home_box_redactor2 { display: grid; grid-template-columns: 33.333% 1fr 1fr; grid-template-rows: 1fr 1fr; gap: var(--u48); grid-auto-flow: row; grid-template-areas: "hbr_redactor hbr_actor1 hbr_actor2" "hbr_redactor hbr_info hbr_info"; } .home_box_redactor1 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 100vh 1fr; gap: var(--u48); grid-auto-flow: row; grid-template-areas: "hbr_redactor hbr_actor1" "hbr_info hbr_info"; } .hbr_redactor { grid-area: hbr_redactor; } .hbr_actor1 { grid-area: hbr_actor1; } .hbr_actor2 { grid-area: hbr_actor2; } .hbr_actor3 { grid-area: hbr_actor3; } .hbr_info { grid-area: hbr_info; } .fastmenu { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 1fr; gap: var(--u48); grid-auto-flow: row; grid-template-areas: "guest edition current"; } .guest { grid-area: guest; } .edition { grid-area: edition; } .current { grid-area: current; } footer { display: grid; width: calc(100vw - 2 * var(--u48)); margin: var(--u24) auto; overflow: hidden; padding: var(--u24) var(--u48); grid-template-columns: 66.667% 33%; grid-template-rows: max-content max-content; gap: var(--u48); grid-template-areas: "fheader fcontact" "flinks flinks"; } .fheader { grid-area: fheader; } .fcontact { grid-area: fcontact; } .flinks { grid-area: flinks; } .list-3a, .list-2a, .list-1a { display: grid; width: 100%; height: 100%; max-height: -moz-max-content; max-height: max-content; gap: var(--u48); } .list li:nth-child(odd) .list-3a { grid-template-columns: 1fr 16.666vw 1fr; grid-template-rows: minmax(16.666vw, auto) minmax(16.666vw, auto) minmax( 16.666vw, auto ); grid-template-areas: "l3a_poster l3a_actor1 l3a_info" "l3a_poster l3a_actor2 l3a_info" "l3a_poster l3a_actor3 l3a_link"; } .list li:nth-child(odd) .list-2a { grid-template-columns: 16.666% 16.666% auto 41.666%; grid-template-rows: 1fr minmax(16.666vw, auto); grid-template-areas: "l2a_info l2a_info l2a_info l2a_poster" "l2a_actor1 l2a_actor2 l2a_link l2a_poster"; } .list li:nth-child(odd) .list-1a { grid-template-columns: 16.666% 1fr 1fr; grid-template-rows: 1fr minmax(16.666vw, auto); grid-template-areas: "l1a_info l1a_info l1a_poster" "l1a_actor1 l1a_link l1a_poster"; } .list li:nth-child(even) .list-3a { grid-template-columns: 1fr 16.666vw 1fr; grid-template-rows: minmax(16.666vw, auto) minmax(16.666vw, 30%) minmax( 16.666vw, 30% ); grid-template-areas: "l3a_info l3a_actor1 l3a_poster" "l3a_info l3a_actor2 l3a_poster" "l3a_link l3a_actor3 l3a_poster"; } .list li:nth-child(even) .list-2a { grid-template-columns: 41.666% auto 16.666% 16.666%; grid-template-rows: 1fr minmax(16.666vw, auto); grid-template-areas: "l2a_poster l2a_info l2a_info l2a_info " "l2a_poster l2a_actor1 l2a_actor2 l2a_link"; } .list li:nth-child(even) .list-1a { grid-template-columns: 1fr 1fr 16.666%; grid-template-rows: 1fr minmax(16.666vw, auto); grid-template-areas: "l1a_poster l1a_info l1a_info " "l1a_poster l1a_link l1a_actor1 "; } .l3a_poster { grid-area: l3a_poster; } .l3a_actor1 { grid-area: l3a_actor1; } .l3a_actor2 { grid-area: l3a_actor2; } .l3a_actor3 { grid-area: l3a_actor3; } .l3a_info { grid-area: l3a_info; } .l3a_link { grid-area: l3a_link; } .l2a_info { grid-area: l2a_info; } .l2a_poster { grid-area: l2a_poster; } .l2a_actor1 { grid-area: l2a_actor1; } .l2a_actor2 { grid-area: l2a_actor2; } .l2a_link { grid-area: l2a_link; } .l1a_info { grid-area: l1a_info; } .l1a_poster { grid-area: l1a_poster; } .l1a_actor1 { grid-area: l1a_actor1; } .l1a_link { grid-area: l1a_link; } .main-menu { display: flex; flex-direction: row; justify-content: space-between; align-items: center; text-transform: uppercase; padding: var(--u24) var(--u48) 0 var(--u48); gap: var(--u78); } .menu-item-menu { display: none; } .brand img { filter: brightness(0) saturate(100%) invert(5%) sepia(8%) saturate(7147%) hue-rotate(118deg) brightness(93%) contrast(101%); height: var(--u78); width: auto; } .menu li { margin-left: var(--u32); } .menu li a { font: var(--fs)/var(--lh) var(--ffb); letter-spacing: var(--ls); transition: all 0.5s ease-in-out; } .menu li a:hover, .menu li a:focus { color: var(--c150); } .menu .btn { padding: var(--u16) var(--u32); font-family: var(--ffb); } .menu .btn:hover, .menu .btn:focus { color: var(--c1) !important; } .close_btn { font-size: var(--u48); transition: color 0.5s ease-in-out; } .close_btn:hover, .close_btn:focus { color: var(--c150); } .mobile_menu { position: fixed; top: 0; left: 0; width: 100vw; min-height: 100vh; background: rgb(255, 255, 255); z-index: 101; opacity: 0; pointer-events: none; transition: opacity 0.5s ease-in-out; display: flex; flex-direction: row; overflow-y: auto; } .mobile_menu::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("img/alchemia_sygnet.svg"); background-repeat: no-repeat; background-size: auto 100%; background-position: 80% center; opacity: 0.04; /* 20% przezroczystości */ z-index: -1; } #myNav.open { opacity: 1; pointer-events: auto; min-height: 100vh; z-index: 100; height: 100%; } .menu_mob { width: 100%; height: -moz-max-content; height: max-content; background-color: var(--c0); display: flex; flex-direction: row; align-items: center; justify-content: space-between; padding: var(--u48); position: relative; z-index: 1020; } .menu_mob img { filter: brightness(0) saturate(100%) invert(99%) sepia(18%) saturate(372%) hue-rotate(41deg) brightness(99%) contrast(97%); } .menu_mob a { color: var(--c1); } .menu_mob_box { width: 100%; height: calc(100% - 100px); display: grid; align-items: center; justify-content: flex-end; padding: var(--u110); position: relative; z-index: 1020; } .menu_mob_box ul { display: flex; flex-direction: column; align-items: flex-end; } .menu_mob_box ul li { height: var(--fs400); margin: var(--u12) 0; display: flex; flex-direction: row; align-items: center; } .menu_mob_box ul li a { font: var(--fs200)/var(--lh200) var(--ffhl); letter-spacing: var(--ls200); text-transform: uppercase; transition: all 0.5s ease-in-out; } .menu_mob_box ul li a:hover, .menu_mob_box ul li a:focus { font: var(--fs400)/var(--lh400) var(--ffh); letter-spacing: var(--ls400); } .myVideo { width: 100%; height: auto; max-height: 100%; -o-object-fit: cover; object-fit: cover; display: block; aspect-ratio: 16/9; } .home-hero .myVideo { -o-object-position: right 50%; object-position: right 50%; } .home-hero { min-height: calc(100vh - 128px); } .home-hero .bgcontent { padding: 4%; justify-content: flex-end; } .home-hero .bgcontent strong { font: var(--fs800)/calc(var(--lh800) * 1.4) var(--ffh); letter-spacing: var(--ls800); } .home-hero .bgcontent p { font: var(--fs200)/var(--lh200) var(--ffl); letter-spacing: var(--ls200); } .home-hero .bgcontent i { font: var(--fs400)/var(--lh400) var(--ffl); letter-spacing: var(--ls400); margin-top: var(--u48); } .home-hero .bgcontent h2 { font: var(--fs700)/calc(var(--lh700) * 0.9) var(--ffh); letter-spacing: var(--ls700); text-transform: uppercase; } .home-hero .bigimg, .home-hero img, .home-hero video { border-radius: var(--u32); } .hb1a_poster, .hb1a_actor, .hb1a_time, .hb1a_info, .hb2a_poster, .hb2a_actor1, .hb2a_actor2, .hb2a_time, .hb2a_info, .hbr_redactor, .hbr_actor1, .hbr_actor2, .hbr_actor3, .hbr_info, .hbi_boxhero, .hbi_program, .hbi_photo, .hbi_contact, .hbi_date, .hbi_buyticket { border-radius: var(--u24); } .hb1a_poster picture, .hb1a_poster img, .hb1a_actor picture, .hb1a_actor img, .hb1a_time picture, .hb1a_time img, .hb1a_info picture, .hb1a_info img, .hb2a_poster picture, .hb2a_poster img, .hb2a_actor1 picture, .hb2a_actor1 img, .hb2a_actor2 picture, .hb2a_actor2 img, .hb2a_time picture, .hb2a_time img, .hb2a_info picture, .hb2a_info img, .hbr_redactor picture, .hbr_redactor img, .hbr_actor1 picture, .hbr_actor1 img, .hbr_actor2 picture, .hbr_actor2 img, .hbr_actor3 picture, .hbr_actor3 img, .hbr_info picture, .hbr_info img, .hbi_boxhero picture, .hbi_boxhero img, .hbi_program picture, .hbi_program img, .hbi_photo picture, .hbi_photo img, .hbi_contact picture, .hbi_contact img, .hbi_date picture, .hbi_date img, .hbi_buyticket picture, .hbi_buyticket img { border-radius: var(--u24); } .hbr_stylowy, .hbr_alchemia { display: flex; flex-direction: row; align-items: center; justify-content: center; padding: 20%; background-color: var(--c0); } .hbr_alchemia img { filter: brightness(0) saturate(100%) invert(91%) sepia(19%) saturate(129%) hue-rotate(64deg) brightness(106%) contrast(96%); } .hb1a_info, .hb2a_info, .hbr_info { background-color: var(--c1); padding: var(--u78); display: flex; flex-direction: column; justify-content: space-between; gap: var(--u110); } .hb1a_info h2, .hb2a_info h2, .hbr_info h2 { font: var(--fs500)/var(--lh500) var(--ffh); letter-spacing: var(--ls500); text-transform: uppercase; margin-bottom: var(--u24); overflow-wrap: break-word; word-wrap: break-word; hyphens: auto; } .hb1a_info h2 i, .hb2a_info h2 i, .hbr_info h2 i { font: var(--fs200)/var(--lh500) var(--ffhl); letter-spacing: var(--ls200); display: block; } .hb1a_info p, .hb2a_info p, .hbr_info p { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); } .hb1a_info p strong, .hb2a_info p strong, .hbr_info p strong { font: var(--fs300)/var(--lh300) var(--ffb); letter-spacing: var(--ls300); text-transform: uppercase; display: block; } .hb1a_time, .hb2a_time { background-color: var(--c300); color: var(--c1); padding: var(--u54); display: flex; flex-direction: column; justify-content: flex-end; } .hb1a_time strong, .hb2a_time strong { font: var(--fs500)/var(--lh500) var(--ffb); letter-spacing: var(--ls500); } .hb1a_time i, .hb2a_time i { font: var(--fs300)/var(--lh300) var(--ffl); letter-spacing: var(--ls300); } .hb1a_time a, .hb2a_time a { margin-top: var(--u48); } .hbi_boxhero { display: flex; flex-direction: column; justify-content: space-between; gap: var(--u78); background-color: var(--c0); color: var(--c1); padding: var(--u110); } .hbi_boxhero img { filter: brightness(0) saturate(100%) invert(91%) sepia(19%) saturate(129%) hue-rotate(64deg) brightness(106%) contrast(96%); max-width: calc(var(--u158) * 1.8); height: auto; } .hbi_boxhero strong { font: var(--fs800)/calc(var(--lh800) * 1.4) var(--ffh); letter-spacing: var(--ls800); } .hbi_boxhero p { font: var(--fs200)/var(--lh200) var(--ffl); letter-spacing: var(--ls200); } .hbi_boxhero i { font: var(--fs400)/var(--lh400) var(--ffl); letter-spacing: var(--ls400); margin-top: var(--u48); } .hbi_boxhero h2 { font: var(--fs600)/calc(var(--lh600) * 0.9) var(--ffh); letter-spacing: var(--ls600); text-transform: uppercase; } .hbi_program { display: flex; flex-direction: column; justify-content: space-between; gap: var(--u62); background-color: var(--c1); color: var(--c0); padding: var(--u48); } .hbi_program h3 { font: var(--fs200)/var(--lh200) var(--ffhl); text-transform: uppercase; letter-spacing: var(--ls200); } .hbi_program ul { padding-left: var(--u24); } .hbi_program li { list-style-type: disc; display: list-item; font: var(--fs)/var(--lh) var(--ffl); letter-spacing: var(--ls); padding-top: var(--u12); } .hbi_program li strong { text-transform: uppercase; } .hbi_contact { display: flex; flex-direction: column; justify-content: space-between; gap: var(--u48); background-color: var(--c0); color: var(--c1); padding: var(--u48); } .hbi_contact img, .hbi_buyticket img { filter: brightness(0) saturate(100%) invert(91%) sepia(19%) saturate(129%) hue-rotate(64deg) brightness(106%) contrast(96%); max-width: var(--u158); height: auto; } .hbi_contact strong { font-family: var(--ffl); line-height: var(--lh); margin-bottom: var(--u8); } .hbi_contact p { margin-top: var(--u12); } .hbi_date { background-color: var(--c300); color: var(--c1); padding: var(--u54); display: flex; flex-direction: column; justify-content: flex-end; } .hbi_date strong { font: var(--fs500)/var(--lh500) var(--ffb); letter-spacing: var(--ls500); } .hbi_date p { font: var(--fs300)/var(--lh300) var(--ffl); letter-spacing: var(--ls300); } .hbi_buyticket { background-color: var(--c100); padding: var(--u48); display: flex; flex-direction: column; justify-content: space-between; gap: var(--u48); color: var(--c1); transition: all 0.5s ease-in-out; } .hbi_buyticket span { font-size: var(--fs600); } .hbi_buyticket p { font: var(--fs200)/var(--lh200) var(--ffl); letter-spacing: var(--ls200); } .hbi_buyticket strong { display: block; text-transform: uppercase; } .hbi_buyticket:hover, .hbi_buyticket:focus { color: var(--c1); background-color: var(--c150); } .home_movies { display: flex; flex-direction: row; flex-wrap: wrap; align-items: space-between; width: 100%; gap: var(--u48); height: -moz-max-content; height: max-content; overflow-y: visible; } .home_movies li { width: calc(50% - var(--u48) / 2); display: flex; flex-direction: column; justify-content: space-between; background-color: var(--c1); border-radius: var(--u24); height: auto; } .hm_about { position: relative; background-color: var(--c1); border-radius: var(--u24); } .hm_about img { border-radius: var(--u24) var(--u24) 0 0; } .movposter picture { width: 100%; height: 100%; object-fit: cover; } .movposter img { border-radius: var(--u24); } .hm_content { border-radius: 0 0 var(--u24) var(--u24); } .home_movie_info { position: absolute; z-index: 10; right: var(--u24); top: var(--u24); background-color: var(--c300); color: var(--c1); border-radius: var(--u12); padding: var(--u16); display: flex; flex-direction: column; } .home_movie_info p { font: var(--fs)/var(--lh) var(--ffl); letter-spacing: var(--ls); padding-right: var(--u24); } .home_movie_info strong { font: var(--fs100)/var(--lh100) var(--ffb); letter-spacing: var(--ls100); display: block; } .home_movie_info span { font: var(--fs200)/var(--lh200) var(--ffl); letter-spacing: var(--ls200); padding-right: var(--u24); } .hm_info, .hm_content { padding: var(--u62); } .hm_content { border-radius: var(--u24) var(--u24) 0 0; } .hm_content p { margin-bottom: var(--u16); } .hm_info h2 { font: var(--fs300)/var(--lh300) var(--ffh); letter-spacing: var(--ls300); text-transform: uppercase; margin-bottom: var(--u8); } .hm_info i { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); } .hmi_about { padding-top: var(--u48); } .hmi_about li { width: 75%; margin-bottom: var(--u12); line-height: var(--lh); } .hmi_about strong { font: var(--fs100)/var(--lh100) var(--ffb); letter-spacing: var(--ls100); text-transform: uppercase; } .home-banner video { border-radius: var(--u24); } .home-banner img { width: 22vw; filter: brightness(0) saturate(100%) invert(91%) sepia(19%) saturate(129%) hue-rotate(64deg) brightness(106%) contrast(96%); } .home-banner .bgcontent { flex-direction: row; align-items: flex-end; justify-content: flex-start; gap: var(--u110); padding: 4%; color: var(--c1); } .home-banner .bgcontent h2 { font: var(--fs700)/var(--lh700) var(--ffh); letter-spacing: var(--ls700); text-transform: uppercase; } .home-banner .bgcontent strong { font: var(--fs800)/calc(var(--lh800) * 1.4) var(--ffh); letter-spacing: var(--ls800); } .home-banner .bgcontent p { font: var(--fs200)/var(--lh200) var(--ffl); letter-spacing: var(--ls200); } .home-banner .bgcontent i { font: var(--fs300)/var(--lh300) var(--ffl); letter-spacing: var(--ls300); margin-top: var(--u32); display: block; } .home-news .bgimg img { border-radius: var(--u24); } .home-news .bgcontent { padding: var(--u110) 4%; flex-direction: row; gap: var(--u158); color: var(--c1); } .home-news .hn_header { width: 40%; display: flex; flex-direction: column; justify-content: space-between; } .home-news .hn_header span { font-size: var(--fs700); } .home-news .hn_header h2 { font: var(--fs400)/var(--lh400) var(--ffh); letter-spacing: var(--ls400); text-transform: uppercase; margin: var(--u48) 0 var(--u24); } .home-news .hn_header p { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); } .home-news .hn_list { width: 60%; } .home-news .hn_list li { margin: var(--u32); } .home-news .hn_list h3 { font: var(--fs100)/var(--lh100) var(--ffb); letter-spacing: var(--ls100); margin: var(--u8) 0 var(--u24); } .home-news .hn_list i { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); } .home_sponsor ul { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 75%; margin: var(--u48) auto; gap: var(--u110); } .home_sponsor ul li { width: 15%; display: flex; flex-direction: row; align-items: center; justify-content: center; } .home_sponsor ul img { max-width: 100%; height: auto; } .fmbox .bgcontent { padding: var(--u62); color: var(--c1); height: 100%; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: var(--u110); } .fmbox .bgimg img { border-radius: var(--u24); } .fmico { width: 22vw; filter: brightness(0) saturate(100%) invert(91%) sepia(19%) saturate(129%) hue-rotate(64deg) brightness(106%) contrast(96%); width: var(--u110); height: auto; } .fmtxt h2 { font: var(--fs300)/var(--lh300) var(--ffb); letter-spacing: var(--ls300); text-transform: uppercase; margin-bottom: var(--u16); } .fmtxt p { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); margin-bottom: var(--u48); } .current { background-color: var(--c100); border-radius: var(--u24); padding: var(--u62); display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: var(--u110); } .current .bgcontent { padding: 0; } .current strong { font: var(--fs700)/var(--lh600) var(--ffh); letter-spacing: var(--ls700); } .current h2 { font: var(--fs400)/var(--lh400) var(--ffh); letter-spacing: var(--ls400); text-transform: uppercase; margin-bottom: var(--u16); } .current i { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); } .list ul { width: 100%; display: flex; flex-direction: column; gap: var(--u48); } .list ul li { width: 100%; min-height: calc(100vh - var(--u48) / 2); } .l3a_poster img, .l2a_poster img, .l1a_poster img { width: auto; height: calc(100vh - var(--u48)); max-height: auto; min-width: 100%; min-height: 100%; -o-object-fit: cover; object-fit: cover; border-radius: var(--u24); } .l3a_actor1 img, .l3a_actor2 img, .l3a_actor3 img, .l2a_actor1 img, .l2a_actor2 img, .l1a_actor1 img { border-radius: var(--u24); width: auto; height: 100%; max-height: auto; min-width: 100%; min-height: 100%; -o-object-fit: cover; object-fit: cover; } .l3a_link, .l2a_link, .l1a_link { border-radius: var(--u24); background-color: var(--c300); display: flex; flex-direction: row; justify-content: flex-end; padding: var(--u32) var(--u48) var(--u110); color: var(--c1); font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); transition: all 0.5s ease-in-out; } .l3a_link:hover, .l3a_link:focus, .l2a_link:hover, .l2a_link:focus, .l1a_link:hover, .l1a_link:focus { color: var(--c1); background-color: var(--c200); } .l1a_info, .l2a_info, .l3a_info { border-radius: var(--u24); background-color: var(--c1); color: var(--c0); padding: 0 var(--u62) var(--u62); display: flex; flex-direction: column; justify-content: space-between; } .a_info_content ul li { min-height: -moz-max-content; min-height: max-content; padding: var(--u12) 0; text-transform: uppercase; } .a_info_content ul li strong { font: var(--fs100)/var(--lh100) var(--ffh); letter-spacing: var(--ls100); display: block; } .a_info_content ul { margin-bottom: var(--u62); gap: 0; } .l1a_info header, .l2a_info header, .l3a_info header { margin-bottom: var(--u62); } .l1a_info header strong, .l2a_info header strong, .l3a_info header strong { font: var(--fs700)/calc(var(--lh700) * 1.4) var(--ffh); letter-spacing: var(--ls700); } .l1a_info header p, .l2a_info header p, .l3a_info header p { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); } .l1a_info header i, .l2a_info header i, .l3a_info header i { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); margin-top: var(--u48); } .l1a_info header h2, .l2a_info header h2, .l3a_info header h2 { font: var(--fs400)/calc(var(--lh700) * 0.9) var(--ffh); letter-spacing: var(--ls700); text-transform: uppercase; } .a_info_content p { margin-bottom: var(--u16); } .pageheader .bgcontent, .pageheader .bgimg img, .pageheader .bgbox { border-radius: var(--u24); } .pageheader .bgcontent { padding: var(--u110) 50% var(--u62) 4vw; } .pageheader h1 { font: var(--fs400)/var(--lh400) var(--ffh); letter-spacing: var(--ls400); text-transform: uppercase; } .pageheader p { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); margin-top: var(--u48); } .bg_play_video { position: relative; } .bg_play_video .bgimg { border-radius: var(--u24); } .bg_play_video picture, .bg_play_video img { border-radius: var(--u24); width: 100%; height: 100%; display: block; } .bg_play_video::after { font-family: "cardea"; content: "\e90c"; display: flex; width: 100%; height: 100%; flex-direction: row; justify-content: center; align-items: center; font-size: var(--fs500); color: var(--c200); position: absolute; top: 0; right: 0; background-color: transparent; border-radius: var(--u24); transition: all 0.5s ease-in-out; } .bg_play_video:hover::after { color: var(--c250); background-color: rgba(69, 123, 157, 0.5); } .movie_play_video { display: flex; position: relative; border: none; width: 100%; padding: 0; background-color: transparent; } .movie_play_video picture, .movie_play_video img, .hm_about picture, .hm_about img { width: 100%; } .movie_play_video::after { font-family: "cardea"; content: "\e90c"; display: flex; width: 100%; height: 100%; flex-direction: row; justify-content: center; align-items: center; font-size: var(--fs500); color: var(--c200); position: absolute; top: 0; right: 0; z-index: 20; background-color: transparent; border-radius: var(--u24) var(--u24) 0 0; transition: all 0.5s ease-in-out; } .movie_play_video:hover::after { color: var(--c250); background-color: rgba(69, 123, 157, 0.5); } .history_content { display: flex; height: -moz-max-content; height: max-content; flex-direction: reverse; flex-wrap: nowrap; gap: var(--u48); } .history_content picture { width: 41.666%; } .history_content picture img { width: auto; height: auto; max-height: auto; min-width: 100%; min-height: 100%; -o-object-fit: cover; object-fit: cover; border-radius: var(--u24); } .history_content article { width: 58.334%; background-color: var(--c1); border-radius: var(--u24); display: flex; gap: var(--u110); flex-direction: column; justify-content: space-between; padding: var(--u62); } .history_content article header strong { font: var(--fs600)/calc(var(--lh600) * 1.4) var(--ffh); letter-spacing: var(--ls600); } .history_content article header h2 { font: var(--fs300)/var(--lh700) var(--ffh); letter-spacing: var(--ls700); text-transform: uppercase; } .history_content article strong { font: var(--fs100)/var(--lh) var(--ffb); letter-spacing: var(--ls); } .history_content article p, .history_content article ul { padding-top: var(--u16); } .history_content article ul { padding-left: var(--u32); } .history_content article li { display: list-item; padding: var(--u8) 0 var(--u8); list-style-type: disc; } .guest { gap: var(--u110); display: flex; flex-direction: column; margin-bottom: var(--u110); } .guest li { padding: 0 8%; display: flex; flex-direction: row; height: -moz-max-content; height: max-content; flex-wrap: nowrap; gap: var(--u48); } .guest li picture { width: 41.666%; } .guest li picture img { width: 100%; height: auto; min-width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: var(--u24); } .guest li:nth-child(odd) { flex-direction: row-reverse; } .guest article { width: 58.334%; } .guest article header { background-color: var(--c1); border-radius: var(--u24); padding: var(--u12) var(--u48) var(--u48) var(--u48); display: flex; flex-direction: row; align-items: flex-end; gap: var(--u12); margin-bottom: var(--u110); } .guest article header span { font: var(--fs600)/var(--lh900) var(--ffh); letter-spacing: var(--ls600); padding-bottom: var(--u4); } .guest article header div { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls); } .guest article header strong { font: var(--fs300)/var(--lh300) var(--ffh); letter-spacing: var(--ls200); text-transform: uppercase; display: block; } .guest article h1 { font: var(--fs500)/var(--lh100) var(--ffh); letter-spacing: var(--ls500); text-transform: uppercase; padding: 0 16% var(--u62) var(--u62); } .guest article span { font: var(--fs200)/var(--lh900) var(--ffl); letter-spacing: var(--ls200); text-transform: uppercase; display: block; } .guest article ul { padding-left: var(--u32); } .guest article li { display: list-item; padding: var(--u4) 0 var(--u4); list-style-type: disc; } .guest_content { padding: 0 var(--u62) var(--u62); } .guest_content strong { font: var(--fs100)/var(--lh) var(--ffb); letter-spacing: var(--ls); } .guest_content p, .guest_content ul { padding-top: var(--u16); } .guest_content ul { padding-left: var(--u32); } .guest_content li { display: list-item; padding: var(--u4) 0 var(--u4); list-style-type: disc; } .guest_history { padding: var(--u48) 0 0 0; } .guest_history strong { text-transform: uppercase; font: var(--fs)/var(--lh) var(--ffb); letter-spacing: var(--ls); } .guest_links ul { padding-left: 0 !important; display: flex; flex-direction: row; padding: 0; margin-top: var(--u24); } .guest_links ul li { display: inline-block; padding: 0; list-style-type: none !important; } .guest_links ul li::after { content: "|"; padding: 0 var(--u8); } .guest_links ul li:last-child::after { content: ""; padding: 0; } .guest_links ul li a { color: var(--c200); font: var(--fs75)/var(--lh75) var(--ffb); letter-spacing: var(--ls75); transition: color 0.5s ease-in-out; } .guest_links ul li a:hover, .guest_links ul li a:focus { color: var(--c150); } .guest_inter { margin-top: var(--u48); display: flex; flex-direction: row; align-items: center; justify-content: center; gap: var(--u24); padding: var(--u24) var(--u48); border-radius: var(--u12); width: -moz-max-content; width: max-content; background-color: var(--c300); color: var(--c250); font: var(--fs100)/var(--lh100) var(--ffb); letter-spacing: var(--ls100); text-transform: uppercase; border: 0; transition: color 0.5s ease-in-out, background-color 0.5s ease-in-out; } .guest_inter:hover, .guest_inter:focus { background-color: var(--c200); color: var(--c250); } .gallery { display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--u24); } .gallery li { width: calc(16.666% - var(--u24) * 5 / 6); } .gallery img { border-radius: var(--u12); -o-object-fit: cover; object-fit: cover; width: auto; height: auto; min-height: 100%; min-width: 100%; -o-object-position: 50% 50%; object-position: 50% 50%; } .gallery a { border-radius: var(--u12); width: 100%; height: 100%; display: flex; position: relative; } .gallery a::after { font-family: "cardea"; content: "\e90e"; display: flex; width: 100%; height: 100%; flex-direction: row; justify-content: center; align-items: center; font-size: var(--fs500); color: var(--c200); position: absolute; top: 0; right: 0; z-index: 20; background-color: transparent; border-radius: var(--u12); transition: all 0.5s ease-in-out; } .gallery a:hover::after { color: var(--c250); background-color: rgba(69, 123, 157, 0.5); } .hero { margin-top: var(--u62); padding: 0 8%; min-height: 100%; max-width: 100%; max-height: 100%; min-width: 100%; } .hero img { border-radius: var(--u24); -o-object-fit: cover; object-fit: cover; min-width: 100%; min-height: 100%; max-width: 100%; max-height: 100%; } .content { margin: var(--u62) 0; padding: 0 25%; } .content p { padding-bottom: var(--u16); } .content strong { font: var(--fs100)/var(--lh100) var(--ffb); letter-spacing: var(--ls100); } .content a { color: var(--c200); font: var(--fs100)/var(--lh100) var(--ffb); letter-spacing: var(--ls100); text-decoration: underline; transition: color 0.5s ease-in-out; } .content a:hover, .content a:focus { color: var(--c150); } .content h2 { font: var(--fs300)/var(--lh300) var(--ffh); letter-spacing: var(--ls300); margin: var(--u62) 0 var(--u24); } .content h3 { font: var(--fs200)/var(--lh200) var(--ffh); letter-spacing: var(--ls200); margin: var(--u48) 0 var(--u24); } .content h4 { font: var(--fs100)/var(--lh100) var(--ffh); letter-spacing: var(--ls100); margin: var(--u32) 0 var(--u24); } .content img { width: 100%; height: auto; margin: var(--u48) 0 var(--u62); border-radius: var(--u24); } .content ul, .content ol { padding: 0 0 var(--u16) var(--u32); } .content ul li { display: list-item; padding: var(--u4) 0 var(--u4); list-style-type: disc; } .content ol li { display: list-item; padding: var(--u4) 0 var(--u4); list-style-type: decimal; } .videoplayer { display: grid; grid-template-columns: 1fr; height: 100vh; width: 100vw; grid-template-rows: max-content 1fr max-content; gap: 0px 0px; grid-auto-flow: row; grid-template-areas: "navi" "vid" "fot"; } .navi { grid-area: navi; } .vid { grid-area: vid; } .video_title { grid-area: fot; } .play_video { width: 100%; height: 100%; max-width: 100%; max-height: 100%; display: block; aspect-ratio: 16/9; background-color: var(--c0); padding: var(--u48); border-radius: var(--u24); } .play_video video { width: auto; height: 100%; max-width: 100%; max-height: 100%; } .video_title { font: var(--fs200)/var(--lh200) var(--ffb); letter-spacing: var(--ls200); text-transform: uppercase; padding-bottom: var(--u48); justify-content: center; } .page404 { width: 100vw; height: 100vh; color: var(--c1); } .page404 .bgcontent { padding: var(--u158); } .page404 .bgcontent img { width: 32%; filter: brightness(0) saturate(100%) invert(99%) sepia(18%) saturate(372%) hue-rotate(41deg) brightness(99%) contrast(97%); } .page404 .bgcontent h1 { font: var(--fs800)/var(--lh) var(--ffh); letter-spacing: var(--ls800); } .page404 .bgcontent p { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); max-width: 40%; margin-bottom: var(--u48); } footer { color: var(--c1); background-color: var(--c0); border-radius: var(--u24); padding: var(--u110) var(--u62) var(--u48) var(--u158); } .fheader { width: 90%; width: 90%; display: flex; flex-direction: column; justify-content: flex-end; } .fheader p { font: var(--fs300)/var(--lh100) var(--ffl); letter-spacing: var(--ls300); margin-bottom: var(--u12); } .fheader strong { text-transform: uppercase; white-space: nowrap; overflow: hidden; box-sizing: border-box; font-size: clamp(72px, 8vw, 12vw); white-space: nowrap; font-family: var(--ffh); line-height: 0.9; overflow: hidden; } .fcontact { padding-right: 8%; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; } .fcontact img { height: var(--u110); width: auto; filter: brightness(0) saturate(100%) invert(91%) sepia(19%) saturate(129%) hue-rotate(64deg) brightness(106%) contrast(96%); } .fcontact strong { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); margin: var(--u12) 0 var(--u48); } .contact li { display: flex; align-items: center; font: var(--fs)/var(--lh) var(--ffl); letter-spacing: var(--ls); margin-bottom: var(--u24); } .contact li span { color: var(--c200); font-size: var(--fs200); margin-right: var(--u24); } .contact li a { color: var(--c1); transition: all 0.5s ease-in-out; } .contact li a:hover, .contact li a:focus { color: var(--c250); } .social { display: flex; align-items: center; font-size: var(--fs200); margin-top: var(--u32); gap: var(--u24); } .social a { color: var(--c200); transition: color 0.5s ease-in-out; text-decoration: none; } .social a:hover, .social a:focus { color: var(--c250); } .flinks { display: flex; align-items: center; justify-content: flex-end; margin: var(--u32) var(--u62) 0 0; } .flinks a { color: var(--c1); transition: color 0.5s ease-in-out; text-decoration: none; } .flinks a:hover, .flinks a:focus { color: var(--c250); } .flinks li::after { padding-left: var(--u8); } .flinks li:not(:last-child)::after { content: "|"; padding-right: var(--u8); color: var(--c1); } .copy { margin: 0 auto var(--u48); width: -moz-max-content; width: max-content; } .copy p { text-align: center; font: var(--fs75)/var(--lh75) var(--ffl); letter-spacing: var(--ls75); } @media (max-width: 1920px) { .home-hero { min-height: calc(100vh - 80px); } } @media (max-width: 1440px) { .content { margin: var(--u62) 0; padding: 0 16.666%; } .history_content article { width: 50%; } .history_content picture { width: 50%; } .list li:nth-child(2n + 1) .list-3a { grid-template-columns: 1fr 16.666vw 16.666vw 16.666vw; grid-template-rows: auto 16.666vw minmax(16.666vw, auto); grid-template-areas: "l3a_poster l3a_info l3a_info l3a_info" "l3a_poster l3a_actor1 l3a_actor2 l3a_actor3" "l3a_poster l3a_link l3a_link l3a_link"; } .list li:nth-child(2n) .list-3a { grid-template-columns: 16.666vw 16.666vw 16.666vw 1fr; grid-template-rows: auto 16.666vw minmax(16.666vw, auto); grid-template-areas: "l3a_info l3a_info l3a_info l3a_poster" " l3a_actor1 l3a_actor2 l3a_actor3 l3a_poster" "l3a_link l3a_link l3a_link l3a_poster"; } .guest { gap: var(--u158); margin-bottom: var(--u158); } .guest article h1 { font: var(--fs400)/var(--lh900) var(--ffh); letter-spacing: var(--ls400); } .guest li { padding: 0 8%; flex-direction: column-reverse !important; } .guest li article, .guest li picture { width: 100%; } .pageheader .bgcontent { padding: var(--u110) 33% var(--u62) 4vw; } .home-hero { min-height: calc(100vh - 60px); } .home_box_1_actor { grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 1fr 1fr; min-height: -moz-max-content; min-height: max-content; grid-template-areas: "hb1a_poster hb1a_info hb1a_info" "hb1a_poster hb1a_actor hb1a_time"; } .home_box_2_actor { grid-template-columns: 0.5fr 0.5fr 1fr; grid-template-rows: 1fr 0.75fr 1fr; min-height: -moz-max-content; min-height: max-content; grid-template-areas: "hb2a_info hb2a_info hb2a_info" "hb2a_actor1 hb2a_actor2 hb2a_poster" "hb2a_time hb2a_time hb2a_poster"; } .home_box_info { grid-template-columns: 1fr 1fr 1fr; grid-template-rows: max-content max-content max-content; min-height: -moz-max-content; min-height: max-content; grid-template-areas: "hbi_boxhero hbi_boxhero hbi_program " "hbi_boxhero hbi_boxhero hbi_date" "hbi_photo hbi_contact hbi_buyticket"; } .home_box_redactor3 { grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 33.333vw 50vw; min-height: -moz-max-content; min-height: max-content; grid-template-areas: "hbr_actor1 hbr_actor2 hbr_actor3" "hbr_redactor hbr_info hbr_info"; } .hbi_boxhero h2 { font: var(--fs500)/calc(var(--lh500) * 0.9) var(--ffh); letter-spacing: var(--ls500); } } @media (max-width: 1024px) { .hero { padding: 0; } .content { padding: 0 8%; } .history_content { flex-direction: column-reverse; } .history_content article { width: 100%; } .history_content picture { width: 100%; } .list li:nth-child(2n + 1) .list-3a, .list li:nth-child(2n) .list-3a { grid-template-columns: 1fr 1fr 1fr; grid-template-rows: auto 1fr auto 16.666vw; grid-template-areas: "l3a_info l3a_info l3a_info" "l3a_actor1 l3a_actor2 l3a_actor3" "l3a_poster l3a_poster l3a_poster" " l3a_link l3a_link l3a_link"; } .list li:nth-child(2n + 1) .list-2a, .list li:nth-child(2n) .list-2a { grid-template-columns: 1fr 1fr; grid-template-rows: auto 1fr auto 16.666vw; grid-template-areas: "l2a_info l2a_info " "l2a_actor1 l2a_actor2 " "l2a_poster l2a_poster" "l2a_link l2a_link"; } .list li:nth-child(2n + 1) .list-1a, .list li:nth-child(2n) .list-1a { grid-template-columns: 1fr 1fr; grid-template-rows: auto auto 1fr; grid-template-areas: "l1a_info l1a_info" "l1a_poster l1a_poster" "l1a_actor1 l1a_link"; } .home-news .hn_list li { margin: var(--u32) 0; } .home-hero { min-height: calc(100vh - 80px); } .home-hero .bgcontent h2 { font: var(--fs600)/calc(var(--lh600) * 0.9) var(--ffh); letter-spacing: var(--ls600); } .home-hero .bgcontent i { font: var(--fs300)/var(--lh300) var(--ffl); letter-spacing: var(--ls300); } .home-hero .bgcontent p { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); } .home-hero .bgcontent { padding: 8%; } .home_box_1_actor { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 50vw 100vh; grid-template-areas: "hb1a_info hb1a_info" "hb1a_actor hb1a_time" "hb1a_poster hb1a_poster"; } .home_box_2_actor { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 50vw 0.75fr 100vh; grid-template-areas: "hb2a_info hb2a_info" "hb2a_actor1 hb2a_actor2" "hb2a_time hb2a_time" "hb2a_poster hb2a_poster"; } .home_box_info { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr auto auto 50vw; min-height: -moz-max-content; min-height: max-content; grid-template-areas: "hbi_boxhero hbi_boxhero" "hbi_program hbi_program " "hbi_date hbi_buyticket" "hbi_photo hbi_contact "; } .home_movies { min-height: -moz-max-content; min-height: max-content; } .home_movies li { width: 100%; } .home-banner .bgcontent { flex-direction: column; align-items: flex-start; justify-content: space-between; padding: 8%; } .home-banner .bgcontent p { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); } .home-banner .bgcontent h2 { font: var(--fs600)/var(--lh600) var(--ffh); letter-spacing: var(--ls600); } .home-banner img { width: 16vw; } .home-news .bgcontent { padding: var(--u110) 8%; flex-direction: column; } .home-news .hn_header { width: 75%; } .home-news .hn_list { width: 100%; } .fastmenu { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; height: -moz-max-content; height: max-content; grid-template-areas: "guest edition" "current current"; } .home_sponsor ul { width: 84%; gap: var(--u62); } .fmico { width: var(--u158); } .btnnext, .btnnextbuy { font-size: var(--u62); padding: var(--u24); } footer { padding: var(--u110) 8% var(--u48) 8%; display: flex; flex-direction: column; gap: var(--u158); } .fheader { width: 100%; } .fheader p { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); } .fcontact img { width: 25vw; height: auto; margin-bottom: var(--u24); } .fcontact { padding-right: 0; justify-content: flex-start; align-items: flex-start; } } @media (max-width: 768px) { .page404 .bgcontent img { width: 50%; } .page404 .bgcontent p { max-width: 75%; } .gallery li { width: calc(25% - var(--u24) * 3 / 4); } .list li:nth-child(2n + 1) .list-3a, .list li:nth-child(2n) .list-3a { grid-template-columns: 1fr; grid-template-rows: auto 1fr 1fr 1fr auto 16.666vw; grid-template-areas: "l3a_info" "l3a_actor1" " l3a_actor2 " " l3a_actor3" " l3a_poster" " l3a_link"; } .list li:nth-child(2n + 1) .list-2a, .list li:nth-child(2n) .list-2a { grid-template-columns: 1fr; grid-template-rows: auto 1fr 1fr auto 16.666vw; grid-template-areas: "l2a_info " "l2a_actor1 " " l2a_actor2 " "l2a_poster " " l2a_link"; } .list li:nth-child(2n + 1) .list-1a, .list li:nth-child(2n) .list-1a { grid-template-columns: 1fr; grid-template-rows: auto 1fr auto 16.666vw; grid-template-areas: "l1a_info" "l1a_actor1 " "l1a_poster " " l1a_link"; } .guest_content { padding: 0 0 var(--u62); } .guest article h1 { padding: 0 16% var(--u62) 0; } .pageheader .bgcontent { padding: var(--u110) 8vw var(--u62) 8vw; } .guest li { padding: 0; } .guest li article { padding: 0 var(--u110); } .menu { display: flex; } .menu-item { display: none; } .menu-item-menu { display: flex; flex-direction: row; align-items: center; justify-content: center; } .menunav { letter-spacing: 0rem; display: flex; flex-direction: row; align-items: center; } .menunav span { font-size: var(--u78); height: 100%; width: 100%; } .brand img { height: var(--u158); } .home-hero .bgcontent h2 { font: var(--fs500)/calc(var(--lh500) * 0.9) var(--ffh); letter-spacing: var(--ls500); } .home-hero .bgcontent i { font: var(--fs200)/var(--lh200) var(--ffl); letter-spacing: var(--ls200); } .hb1a_info h2, .hb2a_info h2, .hbr_info h2 { font: var(--fs300)/var(--lh300) var(--ffh); letter-spacing: var(--ls300); } .hb1a_info h2 i, .hb2a_info h2 i, .hbr_info h2 i { font: var(--fs100)/var(--lh500) var(--ffhl); letter-spacing: var(--ls100); } .hb1a_info p strong, .hb2a_info p strong, .hbr_info p strong { font: var(--fs200)/var(--lh200) var(--ffb); letter-spacing: var(--ls200); } .hb1a_time strong, .hb2a_time strong, .hbi_date strong { font: var(--fs400)/var(--lh400) var(--ffb); letter-spacing: var(--ls400); } .hb1a_time i, .hb2a_time i, .hbi_date p { font: var(--fs200)/var(--lh200) var(--ffl); letter-spacing: var(--ls200); } .hbi_buyticket span { font-size: var(--fs500); } .hm_info h2 { font: var(--fs200)/var(--lh200) var(--ffh); letter-spacing: var(--ls200); } .hmi_about { padding-top: var(--u62); } .home-news .hn_header span { font-size: var(--fs500); } .home-news .hn_header h2 { font: var(--fs300)/var(--lh300) var(--ffh); letter-spacing: var(--ls300); } .home-banner .bgcontent h2 { font: var(--fs500)/var(--lh500) var(--ffh); letter-spacing: var(--ls500); } .home-banner .bgcontent i { font: var(--fs200)/var(--lh200) var(--ffl); letter-spacing: var(--ls200); } .fastmenu { grid-template-columns: 1fr; grid-template-rows: 1fr 1fr 1fr; grid-template-areas: "guest " " edition" " current"; } .fheader strong { font: var(--fs500)/var(--lh500) var(--ffh); letter-spacing: var(--ls500); } .flinks { justify-content: center; margin: var(--u32) var(--u62) 0; } .fmtxt { width: 100%; } } @media (max-width: 480px) { .page404 .bgcontent { align-items: center; justify-content: center; } .page404 .bgcontent a { width: 100%; padding: var(--u32) var(--u48); } .page404 .bgcontent h1 { font: var(--fs700)/var(--lh) var(--ffh); letter-spacing: var(--ls700); } .page404 .bgcontent img { width: 75%; } .page404 .bgcontent p { max-width: 90%; text-align: center; } .content { padding: 0 4%; } .gallery li { width: calc(33.333% - var(--u24) * 2 / 3); } .guest_inter { margin-top: var(--u62); gap: var(--u48); padding: var(--u48) var(--u48); border-radius: var(--u12); width: 100%; } .guest_links li a { font: var(--fs)/var(--lh) var(--ffb); letter-spacing: var(--ls); } .guest article span { font: var(--fs100)/var(--lh900) var(--ffl); letter-spacing: var(--ls100); } .guest article h1 { font: var(--fs300)/var(--lh900) var(--ffh); letter-spacing: var(--ls300); } .guest article header { flex-direction: column; align-items: flex-start; } .guest article header strong { font: var(--fs200)/var(--lh200) var(--ffh); } .guest li article { padding: 0 var(--u32); } .btnnext, .btnnextbuy { width: 100%; margin: 0; text-align: center; } .home-hero .bgcontent strong { font: var(--fs700)/calc(var(--lh700) * 1.4) var(--ffh); letter-spacing: var(--ls700); } .home-hero .bgcontent h2 { font: var(--fs400)/calc(var(--lh400) * 0.9) var(--ffh); letter-spacing: var(--ls400); } .menu_mob_box ul li a:hover, .menu_mob_box ul li a:focus { font: var(--fs300)/var(--lh300) var(--ffh); letter-spacing: var(--ls300); } .home_box_1_actor { grid-template-columns: 1fr; grid-template-rows: 1fr 100vw 50vw 100vh; grid-template-areas: "hb1a_info " "hb1a_actor " " hb1a_time " "hb1a_poster "; } .hb1a_time a, .hb2a_time a { width: 100%; } .home_box_2_actor { grid-template-columns: 1fr; grid-template-rows: 1fr 100vw 100vw 0.75fr 100vh; grid-template-areas: "hb2a_info " "hb2a_actor1 " " hb2a_actor2" "hb2a_time" "hb2a_poster"; } .hbi_boxhero strong { font: var(--fs700)/calc(var(--lh700) * 1.4) var(--ffh); letter-spacing: var(--ls700); } .hbi_boxhero p { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); } .hbi_boxhero h2 { font: var(--fs400)/calc(var(--lh400) * 0.9) var(--ffh); letter-spacing: var(--ls400); } .hbi_program { padding: var(--u62); } .home_box_redactor3 { grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 33.333vw auto; grid-template-areas: "hbr_actor1 hbr_actor2 hbr_actor3" "hbr_info hbr_info hbr_info "; } .hbr_redactor, .home-banner, .hbi_contact, .hbi_photo { display: none; } .fheader strong { font: var(--fs400)/var(--lh400) var(--ffh); letter-spacing: var(--ls400); } .fcontact strong { font: var(--fs)/var(--lh) var(--ffl); letter-spacing: var(--ls); } .flinks { flex-direction: column; } .flinks li:not(:last-child)::after { content: ""; padding-right: 0; } .contact li { margin-bottom: var(--u48); } .social { gap: var(--u62); } .home_box_info { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr auto auto; grid-template-areas: "hbi_boxhero hbi_boxhero " "hbi_program hbi_program " "hbi_date hbi_buyticket"; } } @media (max-width: 320px) { .page404 .bgcontent { padding: var(--u62); } .page404 .bgcontent h1 { font: var(--fs500)/var(--lh) var(--ffh); letter-spacing: var(--ls500); } .gallery li { width: calc(50% - var(--u24) * 1 / 2); } .pageheader h1 { font: var(--fs300)/var(--lh300) var(--ffh); letter-spacing: var(--ls300); } html { overflow-wrap: break-word; word-wrap: break-word; hyphens: auto; } .brand img { height: var(--u110); } .home-hero { min-height: calc(100vh - 40px); } .home-hero .bgcontent strong { font: var(--fs600)/calc(var(--lh600) * 1.4) var(--ffh); letter-spacing: var(--ls600); } .home-hero .bgcontent i { font: var(--fs100)/var(--lh100) var(--ffl); letter-spacing: var(--ls100); } .home-hero .bgcontent h2 { font: var(--fs300)/calc(var(--lh300) * 0.9) var(--ffh); letter-spacing: var(--ls300); } .menu_mob_box ul li a { font: var(--fs200)/var(--lh200) var(--ffhl); letter-spacing: var(--l200); } .menu_mob_box ul li a:hover, .menu_mob_box ul li a:focus { font: var(--fs200)/var(--lh200) var(--ffh); letter-spacing: var(--ls200); } .home_box_1_actor { grid-template-columns: 1fr; grid-template-rows: 1fr 100vw max-content 100vh; grid-template-areas: "hb1a_info " "hb1a_actor " "hb1a_time " "hb1a_poster"; } .hb1a_time strong, .hb2a_time strong, .hbi_date strong { margin-top: var(--u110); } .hbi_boxhero h2 { font: var(--fs300)/calc(var(--lh300) * 0.9) var(--ffh); letter-spacing: var(--ls300); } .hbi_boxhero { display: none; } .home_box_info { grid-template-columns: 1fr; grid-template-rows: auto auto auto; grid-template-areas: "hbi_program" "hbi_date " " hbi_buyticket"; } .hb1a_info h2, .hb2a_info h2, .hbr_info h2 { font: var(--fs200)/var(--lh200) var(--ffh); letter-spacing: var(--ls200); } .hb1a_info h2 i, .hb2a_info h2 i, .hbr_info h2 i { font: var(--fs)/var(--lh) var(--ffhl); letter-spacing: var(--ls); } .hm_info h2 { font: var(--fs100)/var(--lh100) var(--ffh); letter-spacing: var(--ls100); } .hm_info i { font: var(--fs)/var(--lh) var(--ffl); letter-spacing: var(--ls); } .home-news .hn_header { width: 100%; } .fmtxt h2 { font: var(--fs200)/var(--lh200) var(--ffb); letter-spacing: var(--ls200); } .current h2 { font: var(--fs200)/var(--lh200) var(--ffh); letter-spacing: var(--ls200); } .fheader strong { font: var(--fs200)/var(--lh200) var(--ffh); letter-spacing: var(--ls200); } .fheader p { font: var(--fs)/var(--lh) var(--ffl); letter-spacing: var(--ls); } }