html,html *{box-sizing:border-box}

#tables-container{
    margin: auto;
    width: 70%;

}
#table-container{
    padding: 10px;
    margin: auto;
    width: auto;
    position: relative;
 /*  border: 3px solid;
    border-color:#006496;
    border-radius: 10px; 
    display: block; */
}

th.rotate {
  height: 140px;
  white-space: nowrap;
}

th.rotate > div {
  transform: 
    translate(25px, 100px)
    rotate(315deg);
  width: 30px;
}
th.rotate > div > span {
  border-bottom: 1px solid #ccc;
  padding: 5px 10px;
}

.overview-table {
  
}
table.overview-table thead tr td {
    background-color: rgba(0, 100, 150, 0.7);
    padding: 5px;
    margin: 5px;

}
table.overview-table tbody tr td {
    background-color: rgba(0, 100, 150, 0.3);
    opacity: 1;
    padding: 5px;
    margin: 5px;

}
#error-message{
	background-color: rgba(150,0, 0, 0.3);
	padding: 5px;
    text-align: right;
    border-radius: 10px;
    border:1px solid;
    border-color:rgba(150,0, 0, 0.7);
	width:100%
}
td.TableHead30 {
    width:30px;
    padding:0px;
    height:100px;
}
td.TableHead30 p{
    -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg);
    width: 10px;
}
td.Table30 {
    width:30px;
    height: 30px
}
div.TableHead90 {
    width:20px;
    height:20px;
    -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg);
}
td.TableHead140 {
width:140px;
height:100px;
}
td.Table140 {
width:140px;
height: 30px
}