--------------------------------------------------------------------------------
What:	"Oranges in the sky" Styles(Table data design)
Who:	Krasimir Makaveev(krasi [at] makaveev [dot] com)
When:	15.09.2005(created)

(70, 41, 6) v dark brown
* rgb(140, 81, 10)   dark brown
* rgb(216, 179, 101)  med borwn
* rgb(246, 232, 195) lt brown
* rgb(245, 245, 245) whitish
* rgb(199, 234, 229) lt grn
* rgb(90, 180, 172)  med grm
* rgb(1, 102, 94)    dark grn

--------------------------------------------------------------------------------
*/



table {
	font-family: Palatino, serif;
	border-collapse: collapse;
	width: 65%;
     *border-left: 1px solid rgb(140, 81, 10);
	border-top: 1px solid rgb(1, 102, 94); 
	*color: rgb(140, 81, 10);
}

table caption {
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-size: 1.3em;
	font-weight: bold;
	*letter-spacing: -1px;
	*margin-bottom: 2px;
	padding: 2px;
	text-align: left;
	background: rgb(140, 81, 10);
	border-bottom: 2px solid rgb(140, 81, 10);
}

table tfoot tr th, table tfoot tr td {
	text-transform: uppercase;
	*color: rgb(245, 245, 245);
	font-weight: bold;
	background: rgb(140, 81, 10);
}

table thead tr th {
	text-transform: uppercase;
	*border-top: 1px solid rgb(140, 81, 10);
	background: rgb(216, 179, 101);
}

table tfoot tr th {
	width: 20%;
	background: rgb(216, 179, 101);
}

table tfoot tr td {
	*width: 80%;
}

table tr td {
	*border-bottom: 2px solid rgb(90, 180, 172);
}

table td, table th {
	*border-right: 1px solid #ccc;
	*border-bottom: 1px solid #ccc;
	padding: 5px;
	*line-height: 1.8em;
	*font-size: 0.8em;
	vertical-align: top;
	width: 20%;
	background: rgb(199, 234, 229);
}

table tr.odd th, table tr.odd td {
	background: rgb(246, 232, 195);
}

a {
	vertical-align: bottom;
	*line-height: 1.5em;
	padding-bottom: none;
	text-decoration: none;
	border-bottom: 1px dotted rgb(90, 180, 172);
	color: rgb(70, 41, 6);
}

A:visited {text-decoration: none; color: rgb(140, 81, 10)}

A:hover {text-decoration: none; color: rgb(1, 102, 94);}

h1 {
	margin: 0;
	*background-color: rgb(90, 180, 172);
	padding: 5px;
	font: bold 22px Helvetica, Verdana, sans-serif;
}

ul, ol {
	line-height: 1.4em;
}


/* -- -- Section divider -- -- */
#secdiv {
	border-top: 2px solid rgb(140, 81, 10);
	clear: both;
	padding: 0;
	horizontal-align: center;
	width: 40%;
	margin-left: auto;
    	margin-right: auto;
	*height: 2px;
	line-height: 1em;
	*background: rgb(140, 81, 10);
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-size: 1.3em;
	font-weight: bold;
	text-align: center;
	border-bottom: 2px solid rgb(140, 81, 10);
}



/* -- -- TableR is for recipes -- -- */

tableR {
	font-family: Palatino, sans-serif;
	border-collapse: collapse;
	font-size: 1.3em;
     width: 50%;
	color: rgb(245, 245, 245);
}

#tableR {
	font-family: Palatino, sans-serif;
	border-collapse: collapse;
	font-size: 1.3em;
     width: 60%;
	color: rgb(245, 245, 245);
	/*border-bottom: 2px solid rgb(1, 102, 94); why doesn't this work?*/
	border-bottom: 2px solid rgb(140, 81, 10);
}

#tableR caption {
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-size: 1.3em;
	font-weight: bold;
 	vertical-align: bottom;
	line-height: .6em;
	*letter-spacing: -1px;
	margin-top: 6px;
	padding: 2px;
	text-align: left;
	background: transparent;
	border-bottom: 2px solid rgb(140, 81, 10);
}

#tableR thead tr th, #tableR thead tr td  {
	font-size: .8em;
	font-family: Helvetica, Verdana, Arial, sans-serif;
	background: white;
}


