From 34fcdb95f70b721b0354050a6b53aedf719db708 Mon Sep 17 00:00:00 2001 From: Aki Date: Thu, 7 Apr 2022 20:35:25 +0200 Subject: Initialized rofnlauts website content as git repository --- style.css | 127 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 127 insertions(+) create mode 100644 style.css (limited to 'style.css') diff --git a/style.css b/style.css new file mode 100644 index 0000000..284976f --- /dev/null +++ b/style.css @@ -0,0 +1,127 @@ +body { + background: #000; + color: #fff; + font-family: sans-serif; + margin: 0; +} + +.wrapper { + background-color: #717894; + background-image: url("background.png"); + background-repeat: no-repeat; + background-position: top center; + margin: 0 auto; + padding: 3em 8em; + box-sizing: border-box; + width: 100%; + max-width: 960px; + min-width: 600px; + min-height: 100vh; +} + +@keyframes hovering { + from {top: 18%;} + to {top: 28%;} +} + +header { + margin: 80px 0 120px 0; +} + +header a { + display: block; + position: relative; + width: 100%; + padding-top: 25.641%; + text-decoration: none; +} + +header img { + max-width: 100%; + position: absolute; +} + +header img[alt="2"] { + z-index: 1; + top: 0px; +} + +header img[alt="Roflnauts"] { + z-index: 2; + animation-name: hovering; + animation-duration: 3s; + animation-iteration-count: infinite; + animation-direction: alternate; + animation-timing-function: cubic-bezier(.40,0,.60,1.0); +} + +section { + margin: 0 0 60px 0; +} + +section p { + line-height: 1.4em; +} + +#screenshots { + display: flex; + flex-wrap: wrap; + justify-content: center; +} + +.screenshot { + display: block; + border: 2px solid #000; + margin: 4px; + padding: 2px; + background-color: #fff; +} + +.screenshot:hover { + background-color: #ffdd2e; +} + +.screenshot > img { + display: block; +} + +#downloads { + color: #fc3800; + text-align: center; + padding: 0.5em 0; +} + +#downloads:target { + outline: #fe2e solid 4px; + background: #fe23; +} + +#downloads a:link, #downloads a:visited { + color: #fc3800; +} + +#downloads h2 { + margin: 0; +} + +a:link, a:visited { + color: #fcb800; +} + +a:hover, #downloads a:hover { + color: #ffdd2e; +} + +a:active, #downloads a:active { + color: #fff; +} + +footer { + font-size: 76%; + text-align: center; +} + +footer p { + margin: 0.2em 0; +} + -- cgit v1.1