.service{
    position: relative;
    overflow: hidden;
    padding-bottom: 275px;
    &__background{
        position: absolute;
        top: 0;
        right: 0;
        z-index: -1;
        width: 61%;
        svg{
            width: 100%;
            height: 100%;
        }
    }
    &__background_shape{
        position: absolute;
        bottom: -10%;
        left: -7%;
        height: 465px;
        width: 410px;
        svg{
            width:100%;
        }
        @include desktop{
            display: none;
        }
    }
    &__background_pattern{
        position: absolute;
        bottom: 4%;
        left: 6%;
        animation: move_top 5s infinite linear;
        @include desktop{
            display: none;
        }
    }
    &__header{
        margin-bottom: 50px;
        span{
            font-size: 20px;
            font-family: $secondary-font;
            color: $secondary-color;
            position: relative;
            display: block;
            margin: 0 0 20px 30px;
            &::before{
                position: absolute;
                content: '';
                height: 2px;
                width: 20px;
                top: 50%;
                left: -20px;
                transform: translateX(-50%);
                background: $secondary-color;
            }
        }
        h1{
            margin: 0 0 30px 0;
            font-size: 50px;
            font-family: $primary-font;
            color: $secondary-color;
            line-height: 50px;
            @include tablet{
                font-size: 39px;
            }
        }
        p{
            margin: 0 0 0 0;
            font-family: $secondary-font;
            color: $secondary-color;
            font-size: 18px;
            line-height: 26px;
        }
    }
    &__slider{
        &_item{
            margin: 15px;
            padding: 30px;
            box-shadow: 0px 20px 40px 0px rgba(50,65,141,0.12);
            border-radius: 20px;
            background: $white;
            &-icon{
                height: 110px;
                width: 125px;
                position: relative;
                .icon-background{
                    position: absolute;
                    top: 0;
                    right: 0;
                }
                .icon{
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    z-index: 1;
                }
            }
            h4{
                font-size: 24px;
                font-family: $primary-font;
                color: $secondary-color;
                margin: 40px 0 30px 0;
            }
            p{
                font-family: $secondary-font;
                color: #7E7E8A;
                font-size: 16px;
                line-height: 30px;
                margin: 0;
            }
        }
        .slick-list {
            overflow: visible;
        }
        .slick-dots{
            display: flex;
            align-items: center;
            margin: 0;
            padding: 0;
            justify-content: center;
            li{
                margin: 0;
                list-style: none;
                height: 8px;
                width: 8px;
                &:not(:last-child){
                    margin-right: 15px;
                }
                button{
                    cursor: pointer;
                    height: 100%;
                    width: 100%;
                    background: #C2C8CC;
                    border-radius: 50%;
                    transition: all .3s ease;
                    display: block;
                    padding: 0;
                    text-indent: -9999px;
                    &:focus {
                        outline: 0;
                    }
                    &:hover{
                        background: $primary-color;
                    }
                }
                &.slick-active{
                    height: 10px;
                    width: 10px;
                    border-radius: 50%;
                    button{
                        background-color: $primary-color;
                    }
                }
            }
        }
        .slick-slide {
            &:focus{
                outline: 0;
            }
        }
    }
}