diff options
Diffstat (limited to 'random-projects/season3-countdown/style.scss')
-rw-r--r-- | random-projects/season3-countdown/style.scss | 70 |
1 files changed, 70 insertions, 0 deletions
diff --git a/random-projects/season3-countdown/style.scss b/random-projects/season3-countdown/style.scss new file mode 100644 index 0000000..d0b445f --- /dev/null +++ b/random-projects/season3-countdown/style.scss @@ -0,0 +1,70 @@ +.random-project__project__season3-countdown { + #youtube-background { + position: absolute; + top: 0; + left: 0; + width: 100vw; + height: 100vh; + + pointer-events: none; + + z-index: -1; + } + + .container { + color: white; + display: flex; + width: 100vw; + height: 100vh; + justify-content: center; + align-items: center; + flex-direction: column; + font-size: 1em; + } + + .text { + font-size: 4em; + text-shadow: 1px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000, -1px 0 0 #000; + } + + .countdown { + text-shadow: 1px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000, -1px 0 0 #000; + font-size: 4em; + + span { + font-size: 3em; + } + } +} + +@media screen and (max-width: 1600px) { + .random-project__project__season3-countdown { + .container { + font-size: 0.5em; + } + } +} + +@media screen and (max-width: 1024px) { + .random-project__project__season3-countdown { + .container { + font-size: 0.4em; + } + } +} + +@media screen and (max-width: 700px) { + .random-project__project__season3-countdown { + .container { + font-size: 0.3em; + } + } +} + +@media screen and (max-width: 500px) { + .random-project__project__season3-countdown { + .container { + font-size: 0.2em; + } + } +} |