body{padding:30px;margin:0;width:100vw;height:100vh;box-sizing:border-box;font-family:Arial}.dark{background:#242f3e;color:#fff}.title{font-weight:bold;font-size:24px;margin-bottom:24px}.chartBlock{margin-bottom:100px}.chart{height:calc(100vh - 150px);position:relative}.chartSvg{width:100%;height:100%}.gorizontal,.value{transition:all 1s ease;opacity:0;transform:translateY(30px)}.gorizontal.remove,.value.remove{opacity:0;transition:all .5s ease;transform:translateY(-30px)}.gorizontal.active,.value.active{opacity:1;transform:translateY(0px)}.nav{margin-top:24px;width:100%;height:60px;position:relative;border:1px solid #ddeaf3}.dark .nav{border:1px solid rgba(31,42,56,0.5)}.navLeft{height:100%;background:rgba(221, 234, 243, 0.5);border-right:5px solid rgba(221, 234, 243, 0.5);position:absolute;top:0;left:0}.dark .navLeft{background:rgba(31, 42, 56, 0.5);border-right:5px solid rgba(67,89,117,0.5)}.navRight{height:100%;background:rgba(221, 234, 243, 0.5);border-left:5px solid rgba(221, 234, 243, 0.5);position:absolute;top:0;right:0}.dark .navRight{background:rgba(31, 42, 56, 0.5);border-left:5px solid rgba(67,89,117,0.5)}.navSvg{width:100%;height:100%}.legend{margin-top:10px;display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}.legendItem{padding:3px;border:1px solid #edf1f4;margin:0 10px 10px 0;border-radius:15px;display:flex;justify-content:flex-start;align-items:center;opacity:0.5;cursor:pointer}.dark .legendItem{border:1px solid #344658}.legendItem span{margin:0 10px;font-size:12px}.legendItem div{width:20px;height:20px;border-radius:10px;position:relative}.legendItem div:before{content:'';position:absolute;width:6px;height:2px;background:#fff;top:11px;left:4px;transform:rotate(45deg)}.legendItem div:after{content:'';position:absolute;width:10px;height:2px;background:#fff;top:10px;left:7px;transform:rotate(-45deg)}.legendItem.active{opacity:1}.footer{padding:20px 0;text-align:center}a{color:#36a8f1;cursor:pointer}a:hover{text-decoration:underline}.modal{background:#fff;box-shadow:0px 0px 3px rgba(0, 0, 0, 0.3);border-radius:10px;display:none;position:absolute;padding:15px;min-width:100px}.dark .modal{background:#253241;color:#fff}.modal.active{display:block}.modalDate{font-weight:bold;margin-bottom:15px}.modalLegend div{margin-bottom:5px}.modalLegend b{padding-right:5px;font-size:18px}.modalLegend span{font-size:14px}