Revert "UI changes"

This reverts commit 532fff1.

Author: akshit20421

Projects/ArmstrongChecker/OpenSans-Semibold.ttf

@@ -1,11 +1,6 @@
-@font-face {
-    font-family: Open-Sans;
-    src: url('OpenSans-Semibold.ttf');
-}
-
 body {
     text-align: center;
-    background: #1B1A58;
+    background-color: rgba(82, 190, 163, 0.507);
     display: flex;
     flex-direction: column;
     justify-content: center;
@@ -14,66 +9,58 @@ body {
 }
 
 h1 {
-    margin-top: 100px;
-    font-size: 350%;
-    font-family: Open-Sans;
-    color: #fff;
-    text-transform: uppercase;
+    margin-top: 5%;
+    font-size: 400%;
 }
 
 .info {
     /* margin-top: 7%; */
     /* margin-left: 32%; */
     /* margin-right: 32%; */
     width: 40%;
-    height: 100%;
-    margin-top: 40px;
+    max-height: 100%;
     display: flex;
     justify-content: center;
     align-items: center;
     text-align: center;
     border: 1px black;
     flex-direction: column;
-    background-color: #282770;
+    background-color: rgb(215, 128, 142);
     border-radius: 15px;
-    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
     /* box-shadow: #888888 7% 8%; */
 }
 
 input {
-    font-size: 1rem;
+    font-size: large;
     border: 0px solid;
-    background-color: #2F2F75;
-    border-radius: 30px;
+    background-color: black;
+    border-radius: 10px;
     margin-top: 6%;
     height: 20%;
     width: 80%;
     padding: 2%;
     box-shadow: none;
     outline: none;
     color: white;
-    opacity: 100%;
 }
 
 ::placeholder {
     color: white;
-    opacity: 40%;
 }
 
 button {
     border: none;
     outline: none;
     padding: 1%;
-    border-radius: 50px;
-    font-size: 1rem;
-    width: 20%;
-    height: 10%;
-    padding: 1%;
+    border-radius: 8px;
+    font-size: large;
+    width: 40%;
+    height: 20%;
+    padding: 2%;
     margin-top: 5%;
-    background-color: #f269fc;
-    color: rgb(255, 255, 255);
-    cursor: pointer;
-    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
+    opacity: 0.35;
+    background-color: black;
+    color: white;
     /* visibility: hidden; */
 }
 
@@ -91,7 +78,6 @@ button {
 
 p {
     font-size: larger;
-    color: #fff;
 }
 
 #demo {
@@ -101,7 +87,6 @@ p {
     text-align: center;
 }
 
-
 /* .block
 {
     position: relative;
@@ -115,33 +100,18 @@ p {
     background-color: rgba(128, 128, 128, 0.199); 
 } */
 
-@media (max-width: 850px) {
-    html {
-        font-size: 70%;
-        ;
+@media (max-width: 850px){
+    html{
+        font-size: 70%;;
     }
 }
-
-@media (max-width: 750px) {
-    html {
-        font-size: 60%;
-        ;
-    }
-    .info {
-        width: 100%;
-        float: none;
-        height: 100%;
+@media (max-width: 750px){
+    html{
+        font-size: 60%;;
     }
 }
-
-@media (max-width: 500px) {
-    html {
-        font-size: 50%;
-        ;
-    }
-    .info {
-        width: 100%;
-        float: none;
-        height: 100%;
+@media (max-width: 500px){
+    html{
+        font-size: 50%;;
     }
 }