/*-----------------------------------------------------------------------
   AUTHOR:  	Boutros AbiChedid 
   START DATE:  May 17, 2008
   PURPOSE: 	Stylesheet for computer screen.
 -----------------------------------------------------------------------*/

body {
	background: #8BABC4 url(../images/spring.jpg) repeat;
	color: #693;
	cursor: default;
	margin: 0;
	padding: 0;
}
caption {
	
	border-top: 8px groove #CC874B;
	border-bottom: 2px ridge #665;
	margin: 0 auto;
	text-align: center;
	font: 29px/35px "Kristen ITC", "Marker Felt", "Tempus Sans ITC", Arial, sans-serif; 
	background: #fff;
	color: inherit;
}

table {
	background: #fff;
	border-bottom: 4px solid #99DE66;
	border-right: 3px outset #99CCCC;
	border-left: 3px inset #99CCCC;
	margin: 0 auto;
	color: inherit;
}

th,td {
	border-left: 1px solid #999;
	border-top: 1px solid #999;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding: 0 2px;
	vertical-align: top;
	width: 104px;
	height: inherit;
}

col.Sat, col.Sun{
	background: #ECFFEC;
	color: inherit;
}

tr.day {
	color: #665;
	font-size: 10px;
	height: 86px;
	background-color: inherit;
}

tr.number {
	background: #eee;
	color: #000;
	font: 12px Geneva, Arial, Helvetica, sans-serif;
	height: 16px;
	text-align: right;
	vertical-align: middle;
}

th {
	background: #998;
	color: #fff;
	font: 15px Helvetica, Tahoma, Verdana, Arial, sans-serif;
	font-variant: small-caps;
	font-weight: bold;
	height: 18px;
	text-align: center;
	vertical-align: middle;
	border-bottom: 2px groove #665;
}

/************************************************ 
The hover pseudo class is not supported by IE6, it is supported by the other browsers IE7, Mozilla, Safari, and Opera.
Note that I tried to keep both ways using conditional comments but it did not work? see reference: http://msdn.microsoft.com/en-us/library/ms537512.aspx
Therefore I removed the code. In case in the future I decide to put it back this is the corresponding HTML code:
<td id="bird">&nbsp;</td>
<td id="ducks">&nbsp;</td>
<td id="duckling">&nbsp;</td>
<td id="garden">&nbsp;</td>
<td id="tulip">&nbsp;</td> 
--------------------------------

td#bird {
	background: #fff url(../images/bird.jpg) no-repeat;
	color: inherit;
}

td#bird:hover {
	background: #fff url(../images/jbeil.jpg) no-repeat;
	color: inherit;
}

td#ducks {
	background: #fff url(../images/ducks.jpg) no-repeat;
	color: inherit;
}
td#ducks:hover {
	background: #fff url(../images/front.jpg) no-repeat;
	color: inherit;
}

td#duckling {
	background: #fff url(../images/duckling.jpg) no-repeat;
	color: inherit;
}
td#duckling:hover {
	background: #fff url(../images/alligator.jpg) no-repeat;
	color: inherit;
}

td#garden {
	background: #fff url(../images/garden.jpg) no-repeat;
	color: inherit;
}
td#garden:hover {
	background: #fff url(../images/church.jpg) no-repeat;
	color: inherit;
}

td#tulip {
	background: #ECFFEC url(../images/tulip.jpg) no-repeat;
	color: inherit;
}
td#tulip:hover {
	background: #ECFFEC url(../images/waterfall.jpg) no-repeat;
	color: inherit;
}
***************************************************************/


div#error { 
	background-color:transparent; 
	color:red;
	margin-left:auto; 
	margin-right:auto;
	padding-left:5%;
	padding-right:5%;
	text-align: center;
}

.big {
  	font-size: 1.2em;
  	font-style: oblique;  
}

/************ Footer -- Bottom of the Page ************/

#footer {
	clear: both;
	margin: 15px auto 0 auto;
	padding: 5px 5px 0;
	text-align: center;
	border: 0px;	
	color: #000;
	background-color: transparent;
	font-size: 0.85em;
	font-weight:bold;
}

#footer a {
	color: #3a4a3f;
	background: none;
	text-decoration: underline;
}

#footer a:link {
	color: #003366;
	background-color: inherit;
}
 
#footer a:visited {
	color: #f00;
	background-color: inherit;
} 

#footer a:hover, #footer a:active  {
	text-decoration: none;
	color: #191919;
	background-color: inherit;
	font-weight:bold;
}

#footer span {
	font-variant: small-caps;
	font-weight: bold;
	font-size: 0.9em;
}

a.contact {
	font-size: 0.85em;
}

acronym {
  cursor: help;
  border-bottom: 1px dashed #7B8682;
}