.chart-scale{
  display: flex;
  flex-wrap: wrap;
}
.btn-scale {
    text-align: center;
    font-weight: bold;
    color: rgb(253, 253, 253);
    font-family: 'Lato', sans-serif;
    width: 40px;
    height: 40px;
    font-size: 1rem;
    border-radius: 50%;
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0.5rem;
  }
.btn-scale[data-option-value]:hover {
  border-color: #999;
  color: #333;
}

.btn-scale[data-option-value]:focus {
  border-color: #999;
  color: #333;
}

.btn-scale[data-option-value][aria-checked=true] {
  color: #000;
  border: 3px solid #000;
  transform: scale(1.2);
}

.btn-scale[data-option-value][aria-checked=true]:focus {
  box-shadow: 0 0 5px #0074bd;
}

.btn-scale[data-option-value][aria-disabled=true],
.btn-scale[data-option-value][aria-disabled=true]:hover,
.btn-scale[data-option-value][aria-disabled=true]:focus {
  cursor: not-allowed;
  border-color: #ccc;
  color: #999;
}
  
  .btn-scale-asc-1, .btn-scale-desc-10 {
    background: rgb(64,179,71);
    background: linear-gradient(0deg, rgba(64,179,71,1) 0%, rgba(64,179,71,1) 0%);
  }
  
  .btn-scale-asc-1:hover,
  .btn-scale-desc-10:hover {
    background: rgb(64,179,71);
    background: linear-gradient(0deg, rgba(64,179,71,1) 0%, rgba(64,179,71,1) 0%);
  }
  
  .btn-scale-asc-2,
  .btn-scale-desc-9{
    background: rgb(64,179,71);
    background: linear-gradient(0deg, rgba(64,179,71,1) 0%, rgba(64,179,71,1) 0%);
  }
  
  .btn-scale-asc-2:hover,
  .btn-scale-desc-9:hover{
    background: rgb(64,179,71);
    background: linear-gradient(0deg, rgba(64,179,71,1) 0%, rgba(64,179,71,1) 0%);
  }
  
  .btn-scale-asc-3,
  .btn-scale-desc-8 {
    background: rgb(122,204,61);
    background: linear-gradient(0deg, rgba(122,204,61,1) 0%, rgba(122,204,61,1) 0%);
  }
  
  .btn-scale-asc-3:hover,
  .btn-scale-desc-8:hover {
    background: rgb(122,204,61);
    background: linear-gradient(0deg, rgba(122,204,61,1) 0%, rgba(122,204,61,1) 0%);
  }
  
  .btn-scale-asc-4,
  .btn-scale-desc-7 {
    background: rgb(122,204,61);
    background: linear-gradient(0deg, rgba(122,204,61,1) 0%, rgba(122,204,61,1) 0%);
  }
  
  .btn-scale-asc-4:hover,
  .btn-scale-desc-7:hover {
    background: rgb(122,204,61);
    background: linear-gradient(0deg, rgba(122,204,61,1) 0%, rgba(122,204,61,1) 0%);
  }
  
  .btn-scale-asc-5,
  .btn-scale-desc-6 {
    background: rgb(253,182,40);
    background: linear-gradient(0deg, rgba(253,182,40,1) 0%, rgba(253,182,40,1) 0%);
  }
  
  .btn-scale-asc-5:hover,
  .btn-scale-desc-6:hover {
    background: rgb(253,182,40);
    background: linear-gradient(0deg, rgba(253,182,40,1) 0%, rgba(253,182,40,1) 0%);
  }
  
  .btn-scale-asc-6,
  .btn-scale-desc-5 {
    background: rgb(251,234,69);
background: linear-gradient(0deg, rgba(251,234,69,1) 0%, rgba(252,179,10,1) 0%);;
  }
  
  .btn-scale-asc-6:hover,
  .btn-scale-desc-5:hover {
    background: rgb(251,234,69);
background: linear-gradient(0deg, rgba(251,234,69,1) 0%, rgba(252,179,10,1) 0%);;
  }
  
  .btn-scale-asc-7,
  .btn-scale-desc-4 {
    background: rgb(222,99,55);
background: linear-gradient(0deg, rgba(222,99,55,1) 0%, rgba(222,99,55,1) 0%);
  }
  
  .btn-scale-asc-7:hover,
  .btn-scale-desc-4:hover {
    background: rgb(222,99,55);
background: linear-gradient(0deg, rgba(222,99,55,1) 0%, rgba(222,99,55,1) 0%);
  }
  
  .btn-scale-asc-8,
  .btn-scale-desc-3 {
    background: rgb(222,99,55);
background: linear-gradient(0deg, rgba(222,99,55,1) 0%, rgba(222,99,55,1) 0%);
  }
  
  .btn-scale-asc-8:hover,
  .btn-scale-desc-3:hover {
    background: rgb(222,99,55);
background: linear-gradient(0deg, rgba(222,99,55,1) 0%, rgba(222,99,55,1) 0%);
  }
  
  .btn-scale-asc-9,
  .btn-scale-desc-2 {
    background: rgb(232,108,108);
    background: linear-gradient(0deg, rgba(232,108,108,1) 0%, rgba(232,108,108,1) 0%);
    
  }
  
  .btn-scale-asc-9:hover,
  .btn-scale-desc-2:hover {
    background: rgb(232,108,108);
    background: linear-gradient(0deg, rgba(232,108,108,1) 0%, rgba(232,108,108,1) 0%);
  }
  
  .btn-scale-asc-10,
  .btn-scale-desc-1 {
    background: rgb(232,108,108);
    background: linear-gradient(0deg, rgba(232,108,108,1) 0%, rgba(232,108,108,1) 0%);
  }
  
  .btn-scale-asc-10:hover,
  .btn-scale-desc-1:hover {
    background: rgb(232,108,108);
    background: linear-gradient(0deg, rgba(232,108,108,1) 0%, rgba(232,108,108,1) 0%);
  }