* { margin: 0; border: 0; padding: 0; } html { min-height: 100%; } a:link { color: #66CC33; text-decoration: none; } a:visited { text-decoration: none; color: #690; } a:hover { text-decoration: underline; color: #6c3; } a:active { text-decoration: none; color: #660; } body,td,th { font: 12px/16px Georgia, "Times New Roman", Times, serif; color: #fff; } body { background-color: #000; background-image: url(../images/backdrop4.jpg); background-repeat: no-repeat; background-attachment: fixed; background-position: center center; background-size: cover; min-height: 100vh; } #container { width: 460px; max-width: calc(100vw - 40px); margin-left: 20px; } h1 { display: none; } h3 { font: 16px/20px Verdana, Arial, Helvetica, sans-serif; margin-bottom: 0px; } .header { margin: 0px 10px 5px 10px; } .mainContent { margin: 0 20px 0 20px; } .aboutPage #container { position: relative; z-index: 1; width: 350px; max-width: calc(100vw - 32px); margin-left: 18px; padding: 14px 0 34px; transform: none; transition: none; } body.aboutPage { --about-light-x: 20%; --about-light-y: 14%; --about-shadow-x: 0px; --about-shadow-y: 18px; --about-depth-x: 0px; --about-depth-y: 0px; --about-panel-tilt-x: 0deg; --about-panel-tilt-y: 0deg; position: relative; overflow-x: hidden; cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2248%22%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22drop%22%20x1%3D%2210%22%20y1%3D%224%22%20x2%3D%2234%22%20y2%3D%2242%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23fff1d9%22%2F%3E%3Cstop%20offset%3D%220.18%22%20stop-color%3D%22%23ff6b4f%22%2F%3E%3Cstop%20offset%3D%220.52%22%20stop-color%3D%22%23d80f19%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23650014%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22rim%22%20x1%3D%2212%22%20y1%3D%226%22%20x2%3D%2235%22%20y2%3D%2239%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23ffd1bd%22%2F%3E%3Cstop%20offset%3D%220.5%22%20stop-color%3D%22%23ff2b22%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%237b0016%22%2F%3E%3C%2FlinearGradient%3E%3Cfilter%20id%3D%22soft%22%20x%3D%22-60%25%22%20y%3D%22-60%25%22%20width%3D%22220%25%22%20height%3D%22220%25%22%3E%3CfeDropShadow%20dx%3D%220%22%20dy%3D%220%22%20stdDeviation%3D%222.2%22%20flood-color%3D%22%23ff1a24%22%20flood-opacity%3D%220.5%22%2F%3E%3CfeDropShadow%20dx%3D%221.4%22%20dy%3D%222%22%20stdDeviation%3D%221.15%22%20flood-color%3D%22%238a0018%22%20flood-opacity%3D%220.38%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cg%20transform%3D%22rotate(-34%2024%2024)%22%20filter%3D%22url(%23soft)%22%3E%3Cpath%20id%3D%22neon-outline%22%20d%3D%22M24%203C18.4%2013.4%2011.2%2020.1%2011.2%2029.8c0%208.2%205.6%2014.2%2012.8%2014.2s12.8-6%2012.8-14.2C36.8%2020.1%2029.6%2013.4%2024%203Z%22%20fill%3D%22none%22%20stroke%3D%22%23ff1a24%22%20stroke-width%3D%223.35%22%20stroke-linejoin%3D%22round%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.68%22%2F%3E%3Cpath%20d%3D%22M24%203C18.4%2013.4%2011.2%2020.1%2011.2%2029.8c0%208.2%205.6%2014.2%2012.8%2014.2s12.8-6%2012.8-14.2C36.8%2020.1%2029.6%2013.4%2024%203Z%22%20fill%3D%22url(%23drop)%22%20stroke%3D%22url(%23rim)%22%20stroke-width%3D%221.45%22%2F%3E%3Cpath%20d%3D%22M20.2%2013.2c2.1-4.3%204-7.1%204-7.1s-.7%208.3-5.4%2014.2c-1.1%201.4-3.1.3-2.4-1.4%201-2.4%202.2-4.2%203.8-5.7Z%22%20fill%3D%22%23fff6e7%22%20opacity%3D%220.7%22%2F%3E%3Cpath%20d%3D%22M30.6%2029.6c0%205-2.9%208.2-6.6%208.2%22%20fill%3D%22none%22%20stroke%3D%22%23ff9b6b%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.42%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") 9 7, auto; background-position: center center; background-size: cover; } body.aboutPage a, body.aboutPage area { cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2248%22%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22drop%22%20x1%3D%2210%22%20y1%3D%224%22%20x2%3D%2234%22%20y2%3D%2242%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23fff1d9%22%2F%3E%3Cstop%20offset%3D%220.18%22%20stop-color%3D%22%23ff6b4f%22%2F%3E%3Cstop%20offset%3D%220.52%22%20stop-color%3D%22%23d80f19%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23650014%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22rim%22%20x1%3D%2212%22%20y1%3D%226%22%20x2%3D%2235%22%20y2%3D%2239%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23ffd1bd%22%2F%3E%3Cstop%20offset%3D%220.5%22%20stop-color%3D%22%23ff2b22%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%237b0016%22%2F%3E%3C%2FlinearGradient%3E%3Cfilter%20id%3D%22soft%22%20x%3D%22-60%25%22%20y%3D%22-60%25%22%20width%3D%22220%25%22%20height%3D%22220%25%22%3E%3CfeDropShadow%20dx%3D%220%22%20dy%3D%220%22%20stdDeviation%3D%222.2%22%20flood-color%3D%22%23ff1a24%22%20flood-opacity%3D%220.5%22%2F%3E%3CfeDropShadow%20dx%3D%221.4%22%20dy%3D%222%22%20stdDeviation%3D%221.15%22%20flood-color%3D%22%238a0018%22%20flood-opacity%3D%220.38%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cg%20transform%3D%22rotate(-34%2024%2024)%22%20filter%3D%22url(%23soft)%22%3E%3Cpath%20id%3D%22neon-outline%22%20d%3D%22M24%203C18.4%2013.4%2011.2%2020.1%2011.2%2029.8c0%208.2%205.6%2014.2%2012.8%2014.2s12.8-6%2012.8-14.2C36.8%2020.1%2029.6%2013.4%2024%203Z%22%20fill%3D%22none%22%20stroke%3D%22%23ff1a24%22%20stroke-width%3D%223.35%22%20stroke-linejoin%3D%22round%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.68%22%2F%3E%3Cpath%20d%3D%22M24%203C18.4%2013.4%2011.2%2020.1%2011.2%2029.8c0%208.2%205.6%2014.2%2012.8%2014.2s12.8-6%2012.8-14.2C36.8%2020.1%2029.6%2013.4%2024%203Z%22%20fill%3D%22url(%23drop)%22%20stroke%3D%22url(%23rim)%22%20stroke-width%3D%221.45%22%2F%3E%3Cpath%20d%3D%22M20.2%2013.2c2.1-4.3%204-7.1%204-7.1s-.7%208.3-5.4%2014.2c-1.1%201.4-3.1.3-2.4-1.4%201-2.4%202.2-4.2%203.8-5.7Z%22%20fill%3D%22%23fff6e7%22%20opacity%3D%220.7%22%2F%3E%3Cpath%20d%3D%22M30.6%2029.6c0%205-2.9%208.2-6.6%208.2%22%20fill%3D%22none%22%20stroke%3D%22%23ff9b6b%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.42%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") 9 7, pointer; } body.aboutPage a, body.aboutPage area, body.aboutPage button, body.aboutPage [role="button"] { cursor: inherit !important; } body.aboutPage:before, body.aboutPage:after { content: ""; position: fixed; inset: 0; pointer-events: none; } body.aboutPage:before { z-index: 0; width: min(390px, 100vw); background: radial-gradient(circle at var(--about-light-x) var(--about-light-y), rgba(255, 255, 255, 0.08), transparent 26%), linear-gradient(100deg, rgba(0, 0, 0, 0.96) 0%, rgba(8, 8, 9, 0.92) 68%, rgba(0, 0, 0, 0.44) 86%, rgba(0, 0, 0, 0) 100%); box-shadow: inset -1px 0 rgba(255, 255, 255, 0.1), 28px 0 64px rgba(0, 0, 0, 0.46), 0 0 58px rgba(255, 255, 255, 0.04); } body.aboutPage:after { z-index: 0; background: radial-gradient(circle at var(--about-light-x) var(--about-light-y), rgba(255, 231, 184, 0.24) 0%, rgba(255, 255, 255, 0.14) 8%, rgba(255, 255, 255, 0.07) 18%, transparent 31%), linear-gradient(90deg, transparent 0%, transparent 34%, rgba(0, 0, 0, 0.24) 56%, rgba(0, 0, 0, 0.08) 100%); mix-blend-mode: screen; opacity: 0.82; } .aboutPage #container:before { content: ""; position: absolute; inset: 8px 0 18px 0; border-radius: 8px; background: transparent; box-shadow: none; transform: translateZ(-18px); pointer-events: none; } .aboutPage .header, .aboutPage .mainContent { position: relative; z-index: 1; } .aboutBackButton { display: inline-flex; align-items: center; gap: 7px; width: max-content; margin: 0 0 12px 0; padding: 6px 10px 6px 7px; border: 1px solid rgba(255, 216, 77, 0.36); border-radius: 6px; background: linear-gradient(145deg, rgba(255, 216, 77, 0.12), rgba(8, 8, 8, 0.42)); box-shadow: 0 0 14px rgba(255, 216, 77, 0.12), inset 0 1px rgba(255, 255, 255, 0.12); color: #ffd84d; font-size: 11px; font-weight: bold; line-height: 1; text-decoration: none; text-indent: 0; text-shadow: 0 0 8px rgba(255, 216, 77, 0.22); transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; } .aboutBackButton:hover, .aboutBackButton:focus { border-color: rgba(255, 216, 77, 0.68); box-shadow: 0 0 18px rgba(255, 216, 77, 0.2), inset 0 1px rgba(255, 255, 255, 0.18); color: #fff2a8; outline: none; transform: translateX(-1px); } .aboutPage .aboutBackButton:link, .aboutPage .aboutBackButton:visited { color: #ffd84d; } .aboutPage .aboutBackButton:hover, .aboutPage .aboutBackButton:focus { color: #fff2a8; } .aboutBackArrow { position: relative; flex: 0 0 auto; width: 16px; height: 16px; border: 1px solid rgba(255, 216, 77, 0.78); border-radius: 50%; box-shadow: 0 0 10px rgba(255, 216, 77, 0.2); } .aboutBackArrow:before { content: ""; position: absolute; left: 6px; top: 4px; width: 6px; height: 6px; border-left: 2px solid #ffd84d; border-bottom: 2px solid #ffd84d; transform: rotate(45deg); } .aboutBackArrow:after { content: ""; position: absolute; left: 5px; top: 7px; width: 7px; height: 2px; border-radius: 2px; background: #ffd84d; } .aboutPage .mainContent { width: 300px; max-width: 100%; margin: 0 auto; padding: 18px 15px 24px; border: 1px solid transparent; border-radius: 8px; isolation: isolate; overflow: visible; background: linear-gradient(142deg, rgba(255, 255, 255, 0.08), rgba(12, 12, 14, 0.22) 42%, rgba(2, 2, 2, 0.5) 100%), rgba(7, 6, 6, 0.68); box-shadow: var(--about-shadow-x) var(--about-shadow-y) 34px rgba(0, 0, 0, 0.52), 0 0 20px rgba(255, 255, 255, 0.05), inset 0 1px rgba(255, 255, 255, 0.13), inset 0 -18px 34px rgba(0, 0, 0, 0.32); transform: none; transition: box-shadow 160ms ease; -webkit-backdrop-filter: blur(2px) saturate(1.16); backdrop-filter: blur(2px) saturate(1.16); } .aboutPage .mainContent:before { content: ""; position: absolute; inset: -10px -9px -12px -9px; z-index: -1; border-radius: 12px; background: radial-gradient(circle at var(--about-light-x) var(--about-light-y), rgba(255, 255, 255, 0.16), transparent 28%), linear-gradient(145deg, rgba(255, 255, 255, 0.12), rgba(20, 20, 22, 0.26) 42%, rgba(0, 0, 0, 0.44) 100%); box-shadow: calc(var(--about-shadow-x) * 1.8) calc(var(--about-shadow-y) + 8px) 42px rgba(0, 0, 0, 0.6), inset 0 1px rgba(255, 255, 255, 0.12), inset -18px -10px 28px rgba(0, 0, 0, 0.28); transform: perspective(900px) rotateX(var(--about-panel-tilt-x)) rotateY(var(--about-panel-tilt-y)) translate3d(var(--about-depth-x), var(--about-depth-y), 0); transform-origin: 50% 30%; transition: transform 160ms ease, box-shadow 160ms ease, background-position 160ms ease; pointer-events: none; } .aboutPage h3 { color: #fff7eb; font: 18px/23px Verdana, Arial, Helvetica, sans-serif; margin-bottom: 4px; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.75), 0 0 14px rgba(255, 255, 255, 0.18), 0 0 28px rgba(255, 255, 255, 0.08); } .aboutPage p { color: rgba(246, 241, 232, 0.94); line-height: 17px; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.9), 0 0 7px rgba(255, 255, 255, 0.06); } .aboutPage a:link, .aboutPage a:visited { color: #8cff55; text-shadow: 0 0 8px rgba(102, 255, 60, 0.46); } .aboutPage a:hover, .aboutPage a:active { color: #c5ff9b; text-shadow: 0 0 8px rgba(102, 255, 60, 0.72), 0 0 18px rgba(255, 255, 255, 0.12); } @supports (height: 100dvh) { body.aboutPage { background-size: cover; } } @media (max-width: 480px) { body.aboutPage { background-size: cover; background-position: center center; } body.aboutPage:before { width: 100vw; background: radial-gradient(circle at var(--about-light-x) var(--about-light-y), rgba(255, 255, 255, 0.07), transparent 32%), linear-gradient(100deg, rgba(0, 0, 0, 0.96) 0%, rgba(9, 9, 10, 0.9) 72%, rgba(0, 0, 0, 0.72) 100%); } .aboutPage #container { width: calc(100vw - 24px); max-width: 360px; margin: 0 auto; transform: none; } .aboutPage .mainContent { width: calc(100vw - 66px); } } /* Links page uses the same dark sub-page treatment while removing the old image header. */ body.linksPage:before { width: min(700px, 100vw); background: radial-gradient(circle at var(--about-light-x) var(--about-light-y), rgba(255, 255, 255, 0.08), transparent 28%), linear-gradient(100deg, rgba(0, 0, 0, 0.96) 0%, rgba(8, 8, 9, 0.92) 76%, rgba(0, 0, 0, 0.54) 92%, rgba(0, 0, 0, 0) 100%); } .linksPage #container { width: min(650px, calc(100vw - 32px)); max-width: none; margin: 18px auto 0; padding: 14px 0 34px; } .linksPage .header { display: none; } .linksPage .mainContent { box-sizing: border-box; width: min(580px, calc(100vw - 44px)); max-width: 100%; padding: 22px clamp(16px, 3vw, 26px) 26px; text-align: left; } .linksPage .aboutBackButton { display: flex; margin: 0 0 14px 0; } .linksPage .mainContent h3 { position: relative; width: max-content; max-width: 100%; margin: 0 auto 18px; padding: 0 0 8px; color: #ffd84d; font-size: 22px; line-height: 1.12; text-align: center; text-shadow: 0 0 8px rgba(255, 216, 77, 0.42), 0 0 16px rgba(255, 26, 36, 0.24), 0 2px 0 rgba(0, 0, 0, 0.8); } .linksPage .mainContent h3:after { content: ""; position: absolute; left: 50%; bottom: 0; width: min(110px, 100%); height: 2px; transform: translateX(-50%); border-radius: 2px; background: linear-gradient(90deg, transparent 0%, rgba(255, 26, 36, 0.62) 18%, rgba(255, 216, 77, 0.82) 50%, rgba(255, 26, 36, 0.62) 82%, transparent 100%); box-shadow: 0 0 10px rgba(255, 26, 36, 0.28); } .linksPage .mainContent ul { box-sizing: border-box; margin: 0 auto 18px; padding-left: 21px; max-width: 100%; } .linksPage .mainContent li { margin-bottom: 10px; color: rgba(246, 241, 232, 0.96); line-height: 1.42; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.9); } .linksPage .mainContent img { display: block; max-width: 100%; height: auto; margin: 16px auto 0; } .linksPage .mainContent a[href="luchadores.htm"] img { box-sizing: border-box; border: 2px solid rgba(255, 26, 36, 0.84) !important; border-radius: 5px; box-shadow: 0 0 8px rgba(255, 26, 36, 0.58), 0 0 18px rgba(255, 26, 36, 0.36), inset 0 0 10px rgba(255, 26, 36, 0.2); filter: saturate(1.03) contrast(1.02); } .linksPage .mainContent font { display: block; margin-top: 6px; color: #ffd84d !important; line-height: 1.35; text-align: center; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.9), 0 0 8px rgba(255, 216, 77, 0.18); } body.linksPage, body.linksPage *, body.linksPage a, body.linksPage area, body.linksPage img { cursor: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2248%22%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22drop%22%20x1%3D%2210%22%20y1%3D%224%22%20x2%3D%2234%22%20y2%3D%2242%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23fff1d9%22%2F%3E%3Cstop%20offset%3D%220.18%22%20stop-color%3D%22%23ff6b4f%22%2F%3E%3Cstop%20offset%3D%220.52%22%20stop-color%3D%22%23d80f19%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23650014%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22rim%22%20x1%3D%2212%22%20y1%3D%226%22%20x2%3D%2235%22%20y2%3D%2239%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23ffd1bd%22%2F%3E%3Cstop%20offset%3D%220.5%22%20stop-color%3D%22%23ff2b22%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%237b0016%22%2F%3E%3C%2FlinearGradient%3E%3Cfilter%20id%3D%22soft%22%20x%3D%22-60%25%22%20y%3D%22-60%25%22%20width%3D%22220%25%22%20height%3D%22220%25%22%3E%3CfeDropShadow%20dx%3D%220%22%20dy%3D%220%22%20stdDeviation%3D%222.2%22%20flood-color%3D%22%23ff1a24%22%20flood-opacity%3D%220.5%22%2F%3E%3CfeDropShadow%20dx%3D%221.4%22%20dy%3D%222%22%20stdDeviation%3D%221.15%22%20flood-color%3D%22%238a0018%22%20flood-opacity%3D%220.38%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cg%20transform%3D%22rotate(-34%2024%2024)%22%20filter%3D%22url(%23soft)%22%3E%3Cpath%20id%3D%22neon-outline%22%20d%3D%22M24%203C18.4%2013.4%2011.2%2020.1%2011.2%2029.8c0%208.2%205.6%2014.2%2012.8%2014.2s12.8-6%2012.8-14.2C36.8%2020.1%2029.6%2013.4%2024%203Z%22%20fill%3D%22none%22%20stroke%3D%22%23ff1a24%22%20stroke-width%3D%223.35%22%20stroke-linejoin%3D%22round%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.68%22%2F%3E%3Cpath%20d%3D%22M24%203C18.4%2013.4%2011.2%2020.1%2011.2%2029.8c0%208.2%205.6%2014.2%2012.8%2014.2s12.8-6%2012.8-14.2C36.8%2020.1%2029.6%2013.4%2024%203Z%22%20fill%3D%22url(%23drop)%22%20stroke%3D%22url(%23rim)%22%20stroke-width%3D%221.45%22%2F%3E%3Cpath%20d%3D%22M20.2%2013.2c2.1-4.3%204-7.1%204-7.1s-.7%208.3-5.4%2014.2c-1.1%201.4-3.1.3-2.4-1.4%201-2.4%202.2-4.2%203.8-5.7Z%22%20fill%3D%22%23fff6e7%22%20opacity%3D%220.7%22%2F%3E%3Cpath%20d%3D%22M30.6%2029.6c0%205-2.9%208.2-6.6%208.2%22%20fill%3D%22none%22%20stroke%3D%22%23ff9b6b%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.42%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") 9 7, auto !important; } @media (max-width: 560px) { .linksPage #container { width: calc(100vw - 18px); margin: 0 auto; } .linksPage .mainContent { width: calc(100vw - 28px); padding: 18px 14px 24px; } } /* Gallery page uses the same 2026 sub-page treatment as About, with a wider responsive panel. */ body.galleryPage:before { width: min(880px, 100vw); background: radial-gradient(circle at var(--about-light-x) var(--about-light-y), rgba(255, 255, 255, 0.09), transparent 30%), linear-gradient(100deg, rgba(0, 0, 0, 0.96) 0%, rgba(8, 8, 9, 0.93) 74%, rgba(0, 0, 0, 0.56) 90%, rgba(0, 0, 0, 0) 100%); } .galleryPage #container { width: min(820px, calc(100vw - 32px)); max-width: none; margin: 18px auto 0; padding: 14px 0 34px; } .galleryPage .mainContent { box-sizing: border-box; width: min(740px, calc(100vw - 48px)); max-width: 100%; padding: 20px clamp(14px, 3vw, 24px) 28px; text-align: center; } .galleryPage .aboutBackButton { display: flex; margin: 0 0 14px 0; } .galleryPage .mainContent h3 { position: relative; width: max-content; max-width: 100%; margin: 0 auto 16px; padding: 0 0 9px; color: #ffd84d; font-size: 24px; line-height: 1.1; text-align: center; text-shadow: 0 0 8px rgba(255, 216, 77, 0.45), 0 0 18px rgba(255, 26, 36, 0.28), 0 2px 0 rgba(0, 0, 0, 0.8); } .galleryPage .mainContent h3:after { content: ""; position: absolute; left: 50%; bottom: 0; width: min(120px, 100%); height: 2px; transform: translateX(-50%); border-radius: 2px; background: linear-gradient(90deg, transparent 0%, rgba(255, 26, 36, 0.72) 18%, rgba(255, 216, 77, 0.86) 50%, rgba(255, 26, 36, 0.72) 82%, transparent 100%); box-shadow: 0 0 12px rgba(255, 26, 36, 0.35); } .galleryPage .mainContent p { max-width: 650px; margin: 0 auto 16px; text-align: center; text-indent: 0; line-height: 1.45; } .galleryPage .mainContent h3 + p { color: #ffd84d; font-weight: 700; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.95), 0 0 1px rgba(255, 216, 77, 0.22); -webkit-font-smoothing: antialiased; text-rendering: geometricPrecision; } .galleryPage .mainContent div[align="center"], .galleryPage .mainContent center { max-width: 100%; text-align: center; } .galleryPage .mainContent table { max-width: 100%; margin: 0 auto; border-collapse: separate; border-spacing: clamp(12px, 3vw, 30px); } .galleryPage .mainContent td { text-align: center; vertical-align: bottom; } .galleryPage .mainContent img { height: auto; max-width: 100%; image-rendering: auto; } .galleryPage .mainContent img[src*="images/photos/"] { width: min(150px, 42vw); aspect-ratio: 3 / 2; height: auto; object-fit: cover; object-position: center center; } .galleryPage .mainContent a img { box-sizing: border-box; border: 1px solid rgba(255, 26, 36, 0.66) !important; border-radius: 5px; box-shadow: 0 0 8px rgba(255, 26, 36, 0.46), 0 0 18px rgba(255, 26, 36, 0.26), inset 0 0 10px rgba(255, 26, 36, 0.14); filter: saturate(1.04) contrast(1.03); } .galleryPage .mainContent a:hover img, .galleryPage .mainContent a:focus img { box-shadow: 0 0 10px rgba(255, 42, 54, 0.62), 0 0 24px rgba(255, 26, 36, 0.37), inset 0 0 12px rgba(255, 26, 36, 0.19); } .galleryPage .mainContent .gallery-photo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 150px)); justify-content: center; align-items: start; gap: clamp(12px, 3vw, 30px); margin: 24px auto 30px; } .galleryPage .mainContent .gallery-photo-grid > a { display: block; min-width: 0; } .galleryPage .mainContent .gallery-photo-grid img { display: block; width: 100%; } .galleryPage .mainContent font { line-height: 1.35; } @media (max-width: 700px) { .galleryPage #container { width: calc(100vw - 18px); max-width: none; margin: 0 auto; } .galleryPage .mainContent { width: calc(100vw - 28px); padding: 16px 12px 24px; } .galleryPage .mainContent table, .galleryPage .mainContent tbody { display: block; width: 100%; } .galleryPage .mainContent table { border-spacing: 0; } .galleryPage .mainContent tr { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: 12px; width: 100%; margin-bottom: 12px; } .galleryPage .mainContent td { display: block; min-width: 0; padding: 0; } .galleryPage .mainContent td a { display: block; min-height: 44px; } .galleryPage .mainContent td img { width: 100%; } } /* Reviews page uses the same 2026 sub-page treatment as the finished sub websites. */ body.reviewsPage:before { width: min(920px, 100vw); background: radial-gradient(circle at var(--about-light-x) var(--about-light-y), rgba(255, 255, 255, 0.09), transparent 30%), linear-gradient(100deg, rgba(0, 0, 0, 0.96) 0%, rgba(8, 8, 9, 0.93) 76%, rgba(0, 0, 0, 0.58) 91%, rgba(0, 0, 0, 0) 100%); } .reviewsPage #container { width: min(860px, calc(100vw - 32px)); max-width: none; margin: 18px auto 0; padding: 14px 0 34px; } .reviewsPage .header { display: none; } .reviewsPage .mainContent { box-sizing: border-box; width: min(780px, calc(100vw - 48px)); max-width: 100%; margin: 0 auto; padding: 22px clamp(16px, 3vw, 28px) 28px; font-size: 13px; line-height: 1.48; text-align: left; } .reviewsPage .mainContent + .mainContent { margin-top: 18px; } .reviewsPage .aboutBackButton { display: flex; margin: 0 0 14px 0; } .reviewsPage .mainContent h3 { position: relative; width: max-content; max-width: 100%; margin: 0 auto 18px; padding: 0 0 8px; color: #ffd84d; font-size: 24px; line-height: 1.12; text-align: center; text-shadow: 0 0 8px rgba(255, 216, 77, 0.44), 0 0 18px rgba(255, 26, 36, 0.27), 0 2px 0 rgba(0, 0, 0, 0.82); } .reviewsPage .mainContent h3:after { content: ""; position: absolute; left: 50%; bottom: 0; width: min(130px, 100%); height: 2px; transform: translateX(-50%); border-radius: 2px; background: linear-gradient(90deg, transparent 0%, rgba(255, 26, 36, 0.66) 18%, rgba(255, 216, 77, 0.86) 50%, rgba(255, 26, 36, 0.66) 82%, transparent 100%); box-shadow: 0 0 12px rgba(255, 26, 36, 0.32); } .reviewsPage .mainContent h3 font, .reviewsPage .mainContent h3 u { color: inherit !important; text-decoration: none; } .reviewsPage .mainContent p { margin: 0 0 14px; color: rgba(246, 241, 232, 0.96); line-height: 1.48; text-indent: 0; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.92); } .reviewsPage .mainContent font { line-height: 1.45; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.92); } .reviewsPage .mainContent font[color="Gold"], .reviewsPage .mainContent font[color="gold"] { color: #ffd84d !important; font-family: Verdana, Arial, Helvetica, sans-serif !important; font-weight: 700; text-shadow: 0 0 7px rgba(255, 216, 77, 0.3), 0 1px 0 rgba(0, 0, 0, 0.92); } .reviewsPage .mainContent font[color=green], .reviewsPage .mainContent font[color="green"] { color: #9dff6d !important; text-shadow: 0 0 8px rgba(102, 255, 60, 0.36); } .reviewsPage .mainContent font[color="$680000"] { display: block; color: #ffd84d !important; font-size: 11px; line-height: 1.35; text-align: center; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.9), 0 0 8px rgba(255, 216, 77, 0.18); } body.reviewsPage *, body.reviewsPage a, body.reviewsPage area, body.reviewsPage img { cursor: inherit !important; } @media (max-width: 700px) { .reviewsPage #container { width: calc(100vw - 18px); margin: 0 auto; } .reviewsPage .mainContent { width: calc(100vw - 28px); padding: 18px 13px 24px; font-size: 12px; } .reviewsPage .mainContent h3 { font-size: 22px; } } /* Trailer page keeps the video prominent while matching the finished sub-site look. */ body.trailerPage { min-height: 100vh; min-height: 100svh; min-height: 100dvh; } body.trailerPage:before { width: min(1120px, 100vw); background: radial-gradient(circle at var(--about-light-x) var(--about-light-y), rgba(255, 255, 255, 0.09), transparent 30%), linear-gradient(100deg, rgba(0, 0, 0, 0.96) 0%, rgba(8, 8, 9, 0.93) 78%, rgba(0, 0, 0, 0.56) 92%, rgba(0, 0, 0, 0) 100%); } .trailerPage #container { width: min(1060px, calc(100vw - 32px)); max-width: none; margin: 18px auto 0; padding: 14px 0 34px; } .trailerPage .mainContent { box-sizing: border-box; width: min(980px, calc(100vw - 48px)); max-width: 100%; margin: 0 auto; padding: 20px clamp(14px, 2.6vw, 26px) 26px; text-align: center; } .trailerPage .aboutBackButton { display: flex; margin: 0 0 14px 0; } .trailerPage .mainContent h3 { position: relative; width: max-content; max-width: 100%; margin: 0 auto 18px; padding: 0 0 9px; color: #ffd84d; font-size: 26px; line-height: 1.08; text-align: center; text-shadow: 0 0 8px rgba(255, 216, 77, 0.46), 0 0 18px rgba(255, 26, 36, 0.3), 0 2px 0 rgba(0, 0, 0, 0.85); } .trailerPage .mainContent h3:after { content: ""; position: absolute; left: 50%; bottom: 0; width: min(130px, 100%); height: 2px; transform: translateX(-50%); border-radius: 2px; background: linear-gradient(90deg, transparent 0%, rgba(255, 26, 36, 0.7) 18%, rgba(255, 216, 77, 0.88) 50%, rgba(255, 26, 36, 0.7) 82%, transparent 100%); box-shadow: 0 0 12px rgba(255, 26, 36, 0.35); } .trailerFrame { position: relative; width: 100%; aspect-ratio: 16 / 9; min-height: 220px; overflow: hidden; border: 1px solid rgba(255, 26, 36, 0.72); border-radius: 6px; background: #000; box-shadow: 0 0 10px rgba(255, 26, 36, 0.52), 0 0 26px rgba(255, 26, 36, 0.28), 0 18px 38px rgba(0, 0, 0, 0.62), inset 0 0 14px rgba(255, 26, 36, 0.16); filter: saturate(1.04) contrast(1.03); } .trailerFrame:before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(circle at var(--about-light-x) var(--about-light-y), rgba(255, 255, 255, 0.12), transparent 24%), linear-gradient(120deg, rgba(255, 255, 255, 0.08), transparent 34%, rgba(255, 26, 36, 0.06) 100%); mix-blend-mode: screen; opacity: 0.58; } .trailerFrame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #000; } .trailerFrameLaunchOnly iframe { display: none; } .trailerLaunch { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; padding: 24px; background: linear-gradient(110deg, rgba(0, 0, 0, 0.76), rgba(0, 0, 0, 0.52)), url("../Lynch-Mil-ultra.jpg") center / cover no-repeat; } .trailerLaunch[hidden] { display: none; } .trailerLaunchGlow { position: absolute; inset: 0; background: radial-gradient(circle at 50% 45%, rgba(255, 216, 77, 0.15), transparent 26%), radial-gradient(circle at 50% 52%, rgba(255, 26, 36, 0.22), transparent 36%); pointer-events: none; } .trailerLaunchButton { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 15px 24px; border: 1px solid rgba(255, 216, 77, 0.7); border-radius: 6px; background: linear-gradient(135deg, rgba(255, 216, 77, 0.22), rgba(255, 26, 36, 0.36)); box-shadow: 0 0 18px rgba(255, 26, 36, 0.48), 0 0 34px rgba(255, 216, 77, 0.2), inset 0 1px rgba(255, 255, 255, 0.18); color: #ffd84d !important; font-size: 18px; font-weight: 900; line-height: 1; text-decoration: none; text-shadow: 0 0 8px rgba(255, 216, 77, 0.38), 0 2px 0 rgba(0, 0, 0, 0.86); } .trailerLaunchButton:before { content: ""; width: 0; height: 0; margin-right: 10px; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 12px solid currentColor; filter: drop-shadow(0 0 8px rgba(255, 216, 77, 0.45)); } .trailerLaunchButton:hover, .trailerLaunchButton:focus { color: #b9ff72 !important; border-color: rgba(255, 26, 36, 0.86); box-shadow: 0 0 22px rgba(255, 26, 36, 0.6), 0 0 42px rgba(255, 216, 77, 0.24), inset 0 1px rgba(255, 255, 255, 0.22); } body.trailerPage *, body.trailerPage a, body.trailerPage iframe { cursor: inherit !important; } @media (max-width: 700px) { .trailerPage #container { width: calc(100vw - 18px); margin: 0 auto; } .trailerPage .mainContent { width: calc(100vw - 28px); padding: 16px 12px 22px; } .trailerPage .mainContent h3 { font-size: 23px; } .trailerFrame { min-height: 0; } } /* Shared readability pass for the finished sub websites. */ body.aboutPage { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; letter-spacing: 0; -webkit-font-smoothing: antialiased; text-rendering: geometricPrecision; } .aboutPage .mainContent { color: rgba(246, 241, 232, 0.97); font-size: 13px; line-height: 1.55; } .aboutPage .mainContent p, .aboutPage .mainContent li, .aboutPage .mainContent td, .aboutPage .mainContent div, .aboutPage .mainContent center, .aboutPage .mainContent font { font-family: Verdana, Arial, Helvetica, sans-serif !important; font-size: 13px; line-height: 1.55; letter-spacing: 0; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.95), 0 0 5px rgba(255, 255, 255, 0.04); } .aboutPage .mainContent p, .aboutPage .mainContent li, .aboutPage .mainContent td, .aboutPage .mainContent div, .aboutPage .mainContent center { color: rgba(246, 241, 232, 0.97); } .aboutPage .mainContent a { font-weight: 700; } .aboutPage .mainContent font[color="Gold"], .aboutPage .mainContent font[color="gold"] { color: #ffd84d !important; font-weight: 700; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.95), 0 0 7px rgba(255, 216, 77, 0.32); } .aboutPage .mainContent font[color="Red"], .aboutPage .mainContent font[color="red"] { color: #ffd84d !important; } .aboutPage .mainContent font[color="green"], .aboutPage .mainContent font[color=green] { color: #9dff6d !important; } .reviewsPage .mainContent, .reviewsPage .mainContent p, .reviewsPage .mainContent font { font-size: 13px; line-height: 1.58; } @media (prefers-reduced-motion: reduce), (pointer: coarse) { .aboutPage #container { transform: none; transition: none; } } p { margin-bottom: 10px; text-indent: 20px; color: #CCC; } ul { padding-left: 25px; } /* Reviews image placement restored while preserving original image proportions. */ .reviewsPage .mainContent h3, .reviewsPage .mainContent h3 font, .reviewsPage .mainContent h3 u { font-size: 30px !important; line-height: 1.08; } .reviewsPage .mainContent h3.reviewsSectionTitle { margin-top: 0; } .reviewsPage .mainContent img { height: auto; max-width: 100%; object-fit: contain; object-position: center center; } .reviewsPosterPair { display: flex; gap: 16px; align-items: flex-start; justify-content: center; width: min(560px, 100%); max-width: 100%; margin: 0 auto 22px; } .reviewsPosterPair .reviewsPosterImage { display: block; flex: 1 1 0; min-width: 0; width: calc((100% - 16px) / 2); max-width: 272px; height: auto; margin: 0; } .reviewsPage .mainContent img[src="Shadowland7.jpg"] { float: right; width: min(260px, 44vw); max-width: 48%; margin: 4px 0 16px 20px; } .reviewsPage .mainContent img[src="Trophy-Presentation-2.jpg"], .reviewsPage .mainContent img[src="Lynch-Mil-ultra.jpg"], .reviewsPage .mainContent img[src="ImagenRedCarpet-2k.jpg"] { display: block; margin: 16px auto; } .reviewsPage .mainContent img[src="ImagenRedCarpet-2k.jpg"] { width: min(85%, 620px); } @media (max-width: 520px) { .reviewsPosterPair { flex-direction: column; align-items: center; gap: 12px; } .reviewsPosterPair .reviewsPosterImage { width: min(280px, 100%); max-width: 100%; } .reviewsPage .mainContent img[src="Shadowland7.jpg"] { float: none; display: block; width: min(280px, 100%); max-width: 100%; margin: 4px auto 18px; } .reviewsPage .mainContent img[src="Trophy-Presentation-2.jpg"], .reviewsPage .mainContent img[src="Lynch-Mil-ultra.jpg"], .reviewsPage .mainContent img[src="ImagenRedCarpet-2k.jpg"] { width: 100%; max-width: 100%; } } /* Reviews red neon image border. */ .reviewsPage .mainContent img { box-sizing: border-box; border: 1px solid rgba(255, 26, 36, 0.7) !important; border-radius: 5px; box-shadow: 0 0 8px rgba(255, 26, 36, 0.42), 0 0 20px rgba(255, 26, 36, 0.24), inset 0 0 10px rgba(255, 26, 36, 0.12); } /* Make the Lynch and Mil reviews image visibly higher quality. */ .reviewsPage .mainContent img[src="Lynch-Mil-ultra.jpg"] { width: min(92%, 680px); filter: saturate(1.08) contrast(1.08) brightness(1.02); } /* Unified 2026 movie-site type, color, link, and effect system. */ :root { --mm-font-display: "Trebuchet MS", "Segoe UI", Arial, Helvetica, sans-serif; --mm-font-body: "Segoe UI", Inter, "Helvetica Neue", Arial, Helvetica, sans-serif; --mm-gold: #ffd84d; --mm-gold-soft: #fff0a8; --mm-red: #ff1a24; --mm-red-soft: rgba(255, 26, 36, 0.42); --mm-copy: rgba(255, 249, 239, 0.98); --mm-muted-copy: rgba(246, 241, 232, 0.94); --mm-link: #b9ff72; --mm-link-hover: #fff0a8; } body, td, th { font-family: var(--mm-font-body); font-size: 14px; line-height: 1.6; letter-spacing: 0; -webkit-font-smoothing: antialiased; text-rendering: geometricPrecision; } p, li, td, th, div, center, font { letter-spacing: 0; } body.aboutPage { font-family: var(--mm-font-body); font-size: 14px; color: var(--mm-copy); } .aboutBackButton, .aboutBackButton:link, .aboutBackButton:visited { font-family: var(--mm-font-body); font-size: 12px; font-weight: 800; color: var(--mm-gold); text-shadow: 0 0 8px rgba(255, 216, 77, 0.26), 0 1px 0 rgba(0, 0, 0, 0.92); } .aboutPage .mainContent, .linksPage .mainContent, .galleryPage .mainContent, .reviewsPage .mainContent, .trailerPage .mainContent { font-family: var(--mm-font-body); color: var(--mm-copy); font-size: 14px; line-height: 1.64; border-color: rgba(255, 216, 77, 0.14); box-shadow: var(--about-shadow-x, 0px) var(--about-shadow-y, 18px) 34px rgba(0, 0, 0, 0.54), 0 0 22px rgba(255, 216, 77, 0.06), 0 0 26px rgba(255, 26, 36, 0.08), inset 0 1px rgba(255, 255, 255, 0.13), inset 0 -18px 34px rgba(0, 0, 0, 0.34); } .aboutPage .mainContent p, .aboutPage .mainContent li, .aboutPage .mainContent td, .aboutPage .mainContent th, .aboutPage .mainContent div, .aboutPage .mainContent center, .aboutPage .mainContent font, .linksPage .mainContent li, .linksPage .mainContent p, .linksPage .mainContent td, .linksPage .mainContent font, .galleryPage .mainContent p, .galleryPage .mainContent td, .galleryPage .mainContent font, .reviewsPage .mainContent p, .reviewsPage .mainContent li, .reviewsPage .mainContent td, .reviewsPage .mainContent font, .trailerPage .mainContent p, .trailerPage .mainContent td, .trailerPage .mainContent font { font-family: var(--mm-font-body) !important; font-size: 14px !important; line-height: 1.64; color: var(--mm-copy); letter-spacing: 0; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.96), 0 0 5px rgba(255, 255, 255, 0.06); } .aboutPage h1, .aboutPage h2, .aboutPage h3, .linksPage .mainContent h3, .galleryPage .mainContent h3, .reviewsPage .mainContent h3, .trailerPage .mainContent h3, .aboutPage .mainContent h3 font, .aboutPage .mainContent h3 u { font-family: var(--mm-font-display) !important; font-weight: 900; letter-spacing: 0; color: var(--mm-gold) !important; text-decoration: none; text-shadow: 0 0 8px rgba(255, 216, 77, 0.46), 0 0 18px rgba(255, 26, 36, 0.28), 0 2px 0 rgba(0, 0, 0, 0.86); } .aboutPage h3 { font-size: 20px; line-height: 1.2; } .linksPage .mainContent h3 { font-size: 24px; line-height: 1.12; } .galleryPage .mainContent h3 { font-size: 27px; line-height: 1.1; } .reviewsPage .mainContent h3, .reviewsPage .mainContent h3 font, .reviewsPage .mainContent h3 u { font-size: 31px !important; line-height: 1.1; } .trailerPage .mainContent h3 { font-size: 28px; line-height: 1.08; } .aboutPage .mainContent h3:after, .linksPage .mainContent h3:after, .galleryPage .mainContent h3:after, .reviewsPage .mainContent h3:after, .trailerPage .mainContent h3:after { background: linear-gradient(90deg, transparent 0%, rgba(255, 26, 36, 0.7) 18%, rgba(255, 216, 77, 0.9) 50%, rgba(255, 26, 36, 0.7) 82%, transparent 100%); box-shadow: 0 0 12px rgba(255, 26, 36, 0.34), 0 0 10px rgba(255, 216, 77, 0.18); } .aboutPage .mainContent a, .aboutPage .mainContent a:link, .aboutPage .mainContent a:visited, .linksPage .mainContent a, .linksPage .mainContent a:link, .linksPage .mainContent a:visited, .galleryPage .mainContent a, .galleryPage .mainContent a:link, .galleryPage .mainContent a:visited, .reviewsPage .mainContent a, .reviewsPage .mainContent a:link, .reviewsPage .mainContent a:visited, .trailerPage .mainContent a, .trailerPage .mainContent a:link, .trailerPage .mainContent a:visited { font-family: var(--mm-font-body) !important; font-size: inherit; font-weight: 800; color: var(--mm-link) !important; text-decoration: none; text-shadow: 0 0 8px rgba(121, 255, 82, 0.38), 0 1px 0 rgba(0, 0, 0, 0.95); transition: color 160ms ease, text-shadow 160ms ease; } .aboutPage .mainContent a:hover, .aboutPage .mainContent a:focus, .linksPage .mainContent a:hover, .linksPage .mainContent a:focus, .galleryPage .mainContent a:hover, .galleryPage .mainContent a:focus, .reviewsPage .mainContent a:hover, .reviewsPage .mainContent a:focus, .trailerPage .mainContent a:hover, .trailerPage .mainContent a:focus { color: var(--mm-link-hover) !important; text-decoration: none; text-shadow: 0 0 8px rgba(255, 216, 77, 0.5), 0 0 18px rgba(255, 26, 36, 0.26), 0 1px 0 rgba(0, 0, 0, 0.95); } .aboutPage .mainContent font[color="Gold"], .aboutPage .mainContent font[color="gold"], .reviewsPage .mainContent font[color="Gold"], .reviewsPage .mainContent font[color="gold"] { color: var(--mm-gold) !important; font-family: var(--mm-font-display) !important; font-weight: 900; text-shadow: 0 0 7px rgba(255, 216, 77, 0.34), 0 0 14px rgba(255, 26, 36, 0.18), 0 1px 0 rgba(0, 0, 0, 0.95); } .aboutPage .mainContent font[color="Red"], .aboutPage .mainContent font[color="red"], .reviewsPage .mainContent font[color="$680000"] { color: var(--mm-gold) !important; } .aboutPage .mainContent font[color="green"], .aboutPage .mainContent font[color=green], .reviewsPage .mainContent font[color="green"], .reviewsPage .mainContent font[color=green] { color: var(--mm-link) !important; } @media (max-width: 560px) { body, td, th, body.aboutPage, .aboutPage .mainContent, .linksPage .mainContent, .galleryPage .mainContent, .reviewsPage .mainContent, .trailerPage .mainContent, .aboutPage .mainContent p, .aboutPage .mainContent li, .aboutPage .mainContent td, .aboutPage .mainContent th, .aboutPage .mainContent div, .aboutPage .mainContent center, .aboutPage .mainContent font, .linksPage .mainContent li, .linksPage .mainContent p, .linksPage .mainContent td, .linksPage .mainContent font, .galleryPage .mainContent p, .galleryPage .mainContent td, .galleryPage .mainContent font, .reviewsPage .mainContent p, .reviewsPage .mainContent li, .reviewsPage .mainContent td, .reviewsPage .mainContent font, .trailerPage .mainContent p, .trailerPage .mainContent td, .trailerPage .mainContent font { font-size: 13.5px !important; line-height: 1.6; } .aboutPage h3 { font-size: 19px; } .linksPage .mainContent h3, .galleryPage .mainContent h3 { font-size: 23px; } .reviewsPage .mainContent h3, .reviewsPage .mainContent h3 font, .reviewsPage .mainContent h3 u, .trailerPage .mainContent h3 { font-size: 25px !important; } } /* Unified typography for older pages that already use the shared stylesheet. */ body:not(.aboutPage) .mainContent, body:not(.aboutPage) #container, body:not(.aboutPage) p, body:not(.aboutPage) li, body:not(.aboutPage) td, body:not(.aboutPage) th, body:not(.aboutPage) div, body:not(.aboutPage) center, body:not(.aboutPage) font { font-family: var(--mm-font-body) !important; font-size: 14px; line-height: 1.62; letter-spacing: 0; } body:not(.aboutPage) h1, body:not(.aboutPage) h2, body:not(.aboutPage) h3, body:not(.aboutPage) h4 { font-family: var(--mm-font-display) !important; font-weight: 900; font-size: 22px; line-height: 1.16; letter-spacing: 0; color: var(--mm-gold) !important; text-shadow: 0 0 8px rgba(255, 216, 77, 0.44), 0 0 18px rgba(255, 26, 36, 0.26), 0 2px 0 rgba(0, 0, 0, 0.82); } body:not(.aboutPage) a, body:not(.aboutPage) a:link, body:not(.aboutPage) a:visited { font-family: var(--mm-font-body) !important; font-weight: 800; color: var(--mm-link) !important; text-decoration: none; text-shadow: 0 0 8px rgba(121, 255, 82, 0.34), 0 1px 0 rgba(0, 0, 0, 0.82); } body:not(.aboutPage) a:hover, body:not(.aboutPage) a:focus { color: var(--mm-link-hover) !important; text-shadow: 0 0 8px rgba(255, 216, 77, 0.5), 0 0 18px rgba(255, 26, 36, 0.24), 0 1px 0 rgba(0, 0, 0, 0.9); } @media (max-width: 560px) { body:not(.aboutPage) .mainContent, body:not(.aboutPage) #container, body:not(.aboutPage) p, body:not(.aboutPage) li, body:not(.aboutPage) td, body:not(.aboutPage) th, body:not(.aboutPage) div, body:not(.aboutPage) center, body:not(.aboutPage) font { font-size: 13.5px; line-height: 1.6; } body:not(.aboutPage) h1, body:not(.aboutPage) h2, body:not(.aboutPage) h3, body:not(.aboutPage) h4 { font-size: 20px; } } /* Luchadores gallery: brings the legacy roster into the main cinematic site. */ body.luchadoresPage:before { width: min(1120px, 100vw); background: radial-gradient(circle at var(--about-light-x) var(--about-light-y), rgba(255, 255, 255, 0.09), transparent 28%), linear-gradient(100deg, rgba(0, 0, 0, 0.97) 0%, rgba(8, 8, 9, 0.94) 78%, rgba(0, 0, 0, 0.58) 94%, rgba(0, 0, 0, 0) 100%); } .luchadoresPage #container { width: min(1060px, calc(100vw - 32px)); max-width: none; margin: 18px auto 0; padding: 14px 0 42px; } .luchadoresPage .mainContent { box-sizing: border-box; width: min(980px, calc(100vw - 48px)); max-width: 100%; padding: 22px clamp(18px, 4vw, 38px) 34px; text-align: left; -webkit-backdrop-filter: none; backdrop-filter: none; } .luchadoresPage .aboutBackButton { display: flex; margin: 0 0 16px; } .luchadoresPage .mainContent, .luchadoresPage .mainContent p, .luchadoresPage .mainContent div, .luchadoresPage .mainContent center, .luchadoresPage .mainContent font { font-family: var(--mm-font-body) !important; font-size: 14px !important; line-height: 1.64; color: var(--mm-copy) !important; } .luchadoresPage .mainContent p { text-indent: 0; } .luchadoresHero { margin: 0 0 26px; text-align: center; } .luchadoresPage .mainContent .luchadoresEyebrow { margin: 0 0 5px; color: var(--mm-link) !important; font-size: 11px !important; font-weight: 900; letter-spacing: 0.18em; text-transform: uppercase; text-shadow: 0 0 10px rgba(121, 255, 82, 0.32); } .luchadoresPage .luchadoresHero h3 { position: relative; width: max-content; max-width: 100%; margin: 0 auto 12px; padding: 0 0 11px; font-size: clamp(28px, 4vw, 38px) !important; line-height: 1.08; text-align: center; } .luchadoresPage .luchadoresHero h3:after { content: ""; position: absolute; left: 50%; bottom: 0; width: min(220px, 80%); height: 2px; transform: translateX(-50%); border-radius: 2px; background: linear-gradient(90deg, transparent, rgba(255, 26, 36, 0.78) 20%, rgba(255, 216, 77, 0.94) 50%, rgba(255, 26, 36, 0.78) 80%, transparent); box-shadow: 0 0 12px rgba(255, 26, 36, 0.38), 0 0 10px rgba(255, 216, 77, 0.2); } .luchadoresPage .mainContent .luchadoresPdf { margin: 0 0 16px; font-size: 12px !important; text-align: center; } .luchadoresHero figure { margin: 0; } .luchadoresHero img { display: block; box-sizing: border-box; width: min(820px, 100%); height: auto; margin: 0 auto; border: 2px solid rgba(255, 26, 36, 0.86); border-radius: 7px; box-shadow: 0 0 9px rgba(255, 26, 36, 0.62), 0 0 24px rgba(255, 26, 36, 0.32), inset 0 0 12px rgba(255, 216, 77, 0.12); filter: saturate(1.04) contrast(1.03); } .luchadoresHero figcaption { margin-top: 9px; color: rgba(246, 241, 232, 0.74); font-size: 11px; line-height: 1.45; text-align: center; } .luchadoresPage .mainContent .luchadoresIntro { max-width: 860px; margin: 0 auto 26px; color: rgba(246, 241, 232, 0.96) !important; font-size: 15px !important; line-height: 1.7; text-align: center; } .luchadoresPage .mainContent > div { box-sizing: border-box; min-height: 150px; margin: 0 0 18px; padding: 18px 20px; border: 1px solid rgba(255, 216, 77, 0.15); border-radius: 7px; background: linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(3, 3, 3, 0.38)); box-shadow: inset 0 1px rgba(255, 255, 255, 0.06), 0 10px 24px rgba(0, 0, 0, 0.2); } .luchadoresPage .mainContent > div h3 { position: relative; margin: 0 0 14px; padding-bottom: 7px; font-size: 23px !important; line-height: 1.15; text-align: center; } .luchadoresPage .mainContent > div h3:after { content: ""; position: absolute; left: 50%; bottom: 0; width: min(150px, 70%); height: 1px; transform: translateX(-50%); background: linear-gradient(90deg, transparent, rgba(255, 26, 36, 0.7), rgba(255, 216, 77, 0.75), rgba(255, 26, 36, 0.7), transparent); } .luchadoresPage .mainContent img[align="left"] { display: block; box-sizing: border-box; float: left; width: clamp(120px, 18vw, 170px) !important; max-width: 32%; height: auto; margin: 0 18px 10px 0 !important; border: 2px solid rgba(255, 26, 36, 0.78); border-radius: 6px; box-shadow: 0 0 8px rgba(255, 26, 36, 0.5), 0 0 18px rgba(255, 26, 36, 0.2); filter: saturate(1.03) contrast(1.02); } .luchadoresPage .mainContent hr { width: min(520px, 72%); height: 1px; margin: 5px auto 18px; border: 0; background: linear-gradient(90deg, transparent, rgba(255, 26, 36, 0.55), rgba(255, 216, 77, 0.62), rgba(255, 26, 36, 0.55), transparent); box-shadow: 0 0 8px rgba(255, 26, 36, 0.2); } .luchadoresFooter { margin-top: 30px; padding-top: 20px; border-top: 1px solid rgba(255, 216, 77, 0.16); text-align: center; } .luchadoresPage .mainContent .luchadoresIndex { margin: 0 auto 18px; color: rgba(246, 241, 232, 0.66) !important; font-size: 11px !important; line-height: 1.55; text-align: center; } .luchadoresFooter img { display: block; width: auto; max-width: min(220px, 72%); height: auto; margin: 0 auto; } @media (max-width: 680px) { .luchadoresPage #container { width: calc(100vw - 18px); margin: 8px auto 0; } .luchadoresPage .mainContent { width: calc(100vw - 28px); padding: 16px 14px 26px; } .luchadoresPage .mainContent, .luchadoresPage .mainContent p, .luchadoresPage .mainContent div, .luchadoresPage .mainContent center, .luchadoresPage .mainContent font { font-size: 13.5px !important; line-height: 1.6; } .luchadoresPage .mainContent .luchadoresIntro { font-size: 14px !important; text-align: left; } .luchadoresPage .mainContent > div { min-height: 0; padding: 16px 14px; } .luchadoresPage .mainContent > div h3 { font-size: 21px !important; } .luchadoresPage .mainContent img[align="left"] { float: none; width: min(220px, 72vw) !important; max-width: 100%; margin: 0 auto 14px !important; } } /* Responsive accessibility and device support for the main MMvsAM site. */ html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; } body.aboutPage { box-sizing: border-box; padding-left: env(safe-area-inset-left, 0px); padding-right: env(safe-area-inset-right, 0px); } body.aboutPage #container { max-width: 100%; } a, button, [tabindex] { touch-action: manipulation; } a:focus-visible, button:focus-visible, [tabindex]:focus-visible, .aboutBackButton:focus-visible { outline: 3px solid var(--mm-gold, #ffd84d) !important; outline-offset: 3px; } .aboutBackButton { box-sizing: border-box; min-height: 44px; padding: 10px 13px 10px 10px; } .linksPage .mainContent li > a, .luchadoresPage .luchadoresPdf a { display: inline-flex; align-items: center; min-height: 44px; padding: 6px 0; } @media (max-width: 1024px), (max-width: 1400px) and (pointer: coarse) { html { overflow-x: hidden; } body, td, th, body.aboutPage, .aboutPage .mainContent, .linksPage .mainContent, .galleryPage .mainContent, .reviewsPage .mainContent, .trailerPage .mainContent, .luchadoresPage .mainContent, .aboutPage .mainContent p, .aboutPage .mainContent li, .aboutPage .mainContent td, .aboutPage .mainContent th, .aboutPage .mainContent div, .aboutPage .mainContent center, .aboutPage .mainContent font, body:not(.aboutPage) .mainContent, body:not(.aboutPage) #container, body:not(.aboutPage) p, body:not(.aboutPage) li, body:not(.aboutPage) td, body:not(.aboutPage) th, body:not(.aboutPage) div, body:not(.aboutPage) center, body:not(.aboutPage) font { font-size: 16px !important; line-height: 1.6; } .luchadoresPage .mainContent .luchadoresEyebrow, .luchadoresPage .mainContent .luchadoresPdf, .luchadoresPage .mainContent .luchadoresIndex, .luchadoresHero figcaption { font-size: 13px !important; } .luchadoresPage .mainContent .luchadoresIntro { font-size: 16px !important; } .header > map { display: none; } .header > table { display: table; width: 441px; min-width: 441px; max-width: none; margin: 0; } .header { box-sizing: border-box; width: 100%; max-width: 100%; margin: 0 0 14px; overflow-x: auto; overflow-y: hidden; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; } } @media (pointer: coarse), (prefers-reduced-motion: reduce) { body { background-attachment: scroll; } .aboutPage #container, .aboutPage .mainContent:before { transform: none; transition: none; } } /* Give the About article a phone-like reading panel on tablets only. */ @media (min-width: 701px) and (max-width: 1024px), (min-width: 701px) and (max-width: 1400px) and (pointer: coarse) { body.aboutFilmPage:before { width: 100vw; } .aboutFilmPage #container { box-sizing: border-box; width: min(760px, calc(100vw - 24px)); max-width: none; margin: 0 auto; padding: 16px 0 28px; transform: none; } .aboutFilmPage .mainContent { box-sizing: border-box; width: 100%; padding: 20px 24px 28px; } } @media (min-width: 1440px) { .aboutPage .mainContent, .linksPage .mainContent, .galleryPage .mainContent, .reviewsPage .mainContent, .trailerPage .mainContent, .luchadoresPage .mainContent, .aboutPage .mainContent p, .aboutPage .mainContent li, .aboutPage .mainContent td, .aboutPage .mainContent font, .luchadoresPage .mainContent p, .luchadoresPage .mainContent div { font-size: 17px !important; } .luchadoresPage #container { width: min(1240px, calc(100vw - 6vw)); } .luchadoresPage .mainContent { width: min(1160px, calc(100vw - 8vw)); } }