iframe {
    border: none;
    width: 100%
}

.page-links,.clearfix {
    clear: both
}

.process-area5 {
    background-size: contain !important;
    background-position: center !important;
    position: relative
}

.process-wrapper {
    position: relative
}

.process-wrapper .process-line {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(calc(-50% + 500px), calc(-50% - 25px));
    -ms-transform: translate(calc(-50% + 500px), calc(-50% - 25px));
    transform: translate(calc(-50% + 500px), calc(-50% - 25px));
    margin: 0 -500px;
    z-index: -1
}

.process-box {
    text-align: center;
    z-index: 1;
    position: relative;
}

.process-box .process-box_img {
    position: relative;
    border-radius: 50%;
    display: inline-block
}

.process-box .process-box_img:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50%;
    background: rgba(221,51,51,0.87);
    width: 100%;
    height: 100%;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    opacity: 0
}

.process-box .process-box_img img {
    width: 190px;
    padding: 20px;
    border-radius: 50%;
    border: 1px dashed var(--theme-color);
    -webkit-transition: 0.4s;
    transition: 0.4s
}

.process-box .process-box_img .process-box_icon span {
    position: absolute;
    height: 40px;
    width: 40px;
    line-height: 40px;
    border-radius: 50%;
    background: var(--theme-color);
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    color: var(--white-color);
    font-family: var(--title-font);
    left: -15px
}

.process-box .process-box_img .process-box_icon span.number1 {
    -webkit-transform: translate(-100%, -68px) rotate(-15deg);
    -ms-transform: translate(-100%, -68px) rotate(-15deg);
    transform: translate(-100%, -68px) rotate(-15deg)
}

.process-box .process-box_img .process-box_icon span.number2 {
    -webkit-transform: translate(-100%, -136px) rotate(15deg);
    -ms-transform: translate(-100%, -136px) rotate(15deg);
    transform: translate(-100%, -136px) rotate(15deg)
}

.process-box .process-box_img .process-box_icon span.number3 {
    -webkit-transform: translate(-100%, -90px) rotate(-13deg);
    -ms-transform: translate(-100%, -90px) rotate(-13deg);
    transform: translate(-100%, -90px) rotate(-13deg)
}

.process-box .process-box_img .process-box_icon span.number4 {
    -webkit-transform: translate(-100%, -140px) rotate(20deg);
    -ms-transform: translate(-100%, -140px) rotate(20deg);
    transform: translate(-100%, -140px) rotate(20deg)
}

.process-box .process-box_title {
    font-size: 22px;
    margin-top: 20px
}

.process-box .process-box_text {
    margin-bottom: -0.3em
}

.process-box:hover .process-box_img img {
    padding: 0;
    border-color: transparent
}

.process-box:hover .process-box_img:after {
    opacity: 1
}

@media (max-width: 1500px) {
    .process-wrapper .process-line {
        -webkit-transform:translate(calc(-50% + 330px), calc(-50% - 30px));
        -ms-transform: translate(calc(-50% + 330px), calc(-50% - 30px));
        transform: translate(calc(-50% + 330px), calc(-50% - 30px));
        margin: 0 -330px
    }

    .process-box .process-box_img .process-box_icon span.number1 {
        -webkit-transform: translate(-55%, -30px) rotate(-20deg);
        -ms-transform: translate(-55%, -30px) rotate(-20deg);
        transform: translate(-55%, -30px) rotate(-20deg)
    }

    .process-box .process-box_img .process-box_icon span.number2 {
        -webkit-transform: translate(-100%, -145px) rotate(15deg);
        -ms-transform: translate(-100%, -145px) rotate(15deg);
        transform: translate(-100%, -145px) rotate(15deg)
    }

    .process-box .process-box_img .process-box_icon span.number3 {
        -webkit-transform: translate(-100%, -98px) rotate(-13deg);
        -ms-transform: translate(-100%, -98px) rotate(-13deg);
        transform: translate(-100%, -98px) rotate(-13deg)
    }

    .process-box .process-box_img .process-box_icon span.number4 {
        -webkit-transform: translate(-100%, -120px) rotate(20deg);
        -ms-transform: translate(-100%, -120px) rotate(20deg);
        transform: translate(-100%, -120px) rotate(20deg)
    }
}

@media (max-width: 1200px) {
   

    .process-box .process-box_img .process-box_icon span {
        left: 0;
        top: 15px;
        -webkit-transform: none !important;
        -ms-transform: none !important;
        transform: none !important
    }

    .process-box:hover .process-box_icon span {
        background: var(--title-color);
        color: var(--white-color);
        z-index: 2
    }
}

@media (max-width: 1199px) {
    .process-sec-img {
        position:relative;
        width: 100%;
        margin-bottom: 60px
    }

    .process-sec-img img {
        max-height: 500px
    }

    .process-bg-img {
        bottom: 0 !important;
        top: auto !important
    }
}