@import url('https://fonts.googleapis.com/css2?family=Elms+Sans:ital,wght@0,100..900;1,100..900&family=Noto+Sans+TC:wght@100..900&display=swap'); /* ::selection matches every element including , which sits outside the body block where the palette lives — so this token is declared on :root. */ :root { --Selection: #d6c8f5; } ::selection { background: var(--Selection); color: #000; } * { margin: 0; padding: 0; border: 0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } body { margin: 0; overflow-x: hidden; --Bg: #ebecff; --Text: #000; --Main: #54378f; --Secondary: #8D4AF2; --Third: #585CFD; --White: #fff; --Black: #000; --Glass: rgba(66, 35, 113, 0.5); --G01:linear-gradient(0deg,rgb(243, 244, 255) 0%, rgba(255, 255, 255, 1) 100%); --G02:linear-gradient(180deg,rgba(141, 74, 242, 1) 0%, rgba(88, 92, 253, 1) 100%); --Sans: 'Elms Sans', 'Noto Sans TC', sans-serif; color: var(--Text); background: var(--Bg); font-family: var(--Sans); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } a{ text-decoration: none; color: var(--Text); } a:hover{ background: var(--G01); } ::-webkit-scrollbar-track { background-color: transparent; } ::-webkit-scrollbar { width: 7px; background-color: transparent; } ::-webkit-scrollbar-thumb { border-radius: 7px; background-color: var(--Main); } .big { font-size: 1.5em; } .small { font-size: .6em; } .bold { font-weight: bold; } h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; line-height: 1em; } main { width: 90vw; height: 90vh; background: var(--G01); margin: 5vh auto; border-radius: 20px; overflow: hidden; position: relative; } section { width: 100vw; background: var(--Bg); position: relative; z-index: 0; padding: 0; margin: 0; white-space: normal; line-height: 0; } p { line-height: 1.5em; } footer { width: 100vw; } .mobile { display: none !important; } /*////RWD////*/ @media screen and (max-width:1660px) {} @media screen and (max-width:1440px) {} @media screen and (max-width:1366px) {} @media screen and (max-width:1280px) {} @media screen and (max-width:1024px) { } @media (orientation:portrait) and (max-height: 1180px) { } @media (orientation:portrait) and (max-height: 1024px) { } @media screen and (max-width:480px) { .mobile { display: block !important; } .desktop { display: none !important; } } /*Iphone 10*/ @media (orientation: portrait) and (max-height: 812px) {} @media (orientation: portrait) and (max-height: 736px) { } @media (orientation: portrait) and (max-height: 667px) { } @media screen and (max-width: 360px) {} @media screen and (max-width: 320px) {}