/*===== ATTRIBUTE ORDER - DMP WHAT YOU DON'T NEED
width
height: px; auto;
margin:
padding
background: url(images/bg_grid.gif) #FFFFFF no-repeat;  (repeat-x = horizontal; repeat-y = vertical)
border: solid 1px red;	(none; solid; ridge; groove; outset; inset; double; dashed; dotted)
text-align: left; right; center; justify
float: left; right;
HYPERLINKED IMAGES <img border="0" src="images/img.jpg" alt="img" />
position
border-collapse: collapse;
vertical-align: top;
overflow: visible;	text will overlap border, image, etc. 	
overflow: hidden;	crops text to stay within parameters given
overflow: scroll;	creates either horizontal and vertical scroll bars around text
overflow: auto;		creates horizontal and vertical scroll bars around text

COLOURS:
#FFFFFF; white
#999999; gray
#000000; black
#003366; font blue gray

=====*/

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: url(images/0page_bg.jpg) repeat-y center; /* page background */
	font-family: Verdana, Arial, Helvetica, sans-serif; /* Georgia, "Times New Roman", Times, Garamond, serif; */
	font-size: 11px;
	line-height: 17px; /* adjusts leading */
	color: #194B7D; /* aqua; fuchsia; gray; green; lime; maroon; navy; olive; purple; silver; teal; */
	}
br 	{
	line-height: 11px; /* adjusts leading */
	}
.spacer {
	width: 100px;
	}
li {
	padding-bottom: 5px;
	}	
/*===== TEXT LINKS =====*/
a:link, a:active, a:visited { /* a:visited can be separated similar to a:hover */
	color: #0066FF; /* blue */
	font-weight: bold;
	text-decoration: none; /* none, underline, overline, line-through */
	}
a:hover { /* mouse hover */
	color: #FF6600; /* orange */
	font-weight: bold;
	text-decoration: underline; /* none, underline, overline, line-through */
	}

/*===== TEXT CUSTOM LINKS =====*/
a.customlink:link, a.customlink:active, a.customlink:visited {
	color: green;
	text-decoration: none; /* none; underline; overline; line-through; */
	}
a.customlink:hover { /* mouse hover */
	color: lime;
	text-decoration: none;
	}
hr.footer {
	height: 0px;  /* height of line thickness */
	width: 100%;  /* percentage or pixels */
	border: olive 5px solid; 
	background: #FFFFFF; /* white */
	padding-bottom: 5px; /* for Firefox */
	clear: both; /* Netscape & Firefox collapse without clear */ 
	}	

/* ==================================== PAGECENTER */
#pagecenter { 
 	width: 950px;
	margin: auto; 
	background: #FFFFFF;
    	}	
	
/* ==================================== HEADER */
#header { 
 	width: 950px; 
 	height: 220px;
    	}
#logo { 
 	width: 350px; 
 	height: 220px;
	background: url(images/0main_header_logo.jpg) no-repeat;
	float: left;
    	}
#photos { 
 	width: 600px; 
 	height: 220px;
	float: left;
    	}
#contact { 
 	margin: 155px 0px 0px 45px;
 	width: 290px; 
 	height: 40px;
	float: left;
	font-size: 12px;
	color: #0779BF; /* menu blue */
    	}

/* ==================================== MENU HORIZONTAL */
#menuframe { 
 	margin-left: 40px;
 	width: 890px; 
 	height: 35px;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: bold;
	text-align: center;
    	}
.tab	{ /* shell may be used for non-linked tab w no text */
	height: 30px;
	float: left;
	}
a.taboff { /* attributes SHARED by link, active, visited & hover */
	width: auto;
	height: 24px; /* 30px - 6px */ /* required */
	padding: 6px 18px 0px 18px;
	text-decoration: none; /* required here may be separated for link and hover sections */
	display: block; /* required here */
	}
a.taboff:link, a.taboff:active, a.taboff:visited {
	background: #79BF07; /* menu lime green */
	color: #FFFFFF;
	}
a.taboff:hover { 
	background: #0779BF; /* menu blue */
	border-bottom: solid 5px #FFCC33; /* menu orange */
	}
a.tabon { /* attributes SHARED by link, active, visited & hover */
	width: auto;
	height: 24px; /* 30px - 6px */ /* required */
	padding: 6px 18px 0px 18px;
	text-decoration: none; /* required here may be separated for link and hover sections */
	display: block; /* required here */
	}
a.tabon:link, a.tabon:active, a.tabon:visited, a.tabon:hover { 
	color: #FFFFFF;
	background: #0779BF; /* menu blue */
	border-bottom: solid 5px #FFCC33; /* menu orange */
	}

/* ==================================== MENU HORIZONTAL: Our Courses */
.tab2 { /* shell may be used for non-linked tab w no text */
	width: 215px;
	height: 30px;
	float: right;
	}
