search styling

src/app/map/from-to/from-to.component.css

@@ -1,7 +1,5 @@
 .from-to-container {
-
  position: absolute;
-
  height: 52px;
  width: 380px;
  background: #f6be0e;
@@ -10,28 +8,40 @@
  top: 40px;
  display:flex;
  flex-direction: row;
- padding: 10px;
+ padding: 7px 10px 13px;
 }
+
 label {
  font-size: small;
+ position: relative;
+ top: -3px;
 }
+
+.from-container input{
+ width: 141px;
+}
+
 input {
- line-height: 175%;
- width: 150px;
+ line-height: 25px;
+ width: 145px;
  background: #f3ca44;
  border: solid 2px black;
- padding: 2px;
+ padding: 2px 5px;
 }
+
 button {
  background: #cfa109;
  border: solid 2px black;
  cursor: pointer;
- line-height: 175%;
- margin-top: 20px;
+ line-height: 26px;
+ margin-top: 21px;
+ padding: 1px 9px 2px;
 }
+
 button:hover {
  background: #f6be0e;
 }
+
 button:active {
  background: #f3ca44;
 }

src/styles.css

@@ -8,7 +8,7 @@ body, html{
  height: 100%;
 }
 
-body, p, span, button, h1, h2, h3{
+body, p, span, button, h1, h2, h3, input{
  font-family: 'Roboto', sans-serif;
 }
 
@@ -18,6 +18,21 @@ body{
  display: flex;
 }
 
+/* input placeholder */
+
+::placeholder { 
+ color: #333;
+ opacity: 1;
+}
+
+:-ms-input-placeholder {
+ color: #333;
+}
+
+::-ms-input-placeholder { 
+ color: #333;
+}
+
 /* disable blue Chrome focus */
 
 *:focus {