/*================================================
    08. Practice Area CSS
=================================================*/
#ic-practice-area {
    [class^="col-"] {
        @include flexbox();
    }
    padding-bottom: 70px;
    //Responsive
    @media #{$laptop-device}{
        padding-bottom: 50px;
    }
    @media #{$desktop-device}{
        padding-bottom: 50px;
    }
    @media #{$tablet-device}{
        padding-bottom: 40px;
    }
    @media #{$large-mobile}{
        padding-bottom: 30px;
    }
}

.ic-single-practice-box {
    text-align: center;
    @include box-shadow(1px 1.732px 7.68px 0.32px rgba(21, 19, 16, 0.03));
    background-color: #fff;
    padding: 35px 20px 30px;
    margin-bottom: 30px;
    @include transition(all .3s ease-out);

    .ic-icon-font {
        @include transition(all .3s ease-out .1s);
    }

    a {
        color: $text-color;
    }

    h4 {
        margin-bottom: 20px;
        font-weight: 900;
        @include transition(all .3s ease-out);
    }

    &:hover {
        @include box-shadow(1.5px 2.598px 11.28px 0.72px rgba(158, 109, 54, 0.2));

        .ic-icon-font {
            transform: scaleX(-1);

            i {
                color: $primary;
            }
        }

        h4 {
            color: $primary;
        }
    }
}

.ic-icon-font {
    width: 60px;
    height: 60px;
    background-color: #fff;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 40px;
    @extend %flex-center;
    @include box-shadow(1px 1.732px 7.68px 0.32px rgba(21, 19, 16, 0.05));

    i {
        font-size: 36px;
        @include transition(all .3s ease-in-out);
    }
}


.ic-experience-lawyer-content {
    .ic-content-col {
        @include align-items(center);

        .ic-single-feature {
            overflow: hidden;

            .ic-icon {
                @extend %flex-center;
                width: 70px;
                height: 70px;
                float: left;
                background-color: rgb(255, 255, 255);
                @include box-shadow(1px 1.732px 7.68px 0.32px rgba(21, 19, 16, 0.05));
                @include transition (all .3s ease);

                i {
                    color: $primary;
                    font-size: 36px;
                    @include transition (all .3s ease);
                }
            }

            .ic-text {
                margin-left: 100px;
                margin-top: -3px;

                h4 {
                    color: $primary;
                    margin-bottom: 12px;
                }
            }

            &:not(:last-child) {
                margin-bottom: 35px;
            }

            &:hover {
                .ic-icon {
                    background-color: $primary;

                    i {
                        color: $white;
                    }
                }
            }
        }
    }
}

/*================================================
    19. Practice Area Details Page
=================================================*/
.ic-left-4-col {
    .ic-left-link-list {
        ul {
            li {
                list-style-type: none;

                &:not(:last-child) {
                    margin-bottom: 26px;
                }

                a {
                    color: $text-color;
                    font-size: 16px;

                    &.active,
                    &:hover {
                        color: $primary;
                        text-decoration: underline !important;
                    }
                }
            }
        }
    }
}

.ic-right-content,
.ic-left-4-col {
    h2 {
        margin-bottom: 32px;
        text-transform: capitalize
    }
}

.ic-right-content {
    blockquote {
        margin: 0 70px;
        position: relative;

        &::after,
        &::before {
            font-family: 'IcoFont' !important;
            font-style: normal;
            font-weight: normal;
            font-variant: normal;
            text-transform: none;
            white-space: nowrap;
            word-wrap: normal;
            direction: ltr;
            line-height: 1;
            -webkit-font-feature-settings: "liga";
            -webkit-font-smoothing: antialias;
            font-size: 24px;
            color: $primary;
        }

        &::before {
            content: "\efcd";
            position: absolute;
            right: 102.2%;
        }

        &::after {
            content: "\efce";
            top: 6px;
            margin-left: 7px;
            position: relative;
        }
    }
}

.ic-social-text-inline {
    @include align-items(center);

    h6 {
        color: $primary;
    }

    ul.social {
        margin-left: 55px;

        li {
            a {
                font-size: 16px;

                i {
                    color: $text-color;
                }

                &:hover {
                    i {
                        color: $primary;
                    }
                }
            }
        }
    }
}