.schedulerow {
  --bs-gutter-x: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  vertical-align: middle;
  text-align: center;

}
.schedulerow > [class*='col-'] {
  display: flex;
  flex-direction: column;
}

.box {
    padding-top: 50%; 
    padding-bottom: 50%;
    color:#ffffff;
    vertical-align: middle;
    text-align: center; 
}


.box1 {
    background-color:#d2941f;  
    padding-top: 50%;
    padding-bottom: 50%;
    color:#ffffff;
    vertical-align: middle;
    text-align: center;
}

.box2 {
    background-color:#5a7488;
    padding-top: 50%; 
    padding-bottom: 50%;
    color:#ffffff;
    vertical-align: middle;
    text-align: center;
}
.box3 {
    background-color:#786b87;
    color:#ffffff;
    padding-top: 50%; 
    padding-bottom: 50%;
    vertical-align: middle;
    text-align: center;

}

.box4 {
    background-color:#6c7b66;
    padding-top: 50%;
    padding-bottom: 50%;
    min-height: calc(width*1.3);  
    color:#ffffff;
    vertical-align: middle;
    text-align: center;

}
.box5 {
    background-color:#4b7f76;
    padding-top: 50%;
    padding-bottom: 50%;
    min-height: calc(width*1.3);  
    color:#ffffff;
    vertical-align: middle;
    text-align: center;
}

.box6 {
    background-color:#82724a;
    padding-top: 50%;
    padding-bottom: 50%;
    min-height: calc(width*1.3);  
    color:#ffffff;
    vertical-align: middle;
    text-align: center;
}
.box7 {
    background-color:#716558;
    padding-top: 50%;
    padding-bottom: 50%; 
    color:#ffffff;
    vertical-align: middle;
    text-align: center;
}
.box8 {
    background-color:#9d6046;
    padding-top: 50%;
    padding-bottom: 50%; 
    color:#ffffff;
    vertical-align: middle;
    text-align: center;
}

.box9 {
    background-color:#906063;
    padding-top: 50%;
    padding-bottom: 50%; 
    color:#ffffff;
    vertical-align: middle;
    text-align: center;
}

.box10 {
    background-color:#797c78;
    padding-top: 50%;
    padding-bottom: 50%; 
    color:#ffffff;
    vertical-align: middle;
    text-align: center;
}

.stextold {
    vertical-align: middle;
    text-align: center;
    color: white;
    position:absolute;
    white-space: normal;
    word-wrap: break-word;
    flex: 1;
}


.stext {
    height:10px;
}

@media only screen and (max-width: 768px) {
  /* For mobile phones: */
     .stext {
        font-size:small;
    }
    
    .td {
        font-size:small; 
    }
}