/* ============================================================================================== 
This copyright notice must be kept untouched in the stylesheet at all times.
The original version of this stylesheet and the associated (x)html 
is available at https://www.script-tutorials.com/php-ajax-calendar/
Copyright (c) Script Tutorials. All rights reserved.
This stylesheet and the associated (x)html may be modified in any way to fit your requirements.
================================================================================================= */
* {
  margin: 0;
  padding: 0;
}
body {
  background-color: #fff;
}
header h2 {
  font-size: 22px;
  margin: 0px auto;
  padding: 10px 0;
  width: 80%;
  text-align: center;
}
#calendar {
  -moz-user-select: none;
  border: 1px solid #eeeeee;
  border-radius: 6px 6px 6px 6px;
  color: #333333;
  font-family: Arial, sans-serif;
  font-size: 1.1em;
  margin: 10px auto;
  padding: 0.4em;
  width: 90%;
}
#calendar .navigation {
  background-color: #ff7800;
  border: 1px solid #fff;
  border-radius: 6px 6px 6px 6px;
  color: #ffffff;
  font-weight: bold;
  padding: 1px;
  position: relative;
}
#calendar .navigation .title {
  background: none repeat scroll 0 0 transparent;
  border-color: rgba(0, 0, 0, 0);
  color: inherit;
  line-height: 1.8em;
  margin: 0 2.3em;
  text-align: center;
}
#calendar .navigation .prev,
#calendar .navigation .next {
  background-image: url("../../images/nav.png");
  height: 24px;
  opacity: 0.9;
  position: absolute;
  top: 0px;
  width: 24px;
}
#calendar .navigation .prev {
  background-position: 0 0;
  left: 4px;
}
#calendar .navigation .next {
  background-position: -24px 0;
  right: 4px;
}
#calendar .navigation .prev:hover,
#calendar .navigation .next:hover {
  opacity: 1;
}
#calendar table {
  border-collapse: collapse;
  font-size: 0.9em;
  table-layout: fixed;
  width: 100%;
}
#calendar table th {
  border: 0 none;
  font-weight: bold;
  padding: 0.7em 0.3em;
  text-align: center;
}
#calendar table td {
  border: 0 none;
  padding: 1px;
}
#calendar table td a {
  background-color: #eeeeee;
  border: 1px solid #d8dcdf;
  color: #004276;
  display: block;
  font-weight: normal;
  opacity: 0.7;
  padding: 0.2em;
  text-align: center;
  text-decoration: none;
}
#calendar table td a:hover {
  background-color: #f6f6f6;
  border: 1px solid #cdd5da;
  color: #111111;
}
#calendar table td.current a {
  font-weight: bold;
  cursor: pointer;
  opacity: 1;
}
#calendar table td.today a {
  background-color: #fbf8ee;
  border: 1px solid #fcd3a1;
  color: #444444;
  font-weight: bold;
  opacity: 1;
}
.red {
  background-color: #ff0000;
  text-align: center;
  color: #fff;
}