body {
  font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
  margin: 0;
}

input#word {
	text-transform:uppercase;
}

h2 {
    margin-top: 30px;
}

#frame-div {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
	margin-left: auto;
	margin-right: auto;
	width: auto;
}

span.white {
	color:white;
}

table.tight-clean td.labels {
    margin: 0px;
    padding: 0px;
    padding-left: 10px;
    text-align: right;
}

.date-td {
	width: 57px;
	height: 85px;
	padding: 4px;
}

td.date-spacer-td {
	width: 30px;
	height: 85px;
  background-repeat: no-repeat;
  background-position:center;
}

table.tight-clean td.values {
	margin: 0px;
	padding: 0px;
	padding-left: 10px;
	text-align: left;
}

span.image-code {
	font-size: 70%;
	margin-left: 5px;
	margin-right: 5px;
}

.cycle-controls {
	text-align:center;
}

.image-caption-div {
	margin-bottom: 10px;
}

.date-entry {
	width: 30px;
}

.image-caption {
	text-align:center;
	font-style:italic;
	font-size: 80%;
}

.content {
    background: white;
}

.inner-content {
    padding: 10px;
    background: white;
}

table.contact-info-table {
    border: 1px solid rgba(0,0,0,0.1);
    border-radius:5px;
    background-color: rgb(242,242,242);
    float: right;
    margin: 10px;
    padding: 10px;
}

table.contact-info-table td {
    margin: 0px;
    padding: 0px;
    text-align: right;
}

.container {
	width: 900px;
    margin-top: 10px;
    margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
	height: auto;
	border: 1px solid rgba(0,0,0,0.2);
}

.outer-container {
	background: rgb(242,242,242);
}

.bar {
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
	margin-bottom: 0;
}

.bar td { padding: 10px; }

.header {
    border-bottom: 1px solid rgba(0,0,0,0.2);
    height: 100px;
}

.header div { margin: 5px 20px; }

.header 	p {
	margin: 0;
	padding: 0;
}

.header 	h1 {
	margin: 0;
	padding: 0;
}

.float-left {
	float:left;
}

.float-right {
	float:right;
}

table#frame-table, table#date-table {
	border-style: solid;
	border-width: 15px;
	padding: 40px 50px 25px 50px;
	margin-left: auto;
	margin-right: auto;
	width: auto;
}

#date-name-div {
	background: white;
	height: 20px;
	width: 203px;
	text-align: center;
	font-family: 'Lucida Handwriting', cursive;
}

.footer {
	padding: 10px;
	font-size: 80%;
	border-top: 1px solid rgba(0,0,0,0.2);
}

p.copyright {
	color: rgb(128,128,128);
	font-style: italic;
	font-size: 80%;
}

.mat-black a:link {color:cyan;}   
.mat-black a:visited {color:cyan;}
.mat-black a:hover {color:cyan;}  
.mat-black a:active {color:cyan;} 

table.mat-black {
	border-color: rgb(43,48,52);
	background: rgb(76,83,93);
}

table.mat-black img.wild-image {
	border: 2px inset gray;
}

table.mat-black span.image-code {
	color: rgb(150,150,150);
}

table.mat-black td.date-spacer-td {
  background-image: url('images/heart.png');
}

table.mat-black #date-name-div {
	border: 2px inset gray;	
}

.mat-green a:link {color:cyan;}   
.mat-green a:visited {color:cyan;}
.mat-green a:hover {color:cyan;}  
.mat-green a:active {color:cyan;} 

table.mat-green {
	border-color: rgb(172,95,48);
	background: rgb(80,112,80);
}

table.mat-green img.wild-image {
	border: 2px solid white;
}

table.mat-green span.image-code {
	color: rgb(150,150,150);
}

table.mat-green td.date-spacer-td {
  background-image: url('images/cream-dash.png');
}

table.mat-green #date-name-div {
	border: 2px solid white;	
}

.mat-cream a:link {color:blue;}   
.mat-cream a:visited {color:blue;}
.mat-cream a:hover {color:blue;}  
.mat-cream a:active {color:blue;} 

table.mat-cream {
	border-color: rgb(85,33,9);
	background: rgb(203,200,193);
}

table.mat-cream img.wild-image {
	border: 2px inset lightgray;
}

table.mat-cream span.image-code {
	color: rgb(64,64,64);
}

table.mat-cream td.date-spacer-td {
  background-image: url('images/green-circle.png');
}

table.mat-cream #date-name-div {
	border: 2px inset lightgray;
}

.mat-cream-date-only a:link {color:blue;}   
.mat-cream-date-only a:visited {color:blue;}
.mat-cream-date-only a:hover {color:blue;}  
.mat-cream-date-only a:active {color:blue;} 

table.mat-cream-date-only {
	border-color: rgb(22,24,24);
	background: rgb(203,200,193);
}

table.mat-cream-date-only img.wild-image {
	border: 2px inset lightgray;
}

table.mat-cream-date-only span.image-code {
	color: rgb(64,64,64);
}

table.mat-cream-date-only td.date-spacer-td {
  background-image: url('images/green-dash.png');
}

table.mat-cream-date-only tr#date-name-tr {
  display: none;
}

.mat-beaded-frame a:link {color:cyan;}
.mat-beaded-frame a:visited {color:cyan;}
.mat-beaded-frame a:hover {color:cyan;}
.mat-beaded-frame a:active {color:cyan;}

table.mat-beaded-frame {
	border-color: rgb(142,99,54);
	background: rgb(76,83,93);
}

table.mat-beaded-frame img.wild-image {
	border: 2px inset gray;
}

table.mat-beaded-frame span.image-code {
	color: rgb(150,150,150);
}

table.mat-beaded-frame td.date-spacer-td {
	background-image: url('images/beaded-frame-dash.png');
}

table.mat-beaded-frame #date-name-div {
	border: 2px inset gray;
}

td.wild-cell {
	padding: 4px;
}