I'm trying to create a leave calendar excluding the weekends based on start time and end time.

[![enter image description here][1]][1]


I'm experiencing some sort of bug when I apply the codes below.

This code is too hide the weekends in the calendar

  

      <style type="text/css">
    table.ms-acal-month > tbody > tr > th:nth-of-type(1){
    	display:none;
    }
    table.ms-acal-month > tbody > tr > th:nth-of-type(7){
    	display:none;
    }
    table.ms-acal-month > tbody > tr > th:nth-of-type(8){
    	display:none;
    }
    table.ms-acal-month > tbody > tr > td:nth-of-type(7){
    	display:none;
    }
    table.ms-acal-month > tbody > tr.ms-acal-summary-itemrow > td:nth-of-type(6){
    	display:none;
    }
    table.ms-acal-month > tbody > tr.ms-acal-summary-dayrow > td:nth-of-type(6) > div{
    	display:none;
    }
    table.ms-acal-month > tbody > tr.ms-acal-summary-dayrow > td:nth-of-type(6){
    	border-top-width:0px;
    	border-right-width:0px;
    }
    </style>

Without this code, the add button under Friday does not appear.

    </style><style type="text/css">TABLE.ms-acal-month TR TH:first-child + TH + TH + TH + TH + TH + TH { DISPLAY: none !important } TABLE.ms-acal-month TR TH:first-child + TH + TH + TH + TH + TH + TH + TH { DISPLAY: none !important } TABLE.ms-acal-month TR TH:first-child { DISPLAY: none !important } TABLE.ms-acal-month TR TD + TD + TD + TD + TD + TD DIV { WIDTH: 1px; DISPLAY: none !important } TABLE.ms-acal-month TR TD + TD + TD + TD + TD + TD { WIDTH: 0.5% } TABLE.ms-acal-month TR TD + TD + TD + TD + TD + TD + TD { DISPLAY: none !important } TABLE.ms-acal-detail TR TD + TD + TD + TD + TD + TD { WIDTH: 0.5% !important } TABLE.ms-acal-detail TR TD + TD + TD + TD + TD + TD DIV { DISPLAY: none !important } TABLE.ms-acal-detail TR TD + TD + TD + TD + TD + TD + TD { DISPLAY: none !important } .ms-acal-month-top SPAN { DISPLAY: inline !important } .ms-acal-month-top SPAN + SPAN { DISPLAY: none !important } .ms-acal-week-top TD DIV SPAN { DISPLAY: inline !important } .ms-acal-week-top TD DIV SPAN + SPAN { DISPLAY: none !important }</style><br/><br/>​​​​​<br/>

Here is the image of the calendar I created.[![enter image description here][2]][2]


  [1]: https://i.sstatic.net/a2xgE.png
  [2]: https://i.sstatic.net/5mnLQ.png

When I try to set the **start time(Monday) and end time(Friday)** it works fine but if I try to set the **start time(Monday) and end time(Monday)** doesn't appear very well (**Vacation Leave 2**) the same as **Vacation Leave 6** which is Friday to Monday.