body .ui-widget {
    font-family: 'Open Sans';
    font-weight: 400;
    width: 100%;
}


body .ui-widget {
    font-family: 'Open Sans';
    font-weight: 400;
    width: 100%;
}
a.ui-state-default{
    padding: 12px 10px !important;
    text-align: center !important;
}
table.ui-datepicker-calendar tr th span {
    text-align: center;
    display: block;
}
	
#custom-calendar .ui-datepicker-inline {
    box-shadow: 0px 0px 11px 0px #00000054;
    border-radius: 18px;
}

#custom-calendar .ui-datepicker-header {
    background-color: transparent !important;
    border: none;
    text-transform: uppercase;
    font-family: sans-serif;
    padding: 12px 0px;
}

#custom-calendar .ui-datepicker-header .ui-datepicker-title {
    font-size: 22px;
}

#custom-calendar .ui-datepicker-header span.ui-icon {
    text-indent: 9 !important;
    background-image: none;
    position: relative !important;
    margin: auto;
    left: 0px;
    height: auto !important;
    display: table;
    padding: 0px 10px;
}

#custom-calendar .ui-datepicker-header a.ui-corner-all {
    width: auto !important;
    height: auto;
    top: 30%;
}

#custom-calendar a.ui-state-default {
    border: none;
    border-radius: 70px !important;
    width: 5.5em;
    height: 5.5em;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

#custom-calendar a.ui-state-default.ui-state-highlight {
    background-color: #000;
    color: #fff !important;
}

#custom-calendar thead span {
    font-size: 22px;
    color: #000;
    padding: 13px 0px;
}

/* Add this style to highlight dates with posts */
.datehavepostmi {
    background-color: #ffeeaa !important; /* Change this color to your preferred background color */
    color: #000 !important;
}



div#custom-calendar-posts ul {
    margin: 0px;
     box-shadow: 1px 0px 6px 4px #f4efef;
    padding: 15px;
    margin-top: 30px;
}
div#custom-calendar-posts ul li {
    list-style: none;
}
div#custom-calendar-posts ul li a {
    font-size: 18px;
}