A quick post related to the Service Calendar, just in case you want to configure or to change the appearance.
The Link
Please refer to this link:https://msdn.microsoft.com/en-us/library/gg309501.aspx
Then you can try the CSS
The CSS Code
div.ganttBlockserviceappointmentStatus1 { border: 1px solid #FF0000; FILTER: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#FF0000',endColorstr='#FF0000'); background: -moz-linear-gradient(top, #FF0000 0%, #FF0000 100%); background: -webkit-linear-gradient(top, #FF0000 0%,#FF0000 100%); background: -ms-linear-gradient(top, #FF0000 0%,#FF0000 100%); background: linear-gradient(top, #FF0000 0%,#FF0000 100%); } div.ganttBlockserviceappointmentStatus2 { border: 1px solid #00FF00; FILTER: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#00FF00',endColorstr='#00FF00'); background: -moz-linear-gradient(top, #00FF00 0%, #00FF00 100%); background: -webkit-linear-gradient(top, #00FF00 0%,#00FF00 100%); background: -ms-linear-gradient(top, #00FF00 0%,#00FF00 100%); background: linear-gradient(top, #00FF00 0%,#00FF00 100%); } div.ganttBlockserviceappointmentStatus3 { border: 1px solid #0000FF; FILTER: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#0000FF',endColorstr='#0000FF'); background: -moz-linear-gradient(top, #0000FF 0%, #0000FF 100%); background: -webkit-linear-gradient(top, #0000FF 0%,#0000FF 100%); background: -ms-linear-gradient(top, #0000FF 0%,#0000FF 100%); background: linear-gradient(top, #0000FF 0%,#0000FF 100%); } div.ganttBlockserviceappointmentStatus4 { border: 1px solid #FFFF00; FILTER: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#FFFF00',endColorstr='#FFFF00'); background: -moz-linear-gradient(top, #FFFF00 0%, #FFFF00 100%); background: -webkit-linear-gradient(top, #FFFF00 0%,#FFFF00 100%); background: -ms-linear-gradient(top, #FFFF00 0%,#FFFF00 100%); background: linear-gradient(top, #FFFF00 0%,#FFFF00 100%); } div.ganttBlockserviceappointmentStatus6 { border: 1px solid #FF00FF; FILTER: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#FF00FF',endColorstr='#FF00FF'); background: -moz-linear-gradient(top, #FF00FF 0%, #FF00FF 100%); background: -webkit-linear-gradient(top, #FF00FF 0%,#FF00FF 100%); background: -ms-linear-gradient(top, #FF00FF 0%,#FF00FF 100%); background: linear-gradient(top, #FF00FF 0%,#FF00FF 100%); } div.ganttBlockserviceappointmentStatus7 { border: 1px solid #00FFFF; FILTER: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#00FFFF',endColorstr='#00FFFF'); background: -moz-linear-gradient(top, #00FFFF 0%, #00FFFF 100%); background: -webkit-linear-gradient(top, #00FFFF 0%,#00FFFF 100%); background: -ms-linear-gradient(top, #00FFFF 0%,#00FFFF 100%); background: linear-gradient(top, #00FFFF 0%,#00FFFF 100%); } div.ganttBlockserviceappointmentStatus8 { border: 1px solid #7F7F7F; FILTER: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#7F7F7F',endColorstr='#7F7F7F'); background: -moz-linear-gradient(top, #7F7F7F 0%, #7F7F7F 100%); background: -webkit-linear-gradient(top, #7F7F7F 0%,#7F7F7F 100%); background: -ms-linear-gradient(top, #7F7F7F 0%,#7F7F7F 100%); background: linear-gradient(top, #7F7F7F 0%,#7F7F7F 100%); }
I know that this is limited configuration that you might expect more to configure!
Thanks