/*------------------- 
    Icons
------------------*/
.social-icons {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: center;
    align-items: center;

    li {
        margin-right: 10px;

        a {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            box-shadow: 0 0 0 2px #dfdfea inset;
            @include prefix(transition, all 0.4s linear, webkit moz o);

            i {
                display: flex;
                align-items: center;
                justify-content: center;
                width: 26px;
                height: 26px;
                border-radius: 50%;
                font-size: 12px;
                color: $color-white;
                background-color: $color-primary;
                @include prefix(transition, all 0.4s linear, webkit moz o);
            }

            &:hover {
                background-color: $color-secondary;
                box-shadow: 0 0 0 2px $color-secondary inset;

                i {
                    color: $color-secondary;
                    background-color: $color-white;
                }
            }
        }

        &:last-of-type {
            margin-right: 0;
        }
    }
}

.icon-arrow-right {
    font-size: 65%;
}

.plus-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: 22px;
    font-weight: 700;
    margin-right: 3px;
    font-style: normal;
    color: $color-white;
    background-color: $color-primary;
    @include prefix(transition, all 0.3s linear, webkit moz ms o);
}

.rating {
    .active {
        color: #f4572e;
    }
}