FileMaster

Edit File: _homepage19.scss

.banner-homepage19 {
    position: relative;
    .container-banner {
        width: 100%;
        padding: 0px 40px;
        max-width: 1360px;
    }
    .banner-video {
        position: relative;
        display: flex;
        align-items: flex-end;
        padding: 0px 0px 95px 100px;
        background: url(../imgs/page/homepage19/banner.png) no-repeat top center;
        background-size: cover;
        height: 640px;
        &::before {
            content: "";
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;
            bottom: 0px;
            z-index: 1;
            background: url(../imgs/page/homepage19/bg-overlay.png) repeat;
        }
        .banner-video-inner {
            position: relative;
            z-index: 3;
            * {
                color: $color-white;
            }
        }
    } 
}
.collection-homepage19 {
    position: relative;
    width: 100%;
    padding: 0px 40px;
    .box-info-collection {
        background-color: #ffffffe3;
        padding: 36px;
        max-width: 370px;
        margin-left: 195px;
        position: absolute;
        top: 50%;
        z-index: 123;
        transform: translateY(-50%);
    }
    .container-collection {
        max-width: 1360px;
        margin: auto;
        width: 100%;
        background: url(../imgs/page/homepage19/banner2.png) no-repeat top right;
        background-size: cover;
        height: 550px;
        display: flex;
        align-items: center;
        position: relative;
        
        .point {
            position: absolute;
            top: 40%;
            left: 91%;
            height: 40px;
            width: 40px;
            background: url(../imgs/page/homepage19/point.svg) no-repeat center;
            .dropend {
                width: 100%;
                height: 100%;
                button {
                    background-color: transparent;
                    border: 0px;
                    height: 100%;
                    width: 100%;
                    &:after {
                        display: none;
                    }
                }
                .dropdown-menu {
                    border-radius: 8px;
                    padding: 0px;
                }
            }
            &.point-2 {
                top: 54%;
                left: 70%;
            }
            &.point-3 {
                top: 80%;
                left: 53%;
            }
        }
    } 
}
.box-product-list-home19 {
    padding: 80px 0px 0px 0px;
    .nav-tabs-style-4 {
        justify-content: flex-start;
        .nav-link {
            font-size: 24px;
            line-height: 32px;
        }
    }
}
.box-news-home19 {
    padding: 60px 40px 90px 40px;
}
.banner-news-19 {
    max-width: 1360px;
    margin: auto;
    width: 100%;
    background: url(../imgs/page/homepage19/bg-news.png) no-repeat;
    background-size: cover;
    padding: 60px 0px;
}
.mw-270 {
    max-width: 270px;
    width: 100%;
}
.popup-product-collection {
    display: flex;
    background: $color-white;
    padding: 8px;
    border-radius: 8px;
    min-width: 200px;
    align-items: center;
    .popup-image {
        min-width: 64px;
        margin-right: 16px;
        max-width: 64px;
        img {
            display: block;
        }
    }
    .popup-info {
        width: 100%;
    }
}

Back