.ldev-steps {
    padding: 0 2.5rem 3rem 2.5rem;
    background-color: #ffffff;
    border-radius: 10px;
    margin-bottom: 1rem;
}
.steps-top {
    padding: 2rem 0;
    font-size: 2rem;
    min-height: 7rem;
    line-height: 1.2;
    font-weight: 500;
}
.steps-top+.steps-panel{margin-top: 40px;}
.how-to-charge {margin-bottom:4rem;}

@media (min-width: 1200px) {
    .ldev-steps {
        padding: 0 4rem 3rem 4rem;
        margin-bottom: 1rem;
    }
    .how-to-charge {margin-bottom:4rem;}
    .steps-top {
        padding: 3rem 0;
        font-size: 2.4rem;
        min-height: 9.9rem;
    }
    .steps-top+.steps-panel{margin-top: 30px;}
}


.steps-panel{list-style: none}
.ldev-question ul.steps-panel{padding: 0}
.step-stats {margin-bottom:15px;}
.step-stats-heading {
    font-size: 1.1em;
    font-weight: 600;
    margin-bottom: 10px;}
.steps-panel li{
    float: left;
    margin:0 0 8px;
    height: 16px;
    vertical-align: top;
    text-align: center;
}

.steps-panel li:first-of-type a{border-radius: 9px 0 0 9px}
.steps-panel li:last-of-type a{border-radius: 0 9px 9px 0}
.steps-panel li a{
    position: relative;
    height: 100%;
    display: block;
    background: #dadfdd; /*old clients*/
    background: linear-gradient(-45deg,hsla(0,0%,100%,.15) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.15) 0,hsla(0,0%,100%,.15) 75%,transparent 0) 0/30px 30px repeat-x,linear-gradient(90deg,#cfd3d2 0,#cfd3d2 50%,#cfd3d2) 0/var(--p,100%) fixed,#dadfdd;
}
.steps-panel li.active{
    cursor: pointer;
}
.steps-panel li.active a{
    background: #7F73FA; /*old clients*/
    background: linear-gradient(-45deg, hsla(0, 0%, 100%, .15) 25%, transparent 0, transparent 50%, hsla(0, 0%, 100%, .15) 0, hsla(0, 0%, 100%, .15) 75%, transparent 0) 0/30px 30px repeat-x, linear-gradient(90deg, #7266F3 0, #7266F3 50%, #cfd3d2) 0/var(--p, 100%) fixed, #dadfdd;
}
.steps-panel .accordion-item-icon {color:#fff;}
.steps-panel li span.step-name{
    display: inline-block;
    visibility: hidden;
    position: absolute;
    background: #7266F3;
    color: #fff;
    padding: 1px 4px;
    font-size: 13px;
    bottom: calc(100% + 10px);
    left: 1px;
    right: 0;
}

.steps-panel li span.step-name:after{
    content: '';
    display: block;
    position: absolute;
    bottom: -13px;
    left: 50%;
    margin-left: -4px;
    width: 4px;
    height: 4px;
    border:7px solid transparent;
    border-top-color:#7266F3;
}

.steps-panel li.active span.step-name,
.steps-panel li a:hover span.step-name
{
    visibility: visible;
}

.step-pane{display: none}
.step-pane.active{display: block}
.step-buttons .btn.disabled{
    background-color: #7F73FA;
    border-color: #7F73FA;
    opacity: .65;
    cursor: not-allowed;
}
.ldev-steps .ldev-btn-block{
    margin-bottom: 15px;
    margin-top: 7px;
}

@media (max-width: 767px) {
    .steps-panel li span.step-name{display: none !important}
    .steps-top+.steps-panel {margin-top: 15px;}
}