*{box-sizing:border-box;margin:0;padding:0}body{background-color:#f5f5f5;font-family:Arial,sans-serif}.container{display:flex;width:100%}.left-panel{background-color:transparent;color:#fff;padding:0 40px 0 0;width:50%}.left-panel ul{list-style:none;padding:0}.step-item{align-items:stretch;border:2px solid #fff;border-radius:6px;cursor:pointer;display:flex;margin-bottom:10px;transition:background-color .3s,color .3s}.step-item .number{align-items:center;background-color:transparent;color:#fff;display:flex;font-size:40px;font-weight:700;justify-content:center;margin-right:10px;width:60px}.step-item .text{align-items:center;display:flex;font-size:20px;justify-content:start;line-height:24px;padding:15px}.step-item.active{background-color:#fff;border:none;border-radius:6px;color:#013e7f;position:relative}.step-item.active .number{background-color:#013e7f;border-bottom-left-radius:6px;border-top-left-radius:6px;color:#fff}.step-item.active:after{background-color:#fff;content:"";height:3px;left:100%;position:absolute;top:50%;transform:translateY(-50%);width:40px}.right-panel{background-color:#fff;border-radius:6px;flex-grow:1;padding:20px;width:50%}.content-block.active{display:block!important}@media (max-width:768px){.left-panel{padding:0}.container{flex-direction:column}.left-panel,.right-panel{width:100%}.step-item.active:after{display:none;width:20px}}