:root { --ui-font-size: clamp(9pt, 1rem, 4vw, 3rem); --contents-width: 960px; --mp: 4pt; --br-min: calc(var(--mp) * .5); --main-bg-color: #0f0f0f; --ui-bg-color: #F5EFEB; --ui-bg-color-trans: #F5EFEB60; --box-bg-color-dark: #1b1510; --box-bg-color-dark-trans: #1b151080; --box-bg-color: #4a3525; --box-bg-color-trans: #4a3525cc; --box-bg-color-light: #5c4331; --box-bg-color-light-trans: #5c433180; --header-bg-color: #31211380; --footer-bg-color: #31211380; --box-bg-color-mid: #a0785540; --download-single-box-size: 400px; --ui-fg-color-titles: #dbcbbd; --contents-body-text-color: var(--ui-bg-color); --ui-fg-color-std: #F5EFEB; --link-fg-color: #E6A15C; --box-title-color: #E6A15C; --evid-color: #D97736; --evid-color-2: #C4A482; --title-color: #dbcbbd; --transition-fast: all .125s ease-in-out; --transition-mid: all .25s ease-in-out; --transition-slow: all 1s ease-in-out; --transition-cover: all .75s ease-out; --els-gap: calc(var(--mp) * 4); --header-size: calc(var(--mp) * 12); --footer-size: calc(var(--mp) * 8); --backdrop-filter: blur(10px); --box-shadow: 0 0 6px rgba(10, 10, 10, 0.25), 0 0 18px rgba(10, 10, 10, 0.22), 0 0 32px rgba(10, 10, 10, 0.20); --box-shadow-inset: inset 0 0 6px rgba(10, 10, 10, 0.25), inset 0 0 18px rgba(10, 10, 10, 0.22), inset 0 0 32px rgba(10, 10, 10, 0.20); --box-shadow-thin: 0 0 3px rgba(10, 10, 10, 0.25), 0 0 9px rgba(10, 10, 10, 0.22), 0 0 15px rgba(10, 10, 10, 0.20); --text-shadow: 0 1pt 2pt #2f2f2f4d, 0 2px 4px rgba(47, 47, 47, 0.22); --text-glow: 0 2pt 4pt #ffffff4d, 0 2px 4px rgba(255, 255, 255, 0.5); --box-glow: 0 0 6px #03a7f360, 0 0 12px #03a7f340, 0 0 24px #03a7f320, 0 0 40px #03a7f310; --box-glow-purple: 0 0 16px #36154A60, 0 0 24px #36154580, 0 0 364px #36154560, 0 0 40px #36154540; --box-glow-yellow: 0 0 16px #E6B45080, 0 0 24px #E6B45080, 0 0 50px #FFD26459, 0 0 80px #FFE69633; --bg-gradient-body: linear-gradient(to bottom right, #0e142a80 0%, #1b233880 50%, #252D4180 100%); --bg-gradient: linear-gradient(to bottom right, #1b2444 0%, #1b2444 0%, #1c5e72 100%); --bg-gradient-blue: linear-gradient(to bottom right, #000c1d80 0%, #000c1d80 0%, #01050c80 100%); --bg-gradient-yellow: linear-gradient(100deg, #FFD366 0%, #FFD366 35%, #e9873d 100%); --bg-gradient-amaranto: linear-gradient(100deg, #66233f 0%, #66233f 35%, #3f1527 100%); --border-std: 1px solid #5771ac20; --border-sep: 1pt solid #ffffff20; --border-sep-dash: 1pt dashed #ffffff20; --border-hover: 1pt solid #ffffff60; --cols-tot-dist: calc(var(--els-gap) * (var(--cols-num) - 1)); --col-size-delta: calc(var(--cols-tot-dist) / (var(--cols-num) - 1)); --col-size: calc((100% - var(--cols-tot-dist)) / var(--cols-num)); --h2-height: 4rem; } * { transition: var(--transition-mid); scroll-behavior: smooth !important; font-family: var(--ui-font); } *:focus { outline: none !important; } *::-webkit-scrollbar { width: calc(var(--mp) * .5); height: calc(var(--mp) * .5); } *::-webkit-scrollbar-track { background: var(--box-bg-color-dark); } *::-webkit-scrollbar-thumb { background: #888888cc; border-radius: var(--br-min); } *::-webkit-scrollbar-thumb:hover { background: #555555cc; } * { scrollbar-width: thin; --thumb-color: var(--evid-color-2); --track-color: var(--main-bg-color); scrollbar-color: var(--thumb-color) var(--track-color); box-sizing: border-box !important; font-family: var(--ui-font), sans-serif; } html, body, section { padding: 0px; margin: 0px; } html, body { font-size: var(--ui-font-size); background-color: var(--main-bg-color) !important; color: var(--ui-fg-color-std) !important; width: stretch; height: stretch; min-height: 100%; transition: all 0s ease-in-out !important; } a, a:visited { display: inline-flex; padding: calc(var(--mp) * 1); } h1, .h1_emu, h2, h3, h4 { color: var(--ui-fg-color-titles); margin: 0px; padding: 0px; margin-bottom: calc(var(--mp) * 1); font-weight: 500; line-height: 110%; } h3 { font-size: 1.25rem; } h1, .h1_emu, h2 { font-family: var(--titles-font); } .h1_emu, h1 { display: flex; justify-content: center; align-items: baseline; } .h1_emu div.app_name, h1 div.app_name { margin-right: calc(var(--mp) * 1); } .footer div.app_name { color: var(--title-color); } .footer .copyrights, .footer .author { color: var(--ui-fg-color-std); opacity: .75; } .app_version { display: inline-flex; font-size: 1rem; color: orange; font-weight: 400; margin-left: calc(var(--mp) * 1); } .h1_emu div.app_version, h1 div.app_version { font-size: .95rem; } h2 span, h3 span { opacity: .75; color: var(--ui-fg-color-std) !important; } a, a:visited { color: var(--link-fg-color) !important; text-decoration: none; } a:hover { filter: brightness(125%); } a:active { opacity: .75; } .evid_title { color: var(--title-color); font-family: var(--titles-font); } .main { position: fixed; width: 100%; top: 0px; left: 0px; right: 0px; bottom: 0px; padding-top: calc(var(--header-size) + var(--mp) * 0); display: flex; flex-direction: column; margin: auto; z-index: 0; overflow-y: auto; } .box_top { padding: calc(var(--mp) * 4); margin-bottom: calc(var(--footer-size) * 1); display: flex !important; flex-direction: column; text-shadow: var(--text-shadow); z-index: 0; visibility: visible; } .box_top .h1_emu, .box_top h1 { font-weight: 900; font-size: 3.5rem; display: block !important; text-align: center; } .box_top .tag_line { text-align: center; font-size: 1.5rem; padding: calc(var(--mp) * 2); margin-top: calc(var(--mp) * 4); } .box_top .tag_line_disclaimer { padding: calc(var(--mp) * 2); margin-top: calc(var(--mp) * 4); text-align: center; opacity: .5; } .header { position: fixed; top: 0px; left: 0px; right: 0px; height: var(--header-size); border-bottom: var(--border-std); background-color: var(--header-bg-color); padding: calc(var(--mp) * 2); border-top-left-radius: var(--br-min); border-top-right-radius: var(--br-min); font-size: 1rem; color: var(--ui-fg-color-std); display: flex; justify-content: space-between; align-items: center; z-index: 100; backdrop-filter: var(--backdrop-filter); } .footer { height: var(--footer-size); position: fixed; bottom: 0px; left: 0px; right: 0px; border-top: var(--border-std); background-color: var(--footer-bg-color); padding: calc(var(--mp) * 2); border-top-left-radius: var(--br-min); border-top-right-radius: var(--br-min); font-size: 1rem; color: var(--ui-fg-color-std); display: flex; justify-content: space-between; align-items: center; z-index: 100; backdrop-filter: var(--backdrop-filter); box-shadow: var(--box-shadow); } .footer>div { display: flex; white-space: nowrap; width: 50%; justify-content: center; align-items: center; } .footer>div:first-child { justify-content: flex-start; } .footer>div:last-child { justify-content: flex-end; } .downloads_main_box { display: flex; justify-content: space-between; width: stretch; gap: var(--els-gap); padding-top: calc(var(--els-gap) * 1); margin: auto; user-select: none; contain: layout; } .fonts_for_coding_box_container, .contents_box_container { display: flex; align-content: center; justify-content: space-between; align-items: center; justify-items: center; flex-direction: column; padding-bottom: calc(var(--mp) * 2); margin-top: calc(var(--mp) * 4); margin-bottom: calc(var(--mp) * 2); overflow: visible; } section { padding-top: calc(var(--mp) * 4); padding-bottom: calc(var(--mp) * 4); } section h2 { opacity: .75; transform-origin: 50% 50%; transform: translateX(0%) scale(.95); } section.section_active { border: 4pt solid red !important; } section.section_active h2 { opacity: 1; transform: translateX(0%) scale(1); filter: brightness(125%); } .contents_box, .downloads_single_box { box-sizing: border-box; color: var(--ui-fg-color-std); padding: calc(var(--mp) * 2); display: block; } .downloads_single_box { overflow-y: hidden; border-radius: calc(var(--mp) * 1); border-top-right-radius: calc(var(--mp) * 2); border-bottom-left-radius: calc(var(--mp) * 2); } .contents_box { margin-bottom: var(--els-gap); border-top-left-radius: 0px; max-width: var(--contents-width); margin: auto; height: fit-content; backdrop-filter: var(--backdrop-filter); width: stretch; min-width: 100%; } .downloads_single_box { contain: layout; } .main_box_label, .box_label { padding: calc(var(--mp) * 2); padding-left: calc(var(--mp) * 6); padding-right: calc(var(--mp) * 6); top: 0pt; border-bottom-color: transparent; background-color: var(--box-bg-color); border-radius: calc(var(--mp) * 8); border: var(--border-std); font-size: 2rem; color: white; font-weight: bold; box-shadow: var(--box-shadow); width: fit-content; align-self: flex-start; justify-self: flex-start; } .box_label { position: fixed; } .main_box_label { margin-left: calc(var(--mp) * 4); } section { scroll-margin-top: calc(var(--header-size) * 1 + (var(--mp) * 0)); } .main_box_label { scroll-margin-top: calc(var(--header-size) * 1 + (var(--mp) * 4)); } .box_label { transform: translateY(calc(-75% - var(--mp) * 1)); } .spot_box { background-color: #0e193080; padding: calc(var(--mp) * 4); padding-top: calc(var(--mp) * 0); backdrop-filter: var(--backdrop-filter); font-size: 1rem !important; break-inside: avoid; box-shadow: var(--box-shadow); border: var(--border-std); contain: content; max-width: var(--contents-width); } .spot_box { margin-bottom: calc(var(--mp) * 4); border-radius: calc(var(--mp) * 2); border-top: 2pt solid #66233f; } .spot_box h3 { left: calc(var(--mp) * -4); font-size: 1.5rem; position: relative; height: var(--h2-height); text-shadow: var(--text-shadow); background-color: #66233f; background: var(--bg-gradient-amaranto); display: flex; align-content: center; justify-content: space-between; align-items: center; justify-items: center; padding: calc(var(--mp) * 3); width: calc(100% + var(--mp) * 8); width: fit-content; min-width: 66%; border-bottom-right-radius: calc(var(--mp) * 2); box-shadow: var(--box-shadow); text-shadow: var(--text-shadow); } .spot_box h3, .spot_box h3 { user-select: none; } .policy_box_mobile { overflow: hidden; text-overflow: ellispis; max-height: calc(var(--h2-height) + var(--mp) * 2); } .policy_box_mobile .download_icon { position: fixed; z-index: 2000; right: calc(var(--mp) * 4); font-size: 1.5rem; margin-top: calc(var(--h2-height) / 4); transform-origin: 50% 50%; } .policy_box_mobile h3 { cursor: pointer; margin-bottom: calc(var(--mp) * 4); } .policy_box_mobile:hover { filter: brightness(125%); } .policy_box_mobile:active { opacity: .5; } .policy_box_mobile_active .download_icon { transform: rotateZ(60deg); } .policy_box_mobile_active { flex: 1 1 auto; flex-grow: 1 1 auto; height: stretch; max-height: 500dvh; overflow-y: none; } .policy_box_mobile_active h2 { background-color: #66233f80; } .contents_box { line-height: 175%; padding: calc(var(--mp) * 4); padding-top: calc(var(--mp) * 16); margin-top: calc(var(--mp) * 4); margin-bottom: calc(var(--mp) * 4); contain: layout; } .contents_box h2 { background-color: var(--box-bg-color-light); box-shadow: var(--box-shadow); border-radius: calc(var(--mp) * 2); padding: calc(var(--mp) * 4); position: fixed; top: 0px; left: 0px; right: 0px; margin-bottom: calc(var(--mp) * 4); } .downloads_single_box { padding-top: calc(var(--mp) * 0) !important; border: var(--border-std); flex-direction: row; } .downloads_single_box .box_changelog_scroller, .downloads_single_box .box_scroller { position: fixed; overflow-y: auto; padding-bottom: calc(var(--mp) * 8); } .downloads_single_box .box_scroller { top: 0px; left: 0px; right: 0px; bottom: 0px; } .contents_box_disclaimer { padding: calc(var(--mp) * 4); font-size: 1.25rem; hyphens: auto; } .contents_box_disclaimer b { font-weight: 500; color: var(--evid-color); } .contents_box_disclaimer span { color: var(--evid-color-2); } .contents_box_buttons_bar { display: flex; margin-bottom: calc(var(--mp) * 2); flex-wrap: wrap; gap: calc(var(--mp) * 1); padding: calc(var(--mp) * 2); } .button_api_service_bar { white-space: nowrap; flex-wrap: nowrap; display: flex; padding: 0px; margin: 0px; gap: calc(var(--mp) * .5); } .button_api_service, .button { display: flex; align-content: center; border-radius: var(--br-min); border: var(--border-std); cursor: pointer; user-select: none !important; } .button_api_service { justify-content: center; border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important; padding: calc(var(--mp) * 2); margin-left: calc(var(--mp) * 0); aspect-ratio: 1 / 1; width: 4rem; } .button { padding: calc(var(--mp) * 2); justify-content: space-between; flex-grow: 1; flex-basis: auto; max-width: 25%; } .button, .button * { overflow: hidden; text-overflow: ellipsis; text-wrap: nowrap; } .button_api_service:hover, .button_api:hover, .button:hover { border-color: #ffffff60 !important; background-color: #ffffff20; } .button_api_service:active, .button_api:active, .button:active { background-color: #ffffff40; } .clipboard_box_section, .clipboard_box { display: flex; align-content: center; justify-content: space-between; align-items: center; justify-items: center; max-width: 100%; } .clipboard_box { margin-bottom: calc(var(--mp) * .5); } .clipboard_box, .clipboard_box a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .clipboard_box a { border: var(--border-std); padding: calc(var(--mp) * 2); width: 100%; } .clipboard_box_section { align-content: flex-start; justify-content: flex-start; align-items: flex-start; justify-items: flex-start; flex-direction: column; padding-bottom: calc(var(--mp) * 2); margin-top: calc(var(--mp) * 2); } .clipboard_box_section h3 { border-bottom: var(--border-sep-dash); width: 100%; padding: calc(var(--mp) * 2); padding-left: calc(var(--mp) * 4); } .clipboard_box_section div { font-size: 1rem !important; padding: calc(var(--mp) * 2); } .downloads_single_box_background { position: fixed; min-height: 100%; width: stretch; height: stretch; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: -1; opacity: 1; background-color: var(--box-bg-color); } .downloads_single_box_dummy { flex-grow: 1; flex-basis: auto; min-width: 0; pointer-events: none; opacity: .5; } .downloads_single_box .box_header { position: sticky; width: stretch; top: calc(var(--mp) * 0); margin-top: calc(var(--mp) * 0); display: flex; flex-direction: column; background-color: #132E4940; padding-left: calc(var(--mp) * 3); padding: calc(var(--mp) * 2); padding-top: calc(var(--mp) * 7); padding-bottom: calc(var(--mp) * 1); margin-bottom: calc(var(--mp) * 1); z-index: 1000; backdrop-filter: var(--backdrop-filter); box-shadow: var(--box-shadow); contain: layout; } .downloads_single_box .box_footer { position: fixed; bottom: calc(var(--mp) * 0); left: 0px; right: 0px; display: flex; align-content: center; justify-content: flex-end; align-items: center; justify-items: center; background-color: #132E4940; padding: calc(var(--mp) * 0); margin-bottom: calc(var(--mp) * 0); z-index: 1500; backdrop-filter: var(--backdrop-filter); box-shadow: var(--box-shadow); } .downloads_single_box .box_footer, .downloads_single_box .box_footer * { display: flex; align-content: center; justify-content: flex-end; align-items: center; justify-items: center; } .downloads_single_box .box_footer span { opacity: .5; } .downloads_single_box .box_group_label { position: fixed; top: 0px; left: 0px; right: 0px; background-color: transparent; backdrop-filter: var(--backdrop-filter); padding: calc(var(--mp) * 1); padding-right: calc(var(--mp) * 3); white-space: nowrap; min-width: 25%; z-index: 2000; font-size: 1.15rem; font-weight: 500; box-shadow: var(--box-shadow); display: flex; align-content: flex-end; align-items: center; justify-content: flex-end; justify-items: center; line-height: 115%; overflow: hidden; background-color: #8f0fca20 !important; text-transform: uppercase; } .downloads_single_box:nth-child(3n) .downloads_single_box_background { } .downloads_single_box:nth-child(3n + 1) .downloads_single_box_background { } .downloads_single_box:nth-child(3n + 2) .downloads_single_box_background { } .downloads_single_box:hover { filter: brightness(125%); } .download_item { width: stretch; display: flex; align-content: center; align-items: flex-start; justify-content: space-between; justify-items: center; padding: calc(var(--mp) * 2); margin: calc(var(--mp) * 1); border-radius: var(--br-min); cursor: pointer; contain: layout; } .download_item .background_dummy { position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px; background-color: transparent; } .box_header h3, .download_item_web, .download_item_label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .download_item_label { display: block; width: stretch; text-align: left; } .download_item:nth-child(odd) { background-color: #ffffff05; } .download_item:nth-child(even) { background-color: #00000005; } .download_item:hover { background-color: #ffffff20; color: var(--ui-fg-color-titles); } .download_item:active { background-color: #ffffff20; } .item_number { display: inline-flex; align-content: center; align-items: center; justify-content: center; justify-items: center; opacity: .75; border-radius: 100%; aspect-ratio: 1 / 1 !important; margin-right: calc(var(--mp) * 1); background-color: #ffffff20; padding: calc(var(--mp) * .75); line-height: 100%; width: 1.5rem; } .item_just_updated .item_full_name { color: rgb(255, 187, 0); opacity: 1 !important; font-weight: 500; } .item_infos { width: stretch; min-width: 100%; display: flex; align-content: space-between; align-items: space-between; justify-content: space-between; justify-items: space-between; margin: auto; } .item_size, .item_update_at { display: block; opacity: .5; font-size: .95rem; text-align: left !important; margin: auto; } .item_size { text-align: right !important; align-content: flex-end; align-items: flex-end; justify-content: flex-end; justify-items: flex-end; } .download_item:nth-child(odd) { text-align: right; } .download_icon { font-size: 1rem; } .update_time { background-color: var(--box-bg-color-light-trans); border: var(--border-std); box-shadow: var(--box-shadow); display: flex; align-content: center; align-items: center; justify-content: center; justify-items: center; margin: auto; margin-top: calc(var(--mp) * 4); padding: calc(var(--mp) * 1); padding-left: calc(var(--mp) * 4); padding-right: calc(var(--mp) * 4); width: fit-content; border-radius: calc(var(--mp) * 4); font-size: 1rem; } .update_time { display: flex; } .cookies_elert { opacity: .75; color: var(--title-color); } .main_box_label_container { flex-grow: 1; flex-basis: 100%; width: 100%; justify-content: flex-start; margin-left: 0px; margin-right: auto; } .fonts_for_coding_box_scroller .download_item:hover { border: var(--border-hover) !important; z-index: 1000; } .fonts_for_coding_box_scroller .download_item:hover .background_dummy { background-color: #ffffff20; } .fonts_for_coding_box_scroller .download_item { box-shadow: var(--box-shadow-thin); background-color: var(--box-bg-color-light-trans); } .forgekit_promo_header { display: flex; } .box_item_forgekit { border: var(--border-std); box-shadow: var(--box-glow); width: stretch; } .forgekit_promo_version { position: relative; display: flex; align-content: center; align-items: center; justify-content: center; justify-items: center; padding: calc(var(--mp) * 2); margin-top: calc(var(--mp) * 8); min-width: 12rem; background: var(--bg-gradient-yellow); border: 2pt solid darkorange; color: #363636; border-radius: calc(var(--mp) * 1); text-shadow: var(--text-shadow); box-shadow: var(--box-glow); z-index: 500; transform-origin: 0 0%; gap: calc(var(--mp) * 1); cursor: pointer; user-select: none; } .forgekit_promo_version:focus, .forgekit_promo_version:hover { filter: brightness(125%); } .forgekit_promo_version:active { opacity: .5; } .forgekit_promo_version * { line-height: 115% !important; margin: calc(var(--mp) * .5); font-weight: 700; font-size: 1.5rem; } .forgekit_promo_version_changelog_official_url { padding: calc(var(--mp) * 2); } .forgekit_date { font-size: 1rem !important; font-weight: normal !important; width: stretch; text-align: right; } .forgekit_promo_version_container { margin: auto; transform-origin: 50% 50% !important; transform-origin: center; animation-iteration-count: infinite; z-index: 50; font-size: 1.25rem; user-select: none; } .spot_box_glow { border: 1pt solid #5d177e80; box-shadow: var(--box-glow-purple); } .spot_box_glow:hover { filter: brightness(110%) hue-rotate(9deg); } .spot_box_glow h2 { background-color: #52166e; } .item_forgekit_compatible { --ifkc-size: 2.5rem; background-color: rgb(255, 174, 0); border: 1pt solid rgb(180, 131, 25); width: var(--ifkc-size); height: var(--ifkc-size); border-radius: 100%; position: fixed; left: calc(var(--ifkc-size) / 2 * -1); top: calc(var(--ifkc-size) / 2 * -1); box-shadow: var(--box-shadow); } .spot_box h4 { font-size: 1.25rem !important; border-bottom: var(--border-std); border-bottom-style: dashed; padding: calc(var(--mp) * 1); } @media screen and (min-width:1024px) { h1 { position: sticky; top: calc(var(--mp) * 0); padding: calc(var(--mp) * 4); z-index: 1000; background-color: var(--main-bg-color)80; backdrop-filter: var(--backdrop-filter); min-height: calc(var(--header-size) * 1.5); } .header .app_name { font-size: 1.75rem; line-height: 115%; width: fit-content; } .contents_box, .downloads_single_box { flex-basis: auto; flex-grow: 1; flex: 0 0 var(--col-size); height: var(--download-single-box-size); } .downloads_main_box { box-sizing: border-box !important; flex-wrap: wrap; padding-left: calc(var(--mp) * 8); padding-right: calc(var(--mp) * 8); } .box_label { max-width: 33%; } .contents_box_disclaimer { column-count: 2; flex: 1 1 auto; flex-grow: 1 1 auto; height: fit-content !important; column-gap: calc(var(--els-gap) * 1); overflow: visible; width: stretch; min-width: 100%; } section.cookie-and-privacy-policies { padding: 0px !important; margin: 0px !important; background-color: transparent; max-height: 0px; border-width: 0px !important; } .fonts_for_coding_box_scroller { display: flex; flex-wrap: wrap; max-width: calc(var(--contents-width) - var(--mp) * 8); } .fonts_for_coding_box_scroller .download_item { max-width: calc(25% - var(--mp) * 2); width: stretch; border: var(--border-std); } .fonts_for_coding_box_scroller { overflow: hidden; margin-top: calc(var(--mp) * 4); margin-bottom: calc(var(--mp) * 8); display: flex; justify-items: space-between; justify-content: space-between; } .update_time { gap: calc(var(--mp) * 2); } .policy_box_mobile { display: none; } :root { --multibox-cols-span: 3; } .box_item_forgekit { min-width: calc(var(--col-size) * var(--multibox-cols-span) + var(--els-gap) * (var(--multibox-cols-span) - 1) - var(--mp)); } .box_item_forgekit .box_scroller { width: calc(100% / var(--multibox-cols-span) - var(--els-gap) / 2); border-right: var(--border-std); } .downloads_single_box .box_changelog_scroller { top: calc(var(--mp) * 6); left: calc(100% / var(--multibox-cols-span)); right: 0px; bottom: calc(var(--mp) * 6); overscroll-behavior: contain; } .footer .app_title { display: flex; } .just_updated_els_container .download_item { width: var(--col-size); flex-basis: auto !important; } .fonts_for_coding_box { } .contents_body { width: stretch; max-width: var(--contents-width); margin: auto; } } @media screen and (orientation:portrait) and (max-width:1023px) { :root { --ui-font-size: 7pt; --cols-num: 1; --contents-width: 100%; --header-size: calc(var(--mp) * 8); --els-gap: calc(var(--mp) * 1); --footer-size: calc(var(--header-size) * 1.15); --hamburger-line-width: calc(var(--mp) * 3); --hamburger-line-height: calc(var(--header-size) / 30); } .header h1 { font-size: 1.35rem; } .header .app_name { font-size: 1.25rem; line-height: 115%; width: fit-content; } .fonts_for_coding_box_container { flex-direction: column; flex: 1 1 auto !important; flex-grow: 1 1 auto !important; width: stretch !important; padding: 0px !important; margin: auto !important; } .fonts_for_coding_box { padding: 0px; flex: 1 1 auto !important; flex-grow: 1 1 auto !important; width: stretch !important; } .fonts_for_coding_box_scroller { display: block; max-width: 100%; width: stretch !important; flex-direction: column; padding: 0px !important; margin: auto !important; } .box_top { max-height: 100%; flex: 1 1 auto; flex-grow: 1 1 auto; height: fit-content; width: stretch; display: flex; align-content: space-around !important; justify-content: space-around !important; align-items: space-around !important; justify-items: space-around !important; min-height: 60dvh; } .box_top * { margin: auto !important; } .box_top h1 { font-size: 2.50rem !important; } .box_top .tag_line { font-size: 1.15rem !important; padding: calc(var(--mp) * 0) !important; } .downloads_single_box { } .downloads_single_box_dummy { display: none !important; } .downloads_main_box { flex-wrap: none; flex-direction: column; gap: calc(var(--mp) * 4) !important; margin: calc(var(--mp) * 0) !important; margin: auto; } .downloads_single_box { height: auto !important; flex-direction: column-reverse; } .downloads_main_box { padding: 0px; } .downloads_single_box .box_changelog_scroller, .downloads_single_box .box_scroller { position: relative !important; overflow-y: auto; padding-left: 0px !important; padding-right: 0px !important; margin: 0px; left: 0px; height: fit-content !important; max-height: unset; max-height: var(--download-single-box-size); } .box_label, .main_box_label { border-radius: calc(var(--mp) * 1) !important; margin: auto !important; width: 100% !important; flex: 1 1 auto !important; flex-grow: 1 1 auto !important; margin: auto; width: stretch; } .contents_box_label, .spot_box h3 { font-size: 1rem !important; } .main_box_label { font-size: 2rem !important; } .contents_box { border-top-right-radius: 0px !important; } .contents_box_buttons_bar { flex-direction: column; } .contents_box_buttons_bar a.button_api { width: stretch; min-width: 100%; } .contents_box_buttons_bar a.button, .contents_box_buttons_bar .clipboard_box { width: stretch; min-width: 100%; border-color: transparent; } .update_time { flex-direction: column; line-height: 115%; } .footer { flex-direction: column; padding: 0% !important; line-height: 100%; align-content: center !important; justify-content: center !important; align-items: center !important; justify-items: center !important; height: var(--footer-size); max-height: none; } .footer div.cookies_elert, .footer div.site_copyrights { width: stretch; width: 100%; text-align: center !important; display: block !important; white-space: nowrap; padding: calc(var(--mp) * .5); } .footer div.site_copyrights * { display: inline-block; } .footer div.site_copyrights { display: none !important; } .cookies_elert { display: flex; align-content: center; justify-content: center; align-items: center; justify-items: center; } .contents_box_disclaimer, .contents_box_container { padding-left: 0px !important; padding-right: 0px !important; } h1 { font-size: 1.25rem; } .downloads_single_box .box_scroller { padding-bottom: 0px; margin-bottom: calc(var(--mp) * 2) !important; } .footer .app_title { display: none !important; } .footer_menu { visibility: hidden; max-height: 0px; opacity: 0; overflow: hidden; margin: 0px !important; padding: 0px !important; } .changelog_box { display: none !important; } .is_landscape { display: none !important; } .contents_body { width: stretch; } } .contents_body { color: var(--contents-body-text-color) !important; padding: calc(var(--mp) * 4) !important; margin-bottom: calc(var(--mp) * 4) !important; } .contents_body h2 { font-size: 200%; color: var(--title-color); } .contents_body p { margin-bottom: calc(var(--mp) * 2) !important; text-indent: calc(var(--mp) * 2); font-size: 1.15rem; hyphens: auto; } .icon_go { display: inline-block; transform: rotateZ(30deg); } .icon_warning { color: orange; font-size: 1rem; } .font_prop { font-size: .7rem; display: inline-block; margin-right: calc(var(--mp) * 1); padding-right: calc(var(--mp) * 1); border-right: 1pt solid #ffffff40; color: #808080; text-transform: uppercase; } .font_prop:last-child { margin-right: 0px; padding-right: 0px; border-right-width: 0px; } .font_prop_0, .font_prop_1 { color: rgb(0, 255, 179); } .font_prop_0 { opacity: .33; } .font_filters_bar { display: flex; flex-wrap: wrap; align-content: center; justify-content: center; align-items: center; justify-items: center; flex: 1 1 auto; flex-grow: 1 1 auto; flex-basis: auto; } .font_filter_button { padding: calc(var(--mp) * 1); margin: calc(var(--mp) * .5); text-transform: capitalize; user-select: none; cursor: pointer; border: var(--border-std); border-radius: var(--br-min); min-width: 8rem; text-align: center; flex-grow: 1 1 auto; flex: 1 1 auto; flex-basis: auto; } .font_filter_button_active { background-color: #ffffff40; } blockquote { padding: 0px; margin: 0px; } .just_updated_els_container { width: calc(var(--contents-width) - var(--els-gap) * 4); padding: calc(var(--mp) * 4); border: var(--border-std); margin: auto; display: flex; flex-wrap: wrap; background-color: var(--box-bg-color-mid); border-radius: calc(var(--mp) * 2); margin-top: calc(var(--mp) * 4); box-shadow: var(--box-shadow); contain: layout; } .just_updated_els_container .download_item { border: var(--border-std); } .just_updated_els_container .item_number { color: transparent; } .download_item:hover .item_number { background-color: #ffa50080; } .box_top .logo { position: relative; z-index: 1; margin: auto; max-width: 12rem; height: 12rem; } .header .logo { max-width: 3rem; position: relative; left: 0px; top: 0px; margin-right: calc(var(--mp) * 1); } .header_title { display: flex; align-content: center; justify-content: center; align-items: center; justify-items: center; } .header_title .app_name { font-family: var(--titles-font); color: var(--title-color); padding-top: calc(var(--mp) * 1); text-align: center; margin: auto; } .please_wait { margin: auto; font-size: 1.25rem; width: fit-content; animation-name: polling_blink; animation-duration: 3s; animation-timing-function: linear; animation-iteration-count: infinite; font-weight: 500; position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; display: flex; align-content: center; justify-content: center; align-items: center; justify-items: center; user-select: none; z-index: 1; text-shadow: var(--text-shaddow); } .please_wait_hidden { opacity: 0 !important; pointer-events: none !important; z-index: -1 !important; } .footer_menu { display: flex; flex-direction: column; column-count: 2; } .footer_menu a { display: flex; width: Stretch; padding: calc(var(--mp) * 1); } .fake_anchor { display: flex; cursor: pointer; } .fake_anchor a { pointer-events: none !important; } section { } div.observer_sentinel { border: 1pt solid transparent; overflow: hidden; max-width: 100%; position: sticky; top: calc(var(--head-er-size) * -1); max-height: 0px; } .contents_container { position: relative !important; display: safe flex; flex-direction: column; max-width: 100%; min-height: 50vh; scroll-margin-top: calc(var(--header-size) * 1 + (var(--mp) * 0)); flex: 1 0 auto; } .contents_box_container { width: var(--contents-width); margin: Auto; } .flex_break { flex-basis: 100%; height: 0; } .customer_data_grid { display: grid; width: stretch; grid-template-columns: 33% auto; padding: calc(var(--mp) * 4); margin: auto; } .customer_data_grid div { padding: calc(var(--mp) * 1); border-bottom: var(--border-std); } .customer_data_grid div:nth-child(odd) { font-weight: bold; } .main_social_icons_bar, .social_icons_bar { position: relative; width:fit-content; margin: auto; display: flex; align-items: center; align-content: center; justify-items: center; justify-content: center; z-index: 10; align-self: center; justify-self: center; } .social_icons_bar { flex-wrap: wrap; } .main_social_icons_bar .social_icon, .social_icons_bar .social_icon { fill: var(--cover-fg-color) !important; stroke: transparent !important; width: 2.5rem; aspect-ratio: 1 / 1; display: inline-flex; } .main_social_icons_bar { position: relative; margin-bottom: -2pt; background-color: var(--box-bg-color-dark); padding: calc(var(--mp) * 2); border-top-left-radius: calc(var(--mp) * 2); border-top-right-radius: calc(var(--mp) * 2); border: 2pt solid var(--title-color); border-bottom: 2pt solid var(--box-bg-color-dark); }