/*------------------------------
    Solution Area
------------------------------*/
.solution_area{
    background-color:var(--secondary-color);
    padding: 130px 0 100px;
    &.style-02{
        padding: 130px 0 200px;
        background: url(../img/bg/solution-bg.png) no-repeat center;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        .solution-item{
            margin-bottom: 30px;
        }
        .solution-bg{
            background: url(../img/solution/solution-bg.png) no-repeat center;
            background-size: cover;
            height: 100%;
            display: block;
            &:after{
                position: absolute;
                width: 100%;
                height: 100%;
                display: block;
                background: #FFDBDB 0% 0% no-repeat padding-box;
                opacity: 1;
                z-index: -1;
                content: '';
                right: 9%;
                top: 10%;
            }
        }
    }
    &.style-03{
        padding: 195px 0 120px;
        background: url(../img/bg/solution-bg.png) no-repeat center;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        .solution-item{
            margin-bottom: 30px;
        }
        .solution-bg{
            background: url(../img/solution/solution-bg.png) no-repeat center;
            background-size: cover;
            height: 100%;
            display: block;
            &:after{
                position: absolute;
                width: 100%;
                height: 100%;
                display: block;
                background: #FFDBDB 0% 0% no-repeat padding-box;
                opacity: 1;
                z-index: -1;
                content: '';
                left: 9%;
                top: -10%;
            }
        }
    }
    .solution-item{
        @include transition($transition);
        .solution-image{
            margin-bottom: 30px;
        }
        h4{
            font-weight: 700;
        }
        &:hover{
            .solution-image{
                img{
                    opacity: .5;
                }
            }
            h4{
                color: var(--active-color);
            }
        }
    }
}