/* GENERAL */

html											{ overflow-y: scroll; }

#main-content							{ width: 600px; margin: 20px auto; padding: 20px; background: white; -moz-border-radius: 20px; -moz-box-shadow: #222 5px 5px 5px; -webkit-border-radius: 20px; -webkit-box-shadow: #222 5px 5px 5px; position: relative; }
pre												{ width: 96%; overflow-x: auto; overflow-y: hidden; margin: 0 0 12px 0; padding: 15px; background: #eee; border: 1px solid #ccc; }
code											{ font: 11px Monaco, Courier, MonoSpace; background: #eee; }
button										{ padding: 5px; }
button.selected						{ color: #00f; }

/* NAV */


#to-top										{ font: bold 40px Helvetica, Sans-Serif; text-decoration: none; position: fixed; top: 70px; left: 0px;width: 55px; height: 50px; background: #000; color: #fff; }


sup												{ color: red; font-size: 30px; }

#dl												{ position: absolute; top: 15px; right: 15px; text-decoration: none; background: #222; color: white; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; padding: 8px 14px; }
#dl:hover									{ background: #999; }

#use p,
.large p,
.small p									{ text-align: left; }
.info											{ margin: 10px auto; }
ul.info										{ width: 600px; }
div.info									{ width: 600px; }
div.info ul, ul.info			{ list-style: disc; }

/* CODE HIGHLIGHTING */
.c-wrap										{ background: #f3a01e; }
.c-ovrly									{ background: #95421e; }
.c-small									{ background: #d05d2a; }
.c-large									{ background: #7c48b5; }
.c-zoom										{ background: #4b8db5; }
.c-commt									{ background: #9dc425; }
.c-commt2									{ color: #6b861a; }

code											{ line-height: 14px; }


/* ZOOM CONTAINER */
.zoom											{ display: block; margin: 0 auto; }
.large										{ background: white; }

/* FOR TEXT DEMO */
.small p									{ font-size: 11px; width: 600px; font-family:Arial; margin:3px;}
.large p									{ font-size: 15px; width: 750px; padding-left:25px; }

/* FOR IMAGE DEMO */
.small img								{ width: 150px; height: 167px; }
.large img								{ width: 500px; height: 333px; }

/* CALENDAR SPECIFIC */
caption										{ background: #1634D8; padding: 3px; color: white; font: 14px Helvetica, Sans-Serif; text-transform: uppercase; letter-spacing: 1px; }
.calendar 								{ font-size: 14px; } /* double the small calendar font size */
.calendar td,
.calendar th							{ padding: 1px; border: 2px solid white; }
.calendar td a						{ display: block; padding: 3px; background: #900; color: white; }
#months-tables .calendar td a:hover,
#months-tables .calendar td a[style]:hover  { background: black !important; text-decoration: none; }
.day 											{ text-align: center; }
.past-day									{ background-color: #eee; }
#months-tables						{ width: 100%; }
#months-tables td					{ vertical-align: top; }
td												{ vertical-align: top; }
.single-month 						{ padding-right: 10px; }
.small .calendar 					{ font-size: 10px; margin: 0 auto; }
.small .calendar td,
.small .calendar th				{ width: 12px; height: 12px; border: 1px solid white; padding: 0; }
.small .calendar td a 		{ padding: 0; display: block; width: 12px; height: 12px; } 
.small .calendar td.day 	{ background: #eee; }
.small .calendar td.past-day				{ background: #999; }
.small a 									{ border: 0; }
.small #months-tables 		{ width: auto; }
.small caption 						{ font-size: 7px; white-space: nowrap; }
