@font-face {
 font-family: Lobster;
 src: url(lobster.woff);
}

body, p {
 font-family: 'Poppins', Helvetica, Arial, sans-serif;
 font-size: 14px;
 margin: 0;
 padding: 0;
}

h1 {
 font-family: 'Poppins', Helvetica, Arial, sans-serif;
 text-align: center;
 font-size: 36px;
 font-weight: bold;
}

h2 {
 font-family: 'Poppins', Helvetica, Arial, sans-serif;
 font-size: 24px;
 font-weight: bold;
 text-align: left;
 margin: 0;
}

table {
 font-size: 14px;
}

th {
 font-weight: bold;
 text-align: left;
}

.header {
 color: rgb(151, 96, 124);
}

.divider-bk {
 background-color: rgb(173, 149, 183);
}

.paper-bk {
 background-color: rgb(254, 248, 232);
}

.paper {
 color: rgb(254, 248, 232);
}

.loginbar {
 font-size: 14px;
 font-family: 'Poppins', Helvetica, Arial, sans-serif;
 font-weight: bold;
 color: #47362C;
}

.loginbar a {
 text-decoration: none;
 color: inherit;
}

.small {
 font-size: 12px;
 font-weight: normal;
}

.message {
  border: 2px solid rgb(142, 108, 87);
  background-color: #F2E3DA;
  padding: 4px;
  margin: 4px;
}

.message p {
 font-weight: bold;
 font-style: italic;
 color: rgb(142, 108, 87);
 margin: 0px;
}

.ui-datepicker {
 font-size: 9pt !important;
}

.contentbox {
 width: auto;
 background-color: #ffffff;
 padding: 4px;
 padding-left: 7px;
 border-left: 4px solid #8AC007;
 border-right: 4px solid #8AC007;
 border-radius: 10px;
 -webkit-column-break-inside: avoid;
 break-inside: avoid;
}
.alertbox {
 width: 85%;
 background-color: #ffcccc;
 padding: 4px;
 padding-left: 7px;
 border-left: 4px solid #ff0000;
 border-right: 4px solid #ff0000;
 border-top: 4px solid #ff0000;
 border-bottom: 4px solid #ff0000;
 border-radius: 10px;
 -webkit-column-break-inside: avoid;
 break-inside: avoid;
 text-align: left;
}
.formbox {
 width: 50%;
 background-color: #ffffff;
 padding: 4px;
 padding-left: 7px;
 border-left: 4px solid #8AC007;
 border-right: 4px solid #8AC007;
 border-radius: 10px;
 -webkit-column-break-inside: avoid;
 break-inside: avoid;
}
.calendarcell {
 width: auto;
 min-height: 100px;
 background-color: #D9D9EC;
 padding: 4px;
 padding-left: 7px;
 border: 4px solid #D9D9EC;
 border-radius: 10px;
 -webkit-column-break-inside: avoid;
 break-inside: avoid;
}
.calendarcell.empty {
 background-color: inherit;
 border: 0;
}
.calendarcell.past {
 background-color: #EAEAEC;
 border: 4px solid #EAEAEC;
}
.calendarcell.day {
 background-color: #E0B2E0;
 border: 4px solid #E0B2E0;
}
.calendarcell.day.past {
 background-color: #E0D0E0;
 border: 4px solid #E0D0E0;
}
.calendarcell.night {
 background-color: #FFB280;
 border: 4px solid #FFB280;
}
.calendarcell.day.approvalspending {
 background-color: #F216E4;
 border: 4px solid #F216E4
}
.calendarcell.night.approvalspending {
 background-color: #F216E4;
 border: 4px solid #F216E4
}
.calendarcell.night.past {
 background-color: #FFE9DB;
 border: 4px solid #FFE9DB;
}
.calendarcell.today {
 background-color: #FFFF66;
 border: 4px solid #FFFF66;
}

.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width:auto;
  max-width: 600px;
  margin: 20px auto;
}

.collection {
 width: 240px;
 padding: 3px;
 border: 3px solid #aaaaaa;
 border-radius: 10px;
}
.dropoff {
 width: 240px;
 padding: 3px;
 border: 3px solid #aaaaaa;
 border-radius: 10px;
}
li.listitem {
 padding: 2px;
 margin: 3px;
 width: 220px;
 height: 50px;
 border: 1px solid #aaaaaa;
 border-radius: 5px;
}
li.listitem.day {
 background-color: #E0B2E0;
}
li.listitem.night {
 background-color: #FFB280;
}
li.listitem.dropoff {
 background-color: #C8EEFA;
}
ol.vertical {
  margin: 0 0 9px 0;
  padding: 0;
  min-height: 10px; }
  ol.vertical li {
    display: block;
    margin: 5px;
    padding: 5px;
    border: 1px solid #cccccc;
    color: #0088cc;
    background: #eeeeee; }
  ol.vertical li.placeholder {
    position: relative;
    margin: 0;
    padding: 0;
    border: 0; }
    ol.vertical li.placeholder:before {
      position: absolute;
      content: "";
      width: 0;
      height: 0;
      margin-top: -5px;
      left: -5px;
      top: -4px;
      border: 5px solid transparent;
      border-left-color: red;
      border-right: none; }
body.dragging, body.dragging * {
  cursor: move !important;
}

.dragged {
  position: absolute;
  opacity: 0.5;
  z-index: 2000;
}

td.menu {
  text-align: center;
  color: #47362C;
  background-color: #AD95B7;
  font-weight: bold;
  border-spacing: 100px;
  text-transform: uppercase;
  vertical-align: middle;
  height: 40px;
}

td.menu.dog {
  background-color: #CEE6CE;
}

td.menu.finance {
  background-color: #FFCC80;
}

td.menu a {
  text-decoration: none;
  color: inherit;
  vertical-align: middle;
  line-height: 30px;
  display:block;
}

td.menu.highlight {
  background-color: #FEF8E8;
}

.dormant {
  background-color: #DDDDDD;
}

.notes {
  white-space: pre-wrap;
}