div#div-walkapp .walkapp-container{max-width:800px;margin:0 auto;height:calc(100vh - 200px);background-position:center center;background-repeat:no-repeat;background-size:cover;position:relative;display:flex;flex-direction:column;align-items:flex-end;padding:20px 0;box-sizing:border-box}div#div-walkapp .current-progress-wrapper,div#div-walkapp .progress-wrapper{width:25%;min-width:340px;padding:20px;border-radius:8px 0 0 8px;box-sizing:border-box}div#div-walkapp .progress-wrapper{flex:5;display:flex;flex-direction:column;margin-bottom:20px;min-width:40px}div#div-walkapp .current-progress-wrapper{flex:1}div#div-walkapp h1{text-align:center;margin-top:0;margin-bottom:20px}div#div-walkapp h2{text-align:center;font-size:1.2em;margin-top:0;margin-bottom:15px}div#div-walkapp .progress-section{display:flex;flex:1;justify-content:flex-end}div#div-walkapp .progress-container{display:flex;position:relative;width:80%;height:100%;justify-content:flex-end}div#div-walkapp .progress-bar{width:6px;background-color:#e0e0e0;position:relative;height:calc(100% - 14px);margin-top:7px}div#div-walkapp .progress-fill{position:absolute;bottom:0;width:100%;background-color:var(--walkapp-color-progreso);height:0%}div#div-walkapp .city-markers{position:absolute;height:100%;width:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end}div#div-walkapp .city{display:flex;align-items:center;position:relative}div#div-walkapp .city-name{margin-right:20px;font-size:14px;text-align:right}div#div-walkapp .city-marker{width:12px;height:12px;background-color:#e0e0e0;border-radius:50%;position:absolute;right:3px;transform:translateX(50%)}div#div-walkapp .city-marker.completed{background-color:var(--walkapp-color-progreso)}div#div-walkapp .current-progress{width:100%}div#div-walkapp .current-route{display:flex;justify-content:space-between;margin-bottom:5px}.city-to,div#div-walkapp .city-from{font-weight:700}div#div-walkapp .progress-bar-small{height:10px;background-color:#e0e0e0;border-radius:5px;margin-bottom:5px;overflow:hidden}div#div-walkapp .progress-fill-small{height:100%;width:0%;background-color:var(--walkapp-color-progreso)}div#div-walkapp .current-stats{text-align:center;font-size:14px}@media (max-width:800px){div#div-walkapp .walkapp-container{padding:15px 0}div#div-walkapp .current-progress-wrapper,div#div-walkapp .progress-wrapper{min-width:300px;padding:15px}div#div-walkapp .progress-wrapper{top:15px;height:55%;min-width:150px}div#div-walkapp .current-progress-wrapper{bottom:15px}}@media (max-width:600px){div#div-walkapp .walkapp-container{padding:10px 0}div#div-walkapp .current-progress-wrapper,div#div-walkapp .progress-wrapper{min-width:250px;padding:10px}div#div-walkapp .progress-wrapper{top:10px;height:50%;min-width:150px}div#div-walkapp .current-progress-wrapper{bottom:10px}div#div-walkapp h1{font-size:1.5em;margin-bottom:15px}div#div-walkapp h2{font-size:1.1em;margin-bottom:10px}div#div-walkapp .city-name{font-size:12px}}div#div-walkapp .current-progress-wrapper{position:relative}div#div-walkapp .left-floating-button{position:absolute;left:10px;top:calc(100% - 80px);transform:translateY(-50%);border-radius:100px;cursor:pointer;box-shadow:0 2px 4px rgba(0,0,0,.2);width:90px;height:90px;text-align:center}