body {
  background: #66aacc;
}

::selection {
  background: transparent;
}

#frame {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 350px;
  margin: 120px auto;
  background: rgba(255, 255, 255, 0.05);
  box-shadow: inset 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(255, 255, 255, 0.6), 1px 1px 0 1px rgba(0, 0, 0, 0.15);
}
#frame #date_time {
  cursor: default;
  position: relative;
  height: 45px;
  font-family: Tahoma, Geneva, sans-serif;
  font-size: 80%;
  color: rgba(255, 255, 255, 0.6);
  text-shadow: 1px 1px rgba(0, 0, 0, 0.15);
  font-smooth: always;
  -webkit-font-smoothing: antialiased;
}
#frame #date_time .time {
  position: relative;
  float: left;
  width: 40%;
  height: 100%;
  display: box;
  box-pack: center;
  box-align: center;
  display: -ms-flexbox;
  -ms-flex-pack: center;
  -ms-flex-align: center;
  display: -moz-box;
  -moz-box-pack: center;
  -moz-box-align: center;
  display: -webkit-box;
  -webkit-box-pack: center;
  -webkit-box-align: center;
}
#frame #date_time .date {
  position: relative;
  float: left;
  width: 60%;
  height: 100%;
  display: box;
  box-pack: center;
  box-align: center;
  display: -ms-flexbox;
  -ms-flex-pack: center;
  -ms-flex-align: center;
  display: -moz-box;
  -moz-box-pack: center;
  -moz-box-align: center;
  display: -webkit-box;
  -webkit-box-pack: center;
  -webkit-box-align: center;
  box-shadow: -1px 0 rgba(255, 255, 255, 0.6), inset 1px 0 rgba(0, 0, 0, 0.15);
}
#frame #calendar .ui-datepicker {
  width: 100%;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  font-family: Tahoma, Geneva, sans-serif;
  font-size: 80%;
  color: rgba(255, 255, 255, 0.6);
  text-shadow: 1px 1px rgba(0, 0, 0, 0.15);
  font-smooth: always;
  -webkit-font-smoothing: antialiased;
}
#frame #calendar .ui-datepicker .ui-datepicker-header {
  cursor: default;
  padding: 0;
  margin: 0;
  border-radius: 0;
  border: 0;
  background: transparent;
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.15), inset 0 -1px rgba(255, 255, 255, 0.6), 0 1px rgba(0, 0, 0, 0.15), 0 -1px rgba(255, 255, 255, 0.6);
  color: rgba(255, 255, 255, 0.6);
  font-weight: normal;
  text-transform: uppercase;
}
#frame #calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-month {
  height: 50px;
  font-size: 140%;
  line-height: 50px;
}
#frame #calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-year {
  display: none;
}
#frame #calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-prev,
#frame #calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-next {
  cursor: pointer;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 50px;
  height: 50px;
  margin: auto;
  border-radius: 0;
}
#frame #calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-prev {
  left: 0;
}
#frame #calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-next {
  right: 0;
}
#frame #calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-prev:hover,
#frame #calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-next:hover {
  border: 0;
  background: transparent;
}
#frame #calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-prev .ui-icon,
#frame #calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-next .ui-icon {
  position: absolute;
  top: 0;
  left: 5px;
  right: 0;
  bottom: 0;
  width: 8px;
  height: 8px;
  margin: auto;
  border-width: 3px 0 0 3px;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.6);
  background: transparent;
  transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
#frame #calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-next .ui-icon {
  left: -5px;
  border-width: 3px 3px 0 0;
  transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
#frame #calendar .ui-datepicker .ui-datepicker-calendar {
  margin: 0;
  overflow: hidden;
}
#frame #calendar .ui-datepicker thead th {
  cursor: default;
  height: 25px;
  padding: 0;
  margin: 0;
  box-shadow: inset 0 -1px rgba(255, 255, 255, 0.6), 0 1px rgba(0, 0, 0, 0.15);
  color: rgba(255, 255, 255, 0.6);
  font-weight: normal;
  line-height: 25px;
  text-transform: uppercase;
}
#frame #calendar .ui-datepicker thead th:first-child.ui-datepicker-week-end {
  box-shadow: inset -1px 0 rgba(255, 255, 255, 0.6), 1px 0 rgba(0, 0, 0, 0.15);
}
#frame #calendar .ui-datepicker thead th:last-child.ui-datepicker-week-end {
  box-shadow: inset 1px 0 rgba(0, 0, 0, 0.15), -1px 0 rgba(255, 255, 255, 0.6);
}
#frame #calendar .ui-datepicker tbody td {
  padding: 0;
  margin: 0;
}
#frame #calendar .ui-datepicker tbody td a.ui-state-default {
  width: 50px;
  height: 50px;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  display: box;
  box-pack: center;
  box-align: center;
  display: -ms-flexbox;
  -ms-flex-pack: center;
  -ms-flex-align: center;
  display: -moz-box;
  -moz-box-pack: center;
  -moz-box-align: center;
  display: -webkit-box;
  -webkit-box-pack: center;
  -webkit-box-align: center;
  color: rgba(255, 255, 255, 0.6);
  text-align: center;
}
#frame #calendar .ui-datepicker tbody td a.ui-state-default:hover,
#frame #calendar .ui-datepicker tbody td a.ui-state-active,
#frame #calendar .ui-datepicker tbody td a.ui-state-highlight {
  font-size: 130%;
  font-weight: bold;
}