.tab2off { /* shell may be used for non-linked tab w no text */
	width: 215px;
	height: 24px; /* 30px - 6px */ /* required */
	padding: 6px 0px 0px 0px;
	text-decoration: none; /* required here may be separated for link and hover sections */
	display: block; /* required here */
	}
a.tab2off:link, a.tab2off:active, a.tab2off:visited {
	background: #83A8C2; /* menu soft blue */
	color: #FFFFFF;
	}
a.tab2off:hover { 
	text-decoration: none; /* required here may be separated for link and hover sections */
	background: #0779BF; /* menu blue */
	border-bottom: solid 5px #FFCC33; /* menu orange */
	}
a.tab2on { /* attributes SHARED by link, active, visited & hover */
	width: auto;
	height: 23px; /* 30px - 7px */ /* required */
	padding: 7px 18px 0px 18px;
	text-decoration: none; /* required here may be separated for link and hover sections */
	display: block; /* required here */
	}
a.tab2on:link, a.tab2on:active, a.tab2on:visited, a.tab2on:hover { 
	color: #FFFFFF;
	background: #0779BF; /* menu blue */
	border-bottom: solid 5px #FFCC33; /* menu orange */
	}
	
/* ==================================== MENU HORIZONTAL: Our Courses */ 
#vertmenuframe {
	margin: 0px 0px 20px 50px; 
	width: 220px;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: bold;
	text-align: center;
	float: right;
	}   	
.tab3 { /* shell may be used for non-linked tab w no text */
	width: 220px;
	height: 30px;
	float: right;
	border-bottom: solid 1px #FFFFFF; /* menu lime green */
	}
.tab3off { /* shell may be used for non-linked tab w no text */
	width: 215px;
	height: 24px; /* 30px - 6px */ /* required */
	padding: 6px 0px 0px 0px;
	text-decoration: none; /* required here may be separated for link and hover sections */
	border-left: solid 5px #FFFFFF; /* white */
	display: block; /* required here */
	}
a.tab3off:link, a.tab3off:active, a.tab3off:visited {
	background: #83A8C2; /* menu soft blue */
	color: #FFFFFF;
	}
a.tab3off:hover { 
	text-decoration: none; /* required here may be separated for link and hover sections */
	background: #0779BF; /* menu blue */
	border-left: solid 5px #FFCC33; /* menu orange */
	}
a.tab3on { /* attributes SHARED by link, active, visited & hover */
	width: 215px;
	height: 24px; /* 30px - 6px */ /* required */
	padding: 6px 0px 0px 0px;
	text-decoration: none; /* required here may be separated for link and hover sections */
	display: block; /* required here */
	}
a.tab3on:link, a.tab3on:active, a.tab3on:visited, a.tab3on:hover { 
	color: #FFFFFF;
	background: #0779BF; /* menu blue */
	border-left: solid 5px #FFCC33; /* menu orange */
	}
.tab3br { /* shell may be used for non-linked tab w no text */
	width: 215px;
	height: 5px;
	float: right;
	}	
.tab3end { /* shell may be used for non-linked tab w no text */
	width: 215px;
	height: 10px;
	background: #83A8C2; /* menu soft blue */
	float: right;
	}	
.copyright { /* shell may be used for non-linked tab w no text */
	width: 215px;
	padding-top: 10px;
	font-size: 10px;
	font-weight: normal;
 	color: #83A8C2; /* menu soft blue */
 	float: right;
	}	
.sidenotes { /* shell may be used for non-linked tab w no text */
	width: 193px; /* 215 - 20 - 2 for border */
	padding: 10px;
	margin-top: 20px;
	font-size: 10px;
	line-height: 14px;
	font-weight: normal;
	color: #666666; /* gray */
	border: solid 1px #E6E6E6; /* light gray */
	background: #E6E6E6; /* light gray */
	float: right;
	}	
.sidenotes2 { /* shell may be used for non-linked tab w no text */
	width: 193px; /* 215 - 20 - 2 for border */
	padding: 10px;
	font-size: 10px;
	line-height: 14px;
	font-weight: normal;
	color: #666666; /* gray */
	border: solid 1px #E6E6E6; /* light gray */
	float: right;
	}
					
/* ==================================== CONTENT */
#contentframe {
	margin: 5px 0px 30px 70px; 
	width: 860px;
	}
.info {
	width: 590px;
	}
span.title {
	font-family: Georgia, "Times New Roman", Times, Garamond, serif;
	font-size: 26px;
	} 
span.subtitle {
	font-size: 12px;
	color: #79BF07; /* menu lime green */
	font-weight: bold;
	} 
img.left {
	margin: 0px 30px 20px 0px;
	float: left;
	}
img.right {
	margin: 0px 0px 20px 40px;
	float: right;
	} 	 		   	
/* ==================================== INDEX */
table.news {
	width: 575px;
	border-collapse: collapse;
	}
td.newsimg {	
	width: 125px;
	vertical-align: top;
	padding-bottom: 15px; 
	}
