body {
     background-color: #f9f9fa
 }

 .flex {
     -webkit-box-flex: 1;
     -ms-flex: 1 1 auto;
     flex: 1 1 auto
 }

 @media (max-width:991.98px) {
     .padding {
         padding: 1.5rem
     }
 }

 @media (max-width:767.98px) {
     .padding {
         padding: 1rem
     }
 }

 .padding {
     padding: 5rem
 }

 .card {
     background: #fff;
     border-width: 0;
     border-radius: .25rem;
     box-shadow: 0 1px 3px rgba(0, 0, 0, .05);
     margin-bottom: 1.5rem
 }

 .card {
     position: relative;
     display: flex;
     flex-direction: column;
     min-width: 0;
     word-wrap: break-word;
     background-color: #fff;
     background-clip: border-box;
     border: 1px solid rgba(19, 24, 44, .125);
     border-radius: .25rem
 }

 .card-header {
     padding: .75rem 1.25rem;
     margin-bottom: 0;
     background-color: rgba(19, 24, 44, .03);
     border-bottom: 1px solid rgba(19, 24, 44, .125)
 }

 .card-header:first-child {
     border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0
 }

 .card-footer, 
 .card-header {
     background-color: transparent;
     border-color: rgba(160, 175, 185, .15);
     background-clip: padding-box
 }
/* begin css chart line*/
 .body {
  margin: 0;
  overflow: hidden;
  background: #152B39;
  font-family: Courier, monospace;
  font-size: 14px;
  color:#ccc; 
}

.wrapper_chartline {
  display: block;
  margin: 5em auto;
  border: 2px solid #ffffff;
  width: 700px;
  height: 300px;
  position: relative;
}
p{text-align:center;}
.label {
  /*height: 1em;*/
  /*padding: .1em;*/
  /*background: rgba(255, 255, 255, .8);*/
  position: absolute;
  display: none;
  color:#333;
  
}
/* end css chart line*/