search functionality bugs

src/static/sass/base/_base.scss

@@ -58,4 +58,23 @@ html {
 	display: grid;      
 	grid-template-rows: 47vw min-content min-content min-content; 
 	grid-template-columns:  4% repeat(10, 1fr) 4%;
+}
+
+.searchContent {
+	height: 100vh;
+	background-color: $color-background;
+}
+
+.no {
+	background-color: $color-background;
+	height: 150%;
+	padding-bottom: 10rem;
+	display: flex;
+	
+
+}
+
+.yes {
+	background-color: purple; 
+	height: 100vh;
 }

src/static/sass/components/_movie.scss

@@ -0,0 +1,83 @@
+.movie {
+   // margin-top: 5rem;
+   // padding-left: 16rem;
+   // padding-right: 6rem;
+   // padding-bottom: 6rem;
+   margin-top: 15rem;
+   height: 1rem;
+   display: inline-block;
+
+   display: flex;
+   justify-content: center;
+
+   * > img {
+       width: 25rem;
+       padding-right: 2rem;
+       
+   }
+
+   &__column-poster {
+      height: 25rem;
+      
+   }
+
+   &__column-overview {
+      padding-left: 3.5rem;
+      text-align: left;
+      width: 60%;
+      padding-top: .5rem;
+
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      align-items: flex-start; 
+
+      &-heading {
+         font-size: 3rem;
+         font-family: 'Fjalla One', sans-serif;
+         color: $color-white;
+      }
+
+      &-text {
+         color: $color-white;
+         font-family: 'Nanum Gothic', sans-serif;
+         text-align: left;
+         font-size: 1.6rem;      
+         line-height: 1.5;
+
+      }
+
+      &-btn { 
+         margin-bottom: 1rem;
+         color: $color-green;
+         cursor: pointer;
+         border-radius: 5rem;
+         // padding: .5rem;
+         padding: .8rem 2rem .8rem 2rem;
+         font-family: 'Nanum Gothic', sans-serif;
+         font-size: 1.5rem;
+         border: solid 1.7px $color-green;
+         transition: all .2s; 
+
+         &:hover {
+            background-color: $color-green; 
+            color: #fff;
+         }
+
+      }
+
+   }
+
+   &__poster {
+      height: 100%;
+   }
+}
+
+.even {
+   background-color: $color-purple;
+}
+
+.odd {
+   background-color: $color-light-blue-2;
+
+}

src/static/sass/layout/_navigation.scss

@@ -39,17 +39,22 @@
          padding-right: 4.6rem;
          display: flex;
          justify-content: flex-end;
-
       }
    }
 
 }
 
+ ::placeholder {
+    color: rgb(167, 166, 166);
+    opacity: 1;
+    /* Firefox */
+ }
+
 input[type="text"] {
-   // display: none;
-   // color: #fff;
+   font-size: 1.4rem;
    border: none;
    outline: none;
+   background-color: red;
    width: 0px;
    padding: 10px;
    padding-right: 2rem;
@@ -59,12 +64,14 @@ input[type="text"] {
 }
 
 input[type="text"]:focus:hover {
+   z-index: 2;
    border-bottom: 1px solid #BBB;
    color: #fff;
 }
 
 input[type="text"]:focus {
    width: 22rem;
+   color: #fff;
    z-index: 1;
    background-color: #000;
    border: 1px solid #fff;
@@ -75,7 +82,6 @@ input[type="submit"] {
    height: 67px;
    width: 63px;
 
-   color: red;
    text-indent: -10000px;
    border: none;
    position: absolute;
@@ -84,4 +90,12 @@ input[type="submit"] {
    opacity: 0.4;
    cursor: pointer;
    transition: opacity .4s ease;
+}
+
+.logo {
+   z-index: -1;
+   width: 2rem;
+   height: 2rem;
+   transform: translateX(2.4rem) translateY(.5rem);
+   cursor: pointer;
 }