.free-gift{
    background: $orange;
    color: $white;
    padding: 0 10px;
    height: 20px;
    font-size: 11px;
    text-transform: uppercase;
    line-height: 20px;
    .image-thumb &,.img-slider &{
        position: absolute;
        z-index: 100;
        left: 0;
        bottom: 0;
    }
    .icon-gift{
        font-size: 15px;
        vertical-align: middle;
        display: inline-block;
    }
    span{
      vertical-align: middle;
        display: inline-block;
              
    }
    &:before,&:after{
        content: "";
        border-left:10px solid transparent;
        border-right:10px solid transparent;
        margin-right: -10px;
        position: absolute;
        right: 0;
    }
    &:before{
        border-top:$orange 10px solid;
        top:0;
    }
    &:after{
        border-bottom:$orange 10px solid;
        bottom:0;
    }
}

.gift-listing{
    border: 1px solid #e0e0e0;
    margin-bottom:15px !important;
    .main-product{
        padding:20px 15px;
    }
    .imageBox{
        &:hover{
            box-shadow: none;
        }
        figure{
            min-height: 130px !important;
        }
    }
   
    .itemName{
        font-weight: 400;
        padding: 20px 10px;
        .item-image{
            float: left;
            margin-right: 15px;
            width: 70px;
            border: 1px solid #dfdfdf;
            padding:10px;
        }
        a{
            display: block;
            color:#434345;
            &.arrow-up:before{
                float:right;
                content:'\e90d';
                font-family: 'icomoon' !important;
                color:#918a8e;
                @include media-breakpoint-down(sm) {
                    display: none;
                }
            }
        }
        figcaption {
            p{
                padding-top:10px;
                color:#8f8f8f;
            }
        }
    }
  &.active{
      .itemName{
          a{
              &.arrow-up:before{
                  float:right;
                  content:'\e91e';
                  font-family: 'icomoon' !important;
              }
          }
      }
  } 
    .imageBox .image-thumb {
        height: 130px;
        img{
            max-height: 130px;
        }
    }
    .productTitle,.price-box {
        font-size:13px;
    }
    .imageBox{
        min-height: 270px;
        &:hover{
             figure {
                 a:after{
                    background:none;
                }
             }
        }
    }
}


.gift-listing{
    .gift-slider{
        .slick-slide{
            padding-left: 8px;
            padding-right: 8px;
        }
    }
}
#gift-slider{
    li{
        padding-left:10px;
        padding-right:10px;
        padding-bottom: 15px;
    }
}
.modal-content{
    height: 700px;
    overflow-y: auto;
    overflow-x:hidden;
    padding: 15px 25px;
    box-shadow: none !important;
    .close{
        font-size: 14px; 
        color: $white;
        cursor: pointer;  
        &:before{
            float:right;
            padding-left:5px;
            font-size: 12px;
            padding-top: 2px;
            color:#bcbabb;
        }
        &.bottom{
            display: block;
            width: 80px;
            margin: 20px auto;
            @include media-breakpoint-down(sm) {
                display: none;
            }
        }
    }
}
.modal-dialog{
    margin:65px auto 30px !important;
    max-width:850px;
    width:100%!important;
}

.available-gift {
    border-bottom: 1px solid #ececec;
    margin: 0 -10px 0;
    padding: 15px 15px 20px;
    overflow: hidden;
    display: block;
    white-space: nowrap;
    font-size: 12px;
    .icon-gift{
        margin-right:8px;
    }
   #slick-slider {
        display: none;
    }
    .slick-initialized{
        &#slick-slider {
            display: block;
        }
    }


    #slick-slider{
        .thumb{
            padding:15px 0;
            display: inline-block;
            white-space: normal;
            .prod-name{
                color:#4c4c4c;
            }
        }
        img{ 
            border: 1px solid #ddd;
            padding: 7px 12px;
            border-radius: 6px;
            height:65px;
        }
        .slick-prev{
            position: absolute;
            left: -3%;
            top: 35%;
            cursor: pointer;
        }
        .slick-next{
            position: absolute;
            right: -3%;
            top: 35%;
            cursor: pointer;
        }
        .slick-disabled{
            pointer-events: none;
        }
    }
}

.modal-title{
    text-transform: uppercase;
    font-size: 17px;
    text-align: center;
    font-weight: 700;
    padding-bottom: 15px;
}