.img-container {

  position: absolute;
  width: 100%;
  top: 0;  
  left: 0;
  right: 0;
  overflow: hidden;  
   
   .images-carousel { 
      cursor: pointer !important; 
      margin: 0;
   } 

   .gogo-img 
   {
      width: 100%;
      height: auto;  
   }
}

.img-overlay {
   position: relative;
   overflow: hidden;

   .img-navigation-btn { 
      display: none;

      cursor: pointer !important;       
      height: 100%;
      position: absolute;
      color: white;
      padding-top: 17% !important;
      width: 5rem; 
      @include transition(opacity .5s);

      opacity: .7;
      &:hover { opacity: 1; }

      &.prev { 
        background-image: linear-gradient(to right, rgba(70, 70, 70, 0.4) 0%, rgba(255, 255, 255, 0) 100%); 
        padding: 0 30px 0 .5rem;
        left: 0;
        .icon { left: .6rem; }
      }

      &.next { 
        background-image: linear-gradient(to left,  rgba(70, 70, 70, 0.4) 0%, rgba(255, 255, 255, 0) 100%); 
        padding: 0 .5rem 0 30px;
        right: 0;
        .icon { right: .6rem; }
      }      

      .icon {
        font-size: 3rem;
        position: absolute;
        top: calc(50% - 1.5rem);
        margin: 0;
        text-shadow: 0px 1px 4px #757575;
      }
   } 

   .img-clickable-area { 
      height: 100%;
      position: absolute;
      left: 6rem;
      right: 6rem;
      cursor: pointer !important; 
   }  
}