.movieShowcase {
   background-color: $color-background;
   grid-column: 2 / 13;
   color: #fff;

   &__heading {
      padding-top: 2rem;
   }

   &__container { 
      overflow-y: hidden;
      transition: transform 450ms;
      overflow-x: scroll;
      
      flex: 1 1 auto;
      display: grid;
      grid-template-columns: repeat(20, 1fr);
      column-gap: 0;


      &:hover &--movie {
         opacity: .3;

         &:hover {
            transform: scale(1.5);
            opacity: 1;
         }
      }

      &:hover > *  {
         transform: translate3d(-6rem, 0, 0); 
      }

      &--movie:hover ~ &--movie {
          transform: translate3d(6rem, 0, 0); 
      }


      &:hover > &--movie__netflix  {
         transform: translate3d(-2rem, 0, 0); 
      }

      &--movie__netflix:hover ~ &--movie__netflix {
          transform: translate3d(1rem, 0, 0); 
      }

      &:hover &--movie__netflix {
         opacity: .3;

         &:hover {
            transform: scale(1.1);
            opacity: 1;
         }
      }

      &--movie { 
         cursor: pointer;
         transition: all 450ms; 
         transform: center left; 
         padding-top: 3.5rem;
         padding-bottom: 4rem;
         height: 21.5rem;
        
         &:not(:last-child) {
            padding-right: .5rem;
         }
       
         &-image {
            height: 100%;
            
         }

         &__netflix {
            // width: 2rem;
            padding-top: 3rem;
            padding-bottom: 4rem;
            padding-right: 1rem;
            height: 52rem;
            cursor: pointer;
            transition: all 450ms;
            transform: center left;
         }

      }
   }
}

