@media all and (max-width: 449px) {
    .my-breakpoint.ui-grid .ui-block { width: 100%; float:left;}
  }
  @media all and (min-width: 450px) and (max-width: 779px) {
    .my-breakpoint.ui-grid .ui-block { width: 50%; float:left;}
  }
  @media all and (min-width: 780px) {
    .my-breakpoint.ui-grid .ui-block { width: 33%; float:left;}
  }

  .tempiPS thead tr {
  	/*background-color: #005191;*/
  	color: white;
  	font-size: large;
    font-weight: bold;
    padding-top: 2%;
    padding-bottom: 2%;
    text-align: center;
    height: 40px;
  }
  table { width: 95%; }

  .tempiPS tbody tr:nth-child(even) {background: #FFF}
  .tempiPS tbody tr:nth-child(odd) {background: #F2F3F4}
  .tempiPS tbody tr {
      height: 40px;
  }

  .tempiPS tbody tr td div {
    text-align: right;
    border: 2px solid !important;
    border-color: lightgrey !important;
  }

  .tempiPS tbody tr td:nth-child(1) {
  	  width: 50%;
  }
  
  .tempiPS tbody tr td:nth-child(2) td:nth-child(3) td:nth-child(4) td:nth-child(5) td:nth-child(6) {
  	width: 10%;
  }

  .tempiPS tbody tr td:nth-child(2) div {
  	border: 3px solid;
    border-color: lightgrey;
    padding: 2px 6px 2px 6px;
  	background-color: #FF0000;
  }

  .tempiPS tbody tr td:nth-child(3) div {
  	border: 3px solid;
    border-color: lightgrey;
    padding: 2px 6px 2px 6px;
  	background-color: #FFA500;
  }
  .tempiPS tbody tr td:nth-child(4) div {
  	border: 3px solid;
    border-color: lightgrey;
    padding: 2px 6px 2px 6px;
  	background-color: #87CEFA;
  }  

  .tempiPS tbody tr td:nth-child(5) div {
  	border: 3px solid;
    border-color: lightgrey;
    padding: 2px 6px 2px 6px;
  	background-color: #32CD32;
  }
  
  .tempiPS tbody tr td:nth-child(6) div {
  	border: 3px solid;
    border-color: lightgrey;
    padding: 2px 6px 2px 6px;
  	background-color: white;
  }