.text-overflow-1{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 1.5em;     
    max-height: 2.3em;     
    -webkit-line-clamp: 1; 
    -webkit-box-orient: vertical; 
}
.text-overflow-2{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 1.5em;     
    max-height: 3.7em;     
    -webkit-line-clamp: 2; 
    -webkit-box-orient: vertical; 
}
.text-overflow-3{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 1.5em;     
    max-height: 4.3em;     
    -webkit-line-clamp: 3; 
    -webkit-box-orient: vertical; 
}
@media (min-width: 576px) {
    .text-overflow-sm-1{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 2.3em;     
        -webkit-line-clamp: 1; 
        -webkit-box-orient: vertical; 
    }
    .text-overflow-sm-2{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 3.7em;     
        -webkit-line-clamp: 2; 
        -webkit-box-orient: vertical; 
    }
    .text-overflow-sm-3{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 4.3em;     
        -webkit-line-clamp: 3; 
        -webkit-box-orient: vertical; 
    }
    }

@media (min-width: 768px) {
    .text-overflow-md-1{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 2.3em;     
        -webkit-line-clamp: 1; 
        -webkit-box-orient: vertical; 
    }
    .text-overflow-md-2{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 3.7em;     
        -webkit-line-clamp: 2; 
        -webkit-box-orient: vertical; 
    }
    .text-overflow-md-3{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 4.3em;     
        -webkit-line-clamp: 3; 
        -webkit-box-orient: vertical;  
    }
    }

@media (min-width: 992px) {
    .text-overflow-lg-1{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 2.3em;     
        -webkit-line-clamp: 1; 
        -webkit-box-orient: vertical; 
    }
    .text-overflow-lg-2{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 3.7em;     
        -webkit-line-clamp: 2; 
        -webkit-box-orient: vertical; 
    }
    .text-overflow-lg-3{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 4.3em;     
        -webkit-line-clamp: 3; 
        -webkit-box-orient: vertical; 
    }
    }
@media (min-width: 1200px) {
    .text-overflow-xl-1{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 2.3em;     
        -webkit-line-clamp: 1; 
        -webkit-box-orient: vertical; 
    }
    .text-overflow-xl-2{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 3.7em;     
        -webkit-line-clamp: 2; 
        -webkit-box-orient: vertical; 
    }
    .text-overflow-xl-3{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        line-height: 1.5em;     
        max-height: 4.3em;     
        -webkit-line-clamp: 3; 
        -webkit-box-orient: vertical; 
    }
    }

    /* table to block */
/* tabel */
@media (max-width: 576px) {
	.table2block-xs thead {
	  border: none;
	  clip: rect(0 0 0 0);
	  height: 1px;
	  margin: -1px;
	  overflow: hidden;
	  /* padding: 0; */
	  position: absolute;
	  /* width: 1px; */
	}
	.table2block-xs tr {
	  border-bottom: 3px solid #0da9ef;
	  display: block;
	}
	.table2block-xs td {
	  border-bottom: 1px solid #0da9ef;
	  display: block;
	  text-align: right;
	}
	.table2block-xs td::before {
	  content: attr(data-label);
	  float: right;
	}
	.table2block-xs td{
		text-align: center;
	}
  }
  @media (max-width: 768px){
      .table2block-sm thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        /* padding: 0; */
        position: absolute;
        /* width: 1px; */
      }
      .table2block-sm tr {
        border-bottom: 3px solid #0da9ef;
        display: block;
      }
      .table2block-sm td {
        border-bottom: 1px solid #0da9ef;
        display: block;
        text-align: right;
      }
      .table2block-sm td::before {
        content: attr(data-label);
        float: right;
      }
      .table2block-sm td{
          text-align: center;
      }
  }
  @media (max-width: 992px){
      .table2block-md thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        /* padding: 0; */
        position: absolute;
        /* width: 1px; */
      }
      .table2block-md tr {
        border-bottom: 3px solid #0da9ef;
        display: block;
      }
      .table2block-md td {
        border-bottom: 1px solid #0da9ef;
        display: block;
        text-align: right;
      }
      .table2block-md td::before {
        content: attr(data-label);
        float: right;
      }
      .table2block-md td{
          text-align: center;
      }
  }
  @media (max-width: 1200px){
      .table2block-lg thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        /* padding: 0; */
        position: absolute;
        /* width: 1px; */
      }
      .table2block-lg tr {
        border-bottom: 3px solid #0da9ef;
        display: block;
      }
      .table2block-lg td {
        border-bottom: 1px solid #0da9ef;
        display: block;
        text-align: right;
      }
      .table2block-lg td::before {
        content: attr(data-label);
        float: right;
      }
      .table2block-lg td{
          text-align: center;
      }
  }
  @media (min-width: 1200px){
      .table2block-xl thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        /* padding: 0; */
        position: absolute;
        /* width: 1px; */
      }
      .table2block-xl tr {
        border-bottom: 3px solid #0da9ef;
        display: block;
      }
      .table2block-xl td {
        border-bottom: 1px solid #0da9ef;
        display: block;
        text-align: right;
      }
      .table2block-xl td::before {
        content: attr(data-label);
        float: right;
      }
      .table2block-xl td{
          text-align: center;
      }
  }