#tableR tr td {
	background: rgb(245, 245, 245);
 	border-bottom: transparent;
	font-size: 1.2em;
}

#tableR td, #tableR th {
	padding: 5px;
	vertical-align: top;
	width: 20%;
	background: rgb(245, 245, 245);
}

#tableR tr.odd th, #tableR tr.odd td {
	border-top: 2px solid rgb(90, 180, 172);
 	line-height: 1.2em;
     background: rgb(246, 232, 195);
}


/*--- ---- ---- ---- */

#topsection{
/*height: 130px;*/ /*Height of top section*/
}

#topsection h1{
margin: 0;
*background-color: rgb(90, 180, 172);
padding: 0px;
font: bold 22px Helvetica, Verdana, sans-serif;
}

/*--- ---- Navigation menu ---- ---- */

#ddtitle{
margin-left: 20px;
font: bold 12px Helvetica;
padding:0;
list-style:none;
}

#ddcolortabs{
margin-left: 4px;
margin-color: rgb(199, 234, 229)
padding: 0;
*border-left: 12px solid rgb(199, 234, 229);
width: 100%;
*background-color: rgb(199, 234, 229);
*background: solid rgb(199, 234, 229);
voice-family: "\"}\"";
voice-family: inherit;
padding-left: 5px;
}

#ddcolortabs ul{
font: bold 11px Helvetica, Verdana, sans-serif;
*background-color: rgb(199, 234, 229);
line-height: 1em
border: 2px rgb(50, 50, 50);
margin:0;
padding:0;
list-style:none;
}

#ddcolortabs li{
display:inline;
margin:0 2px 0 0;
padding: 0;
*background-color: rgb(199, 234, 229);
text-transform:uppercase;
}

#ddcolortabs a {
float:left;
color: black;
background: rgb(216, 179, 101) url(media/color_tabs_left.gif) no-repeat left top;
margin:0 2px 0 0;
padding:0 0 1px 3px;
text-decoration:none;
letter-spacing: 1px;
}

#ddcolortabs a span{
float:left;
display:block;
background: transparent url(media/color_tabs_right.gif) no-repeat right top;
padding:4px 9px 2px 6px;
}

#ddcolortabs a span{
float:none;
}


#ddcolortabs a:hover{
background-color: rgb(246, 232, 195);
}

#ddcolortabs a:hover span{
background-color: rgb(246, 232, 195);
color: black;
}

#ddcolortabs #current a, #ddcolortabs #current span{ /*currently selected tab*/
background-color: rgb(140, 81, 10);
}

#ddcolortabs #current a{
float:left;
color: white;
}

#ddcolortabsline{
clear: both;
padding: 0;
width: 100%;
height: 8px;
line-height: 8px;
background: rgb(140, 81, 10);
/*border-top: 1px solid #fff; */ /*Remove this to remove border between bar and tabs*/
}

#ddcolorline{
clear: both;
padding: 0;
width: 100%;
height: 2px;
line-height: 2px;
background: rgb(140, 81, 10);
}
</style>

/*--- ---- floating side notes ---- ---- */

sidenote1, sidenote2, sidenote3, sidenote4 {
}

#sidenote1,
#sidenote2,
#sidenote3,
#sidenote4 {
	padding: 0px 5px 5px 5px;
    width: 250px;
    font-size: 90%;
}

#sidenote1,
#sidenote2 {
    border: 1px solid rgb(70, 41, 6);
    background-color: rgb(199, 234, 229);
}
#sidenote3,
#sidenote4 {
    border: 1px solid rgb(1, 102, 94);
    background-color: rgb(246, 232, 195);
}

#sidenote1 h3,
#sidenote2 h3,
#sidenote3 h3,
#sidenote4 h3 {
	text-transform: uppercase;
	*line-height: .6em;
	margin: 4px 0px 4px 0px;
	text-align: center
	*margin-left: auto;
    	*margin-right: auto;
	font: bold 11px Helvetica, Verdana, sans-serif;
}

#sidenote1,
#sidenote3 {
    margin: 5px 5px 5px 5px;
    float: right;
}

#sidenote2, 
#sidenote4 {
    margin: 5px 10px 5px 5px;
    float: left;
}