@media (max-width: 767.98px) {
  .display-1 {
    font-size: 5.5rem;
    font-weight: 300;
    line-height: 1.2;
  }

  .display-2 {
    font-size: 4.5rem;
    font-weight: 300;
    line-height: 1.2;
  }

  .display-3 {
    font-size: 3.5rem;
    font-weight: 300;
    line-height: 1.2;
  }

  .display-4 {
    font-size: 2.5rem;
  }
}

@media (max-width: 575.98px) {
  .display-1 {
    font-size: 4.5rem;
    font-weight: 300;
    line-height: 1.2;
  }

  .display-2 {
    font-size: 3.5rem;
    font-weight: 300;
    line-height: 1.2;
  }

  .display-3 {
    font-size: 2.5rem;
  }

  .display-4 {
    font-size: 2.25rem;
  }
}

.bi {
  vertical-align: -0.125em;
  margin-bottom: calc(-0.125em / 2);
}

@media print {
  @page {
    size: A4;
    
  }

  html,
  body {
    background: none !important;
  }

  .bg-light {
    background: none;
  }

  .jumbotron {
    background: none;
    padding: 0;
  }

  .progress{
    background-color: #f5f5f5 !important;
    border-radius: 4px !important;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1) !important;
  }
  
  .progress-bar{
    border: 2px solid #0000 !important;
    background-color: #428bca !important;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15) !important;
  }

  .col-print-1 {flex: 0 0 8%; max-width:8%;}
  .col-print-2 {flex: 0 0 16%; max-width:16%;}
  .col-print-3 {flex: 0 0 25%; max-width:25%;}
  .col-print-4 {flex: 0 0 33%; max-width:33%;}
  .col-print-5 {flex: 0 0 42%; max-width:42%;}
  .col-print-6 {flex: 0 0 50%; max-width:50%;}
  .col-print-7 {flex: 0 0 58%; max-width:58%;}
  .col-print-8 {flex: 0 0 66%; max-width:66%;}
  .col-print-9 {flex: 0 0 75%; max-width:75%;}
  .col-print-10{flex: 0 0 83%; max-width:83%;}
  .col-print-11{flex: 0 0 92%; max-width:92%;}
  .col-print-12{flex: 0 0 100%; max-width:100%;}
}