/* timeslot */
.good_ts{
    width: 100px; height: 150px; 
    background: linear-gradient(180deg, #629F26 0%, #146C3C 100%);
    border: 3px solid #FFFFFF;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}

.bad_ts{
    width: 100px; height: 150px; 
    background: linear-gradient(180deg, #F3492C 0%, #BC4040 100%);
    border: 3px solid #FFFFFF;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}

.too_bad_ts{
    width: 100px; height: 150px; 
    background: linear-gradient(180deg, #AC2E10 0%, #551717 100%);
    border: 3px solid #FFFFFF;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}

.weird_ts{
    width: 100px; height: 150px; 
    background: linear-gradient(180deg, #F0960E 0%, #6C5914 100%);
    border: 3px solid #FFFFFF;
    border-radius: 16px;
    margin-left: 3px; margin-bottom: 3px;
    color: white
}

.heat_ts{
    width: 100px; height: 150px; 
    background: linear-gradient(180deg, rgb(101, 205, 219) 0%, rgb(20, 98, 108) 100%);
    border: 3px solid #FFFFFF;
    border-radius: 16px;
    margin-left: 3px; margin-bottom: 3px;
    color: white
}

/* device */
.good_device{
    width: 200px; height: 250px; 
    background: linear-gradient(180deg, #629F26 0%, #146C3C 100%);
    border: 3px solid #ffffff;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}

.bad_device{
    width: 200px; height: 250px; 
    background: linear-gradient(180deg, #F3492C 0%, #BC4040 100%);
    border: 3px solid #FFFFFF;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}

.too_bad_device{
    width: 200px; height: 250px; 
    background: linear-gradient(180deg, #AC2E10 0%, #551717 100%);
    border: 3px solid #FFFFFF;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}

.weird_device{
    width: 200px; height: 250px; 
    background: linear-gradient(180deg, #F0960E 0%, #6C5914 100%);
    border: 3px solid #FFFFFF;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white
}

.ps_device{
    width: 200px; height: 250px; 
    background: linear-gradient(180deg, rgb(101, 205, 219) 0%, rgb(20, 98, 108) 100%);
    border: 3px solid #FFFFFF;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white
}

.operation_button{
    width: 250px; height: 100px; 
    background: linear-gradient(180deg, rgb(101, 205, 219) 0%, rgb(20, 98, 108) 100%);
    border: 3px solid #FFFFFF;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white
}

/* basestation */
.basestation{
    width: 325px; height: 200px; 
    background: linear-gradient(180deg, #629F26 0%, #146C3C 100%);
    border: 3px solid #ffffff;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}

.bad_basestation{
    width: 325px; height: 200px; 
    background: linear-gradient(180deg, #F3492C 0%, #BC4040 100%);
    border: 3px solid #ffffff;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}

.unknown_basestation{
    width: 325px; height: 200px; 
    background: linear-gradient(180deg,#556970 0%, #35505A 100%);
    border: 3px solid #ffffff;
    border-radius: 16px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}




/* badges */
.good_badge{
    width: 50px; height: 50px; 
    background: linear-gradient(180deg, #629F26 0%, #146C3C 100%);
    border: 3px solid #ffffff;
    border-radius: 20px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}

.bad_badge{
    width: 50px; height: 50px; 
    background: linear-gradient(180deg, #F3492C 0%, #BC4040 100%);
    border: 3px solid #FFFFFF;
    border-radius: 20px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}

.too_bad_badge{
    width: 50px; height: 50px; 
    background: linear-gradient(180deg, #AC2E10 0%, #551717 100%);
    border: 3px solid #FFFFFF;
    border-radius: 20px;
    margin-left: 5px; margin-bottom: 5px;
    color: white;
}

.weird_badge{
    width: 50px; height: 50px; 
    background: linear-gradient(180deg, #F0960E 0%, #6C5914 100%);
    border: 3px solid #FFFFFF;
    border-radius: 20px;
    margin-left: 5px; margin-bottom: 5px;
    color: white
}

.ps_badge{
    width: 50px; height: 50px; 
    background: linear-gradient(180deg, rgb(101, 205, 219) 0%, rgb(20, 98, 108) 100%);
    border: 3px solid #FFFFFF;
    border-radius: 20px;
    margin-left: 5px; margin-bottom: 5px;
    color: white
}