/**  baby blue (portfolio) : #7EA2C7; royal blue (services): #0000AA; teal (home): #154E95; periwinkle:  #4148A2; l,a: #080891; u: #9DC6CF; navy: #010D6B; turquoise: #17DDCD; sky blue (contact) : #2195F0; turquoise: #0000FF; light periwinkle: #7490D7;  teal: #154E95; **/
<style>  
<!--
.subtitle-blue                     {color: #33499a; font: 20px Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif; }
.colhead-blue                    {font-family: Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif; color: #33499a; font-size: 16px;}
.colhead-courier              { font-family: Courier, serif; font-size: 16px; }
.bigbody-blue                   {color: #0000AA; font-family:  Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif;	 font-size: 14px;}
.bigbody-white                 {color: #FFFFFF; font-family:  Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif;	font-size: 14px;}
.body-reg                            {color: #0000AA; font-family:  Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif;	 font-size: 12px;}
.body-small                       {font-family: Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif;	 color: #33499a; font-size: 10px;}
.footnote                            {font-family: Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif;	 color: #33499a; font-size: 7px;}
.mid                                       {font-family: Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif;	 color: #33499a; font-size: 5px;}
.graph                                   {font-family: Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif;	  color: #33499a; font-size: 3px;}
.subtitle-courier-blue      {font-family: "Courier New", Georgia, serif; font-size: 20px;}
.subtitle-courier-red        {color: #FF0000; font-family: 20px "Courier New", Georgia, serif;}
.title-courier-red               {color: #FF0000; font: 20px "Courier New", Georgia, serif; }

body { 	height: auto; margin: 0px; 	padding: 0px;  text-align: center; }
			

/** ======================================= PAGE ELEMENTS =============================================**/
#page { background-color:  #FFF;  height: 750px;  margin: 5px auto; height: auto;  width: 800px; }
	
#header { background-color:  #FFF;  color: #0000AA; font: 12px  Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif; height: auto; text-align: left;  width: 100%; }

#header-text { padding-right: 15px;  }

#content { background-color:  #FFF; color: #0000AA; font:  13px Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif; height: auto; margin-left: 0; padding: 15px; position: relative;  text-align: left;  width: auto; }

#content-inner { background-color:  #FFF; color: #0000AA; font: 13px  Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif;	height: auto; margin-left: 275px; padding: 15px; position: relative;  text-align: left; width: auto; }

#btm-services { color: #0000AA;	font: 13px  Verdana, Arial, 'Avant Garde', 'Century Gothic', sans-serif; height: auto; margin-left: 150px; margin-top: 125px; *margin-top: 150px; padding: 15px; width: 800px; } 

#btm-nav { color: #0000AA;  font-family:  Verdana, Arial, Helvetica, sans-serif;	  font-size: 10px;  text-align: center; }

.contact      {background-color: #2195F0;}
.portfolio  {background-color: #7EA2C7; }
.services    {background-color: #0000AA; }
.home        {background-color: #154E95; }

.be-left       { display: inline; float: left; padding: 5px 10px 5px 5px;}
.be-right     { display: inline; float: right; padding: 0px 7px 15px 15px;}
.go-left       { text-align: left;}
.go-right     { text-align: right;}

/** ======================================= GRID FRAMEWORK =============================================**/
/** width of content page is 800px; there are two 110px-wide side bars for ads, giving a total width of the page of 890px 
/**  5px gutter 
.grid-1   { width:   65px; }
.grid-2   { width: 140px; }
.grid-3   { width: 180px; }
.grid-4   { width: 265px; }
.grid-5   { width: 325px;}
.grid-6   { width: 365px; }
.grid-7   { width: 440px; } 
.grid-8   { width: 520px; }   /** tot = 670px 
.grid-9   { width: 600px; }
.grid-10 { width: 660px; }

.column { float: left;   margin: 0 5px;   overflow: hidden;   display: inline; }
.row      { margin: 0 auto;   overflow: hidden; 	text-align: left;    width: 670px; }
**/

/** ======================================= FORMS =============================================**/
fieldset { background-color: #FFFFFF;  font-weight: bold; margin-left: auto; margin-right: auto; padding: 0px 15px; width: 80%;}

legend { color: #080891; font-family: Arial, Tahoma, Helvetica, sans-serif; font-size: 16px; }

input {   background-color: #F8F8F8;  border: 1px solid #888;   font-size: 12px;  padding: 4px;    } 

input:focus  { border: 1px solid #000; background-color: #9DC6F3; }


/** ======================================= NAV ELTS =============================================**/
#tablist { height: 15px; 	text-align: center; }

#tablist li {    /** what each list elt will look like; creates wider band behind each anchor elt **/
	display: inline;  /** list goes horizontal instead of vertical **/
	list-style: none;
	padding-left: 50px;
	padding-right: 50px; } 

/** what each link in the top-level colored boxes will look like **/
#tablist li a {  color: #FFFFFF; font-family: Verdana, Arial, Helvetica, sans-serif; 	font-size: 13px;  text-align:  center; text-decoration: none; }  

#tablist li a:hover{ color: #B7D1EA;  }	


/** ======================================= LISTS =============================================**/
li.square		{list-style-type: square; list-style-size: 5pt}
li.disc		{list-style-type: disc; list-style-size: 5pt}


/** ======================================= LINKS =============================================**/
a   {  color: #0000AA;   font-weight: normal;   text-decoration: none; }
 a:hover   {color:#2CBDB7;}
 
-->   
</style>  


