/* Just some base styles not needed for example to function */

body
{
  margin: 10px;
  padding: 0;
  width: 1000px;
}
	
/* Text rotation exmaples styles */
.datebox {
 float: left;
 background-color: #111111;
 border: 1px solid #990000;
 position: relative;
 margin: 10px 10px 5px 10px;
}
.av   { background-color: #331111;   }
.full { width: 900px;                }
.half { float:left; width: 440px; xheight: 120px; margin-right:8px; }
.tdle { width: 300px;                  }
.tdri { width: 500px;                  }

.year {
 display: block; 
 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
 xwriting-mode: bt-lr;
 -webkit-transform: rotate(-90deg);	
 -moz-transform: rotate(-90deg);
 -ms-transform: rotate(-90deg);
 -o-transform: rotate(-90deg);
 transform: rotate(-90deg);
 position: absolute;
 height: 100px;
 font-weight: bold;
 white-space: nowrap;
 font-size: 90%;
 padding: 15px;
 text-align: center; vertical-align: middle; line-height: 40%;

}
/* padding: 10px;  //top,right,bottom,left */

td.day
{
 display: xblock;
 text-align: left;
 vertical-align: top;
 padding: 10px 0px 10px 100px;  
} /* top,right,bottom,left */
.day
{
 display: block;
 text-align: left;
 vertical-align: top;
 padding: 10px 0px 10px 100px;  
} /* top,right,bottom,left */

	*:first-child+html .datebox .year { xright: -128px; } /* IE7 positions element differently to IE6 & 8 */
	.datebox span:nth-child(3)
	{
		right: -16px;
		bottom: 24px;
		writing-mode: lr-tb; 
	}



@media only screen and (max-device-width: 480px) {
        td, .full { -webkit-text-size-adjust:100% }
}