//Featured Posts
#featured-estates {
  padding: 0;
  overflow: hidden;
  text-align: center;
  margin-bottom: 50px;
  padding-top: 25px;
  .section-title {
    text-align: left;
    margin-left: auto;
    margin-right: auto;
    padding: 15px;
    &:after {
      left: 15px;
    }
  }
  .fg-item-container {
    padding: 0;
    @media screen and (min-width: 768px) {
      &:nth-of-type(3n+1) {
        clear: left;
      }
    }
    @media screen and (max-width: 767px) {
      &:nth-of-type(2n+1) {
        clear: left;
      }
    }

    .fg-item {
      @media screen and (max-width: 767px){
        img{
          width: 100% !important;
        }
      }
      position: relative;
      overflow: hidden;
      -webkit-backface-visibility: hidden;
      .product-details {
        position: absolute;
        top: 0;
        left: 0;
        .transition(1s all ease);
        right: 0;
        bottom: 0;
        background: fade(desaturate(black, 30%), 50%);
        .transform(scale(1));
        h3 {
          text-align: center;
          color: fade(white, 80%);
          display: block;
          text-align: center;
          font-weight: 300;
          letter-spacing: 1px;
          font-size: 14px;
          text-transform: uppercase;
          top: 50%;
          margin-bottom: 0;
          margin-top: 0;
          width: 100%;
          text-align: center;
          .transform(translateY(-50%));
          position: absolute;
          @media screen and (max-width: 767px) {
            font-size: 12px;
          }
        }
        opacity: 1;
      }
      @media screen and (min-width: 767px) {
        &:hover {
          .product-details {
            opacity: 1;
            .transform(scale(1));
          }
          img {
            .transform(scale(1.3));
            -webkit-filter: brightness(0.5);
            filter: brightness(0.5);
          }
        }

        img {
          width: 100%;
          .transition(0.4s all ease);
          -webkit-backface-visibility: hidden;
        }
      }
    }
    .fg-item-last {
      .product-details {
        opacity: 1;
        background: fade(black, 50%);
        .transform(scale(1));
        h3 span {
          display: inline-block;
          padding: 10px 15px;
          font-size: 12px;
          text-transform: uppercase;
          border: solid 3px #eee;
          color: #eee;
          .transition(0.2s all ease);
          @media screen and (min-width:767px){
            &:hover {
              .transform(scale(1.1));
            }
          }
        }
      }
    }
  }
}
