.ballstep{padding:5px 12px 15px 12px;}

.step-section{margin-top:10px;margin-bottom:20px;}
.step-guru{
    background:#232323;padding:5px 8px 5px 20px;text-align:left;
    border-radius:6px;-khtml-border-radius:6px;-moz-border-radius:6px;
}
.step-guru .guru-img{
    overflow:hidden;border:2px solid #aaa;margin-right:6px;
    display:inline-block;vertical-align:middle;width:30px;height:30px;
    border-radius:4px;-khtml-border-radius:4px;-moz-border-radius:4px;
}
.step-guru .guru-img img{display:inline-block;vertical-align:top;width:100%;}
.step-guru .guru-name{display:inline-block;vertical-align:middle;font-weight:400;font-size:1rem;color:#fff;}

.step-select{
    margin-top:5px;display:flex;flex-direction:row;gap:8px;flex-wrap:nowrap;
    border-radius:8px;-khtml-border-radius:8px;-moz-border-radius:8px;
}
.step-select .step-cols{background:#fdf1ba;width:33.33%;padding:15px 10px;text-align:center;}
.step-select .step-images{padding:0 8px 5px 8px;}
.step-select .step-logo{
    display:inline-block;vertical-align:middle;width:100px;height:100px;
    padding:6px;overflow:hidden;border:2px solid #fff;
    border-radius:50%;-khtml-border-radius:50%;-moz-border-radius:50%;
}
.step-select .step-logo img{display:inline-block;vertical-align:top;width:100%;}

.step-select .step-shows{margin-top:5px;}
.step-select .bg-txshow{
    padding:2px 20px;background:#fed000;
    border-radius:25px;-khtml-border-radius:25px;-moz-border-radius:25px;
}

@media screen and (min-width:590px) and (max-width:799px){
    .ballstep{padding:5px 0 15px 0;}
    .step-select .bg-txshow{display:block;white-space:nowrap;overflow:hidden;text-overflow:'..';}
}

@media screen and (min-width:280px) and (max-width:589px){
    .ballstep{padding:5px 0 15px 0;}

    .step-select{flex-wrap:wrap;}
    .step-select .step-cols{width:100%;}
}