/*
html, body {
  margin: 0;
  padding: 0;
  font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
  font-size: 14px;
}
*/


/*  */
#calendar {
  margin:0;padding:0;
}
                                                                          
#calendar .fc-timeGridWeek-button.active, #calendar .fc-timeGridDay-button.active, #calendar .fc-dayGridMonth-button.active {
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

/* header */
#calendar .fc-center h2{
  margin-top:20px;
}

#calendar .fc-left, #calendar .fc-right{
  padding-bottom:45px;
}

#calendar .fc-timeGridDay-view{
  width:50%!important;
  position:relative;left:30%;
}

#calendar .fc-event {
  cursor:pointer;
}

#calendar .fc-event .fc-time{
  font-size:1.2em;
  font-family:Arial;
}

/* color direct events **/
#calendar .fc-event.free{
  background-color: #54FF00!important;
  border-color:#54FF00; 
  color:black; 
}
#calendar .fc-event.reserved{
  background-color: red!important;
  border-color:red; 
  color:white;
}    
#calendar .fc-event.optional{
  background-color: orange!important;
  border-color:orange; 
  color:white;
}

/* hide direct events in MONTH VIEW */
#calendar .fc-day-grid-event{
    display:none;
}

/* hide bakcground events in WEEK nd DAY VIEWS */ 
#calendar .fc-timeGrid-view .event-month{
    display:none;
}

 
#calendar .fc-bgevent-skeleton{
  cursor:pointer;
}

/* when day is selected */ 
#calendar .fc-day.day-selected, #calendar .fc-day-header.day-selected {
  background-color:purple!important;
  border:5px solid rgba(128, 0, 128, 1)!important; 
  opacity:0.5!important;
  color:white!important;          
}
#calendar .fc-day.day-selected {
   border:5px solid rgba(128, 0, 128, 0.5)!important;       
}

/* default color of all cells */ 
#calendar .fc-day {
    
}    
/* default color of all events */
#calendar .fc-event {
}
/* color for past days */ 
#calendar .fc-past {
  background-color: #E7E7E7!important;
}
    
/* color for rendering */
#calendar .fc-bgevent{
  opacity: 1!important;
}
#calendar .fc-bgevent.reserved {
  background-color: red!important;
}
#calendar .fc-bgevent.free {
  background-color: #54FF00!important;
}
#calendar .fc-bgevent.optional {
  background-color: orange!important;
}
#calendar .fc-bgevent.partial {
  background-color: orange!important;
}

#calendar .fa-calendar-alt{
  font-weight:100!important;
  
}
/* TODO BETTER enlarge day top to display title */
#calendar  .fc-day-top{
  padding-bottom:8%;
  cursor:pointer; 
}

/* border day cells on MONTH view */
#calendar .fc-bgevent-skeleton table td{
  border:1px solid white!important;
}




/* tooltip */
    
/*  box-shadow offset-x | offset-y | blur-radius | color */

/*  */
.ui-tooltip {
  background: white!important;
  border: 1px solid black;
  box-shadow: 0 0 0 black;
  box-shadow: 8px 5px 10px black;
  border-radius: 10px;     
}

.arrow:after {
  background: black;
  border: 2px solid white;
}


/* tooltip original  
.ui-tooltip, .arrow:after {
  background: black;
  border: 2px solid white;
}
.ui-tooltip {
  padding: 10px 20px;
  color: white;
  border-radius: 20px;
  font: bold 14px "Helvetica Neue", Sans-Serif;
  text-transform: uppercase;
  box-shadow: 0 0 7px black;
}
*/    
.arrow {
  width: 70px;
  height: 16px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  margin-left: -35px;
  bottom: -16px;
}
.arrow.top {
  top: -16px;
  bottom: auto;
}
.arrow.left {
  left: 20%;
}
.arrow:after {
  content: "";
  position: absolute;
  left: 20px;
  top: -20px;
  width: 25px;
  height: 25px;
  box-shadow: 6px 5px 9px -9px black;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.arrow.top:after {
  bottom: -20px;
  top: auto;
}

div.month-tooltip.reserved{
  color:red;
}
div.month-tooltip.free{
  color:green;
}
div.month-tooltip.partial{
  color:orange;
}
   
   
/* date dropper */
#date-selector input{
  width:1px;height:1px;
}




/* arrow to change year and month are more visible */
div.datedropper .picker ul.pick .pick-arw.pick-arw-s1 {
  opacity: 0.5;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
} 

div.datedropper .picker ul.pick .pick-arw.pick-arw-s1:hover {
  opacity: 1;
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -o-transform: scale(1.5);
}

/* popup */
.pop-container .pop-fixer .pop-outer .pop-toolbar .pop-button {
  background-color: darkred;
  color:white;
  border-color:1px solid white;
}

.pop-container .pop-fixer .pop-outer .pop-toolbar .pop-button:hover {
  background-color: white;
  color:darkred;
  border:1px solid darkred;   
}

.pop-container h3 strong.free{
  color:#54FF00;
}
.pop-container h3 strong.reserved{
  color:red;
}

.pop-container a{
  color:darkred;
}
.pop-container a:hover{
  color:#707070;
}


/* legend */

.list_tours_tabs ul li h3{
  font-size:15px!important;	
}

.list_tours_tabs ul li.free h3:hover{
  color:#54FF00;
}
.list_tours_tabs ul li.reserved h3:hover{
  color:red;
}
.list_tours_tabs ul li.partial h3:hover{
  color:orange;
}

.list_tours_tabs ul li .block{
  width:45px;
  height:45px;
}

.list_tours_tabs ul li.free .block{
  background-color:#54FF00;
}
.list_tours_tabs ul li.reserved .block{
  background-color:red;
}
.list_tours_tabs ul li.partial .block{
  background-color:orange;
}