• File: _benefit.scss
  • Full Path: /home/monpetu/www/leoreno.fr/wp-content/themes/buildexo/assets/scss/components/_benefit.scss
  • Date Modified: 10/29/2024 2:43 PM
  • File size: 1.85 KB
  • MIME-type: text/plain
  • Charset: utf-8
.tx-benefit {
    z-index: 1;
    &:hover {
        .tx-item {
            &--bg {
                opacity: 1;
                @include transform(scale(1));
            }
            &--holder {
                border-color: transparent;
            }
            &--icon {
                &::before {
                    background-color: #e9e9e9;
                }
            }
        }
    }
    .tx-item {
        &--holder {
            padding: 32px 50px;
            padding-bottom: 40px;
            border: 2px solid #fff;
            @include transition(.3s);
        }
        &--bg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -1;
            opacity: 0;
            @include transition(.3s);
            @include transform(scale(0.9));
            background-size: cover;
        }
        &--icon {
            margin-bottom: 20px;
            position: relative;
            z-index: 1;
            &::before {
                position: absolute;
                top: 0;
                left: 0;
                width: 52px;
                height: 52px;
                @include border-radius(50%);
                background-color: #fefefe;
                content: "";
                z-index: -1;
                @include transition(.3s);
            }
        }
        &--title {
            font-size: 32px;
            color: #040a39;
            margin-bottom: 4px;
            a {
                color: inherit;
            }
            &:hover {
                color: var(--color-primary-2);
            }
        }
        &--content {
            font-size: 18px;
            line-height: 30px;
            color: #494949;
        }
    }
}
.benefit-pb {
    padding-bottom: 400px;
}