// Best product Start
.best-product-area{
    position: relative;
    .shape{
        position: absolute;
        right: 145px;
        bottom: 64px;
        opacity: .8;
        @media #{$lg}{
            right: 84px;
            bottom: 18px;
        }
         @media #{$md}{
            right: 84px;
            bottom: 18px;
        }
    }
    .bg-height{
        background-repeat: no-repeat;
        width: 100%;
        background-size: cover;
    }
    .best-product-caption{
        padding-top:150px;
        padding-bottom: 130px;
        @media #{$lg}{
            padding-top:150px;
            padding-bottom: 130px;
        } 
        @media #{$md}{
            padding-top: 80px;
            padding-bottom: 75px;
        } 
        @media #{$sm}{
            padding-top: 80px;
            padding-bottom: 75px;
        }
        @media #{$xs}{
            padding-top: 80px;
            padding-bottom: 75px;
        }
        h2{
            color:#000;
            font-size: 55px;
            font-weight: 700;
            line-height: 1.3;
            margin-bottom: 19px;
            @media #{$lg}{
                font-size: 45px;
            } 
            @media #{$md}{
                font-size: 45px;
            } 
            @media #{$sm}{
                font-size: 22px;
            }
            @media #{$xs}{
                font-size: 21px;
            }
        }
        p{
            color: #373b41;
            font-size: 20px;
            margin-bottom: 55px;
            @media #{$md}{
                font-size: 17px;
            } 
            @media #{$sm}{
                font-size: 17px;
            }
            @media #{$xs}{
                font-size: 17px;
            }
        }
    }
    .product-man{
        left: 9%;
        bottom: 0;
        z-index: 1;
    }
    .vertical-text{
        span{
            text-orientation: (150deg);
            writing-mode: vertical-lr;
            writing-mode: vertical-lr;
            transform: rotate(180deg);
            font-size: 117px;
            font-family: $font_2;
            font-weight: 700;
            text-transform: uppercase;
            -webkit-text-stroke: 1px #e6dfc6;
            -webkit-text-fill-color:transparent;
            position: relative;
            z-index: 0;
            
        }

    }
}


// Best-collection Start
.best-collection-area{
    .best-left-cap{
        h2{
            color:#000;
            font-size: 45px;
            font-weight: 700;
            line-height: 1.3;
            margin-bottom: 19px;
            @media #{$lg}{
                font-size: 33px;
            } 
              @media #{$md}{
                font-size: 33px;
            } 
             @media #{$sm}{
                font-size: 33px;
            } 
            @media #{$xs}{
                font-size: 33px;
            }
        }
        p{
            color: #373b41;
            font-size: 20px;
            margin-bottom: 55px;
        }
    }
    .best-left-img{
        padding-top: 130px;
        @media #{$md}{
            padding-top: 30px;
        }
         @media #{$sm}{
            padding-top: 30px;
        } 
        @media #{$xs}{
            padding-top: 30px;
        }



    }
    .best-mid-img{

    }
    // Riht cap
    .best-right-cap{
        float:right;
        .best-single{
            display: flex;
            align-items: end;
            .single-cap{
                &.active{
                    background: #2577fd;
                    padding: 10px 30px;
                    border-radius: 10px;
                    h4{
                        color: #fff;
                        font-family: $font_2;
                    }
                }
                text-align: right;
                h4{
                    color: #000000;
                    font-size: 18px;
                    line-height: 1.6;
                    font-family: $font_2;
                }
            }
            .single-img{
                padding-left: 25px;
                img{

                }
            }
        }
    }
}
// Best-collection End


// Latest Offers
.latest-height{
    height: 400px;
    background-repeat: no-repeat;
    background-size: cover;
}
.latest-wrapper{
    .latest-area{
        position: relative;
        .latest-caption{
            position: relative;
            z-index: 1;
            h2{
                color:#000;
                font-size: 45px;
                font-weight: 700;
                line-height: 1.3;
                margin-bottom: 19px;
                @media #{$lg}{
                    font-size: 36px;
                }
                @media #{$md}{
                    font-size: 35px;
                }
                @media #{$sm}{
                    font-size: 29px;
                }
                 @media #{$xs}{
                    font-size: 27px;
                }
            }
            p{
                color: #373b41;
                font-size: 20px;
                margin-bottom: 55px;
            }
        }
        .latest-subscribe{
            form{
                position: relative;
                input{
                    height: 60px;
                    width: 100%;
                    padding: 10px 32px;
                    border: 1px solid#fff;
                    border-radius: 30px;
                    @media #{$xs}{
                        padding: 10px 17px;
                    }
                     @media #{$sm}{
                        padding: 10px 17px;
                    }
                }
                button{
                    padding: 20px 47px;
                    background:#2577fd;
                    font-size: 14px;
                    font-weight: 300;
                    position: absolute;
                    right: 0;
                    border: 0;
                    cursor: pointer;
                    top: 0;
                    color:#fff;
                    border-radius: 30px;
                    @media #{$md}{
                        padding: 20px 33px;
                    } 
                    @media #{$xs}{
                        padding: 20px 14px;
                    }
                     @media #{$sm}{
                        padding: 20px 14px;
                    }
                }
            }
        }
        .man-shape{
            position: absolute;
            left: 34px;
            bottom: -77px;
            @media #{$laptop}{
                display: none;
            } 
            @media #{$lg}{
                display: none;
            }
             @media #{$md}{
                display: none;
            }
            @media #{$sm}{
                display: none;
            }
            @media #{$xs}{
                display: none;
            }
        }
    }
}


// gallery-area
.gallery-wrapper {
    .gallery-area{
        .gallery-items{
            display: flex;
            width: 20%;
            @media #{$md}{
                width: 50%;
            }
            @media #{$sm}{
                width: 50%;
            }
             @media #{$xs}{
                width: 50%;
            }
        }
    }
}