Symptoms page CSS file

symptom.css

@@ -0,0 +1,154 @@
+@import url("https://fonts.googleapis.com/css?family=Montserrat:300,400,700&display=swap");
+
+*{
+  margin: 0;
+  padding: 0;
+}
+
+html {
+  font-size: 14px;
+  font-family: 'Monterrat', sans-serif;
+  box-sizing: border-box;
+}
+
+body{
+  background-color: #CDEBFF;
+  min-height: 100vh;
+  font-family: Arial, Helvetica, sans-serif;
+}
+
+h1{
+  color: #3F3B3B;
+  font-family: sans-serif;
+  font-size: 40px;
+  font-weight: 100;
+  letter-spacing: 3px;
+  margin-top: 20px;
+  text-align: center;
+}
+
+.overlay{
+  width: 100%;
+  height: 100vh;
+  position: absolute;
+  top: 0;
+}
+
+.navbar{
+  width: 100%;
+  display: flex;
+  align-items: center;
+  margin: 15px auto;
+}
+
+.logo{
+  flex-basis: 10px;
+}
+
+.logo img{
+  width: 160px;
+  height: 70px;
+  cursor: pointer;
+  margin-top: 0px;
+  margin-right: 1020px;
+  margin-left: 30px;
+  display: flex;
+  background-color: #B7B7B7;
+  border-radius: 20px;
+}
+
+.logo img:hover{
+  border: 3px solid #96D2E5;
+}
+
+nav a{
+  color: #3F3B3B;
+  margin: 20px;
+  text-decoration: none;
+  font-size: 20px;
+  text-transform: lowercase;
+  background-color: #E3E3E3;
+  border-radius: 20px;
+}
+
+nav a:hover{
+  border: 3px solid #96D2E5;
+}
+
+nav{
+  display: flex;
+  flex-flow: row-reverse;
+}
+
+.container{
+  max-width: 800px;
+  margin: auto;
+  padding: 10px;
+}
+
+.input{
+  width: 95%;
+  border: none;
+  border-bottom: 2px solid #3F3B3B;
+  background: none;
+  padding: 10px;
+  outline: none;
+  font-size: 18px;
+}
+
+h3{
+  margin: 80px 0;
+}
+
+.unassessed h3{
+  margin-top: 20px;
+  color: #3F3B3B;
+}
+
+.assessed h3{
+  margin-top: 20px;
+  color: #3F3B3B;
+}
+
+.symptom{
+  width: 100%;
+  background: rgba(255, 255, 255, 0.514);
+  padding: 20px;
+  margin: 5px 0;
+  overflow: hidden;
+  border-radius: 20px;
+}
+
+.assessed .symptom{
+  background: rgba(138, 137, 137, 0.315);
+  color: white;
+}
+
+.symptom i{
+  float: right;
+  margin-left: 20px;
+  cursor: pointer;
+}
+
+h4{
+  margin-top: 40px;
+  color: #87bccc;
+  font-size: 24px;
+  text-transform: lowercase;
+  font-weight: 200;
+  text-align: center;
+}
+
+.announc a{
+  color: #65848d;
+  text-decoration: none;
+}
+
+.announc p{
+  font-size: 23px;
+  margin-top: 20px;
+  color: #87bccc;
+  font-weight: 200;
+  text-align: center;
+  text-transform: lowercase;
+}