fieldset.jcalendar {
border:1px solid #A1A5A9;
font:.9em Arial, Helvetica, sans-serif;
}

div.jcalendar-wrapper {
width:20em;
}

div.jcalendar-selects {
padding:.6em .4em;
text-align:center;
}

div.jcalendar-selects select {
border:1px solid #A1A5A9;
font-size:100%;
}

div.jcalendar table {
background:#a1a5a9;
color:#000;
margin:.3em auto;
}

div.jcalendar table th {
background:#eee;
}

div.jcalendar table td {
background:#f9f9f9;
padding:0;
width:2.2em;
}

div.jcalendar table th.weekend {
background:#ddd;
}

div.jcalendar table td.weekend {
background:#e9e9e9;
}

div.jcalendar table td a {
color:#333;
display:block;
line-height:1.7em;
text-align:center;
text-decoration:none;
width:2.2em;
}

div.jcalendar table td.today a {
background:#777;
border-color:#aaa;
color:#fff;
font-weight:700;
}

div.jcalendar table td a:hover,div.jcalendar table td a:focus,div.jcalendar table td a:active {
background:#77b0d3;
color:#fff;
padding:0;
}

div.jcalendar table td a.selected {
background:#0072b9;
color:#fff;
}

div.jcalendar-links {
margin:.4em;
text-align:center;
}

div.jcalendar-links a {
padding:.2em .4em;
}


#calendar table{
    background:#a9a9a9;
    color:#000;
    width:380px;
    height:350px;
    text-align: center;
}
#calendar th {
    background: #F9F9F9;
    padding:1px;
    /*height: 2.2em;*/
    
}

#calendar th a{
    width: 100%;
    /*height: 3.2em;*/
    /*line-height: 3.2em;*/
    padding-top:20px;
    display: block;
    text-align: center;
}

#calendar table td {
    background:#f9f9f9;
    padding:1px;
    width:18px;
    line-height: 40px;
    text-align: center;
}

#calendar .th{
    background:#a9a9a9;
    height: 40px;
    line-height: 40px;
    margin: 0;
    padding: 0;
}

#calendar .calendarHeader{
    font-weight: bold;
}

#calendar .calendarToday{
    background:#000 !important;
    color:#fff;
}
#calendar .calendarToday a{
    color: #fff !important;
}
#calendar .calendarToday a{
    color:#fff;
}

#calendar .calendarEvent{
    background:red;
    color:#fff;
    cursor: pointer;
}
#calendar .calendar td a {
    text-decoration: none;
    color: black;
    width: 100%;
    height: 100%;
    display: block;
}

#calendar .selectedDay{
    color: red ;
    font-weight: bold;
    background-color: #e9e9e9;
}

/* Calendar legend */
#calendar-legend{
   width: 450px;
   height: 30px;
}
.legend{
    width: 130px;
    height: 20px;
    margin-top: 5px;
    text-align: right;
    display: block;
    float: left;
}
.legend .square{
    width: 20px;
    height: 20px;
    border: 1px solid #A9A9A9;
    float: left;
}
#square-today{
    background-color: #000;
}
#square-reservated{
    background-color: red;
}
#square-selected{
    background-color: #E9E9E9;
}
.legend .text{
    width: 100px;
    float: right;
    text-align: left;
}