#unitCal { position: relative; font-family: verdana; font-size:10pt;}
.cal	{  
    width: 280px; 
    float: left; 
    margin: 10px 0 10px 10px;
}
.cal .header	{ 
    height: 48px; 
}
.calhdr a	{ 
    display: none; 
}
.calhdrl 		{ 
    background: url(/public/images/left-blue.png) no-repeat;  
    width:48px; 
    height:48px; 
    font-size: 9px; 
    color: #024879; 
    display: block; 
    float: left; 
    text-align: center; 
    text-indent: -9999px;  
}
.calhdrl:hover	{
    cursor: pointer; 
}
.calhdrr 		{ 
    background: url(/public/images/right-blue.png) no-repeat ;  
    width:48px; 
    height:48px; 
    font-size: 9px; 
    color: #024879; 
    display: block; 
    float: right; 
    text-align: center;   
    text-indent: -9999px; 
}
.calhdrr:hover	{
    cursor: pointer; 
}
.calhdrm 		{ 
    width: 180px;   
    color: #438BD3; 
    display: block; 
    float: left; 
    padding: 0; 
    margin: 10px 0 0 0;  
    text-align: center; 
    font-size:12pt;
}

.calbody span 		{ 
    display: block; 
    float: left; 
    width: 35px; 
    height: 25px;  
    border:1px grey solid; 
    padding: 10px 0 0 0; 
    margin: 1px; 
    text-align: center;  
}
.calbody span.dayhdr { 
    color: #141D6C; 
    font-weight: bold; 
    background:#3A85BE;
}
.oldday { 
    background: #dadada; 
}
.avday	{ 
    background: #fff;
}
.naday	{ 
    background: #E38384; 
}
.stday	{ 
    background: #3A85BE; 
}
.calbody span.hover	{ 
    background: #438BD3; 
}
.selday	{ 
    background: #AAC4DE; 
    color: #fff; 
 }

.cal .key	{ 
    clear: both; 
    margin: 20px 0 0 0; 
}
.cal .key span	{ 
    width: auto; 
    height: 20px;
    padding: 0; 
    margin: 3px 5px 0 0;  
}

.cal .key span.selday	{ 
    background: #AAC4DE; 
    color: #fff; 
    width: 15px; 
    margin: 0 5px 0 0;
}

.cal .key span.stday	{ 
    background: #3A85BE;
    color: #fff; 
    width: 15px; 
    margin: 0 5px 0 0;
}
.cal .key span.oldday	{ 
    width: 15px; 
    margin: 0 5px 0 0; 
    background: #dadada; 
}
.cal .key span.avday	{
    width: 15px; 
    margin: 0 5px 0 0;  
    background: #fff; 
}
.cal .key span.sspanay	{ 
    width: 15px; 
    background: #3A85BE; 
    margin: 0 5px 0 0;  
}
.cal .key span.naday	{ 
    width: 15px; 
    background: #E38384; 
    margin: 0 5px 0 0; 
}

#detail { 
    float: left; 
    width: 220px; 
    margin: 60px 0 0 0;
    background:#fff; 
    border:1px solid grey; 
    padding:10px;}
#detail span { 
    display: block; 
    width: 100%; 
    min-height:22px;
    float:left;
}
#detail span.heading { 
    float: left; 
    width: 70px; 
    margin: 0 0 0 0; 
}

#detail span.entry { 
    float: left; 
    width: auto; 
    vertical-align:bottom;
}

#detail span.discheading { 
    float: left; 
    width: 120px; 
    margin: 0 10px 0 0; 
}

#detail span.discentry { 
    float: right; 
    width: auto; 
    vertical-align:bottom;
}

#detail select { 
    padding: 2px 2px;
    margin-bottom: 5px;
}
#detail hr { 
    display: none; 
}
#detail .class		{ 
    display: block; 
}
#detail .duration	{ 
    //height: 30px; 
}
#detail .duration .heading	{ 
    margin: 3px 0 0 0; 
}
#detail .people	{ 
    height: 30px; 
}
#detail .people .heading	{ 
    margin: 3px 0 0 0; 
}
#detail .pets	{ 
    height: 30px;
}
#detail .pets .heading	{ 
    margin: 3px 0 0 0;
}
#detail .total	{ 
    font-weight: bold; 
}
#detail .holidaydetails	{ 
    margin: 10px 0; 
}
#detail .booknow {}
#detail .inactiveBtn {
    font-weight:bold; 
    border:none; 
    border-radius:5px; 
    padding: 5px 10px; 
    float: right; 
    background-color: grey; 
    color:white; 
}
#detail .activeBtn {
    font-weight:bold; 
    border:none; 
    border-radius:5px; 
    padding: 5px 10px; 
    float: right; 
    background-color: #3A85BE; 
    color:white; 
}

#detail .activeBtn:hover {
    cursor: pointer;
}


@media (max-width: 580px) and (min-width: 475px ) {
#unitCal {font-family: verdana; font-size:8pt; width:100%;}
.cal	 { width: 45%; margin:0px;}
.cal .header {width: 96%; 
              /* height:20px;  */
              float:left;}
.calhdrm {  font-size: 9pt;
            width: 48%;
            margin-top: 18px;}
.calbody span { width: 12%; height: 20px;}
.calhdrl {
    width:50px; 
    /* text-indent: 0px; */
}
.calhdrr { 
    width:50px; 
    /* text-indent: 0px; */
}
#detail { width: 45%; margin: 30px 0 0 0;}
}

@media (max-width: 475px) {
#unitCal {font-family: verdana; font-size:6pt; width:100%;}
.cal	 { width: 45%; margin:0px;}
.cal .header {width: 96%; 
              /* height:20px;  */
              float:left;}
.calhdrm  { font-size:14pt; width:60%; margin-top:12px;}
.calbody span { width: 12%; height: 20px;}
.calhdrl { 
    width:50px; 
    /* text-indent: 0px;*/
    /* height:8px;     */
}
.calhdrr { 
    width:50px; 
    /* text-indent: 0px;
    height:8px; */
}
#detail { width: 45%; margin: 10px 0 0 0;}
}
@media (max-width:290px) {
  .calhdrm  { font-size: 10pt;
    width: 55%;
    margin-top: 17px;
    font-weight: bold;}
}

@media (max-width:400px) {
.cal {width:100%;}
#detail {width:95%;}
}