.cal_module{
  min-width:300px;
}

div.cal_mod_row_menu{
  background:var(--background_row_menu);
  padding:10px;
  border-bottom: 0px solid silver;
  border-radius: 8px 8px 0 0;
}

div.cal_mod_row_menu  ul {
  padding:0;
  margin:0;
}

div.cal_mod_row_menu  ul li{
  list-style:none;
  display:inline-block;
  margin-right: 0px;
}

div.cal_mod_row_menu  ul li button{
  text-decoration:none;
  font-size:20px;
  padding:4px;  
  border: 0px;
}

div.cal_mod_row_menu  ul li button:hover{
  color:var(--main_color);
}

.date_time_mod_container{
  border-left: 1px solid var(--my_calendar_border_color);
  /*display:flex;*/
  background:silver;
}

.cal_mod_div_body {
  padding:0px 0px 0px 0px;
}

.cal_mod_div_head_month,
.cal_mod_div_head{
  padding:0px 0px 0px 0px;
  overflow:hidden;
}

.cal_mod_table_header, 
.cal_mod_table_body {
  width:100%;
  background: var(--my_calendar_cell_color);
  border-collapse: collapse;
}

.cal_mod_table_header td{
  width:13%;
  height:24px;
  box-sizing: border-box;
  border-right: 1px solid var(--my_calendar_border_color);
}

.cal_mod_table_body td{
  width:13%;
  vertical-align:top;
  border-right: 1px solid var(--my_calendar_border_color);
}

li.cal_mod_center_date span{
  font-size:14px;
  font-weight:bold;
  color:white;
}


td.cal_mod_day_caption{
  width:13%;
  color:var(--main_color, #F07746);
  font-size: 13px;
  font-weight:bold;
  text-align:center;
  background: var(--my_calendar_frame_color);
  border-bottom:1px solid var(--my_calendar_border_color);
  border-right: 1px solid var(--my_calendar_border_color);
  height:24px;
  box-sizing: border-box;
}

th.cal_mod_time_caption,
th.cal_mod_week_caption{
  font-size: 16px;
  font-weight:normal;
  text-align:center;
  vertical-align:middle;
  border-bottom:1px solid var(--my_calendar_border_color);
  border-right: 1px solid var(--my_calendar_border_color);
  height:24px;
  box-sizing: border-box;
}

th.cal_mod_week_caption{
  background: var(--my_calendar_frame_color);
}

th.cal_mod_time_caption{
  background: var(--my_dark_yellow);
  color: var(--my_prussian_blue);
}

.cal_mod_cell{
  height:24px;
  box-sizing: border-box;
  /*border:1px solid #ead098;*/
}


td.cal_mod_today{
  border-right: 2px solid var(--main_color, #F07746);
  border-left: 2px solid var(--main_color, #F07746);
  /*background:rgba(240,119,70,0.2);*/
}

td.cal_mod_today_month{
  vertical-align:top;
  border-bottom: 1px solid var(--my_calendar_border_color);
  background:rgba(240,119,70,0.2);
  color: var(--main_color, #F07746);
}

tr.cal_mod_week_row p{
   text-align:right;
   margin:0px;
   padding:0;
}

td.cal_mod_day_cell{
  background: var(--my_calendar_cell_color);
  vertical-align:top;
  /*border-bottom: 1px solid var(--my_calendar_border_color);*/
}

td.cal_mod_cell_grayed{
  background: var(--background);
  /*border-bottom: 1px solid var(--my_calendar_border_color);*/
}
.cal_mod_table_body td > p{
  font-weight:bold
}

td.cal_mod_cell_grayed > p{
  color:gray;
  font-weight:normal;
}

.time_mod_click_design,
.cal_mod_click_design{
  cursor:pointer;
  border-bottom: 1px solid var(--my_calendar_border_color);
}


.cal_mod_click_design:hover{
  background: rgba(192,192,192,0.5) !important;
}

.time_mod_click_design:hover{
  background: rgba(192,192,192,0.5) !important;
}


.time_mod{
  text-align: center;
  overflow-y: auto;
  min-width:12%;
  /*flex:auto;*/
  height:169px;
}

.calendar_time_table_body{
  width:100%;
  background: var(--my_calendar_cell_color);
}

.calendar_mod_hour_dark_cell{
  background:var(--my_calendar_dark_cell_color);
  min-width:100%;
}

.calendar_mod_hour_cell{
  background: var(--my_calendar_cell_color);
  min-width:100%;
}