/* ############################################################################################################################################################################ */ /* ############################################################################################################################################################################ */ /* Glyh Entertainment Public Website */ /* • Page: Resolutions (resolutions.css) */ /* • Description: Supported resolutions table for css headers. This is largely intended as a tempalte for other stylesheets. */ /* • Location: /css/resolutions.css */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* • Version: v0.0.01 α */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* • Project Start Date: 2026-04-07 */ /* • α Release Date: 2026-04-XX */ /* • β Release Date: 2026-04-XX */ /* • Last updated: 2026-04-10 */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* • Author: by Conner Rhoads */ /* • Official Site: www.glyphentertainment.com */ /* ############################################################################################################################################################################ */ /* ############################################################################################################################################################################ */ /* ============================================================================================================================================================================ */ /* RESOLUTION REFERENCE TABLE */ /* ============================================================================================================================================================================ */ /* */ /* These are the standard resolutions supported by this site: */ /* */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MOBILE RESOLUTIONS (Portrait Mode) */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MOBILE LDPI | 240x320 | 3:4 | @media (min-width: 0px) and (max-width: 240px) */ /* MOBILE MDPI | 320x480 | 2:3 | @media (min-width: 241px) and (max-width: 320px) */ /* MOBILE HDPI | 480x800 | 3:5 | @media (min-width: 321px) and (max-width: 480px) */ /* MOBILE XHDPI | 720x1280 | 9:16 | @media (min-width: 641px) and (max-width: 720px) */ /* MOBILE XXHDPI | 1080x1920 | 9:16 | @media (min-width: 801px) and (max-width: 1023px), (min-width: 1025px) and (max-width: 1080px) */ /* MOBILE XXXHDPI | 1080x1920 | 9:16 | @media (min-width: 801px) and (max-width: 1023px), (min-width: 1025px) and (max-width: 1080px) */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* LEGACY RESOLUTIONS */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* LEGACY VGA | 640x480 | 4:3 | @media (min-width: 481px) and (max-width: 640px) */ /* LEGACY SVGA | 800x600 | 4:3 | @media (min-width: 800px) and (max-width: 800px) */ /* LEGACY XVGA | 1024x768 | 4:3 | @media (min-width: 1024px) and (max-width: 1024px) */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MODERN RESOLUTIONS */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MODERN 720p | 1280x720 | 16:9 | @media (min-width: 1081px) and (max-width: 1280px) */ /* MODERN 1080p | 1920x1080 | 16:9 | @media (min-width: 1281px) and (max-width: 1920px) */ /* MODERN 2k | 2560x1280 | 16:9 | @media (min-width: 1921px) and (max-width: 2559px) */ /* MODERN 4k | 3840x1400 | 16:9 | @media (min-width: 2562px) and (max-width: 3439px), (min-width: 3442px) and (max-width: 3839px) */ /* MODERN 6k | 6144x3456 | 16:9 | @media (min-width: 3841px) and (max-width: 5119px), (min-width: 5121px) and (max-width: 6144px) */ /* MODERN 8k | 7680x4320 | 16:9 | @media (min-width: 6145px) and (max-width: 7680px) */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* ULTRAWIDE RESOLUTIONS */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* ULTRAWIDE WFHD | 2560x1080 | 21:9 | @media (min-width: 2560px) and (max-width: 2560px) */ /* ULTRAWIDE FHD | 4608x1920 | 21:9 | @media (min-width: 4608px) and (max-width: 4608px) */ /* ULTRAWIDE UWQHD | 3440x1440 | 21:9 | @media (min-width: 3440px) and (max-width: 3440px) */ /* ULTRAWIDE WQHD+ | 3840x1600 | 21:9 | @media (min-width: 3840px) and (max-width: 3840px) */ /* ULTRAWIDE UW5k | 5120x2160 | 21:9 | @media (min-width: 5120px) and (max-width: 5120px) */ /* ============================================================================================================================================================================ */ /* ============================================================================================================================================================================ */ /* [START] RESOLUTIONS STYLESHEETS */ /* ============================================================================================================================================================================ */ /* ============================================================================================================================================================================ */ /* MOBILE RESOLUTIONS (Portrait Mode) */ /* ============================================================================================================================================================================ */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MOBILE LDPI | 240x320 | 3:4 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 0px) and (max-width: 240px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MOBILE MDPI | 240x320 | 3:4 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 241px) and (max-width: 320px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MOBILE HDPI | 320x480 | 2:3 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 321px) and (max-width: 480px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MOBILE XHDPI | 480x800 | 3:5 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 321px) and (max-width: 480px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MOBILE XXHDPI | 720x1280 | 9:16 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 641px) and (max-width: 720px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MOBILE XXXHDPI | 1080x1920 | 9:16 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 801px) and (max-width: 1023px), (min-width: 1025px) and (max-width: 1080px) { } /* ============================================================================================================================================================================ */ /* LEGACY RESOLUTIONS */ /* ============================================================================================================================================================================ */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* LEGACY VGA | 640x480 | 4:3 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 481px) and (max-width: 640px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* LEGACY SVGA | 800x600 | 4:3 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 800px) and (max-width: 800px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* LEGACY XVGA | 1024x768 | 4:3 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 1024px) and (max-width: 1024px) { } /* ============================================================================================================================================================================ */ /* MODERN RESOLUTIONS */ /* ============================================================================================================================================================================ */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MODERN 720p | 1280x720 | 16:9 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 1081px) and (max-width: 1280px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MODERN 1080p | 1920x1080 | 16:9 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 1281px) and (max-width: 1920px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MODERN 2k | 2560x1280 | 16:9 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 1921px) and (max-width: 2559px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MODERN 4k | 3840x1400 | 16:9 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 2562px) and (max-width: 3439px), (min-width: 3442px) and (max-width: 3839px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MODERN 6k | 6144x3456 | 16:9 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 3841px) and (max-width: 5119px), (min-width: 5121px) and (max-width: 6144px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MODERN 8k | 7680x4320 | 16:9 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 6145px) and (max-width: 7680px) { } /* ============================================================================================================================================================================ */ /* ULTRAWIDE RESOLUTIONS */ /* ============================================================================================================================================================================ */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* ULTRAWIDE WFHD | 2560x1080 | 21:9 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 2560px) and (max-width: 2560px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* ULTRAWIDE FHD | 4608x1920 | 21:9 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 4608px) and (max-width: 4608px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* ULTRAWIDE UWQHD | 3440x1440 | 21:9 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 3440px) and (max-width: 3440px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* ULTRAWIDE WQHD+ | 3840x1600 | 21:9 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 3840px) and (max-width: 3840px) { } /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* ULTRAWIDE UW5k | 5120x2160 | 21:9 | */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media (min-width: 5120px) and (max-width: 5120px) { } /* ============================================================================================================================================================================ */ /* [END] RESOLUTIONS STYLESHEETS */ /* ============================================================================================================================================================================ */ /* ============================================================================================================================================================================ */ /* 350px on Left+Right @ Modern 1080p Transformations */ /* ============================================================================================================================================================================ */ /* --- /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Mobile Resolutions (Portrait Mode) /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MOBILE LDPI (0–240px) → margin: left: 15px right: 15px; /* MOBILE MDPI (241–320px) → margin: left: 20px right: 20px; /* MOBILE HDPI (321–480px) → margin: left: 30px right: 30px; /* MOBILE XHDPI (641–720px) → margin: left: 30px right: 30px; /* MOBILE XXHDPI (801–1080px) → margin: left: 40px right: 40px; /* MOBILE XXXHDPI (801–1080px) → margin: left: 40px right: 40px; /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Legacy Resolutions /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* LEGACY VGA (481–640px) → margin: left: 30px right: 30px; /* LEGACY SVGA (800–800px) → margin: left: 40px right: 40px; /* LEGACY XVGA (1024–1024px) → margin: left: 50px right: 50px; /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Modern Resolutions /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MODERN 720p (1081–1280px) → margin: left: 250px right: 250px; /* MODERN 1080p (1281–1920px) → margin: left: 350px right: 350px; /* MODERN 2k (1921–2559px) → margin: left: 380px right: 380px; /* MODERN 4k (2562–3839px) → margin: left: 400px right: 400px; /* MODERN 6k (3841–6144px) → margin: left: 450px right: 450px; /* MODERN 8k (6145–7680px) → margin: left: 500px right: 500px; /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Ultrawide Resolutions /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* ULTRAWIDE WFHD (2560–2560px) → margin: left: 500px right: 500px; /* ULTRAWIDE FHD (4608–4608px) → margin: left: 700px right: 700px; /* ULTRAWIDE UWQHD (3440–3440px) → margin: left: 500px right: 500px; /* ULTRAWIDE WQHD+ (3840–3840px) → margin: left: 500px right: 500px; /* ULTRAWIDE UW5K (5120–5120px) → margin: left: 700px right: 700px; /* ============================================================================================================================================================================ */ /* END TRANSFORMATIONS */ /* ============================================================================================================================================================================ */ /* ============================================================================================================================================================================ */ /* ICON TRANSFORMATIONS */ /* ============================================================================================================================================================================ */ /* --- /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Mobile Resolutions (Portrait Mode) /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MOBILE LDPI (0–240px) → icon: /* MOBILE MDPI (241–320px) → icon: /* MOBILE HDPI (321–480px) → icon: /* MOBILE XHDPI (641–720px) → icon: /* MOBILE XXHDPI (801–1080px) → icon: /* MOBILE XXXHDPI (801–1080px) → icon: /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Legacy Resolutions /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* LEGACY VGA (481–640px) → icon: /* LEGACY SVGA (800–800px) → icon: /* LEGACY XVGA (1024–1024px) → icon: /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Modern Resolutions /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* MODERN 720p (1081–1280px) → icon: /* MODERN 1080p (1281–1920px) → icon: /* MODERN 2k (1921–2559px) → icon: /* MODERN 4k (2562–3839px) → icon: /* MODERN 6k (3841–6144px) → icon: /* MODERN 8k (6145–7680px) → icon: /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Ultrawide Resolutions /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* ULTRAWIDE WFHD (2560–2560px) → icon: /* ULTRAWIDE FHD (4608–4608px) → icon: /* ULTRAWIDE UWQHD (3440–3440px) → icon: /* ULTRAWIDE WQHD+ (3840–3840px) → icon: /* ULTRAWIDE UW5K (5120–5120px) → icon: /* ============================================================================================================================================================================ */ /* END TRANSFORMATIONS */ /* ============================================================================================================================================================================ */