.bar {
    max-width: 800px;
    width: 100%;
    
    color: white;
    padding-top: 10px;
    padding-bottom: 10px;
    animation: bar-animation 1 4s;
    background: #6a9096;
}
  

    .bar0{ 
      margin-left: 20px;
      max-width: 80%;}
    .bar1{
      
        max-width: 13%;
      }
      .bar2{
        max-width: 16%;
      }
      .bar3{
        max-width: 70%;
      }
      .bar4{padding-top:25px;
        padding-bottom: 25px;
        max-width: 1%;
      }
      .bar5{
        max-width: 10%;
      }
      .bar6{padding-top:25px;
        padding-bottom: 25px;
        max-width: 5%;
      }
      .bar7{
        max-width: 55%;
      }
      .bar8{
        max-width: 70%;
      }
      .bar9{
        max-width: 30%;
      }
      .bar10{
        max-width: 100%;
      }
      .bar11{
        max-width: 20%;
      }
      .bar12{padding: 25px;
        padding-bottom: 25px;
        max-width: 7%;
      }
      .bar13{padding-top: 25px;
        padding-bottom: 25px;
        max-width: 1%;
      }
      .bar14{padding-top:25px;
        padding-bottom: 25px;
        max-width: 1%;
      }
      .bar15{
        max-width:100%;
      }
      
  @keyframes bar-animation{
    0%{
      width: 0px;
    }
    100%{
      width: 100%;
    }
  }