/* Layout styles
=================================== */

.events-row {
    display: block;
    margin-bottom: 1em;
}

.events-row:after {
    content: '';
    display: table;
    clear:both;
    visibility: hidden;
    height: 0;
}

.events-layout {
    display: block;
    padding: 0;
    margin-left: -48px;
}

.events-column {
    display: inline-block;
    padding-left: 48px;
    box-sizing: border-box;
    vertical-align: top;
}

.events-column.main {
    width: 60%;
}

.events-column.sidebar {
    width: 40%;
}

.events-archive ul.event-list {
    list-style:none;
    margin: 0;
    padding: 0;
}

.events-archive li.event-list-item {
    margin: 0 0 1em;
    padding: 0;
}


/* Map styles
=================================== */
.map-frame iframe {
    width: 100%;
}

#map {
    display: none;
}

.toggle-hidden {
    display: none;
}


/* Datepicker styles
=================================== */
#datepicker .ui-datepicker {
    border: none;
    background: none;
    padding: 0;
    width: 100%;
}

#datepicker .ui-datepicker-header {
    background: none;
    border: none;
    border-radius: 0;
    margin: 0 0 12px;
    text-align: center;
}

#datepicker .ui-datepicker-title {
    cursor: pointer;
    display: inline-block;
    line-height: 0;
}

#datepicker .ui-datepicker-title span {
    color: black;
    line-height: 1.4;
    transition: color .35s ease;
    font-size: 18px;
}

#datepicker .ui-datepicker-title span:hover {
     color: black;
 }

#datepicker span.ui-datepicker-month {
    display: block;
}

#datepicker span.ui-datepicker-year {
    display: block;
    font-weight: 200;
    font-size: 14px;
}

#datepicker .ui-state-hover {
    background: none;
    border: none;
}

#datepicker .ui-datepicker-next,
#datepicker .ui-datepicker-prev {
    cursor: pointer;
    text-align: center;
    color: black;
}

#datepicker .ui-datepicker-next span,
#datepicker .ui-datepicker-prev span {
    display: none;
}

#datepicker .ui-datepicker-next:after,
#datepicker .ui-datepicker-prev:after {
     content: '\f060';
     display: inline-block;
     font-family: 'Font Awesome 5 Free', sans-serif;
     font-weight: 900;
     line-height: 1.2;
     text-align: center;
     font-size: 18px;
 }

#datepicker .ui-datepicker-next:hover,
#datepicker .ui-datepicker-prev:hover {
     color: royalblue;
}

#datepicker .ui-datepicker-next {
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}

#datepicker .ui-datepicker-next:after {
    content: '\f061';
}

#datepicker .ui-datepicker-prev {
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}

#datepicker .ui-datepicker-prev:after {
    content: '\f060';
}

#datepicker .ui-datepicker-calendar {}
#datepicker .ui-datepicker-calendar thead {}

#datepicker .ui-datepicker-calendar thead th {
    padding: 12px 0;
    background: black;

}

#datepicker .ui-datepicker-calendar thead th span {
    color: white;
}

#datepicker .ui-datepicker-calendar tbody {}
#datepicker .ui-datepicker-calendar tbody tr:first-child {}

#datepicker .ui-datepicker-calendar tbody tr:first-child td {
    padding-top: 12px;
}

#datepicker .ui-datepicker-calendar tbody td {
    text-align: center;
}

#datepicker .ui-state-default {
    border: none;
    background: none;
    text-align: center;
    display: inline-block;
    color: black;
    cursor: default;
    padding: 0;
    height: 40px;
    width: 100%;
    max-width: 40px;
    line-height: 40px;
    border-radius: 12px;
}

#datepicker .ui-state-default:hover {
    color: black;
}

#datepicker .ui-state-disabled {
    opacity: .5;
}

#datepicker .ui-datepicker-today {}

#datepicker .ui-datepicker-today a {
    background: lightslategrey !important;
    color: white;
    cursor: pointer;
}

#datepicker .ui-datepicker-today a:hover {
    color: white;
}

#datepicker .has-event {}

#datepicker .has-event a {
    cursor: pointer;
    color: white;
    background: black;
    transition: background .35s ease;
}

#datepicker .has-event a:hover {
    color: white;
    background: royalblue;
}

#datepicker .has-event.current {}

#datepicker .has-event.current a {
    background: royalblue;
}