diff --git a/index.html b/index.html new file mode 100644 index 0000000..e6c9bf6 --- /dev/null +++ b/index.html @@ -0,0 +1,21 @@ + + + + + + + + + Home - delay.cloud + + + +
+
+

delay.cloud

+
+
+

This site is currently unfinished.

+
+
+
\ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..1658737 --- /dev/null +++ b/style.css @@ -0,0 +1,175 @@ +@font-face { + font-family: 'Roboto', sans-serif; + src: url('https://delay.cloud/fonts/Roboto.ttf') format("truetype"), + url('https://delay.cloud/fonts/roboto-regular-webfont.woff2') format('woff2'), + url('https://delay.cloud/fonts/roboto-regular-webfont.woff') format('woff'); +} + +@keyframes fade { + from {opacity: 0%; border-color: #1E1E1E;} + to {opacity: 100%; border-color: #1E1E1E;} +} + +@keyframes fadeup { + from {opacity: -100%; margin-top: 10vh;} + to {opacity: 100%; margin-top: relative;} +} + +@keyframes fadegrow { + from {opacity: 0%; width: 0;} + to {opacity: 100%; width: calc(20vh + 20vw);} +} + +@keyframes bgcolor { + from {color: #FFFFFF;} + to {color: #1E1E1E;} +} + +h1 { + font-family: 'Roboto', sans-serif; + margin-top: 40vh; + margin-bottom: auto; + font-size: calc(2.5vh + 2.5vw); + text-align: center; + color: #FFFFFF; + border-radius: 5px; + border: #FFFFFF; + border-width: 1vh; + transition: 1s; + animation-name: fade; + animation-duration: 3s; + animation-delay: -2; + min-width: 150px; +} + +body { + background-color: #1E1E1E; + size: 100%; + animation-name: bgcolor; + animation-duration: 3s; +} + +hr { + display: calc(0.15vh + 0.15vw) solid #FFFFFF; + border: calc(0.15vh + 0.15vw) solid #FFFFFF; + color: #FFFFFF; + fill: #FFFFFF; + fill-opacity: 100%; + width: calc(20vh + 20vw); + border-radius: 5px; + animation-name: fadegrow; + animation-duration: 2s; + transition: 1s; + animation-delay: -3; + background-color: #FFFFFF; +} + +p { + font-family: 'Roboto', sans-serif; + text-align: center; + font-size: calc(1.3vh + 1.3vw); + color: #FFFFFF; + margin-top: -0.01vh; + animation-name: fadeup; + animation-duration: 2s; + transition: 1s; + animation-delay: -3; +} + +.aligner { + text-align: center; +} + +button { + border-radius: 5px; + border-color: #FFFFFF; + color: #1E1E1E; + width: calc(7vw + 5vh); + height: calc(3vw + 1vh); + text-align: center; + background-color: #FFFFFF; + font-family: 'Roboto', sans-serif; + transition: 1s; + border-width: 1px; + font-size: calc(1vw + 1vh); + margin-right: 1vh; + border-style: solid; + animation-name: fade; + animation-duration: 1s; + min-width: 60px; + min-height: 30px; + transition: 1s; +} + +@keyframes buttonwhitefade { + from {color: #FFFFFF;} + to {color: #CECECE;} +} + +button:hover { + border-radius: 5px; + color: #1e1e1e; + border-color: #949494; + text-align: center; + background-color: #949494; + transition: 1s; + cursor: pointer; +} + +.b2 { + border-radius: 5px; + border-color: #363636; + color: #ffffff; + width: calc(7vw + 5vh); + height: calc(3vw + 1vh); + text-align: center; + background-color: #363636; + font-family: 'Roboto', sans-serif; + border-width: 2px; + font-size: calc(1vw + 1vh); + transition: 1s; + margin-right: 1vh; + border-style: solid; + animation-name: fade; + animation-duration: 1s; +} + +.b2:hover { + border-radius: 5px; + color: #ffffff; + border-color: #363636; + text-align: center; + background-color: #202020; + transition: 1s; + cursor: pointer; +} + +.footer { + background-color: #1E1E1E; + border-color: #1E1E1E; + border-style: solid; + border-width: 0.25vh; + color: #ffffff; + padding-bottom: 1vh; + padding-top: 1vh; + margin-bottom: 2vh; + border-radius: 5px; + transition: 1s; + animation-name: fade; + animation-duration: 2s; + font-family: 'Roboto', sans-serif; + text-align: center; + font-size: calc(1vh + 1vw); + position: fixed; + bottom: 0; + right: 0%; + width: 95%; + box-sizing: border-box; + display: inline-block; + margin-right: 2.5%; +} + +html { + background-color: #1E1E1E; + color:#1E1E1E +} \ No newline at end of file