/* beautiful CSS dates - Kroc Camen - camendesign.com
   creative commons 3.0 attribution. share + remix this,
   just include "Kroc Camen" and/or "camendesign.com" in your CSS */
/* ==========================================================================*/

/* day */                        
a[rel~=bookmark]
   {
   display: block;
   position: relative;
   width: 35px;
   border: 1px solid #888885;
      -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   font: 16px/24px "Helvetica Neue", Arial, sans-serif;
   text-align: center;
   letter-spacing: 2px;
   text-decoration: none;
   color: #666;
   background: #fcfcfc url("/library/images/icons/date-day-bg.png") repeat-x left 18px;
   }

/* lift the suffix, so that the number is fully centered */
a[rel~=bookmark] sup
   {
   position: absolute;
   padding-top: 4px;
   font-size: 10px;
   line-height: 10px;
   letter-spacing: normal;
   }

/* year + month */
a[rel~=bookmark] abbr
   {
   display: block;
   font: 10px Verdana, sans-serif;
   letter-spacing: normal;
   color: white;
      -moz-border-radius-topright:  5px;
   -webkit-border-top-right-radius: 5px;
      -moz-border-radius-topleft:   5px;
   -webkit-border-top-left-radius:  5px;
   }

/* month */
a[rel~=bookmark]>:first-child
   {
   width: 25px;
   margin: -1px 0 0 -1px;
   padding: 0 5px;
   border: 1px solid #832a28;
   line-height: 16px;
   text-align: center;
   text-transform: uppercase;
   background: #a33537 url("/library/images/icons/date-month-bg.png") repeat-x bottom left;
   }


/* since the date is the permalink, add a focus rectangle around it when hovering */
/*
a[rel~=bookmark]:hover,
a[rel~=bookmark]:focus
   {
   margin-bottom: 0;
   text-decoration: none;
   outline: auto 5px -webkit-focus-ring-color;
   outline-offset: -2px;
   -moz-outline:
   -moz-mac-focusring solid 2px;
   -moz-outline-radius: 0 7px 7px;
   -moz-outline-offset: 0;
   }
*/


/*
a[rel~=bookmark]:hover sub,     /* show the time on mouse-over / keyboard-focus */
a[rel~=bookmark]:focus sub
   {display: block;}
*/

/* ==========================================================================*/
