@charset "UTF-8";

*{	
		width: 99%;
		max-width: 980px;
		margin-left:auto;
		margin-right:auto;
		margin-bottom:0px;
		margin-top:10px;
		padding:0;
		font-size:101%;
		font-family: Helvetica, sans-serif;
		-webkit-text-size-adjust:none;
	}
	.poem {
  display: table;
  margin-right: auto;
  margin-left: auto;
  margin-top: 1em;
}
.poemCentered {
  display: table;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}
/* put each stanza in a paragraph of this class*/
.stanza {
  text-indent: 0;
  margin-left: 2em;
  margin-bottom: 1em;
}
/* put each stanza line in a span of this class AND put <br/> after line*/
.stanzaline {
  margin-left: -2em;
}

	.clear {
		clear:both;
	}
	
	.spaced {
		margin-top: 5px;
	}
	
	.brownbox {
		background-color:#633;
	}
}	
	
	.indexheading {
		text-align:center;
		background-color:#633;
		height:70px;	
		width:100%;
		margin: auto;
		border-bottom:medium black  dashed ;
	}
	
	.indexheading h1 {
		margin-top:10px;
		font-size:200%;
		color:#FFFF00;
		background-color:#633;
		text-align: center ;
	}
	
	.indexheading img {
		margin-top:10px;
		background-color:#633;
	}
	
	.header {
		/* height:auto;	 */
		margin-top: 1px;
		width:100%;
		margin-left: auto ;
  		margin-right: auto ;
	}
	
	.header h1 {
		background-color:#633;
		padding: 10px 0;
		/* text-align: center; */
		color:#FFFF00;	
	}

	.header h2 {
		background:#633;
		padding: 10px 0;
		text-align: center;
		margin-top:0;
		margin-bottom:0;
		color:#FFFF00;	
	}
	
	.header h4 {
		background:#633;
		color:#FFFFCC;
		padding: 1px 0;
		text-align:center;	
	}
	
	
	.header h5 {
		background:#633;
		color:#FFFFCC;
		padding: 0px 0;
		margin-top:0;
		margin-bottom:0;
		text-align:center;	
	}
	
	.header h6 {
		background:#633;
		color:#FFFFCC;
		padding: 0px 0;
		margin-top:0;
		margin-bottom:0;
		text-align:center;	
		font-size:xx-small;
	}
	
	.feature {
		margin: 25px 50px 25px 5px;
		text-align:left;
		width: 95%;	
	}
	
	.feature h2 {
		font-size:larger;
	}
	
	.feature h3 {
		background:url(../images/redBlock.gif) no-repeat left center;	
		padding-left: 20px;
		margin-bottom: 15px;
		margin-top:10px;	
	}
	
	.feature h4{
		font-size:95%;	
		margin-bottom:1px;
		margin-top:1em;
	}
	
	.feature h5{
		font-size:smaller;
		margin-bottom:1px;
		margin-top:1px;
	}
	
	.feature h5.withnext {
		font-size:smaller;
		margin-bottom:1px;
		margin-top:6px;
	}
	
	.feature h6 {
		padding-left: 10px;
		margin-bottom: 5px;
		margin-top:5px;	
		font-size:small;
	}
	
	.feature p {
		padding-top:2px;
		padding-left:2px;
		padding-bottom:2px;
		padding-right:2px;
		/* background: #ffffff; */
		/* margin:5px; */
   		/* font: normal 1.7em Arial, Helvetica, sans-serif; */
	}
	
	.feature p.shorter {
		padding-top:2px;
		padding-left:15px;
		padding-bottom:2px;
		padding-right:2px;
		border-left-style:solid;
		border-left-width:thin;
	}
	
	.feature li {
		background-color: #ffffff;
  		margin-left: 5px;
  		padding-left: 40px;
		/* font: normal Arial, Helvetica, sans-serif; */
	}
	
	.feature ol {
	list-style-type: decimal;
	position: relative;
	font-size: smaller;
	padding-top: 5px;
	padding-right: 30px;
	padding-bottom: 5px;
	padding-left: 30px;
	margin-top: 4px;
	margin-right: 4px;
	margin-bottom: 5px;
	margin-left: 4px;
	}
	
	.feature ul {
	font-size: smaller;
	padding-top: 5px;
	padding-right: 150px;
	padding-bottom: 5px;
	padding-left: 20px;
	margin-top: 4px;
	margin-right: 150px;
	margin-bottom: 5px;
	margin-left: 4px;
	}
	
	.feature ul.common {
	font-weight:bold;
	/*font-size: 300%;*/
	padding-left: 5px;
	margin-left: 12px;
	}
	
	
	.feature ul.common li {
	font-size: smaller;
	font-weight:bold;
	padding-left: 0px;
	margin-left:5px;
	margin-right:50px;
	background-color:#FFFFCC;
	}
	
	.feature ol.common {
	font-weight:bold;
	/* font-size: 300%; */
	padding-left: 5px;
	margin-left: 12px;
	}
	
	.feature ol.common li {
	font-weight:bold;
	background-color:#FFFFCC;
	padding-left: 0px;
	margin-left:5px;
	margin-right:60px;
	font-size: smaller;
	}
	
	.feature ol.common li span {
		font-weight: normal;
		font-size:120%;
	}

	.feature ol.commonnone {
	font-weight:bold;
	/* font-size: 300%; */
	padding-left: 5px;
	margin-left: 12px;
	}

	.feature ol.commonnone li {
	font-weight:bold;
	background-color:#FFFFCC;
	padding-left: 0px;
	margin-left:5px;
	margin-right:60px;
	font:bold  30% Arial, Helvetica, sans-serif;
	list-style: none;
	/* color:#FF0000; */
	}
	
	.feature ol.commonnone li span {
		font-weight: normal;
		font-size:120%;
	}

	
	.feature ol.commlet li {
	font-weight:bold;
	background-color:#FFFFCC;
	padding-left: 5px;
	font:bold  .35em Arial, Helvetica, sans-serif;
	list-style-type:upper-alpha;
	/* color:#FF0000; */
	}
	
	.feature ol.commlet li span {
		font-weight: normal;
		font-size:55%;
	}
			
	.footer {
		margin-top: 10px;
	}
	
	.footer p {
		font-size:8px;	
			
	}
	
	
	.month{
		width:100%
		margin-left: auto ;
  		margin-right: auto ;;
	}
	
	.month table.hovertable {
	/* table-layout: fixed; */
	font-family: verdana,arial,sans-serif;
	/* font-size:12px; */
	width:80%;
	color:#333333;
	border-width: 1px;
	border-color: #999999;
	border-collapse: collapse;
	margin: 0 auto;
}


	.month table.hovertable th {
	background-color: #633; //#c3dde0;
	border-width: 1px;
	padding: 8px;
	border-style: solid;
	border-color: #a9c6c9;
	color:#FF0;
}

	.month h1 {
	color:#FFFF00;	
	}
	
	.month h3 {
	color:black;
	font-size:125%;
	margin-top:15px;
	}

	.month table.hovertable tr {
	background-color:#FFFFCC; //#d4e3e5;
}
	.month table.hovertable td {
	border-width: 1px;
	padding: 8px;
	border-style: solid;
	border-color: #a9c6c9;
}

	.day table.hovertable {
	font-family: verdana,arial,sans-serif;
	/* font-size:12px; */
	color:#333333;
	border-width: 1px;
	border-color: #999999;
	border-collapse: collapse;
	margin:auto;
}

	.day h2 {
	color:#FFFF00;	
	}
	
	.day h3 {
		color: black;
		font-size:150%;
	}
	
.calendar_day {
	margin-top:3px;
	margin-bottom:1px;
}

.calendar_day:hover{
	background-color:#d4e3e5;
}
.calendar_other {
	font-size:smaller;
	margin-left: 30px;
	margin-top:1px;
	margin-bottom:1px;
}

body {
	background-color: #FFFFCC;
}

body, td, th, h3, h6 {
	color: #330000;
}

h1, h2, h4, h5 {
  color: #660000;
}

a {
	color: #003366;
}

@media screen 
and (min-device-width : 320px)
and (max-device-width : 480px){
	body {
		/* width:50%; */
		margin: 0 auto;
	}
		
}

@media screen and (min-device-width : 481px)
and (max-device-width : 640px){{
	body {
		width:50%;
		margin: 0 auto;
	}
	
	.month{
		width:50%;
		margin: 0 auto;
	}
	
}


@media only screen and (min-device-width: 641px) and (max-device-width: 768px) { 
// seems to be the Galaxy S3
	body {
		width:100%; /*600px;*/
		margin: 0 auto;
	}
	
		.month{
		width:50%;
		margin: 0 auto;
	}
}

@media only screen and (min-device-width: 769px) {
	body {
		width:700px;
		margin: 0 auto;
	}
}