/* div for the calendar markup - text must be centered */
div#calendar {
  margin : 0px 0px 50px 120px;
  padding : 10px;
  text-align : center;
  width : 21em;
  border : 1px solid #ccc;
}

/* calendar heading color */
h2.calendar {
  color : #009999;
  font-weight : normal;
}

/* list info - monospace font must be used */
ul#days, ul.weeks {
  font-family : 'courier new', monospace;
  list-style-type : none;
  margin : 20px 0 20px 0;
}

/* day-box span styles - adjust with padding */ 
ul#days li span {
  background-color : #009999;
  border : 1px solid #000;
  cursor : help;
  font-weight : bold;
  color : #fff;
  padding : 5px;
}

/* active links boxes default state - adjust with padding */
ul.weeks li a.al, ul.weeks li a.na  { 
  color : #666;
  text-decoration : none;
  background-color : #99CCFF;
  border : 1px solid #999;
  padding : 5px;
}

/* all states of not-used links */
ul.weeks li a.na, ul.weeks li a.na:hover, ul.weeks li a.na:focus, ul.weeks li a.na:active   { 
  background : transparent;
  color : #666;
  cursor : default;
}

/* hover and focus state of active links */
ul.weeks li a.al:hover, ul.weeks li a.al:focus, ul.weeks li a.al:active {
  color : #000;
  background-color : #33CCFF;
  border : 1px solid #000;
  text-decoration : none;
  cursor : pointer;
}

/* not used link boxes - color and background should match - adjust with padding */
ul.weeks li a.nu { 
  color : #eee;
  padding : 5px;
  border : 1px solid #ccc;
  background-color : #eee;
  cursor : default;
}

/* to hide link separators */
span.sep {
  display : none;
}

/* this needs to be in conditional comment for IE only */
div#calendar {
  font-size : 0.9em;
  letter-spacing : 0.001em;
}

/* End Styles */