/* Some resets for compatibility with existing CSS */ .date_selector, .date_selector * { width: auto; height: auto; border: none; background: none; margin: 0; padding: 0; text-align: left; text-decoration: none; } .date_selector { background: #fbfbfb; border: 1px solid #ccc; padding: 10px; margin: 0; margin-top: -1px; position: absolute; z-index: 100000; display: none; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; box-shadow: 0 0 5px #aaa; -moz-box-shadow: 0 0 5px #aaa; -webkit-box-shadow: 0 0 5px #aaa; } .date_selector_ieframe { position: absolute; z-index: 99999; display: none; } .date_selector .nav { width: 17.5em; /* 7 * 2.5em */ } .date_selector .nav p { clear: none; } .date_selector .month_nav, .date_selector .year_nav { margin: 0 0 3px 0; padding: 0; display: block; position: relative; text-align: center; } .date_selector .month_nav { float: left; width: 55%; } .date_selector .year_nav { float: right; width: 42%; margin-right: -8px; /* Compensates for cell borders */ } .date_selector .month_name, .date_selector .year_name { font-weight: bold; line-height: 20px; } .date_selector .button { display: block; position: absolute; top: 0; width: 18px; height: 18px; line-height: 16px; font-weight: bold; color: #008ee8; text-align: center; font-size: 12px; overflow: hidden; border: 1px solid #ccc; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .date_selector .button:hover, .date_selector .button.hover { background: #ed9c35; color: #fff; cursor: pointer; border-color: #d77011; } .date_selector .prev { left: 0; } .date_selector .next { right: 0; } .date_selector table { border-spacing: 0; border-collapse: collapse; clear: both; margin: 0; } .date_selector th, .date_selector td { width: 2.5em; height: 2em; padding: 0 !important; text-align: center !important; color: #666; font-weight: normal; } .date_selector th { font-size: 11px; } .date_selector td { border: 1px solid #ccc; line-height: 2em; text-align: center; white-space: nowrap; color: #008ee8; background: #fff; } .date_selector td.today { background: #eee; } .date_selector td.unselected_month { color: #ccc; } .date_selector td.selectable_day { cursor: pointer; } .date_selector td.selected { background: #008ee8; color: #fff; font-weight: bold; } .date_selector td.selectable_day:hover, .date_selector td.selectable_day.hover { background: #ec8526; color: #fff; }