td.newstext {	
	width: 450px;
	vertical-align: top;
	padding-left: 25px; 
	}

/* ==================================== COURSES */
table.reg {
	border-collapse: collapse;
	text-align: center;
	}
td.reg1 {
	padding: 5px 0px 10px 0px;
	font-weight: bold;
	background: #FFCC33; /* menu orange */
	border: solid 1px #FFCC33; /* menu orange */
	}
td.reg2 {
	vertical-align: top;
	width: 320px; /* 400 - 80 */
	padding: 7px 40px 15px 40px;
	font-size: 10px;
	line-height: 14px;
	color: #666666; /* gray */
	border: solid 1px #FFCC33; /* menu orange */
	}
				
/* ==================================== COURSE CALENDAR 3 columns */

/* revised for bodies in motion - use for 2012 */
table.tuition {
	border-collapse: collapse;
	margin-top: 10px;
	background: #EBE9F2; /* light lavendar = calendar bg */
	}	
td.tuitionperson {	
	width: 115px;
	padding: 5px 5px 8px 15px;
	font-weight: bold; /* bold, normal or light */	
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #D68BD8;
	background: #FAEBFA; /* light violet */
	}
td.tuitioncouple {	
	width: 115px;
	padding: 5px 5px 8px 15px;
	font-weight: bold; /* bold, normal or light */
	border-right: solid 3px #FFFFFF;	
	border-bottom: solid 3px #FFB138;
	background: #FFE6C3; /* light orange */
	}
td.tuitionfamily {	
	width: 115px;
	padding: 5px 5px 8px 15px;
	font-weight: bold; /* bold, normal or light */
	border-right: solid 3px #FFFFFF;	
	border-bottom: solid 3px #C1CCD6;
	background: #E6F3FF; /* light blue */
	}
td.coursematerial {	
	width: 508px;
	padding: 5px 5px 8px 15px;
	border-bottom: solid 3px #BAB8BF;
	}

/* current coding 2011 */	
table.cost {
	border-collapse: collapse;
	margin-top: 10px;
	background: #EBE9F2; /* #EBE9F2 = calendar bg - light lavendar */
	}	
td.cost1 {	
	width: 115px;
	padding: 5px 5px 8px 15px;
	font-weight: bold; /* bold, normal or light */	
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	background: #E6F3FF; /* light blue */
	}
td.cost2 {	
	width: 630px;
	padding: 5px 20px 8px 15px;
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	background: #E6F3FF; /* light blue */
	}
table.cost30 {
	border-collapse: collapse;
	margin: 10px 0px 10px 0px;
	background: #FFE6C3; /* light orange */
	}	
td.cost31 {	
	width: 160px;
	padding: 5px 5px 8px 15px;
	font-weight: bold; /* bold, normal or light */	
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	}
td.cost32 {	
	width: 452px;
	padding: 5px 20px 8px 15px;
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	}
td.cost33 {	
	width: 128px;
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	text-align: center;
	}
table.calendar {
	border-collapse: collapse;
	background: #EBE9F2; /* #EBE9F2 = calendar bg - light lavendar */
	font-weight: bold; /* bold, normal or light */
	margin-top: 20px;	
	}
td.date {	
	width: 380px;
	padding: 9px 5px 12px 15px;
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	}
td.location {	
	width: 120px;
	padding: 9px 5px 12px 5px;
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #FFFFFF;	
	text-align: center;
	}
td.agency {	
	width: 120px;
	padding: 9px 5px 12px 5px;
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	text-align: center;
	background: #E7F2E4; /* yellow */
	}
td.agency2 {	
	width: 120px;
	padding: 9px 5px 12px 5px;
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	text-align: center;
	}
td.paypal {	
	width: 140px;
	text-align: center;
	background: #FFFFFF;
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	}
td.paypal1 {	
	width: 70px;
	text-align: center;
	background: #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	}
td.paypal2 {	
	width: 70px;
	text-align: center;
	background: #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	}
td.date3 {
	width: 340px;
	vertical-align: top;
	padding: 3px 5px 13px 20px;	
	color: #CC0000; /* red */
	background: #FFFFFF;
	}
td.paypal3 {	
	width: 120px;
	padding: 3px 0px 15px 0px;
	text-align: center;
	background: #FFFFFF;
	border-right: solid 3px #FFFFFF;
	border-bottom: solid 3px #FFFFFF;
	}
td.agency3 {	
	width: 160px;
	background: #FFFFFF;
	}
td.end3 {	
	width: 140px;
	background: #FFFFFF;
	}
table.list {
	border-collapse: collapse;
	}	
td.listcol {
	vertical-align: top;	
	width: 125px;
	padding: 5px 5px 5px 5px;
	}
span.price {
	font-size: 12px;
	color: #CC0000;
	}
span.red {
	color: #990000;
	}
				    	 	
/* ####################################   END */
