/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/
 #events h3   {
	/* add your css rule here */
}


 #events p.duration, #events div.duration   {
	/* add your css rule here */
}


 #events p.description, #events div.description   {
	/* add your css rule here */
}


 #events .selectedEvent   {
	/* add your css rule here */
}


 #events input.reserve_time_btn   {
	/* add your css rule here */
}


 #events input.select_another_btn   {
	/* add your css rule here */
}


 #eventForm #start_date-block-container h3, #eventForm #timeline-container h3   {
	/* add your css rule here */
}


 #eventForm #save_button   {
	/* add your css rule here */
}


 div.ui-widget-content   {
	/* add your css rule here */
}


 div.ui-widget-header   {
	/* add your css rule here */
}


 #timeline-container table.timeline   {
	/* add your css rule here */
}


 .timeline td.not_worked_time   {
	/* add your css rule here */
}


 .timeline td.free_time   {
	/* add your css rule here */
}


 .timeline td.selected_time   {
	/* add your css rule here */
}


 .timeline td.reserved_time   {
	/* add your css rule here */
}


 div#loading   {
	/* add your css rule here */
}


 #start_date-block-container .zend_form dt, start_date-block-container .zend_form dt b, start_date-block-container .zend_form dd label   {
	/* add your css rule here */
}


html, body {
  background-color: #000 !important;
}


@media (max-width: 768px) {
  #header .nav-trigger {
    background-color: #000000 !important;
    border-radius: 6px !important;
    margin-top: 5px !important;
  }

  #header .nav-trigger::before,
  #header .nav-trigger::after,
  #header .nav-trigger span {
    background-color: #ffffff !important;
  }
}


@media (max-width: 768px) {
  #header .nav {
    background-color: #000000 !important;
    color: #ffffff !important;
  }

  #header .nav a,
  #header .nav li,
  #header .nav span {
    color: #ffffff !important;
    background-color: transparent !important;
  }

  #header .nav li:hover,
  #header .nav a:hover {
    color: #ff0055 !important;
  }
}


@media (max-width: 768px) {
  body,
  #header .nav,
  #header .nav ul,
  #header .nav li,
  #header .nav a {
    background-color: #000000 !important;
  }

  #header .nav-wrapper,
  #header .nav-wrapper::before,
  #header .nav-wrapper::after {
    background-color: #000000 !important;
  }

  .main, html {
    background-color: #000 !important;
  }
}


@media (max-width: 768px) {
  #header .nav a,
  #header .nav li,
  #header .nav span {
    color: #ffffff !important;
  }

  #header .nav a:hover,
  #header .nav li:hover,
  #header .nav span:hover {
    color: #ffffff !important;
  }

  #header .nav a:active,
  #header .nav a:focus {
    color: #ffffff !important;
  }
}


.btn, 
button, 
.sb-button, 
.sb-booking-btn-container a {
  opacity: 0;
  animation: fadeInButtons 0.01s ease-in-out forwards;;
  transform: translateY(10px);
}

/* Animazione di fade + leggero slide */
@keyframes fadeInButtons {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


a[href^="#book/category/"] {
  color: white !important;
  transition: color 0.2s ease;
}

a[href^="#book/category/"]:hover {
  color: black !important;
}