diff --git a/index.html b/index.html new file mode 100644 index 00000000..7c6c4ec5 --- /dev/null +++ b/index.html @@ -0,0 +1,52 @@ + + + + + + reValuate: Putting the value back in recycling + + + + + + + +
+ +
+
+
+ +
+
+ +
+
+
+ + + + + \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 00000000..dd340b06 --- /dev/null +++ b/style.css @@ -0,0 +1,53 @@ +a { + color: white; + font-size: 30px; + transition: 0.6s; +} + +a:hover { + color: black; +} + +@media (min-width: 992px) { + .animate { + animation-duration: 0.3s; + -webkit-animation-duration: 0.3s; + animation-fill-mode: both; + -webkit-animation-fill-mode: both; + } +} + +@keyframes slideIn { + 0% { + transform: translateY(1rem); + opacity: 0; + } + 100% { + transform:translateY(0rem); + opacity: 1; + } + 0% { + transform: translateY(1rem); + opacity: 0; + } +} + +@-webkit-keyframes slideIn { + 0% { + -webkit-transform: transform; + -webkit-opacity: 0; + } + 100% { + -webkit-transform: translateY(0); + -webkit-opacity: 1; + } + 0% { + -webkit-transform: translateY(1rem); + -webkit-opacity: 0; + } +} + +.slideIn { + -webkit-animation-name: slideIn; + animation-name: slideIn; +} \ No newline at end of file diff --git a/style2.css b/style2.css new file mode 100644 index 00000000..6ce6e851 --- /dev/null +++ b/style2.css @@ -0,0 +1,30 @@ +@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap'); + +.fancyButton { + border: 2px solid green; + background-color: transparent; + padding: 10px 12px; + text-align: center; + border-radius: 55px; + transition-duration: 0.4s; + color: black; + outline: none; + font-family: 'Roboto', sans-serif !important; + font-size: 50px; + box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19); +} + +.fancyButton:hover { + background-color: green; + color: white; +} + +button:focus { + outline: none; +} + +button { + margin: 50px 50px 50px 50px; + width: 850px; + height: 700px; +} \ No newline at end of file