/*===== XHTML NOTATIONS
elements { 
	attributes: value;
	}
	
<strong> bold </strong>
<em> italic </em>
break = <br /> 
horizontal rule:<hr />
image <img src="images/happy.gif" alt="Happy face" />

SPECIAL CHARACTERS
& = 	&#038;
(c) = 	&#169;
space = &nbsp;

<img src="images/image.jpg" alt="image" />
<a href="index.htm">text may go here</a>
<a class="header" href="index.htm">customized hyperlink</a>
<a href="http://www.rubenfeldsynergy.com" target="_blank">blank opens new window</a>
=====*/

body 	{
	margin: 0px; /* bumps website up to top-margin; except opera (margin top = 8px by default) */
	padding: 0px; /* compensates for 8px top margin in opera (does not affect other browsers) */ 
	background: #CCCCCC; /* page background */
	font-family: Verdana, Arial, Helvetica, sans-serif; /* universal default font */
	font-size: 11px;
	color: #666666; /* aqua; black; blue; fuchsia; gray; green; lime; maroon; navy; olive; purple; red; silver; teal; white; yellow; */
	line-height: 16px; /* adjusts leading */
	}
img 	{ 
 	border: none; /* removes border around all hyperlinked images */
    	} 
img.floatright { 
	margin: 0px 0px 20px 20px;
	border-right: #F09933 3px double;
	border-bottom: #F09933 3px double;
	float: right;
    	}


/* ==================================== PAGECENTER */
#pagecenter { 
 	width: 800px;
	margin: auto; /* centres div within page */
    	}

/* ==================================== HEADER */
#header { 
 	width: 800px; 
 	height: 150px;
	background: #FFFFFF; 
    	}
#header-logo { 
 	width: 180px; 
 	height: 130px; /* 150 - 20 */
	text-align: center; /* left; right; center; justify */
	padding: 20px 0px 0px 0px;
	float: left;
    	}
#header-menu { 
 	width: 620px;  
 	height: 150px; 
	float: left;
    	}
#header-menu-topspace { 
 	width: 620px;  
 	height: 20px; 
    	}
#header-menu-imgframe { 
 	width: 620px;  
 	height: 100px; 
    	}
.header-menu-img { 
 	width: 100px;  
 	height: 100px; 
	border-right: solid 1px #FFFFFF;
	float: left;
    	}
#header-menu-textframe { 
 	width: 600px; 
 	height: 100px;
    	}
.header-menu-texton { 
 	width: 100px;
 	height: 20px;
	font-size: 10px;
	font-weight: bold; /* bold, normal or light */
	text-align: center; /* left; right; center; justify */
	background: #F09933; /* orange */
	border-right: solid 1px #FFFFFF;
	float: left;
    	}
.header-menu-textoff { 
 	width: 100px;
 	height: 20px;
	font-size: 10px;
	font-weight: bold; /* bold, normal or light */
	text-align: center; /* left; right; center; justify */
	background: #CCCCCC;
	border-right: solid 1px #FFFFFF;
	float: left;
    	}
a.header:link, a.header:active, a.header:visited {
	color: #666666;
	text-decoration: none; /* none; underline; overline; line-through; */
	}
a.header:hover { /* mouse hover */
	color: #FFFFFF;
	text-decoration: underline;
	}

/* ==================================== CONTENT */
table.content-frame {
	border-collapse: collapse;
	background: #FFFFFF;
	}
td.sidebar {	
	width: 180px;
	vertical-align: top;
	font-size: 10px;
	font-weight: bold; /* bold, normal or light */
	text-align: center; /* left; right; center; justify */
	}
.submenu-hr {	
	width: 130px;
	height: 24px;
	margin: auto; /* centres div within page */ 
	}
.submenu {	
	width: 130px;
	height: 20px; /* 24 - 4 */
	padding-top: 4px;
	margin: auto; /* centres div within page */ 
	border-bottom: solid 1px #CCCCCC;
	}
.testimonial {	
	width: 130px;
	padding-top: 30px;
	margin: auto; /* centres div within page */ 
	font-weight: bold; /* bold, normal or light */
	text-align: center; /* left; right; center; justify */
	color: #FF9933; /* orange */ 
	}
a.content:link, a.content:active, a.content:visited {
	color: #666666;
	text-decoration: none; /* none; underline; overline; line-through; */
	}
a.content:hover { /* mouse hover */
	color: #F09933;
	text-decoration: underline;
	}
td.content {	
	width: 620px;
	vertical-align: top;
	background: url(images/0main_content_watermark.jpg) no-repeat bottom right;
	}
#content-title {	
	width: 350px;
	margin-right: 20px;
	padding-top: 10px;
	font-family: Times Roman, Times, Garamond, serif;
	font-size: 24px;
	line-height: 24px; /* adjusts leading */
	color: #F0CCA2;
	font-variant: small-caps; /* normal or small-caps */
	font-weight: normal; /* bold, normal or light */
	text-align: right; /* left; right; center; justify */ 
	letter-spacing: 2px; /* normal or specified length eg. 2px */
	border-bottom: solid 1px #CCCCCC;
	float: right;
	}
#content-info {	
	width: 580px; /* 600 - 20 */
	padding: 20px 20px 50px 0px;
	clear: both;
	}

/* ==================================== FOOTER */
#footer { 
 	width: 780px; /* 800 - 20 */
	height: 20px;
	padding-right: 20px;
	font-size: 10px;
	color: #333333;
	text-align: right; /* left; right; center; justify */ 
	background: #F09933; /* div background */
    	}
a.footer:link, a.footer:active, a.footer:visited {
	color: #666666;
	text-decoration: underline; /* none; underline; overline; line-through; */
	}
a.footer:hover { /* mouse hover */
	color: #FFFFFF;
	text-decoration: none;
	}  


/* ==================================== INDEX */
#news { 
 	padding: 10px;
	margin: 10px 0px 10px 30px;
	background: #E6E6E6; /* div background */
	border: #CCCCCC 1px solid;
	font-size: 10px;
	line-height: 12px;
	color: #333333;
	text-align: center;
	float: right;
    	}
#slideshow { 
 	width: 210px;
 	height: 162px;
 	margin: 20px 0px 30px 20px;
	background: url(images/1index_slide_01.jpg); /* div background */
	float: right;
    	}
img.kidscontest {	
	margin: 0px 15px 10px 20px;
	float: right;
	}

  
/*    	
COLOURS: aqua; black; blue; fuchsia; gray; green; lime; maroon; navy; olive; purple; red; silver; teal; white; yellow;

/* ATTRIBUTE ORDER

width
height: px; auto;
margin
padding
text
background
border
float
position

 */
