﻿/**********************************************************************
Import Htc.cc for IE 6 PNG support
**********************************************************************/
@import url(Htc.css);

/**********************************************************************
Hack for 100% height elements
**********************************************************************/

body, html
{

}

/**********************************************************************
Global styles and reset elements
**********************************************************************/
body
{
    font-size: 10pt;
    font-family: Arial;
    background-color: #003399;
    line-height: 150%;
    color:#333333;
}

.container
{
    margin-left: auto;
    margin-right: auto;
    width: 800px;
    background-color: White;
}

a
{
    color: #003399;
}

a:hover
{
    /* TODO Set to correct color */
    color: #990000 !important;
}

.center
{
    text-align: center;
}

h1, h2, h3, h4, h5, h6 {
   font-size: 9pt;
   font-weight: bold;
   margin-bottom: 4.5pt;
   color: #004889;
}

h1
{
    font-size: 16pt;
}

h2
{
    font-size: 12pt;
}

h3
{
 font-size: 12pt;
}


.center {
   text-align: center;
}

.underline {
   text-decoration: underline;
}

td
{
    vertical-align: top;
}

.clear {
   height: 0;
   font-size: 0;
   clear: both;
}

.border
{
    border: thin solid #333333;
}
.border td
{
    border: thin solid #333333;
}

.qoutebox
{
    border: 2px solid #D3D1D2;
    color: #828282;
    font-style:italic;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
}

/**********************************************************************
Page Specific Styles
**********************************************************************/
#program_overview td
{
    padding-left: 0px;
    padding-right: 0px;
}
/**********************************************************************
The header and top block
**********************************************************************/
#header
{
    clear: both;
    float: left;
    width: 100%;
    background-color: #FFFFFF; 
    padding-bottom: 10px;
}

#top
{
    width: 800px;
    height: 137px;
    background-image: url(/Images/SiteTemplate/TopHeaderBackground.png);
    background-repeat: no-repeat;
}

#logo
{
    margin-left: 25px;
    float: left;
    width: 142px; 
    padding-top: 56px;
}
#kids
{
    float: left; 
    width: 448px;
    height: 137px;
}

#search
{
    float: right;
    width: 185px;
    padding-top: 95px;
    font-size: 10pt;

}
#search a
{
    font-weight: bold;
    text-decoration: none;
}

/**********************************************************************
The menu
**********************************************************************/
#menu
{
    height: 37px;
    vertical-align: top;
}
#menu_empty
{
    background-image: url(/Images/SiteTemplate/MenuEmptyBackground.png);
    height: 37px;
}

#menu_red_curve
{
    height: 37px;
    float: right;
    width: 17px;
}

#menu_main
{
    height: 33px;
    background-image: url(/Images/SiteTemplate/MenuRedBackground.png);
    float: right;
    padding-top: 4px;
}

#menu_main a:hover
{
    color: #FFFF66 !important;
}

#menu_secondary
{
    height: 33px;
    background-image: url(/Images/SiteTemplate/MenuBlueBackground.png);
    float: right;
    padding-top: 4px;
}
#menu_secondary a:hover
{
    /* TODO Set to correct color */
    color: #990000;
}
#menu_blue_curve
{
    height: 37px;
    float: right;
    width: 40px;
}
#menu a
{
    margin-right: 15px;
    margin-left: 15px;
    font-size: 9pt;
    color: #FFFFFF;
    text-decoration: none;
}

#menu a:hover
{
  color: #FFFF66 !important;
}

.selected
{
    color: #FFFF66 !important;
    font-weight: bold;
}
/**********************************************************************
Left column/nav styles
**********************************************************************/
.left_nav
{
    background-color: #ABA3A0; /* Left column background colour */
    background-image: url("/Images/SiteTemplate/LeftBarBottomCurve.png");
    background-repeat: no-repeat;
    background-position: right bottom;
    margin-right: 0px;
    width: 210px;
    float:left;

    padding-bottom: 16px;
    font-size: 9pt; /* Default font size set here since the body font is set to 8pt for a bug */
    color: #FFFFFF;
}

#left_nav_content
{
    margin-top: -16px;    
    padding-bottom: 14px;
    padding-left: 8px;
    padding-right: 8px;
}

.left_nav a
{    
    text-decoration: none;
    color: #FFFFFF;
    
}

.left_nav a:hover
{
    color: #FFFF66 !important;
}


.left_nav_ul {
   list-style: none;
   margin: 0;
   padding: 0;
   font-size: 11pt;
}

.left_nav_ul li  
{
 line-height: 150%;    
}

/**********************************************************************
Content styles
**********************************************************************/
.content
{
 font-size: 10pt; /* Default font size set here since the body font is set to 8pt for a bug */
 float:left;
}

/* Left Nav - No Right Bar */
.content1
{
   width: 570px;
   padding-left: 10px;
   padding-right:10px;
}

/* Left Nav - Narrow Right Bar */
.content2
{
   width: 400px;
   padding-left: 10px;
   padding-right:10px;
}

/* Left Nav - Wide Right Bar */
.content3
{
   width: 323px;
   padding-left: 10px;
   padding-right:10px;
}

/* No Left Nav - No Right Bar */
.content4
{
   width: 780px;
   padding-left: 10px;
   padding-right:10px;
}

/* No Left Nav - Narrow Right Bar */
.content5
{
   width: 610px;
   padding-left: 10px;
   padding-right:10px;
}

/**********************************************************************
Right column/nav styles
**********************************************************************/
.right_nav
{
    background-color: #D2DA4A; /* Right column background colour */
    background-repeat: no-repeat;
    background-position: right bottom;
    margin-right: 0px !important;
    padding-bottom: 16px;
    font-size: 10pt; /* Default font size set here since the body font is set to 8pt for a bug */
    float:left;
}

.right_nav_wide
{
        background-image: url("/Images/SiteTemplate/RightBarBottomCurve.png");
        width: 247px !important;
}

.right_nav_narrow
{
        background-image: url("/Images/SiteTemplate/RightMiniBarBottomCurve.png");
        width: 170px !important;
}

.RightBarTopCurve
{
    vertical-align: top;
}

#right_nav_content
{
    margin-top: -2px;
    padding-left: 8px;
    padding-right: 8px;
}

.right_nav a
{
    color: #000000;
    text-decoration: none;
}

.right_nav a:hover
{
    color: #990000;
}

#right_nav_ul {
   list-style: none;
   margin: 0;
   padding: 0;
   font-size: 11pt;
}

#right_nav_ul 
{
 line-height: 150%;  
}


/**********************************************************************
Footer styles
**********************************************************************/
#footer
{
    clear: both;
    float: left;
    width: 100%;
    color: #003399;
    font-size: 9pt;
    text-align: center;
    background-color: #FFFFFF;
}
#footer a
{
    text-decoration: none;
}

#footer p
{
    padding: 10px;
    margin: 0;
}

#footer_bar
{
    background-color:#003399; 
    height:23px;
}


/**********************************************************************
Home Page - Programs buttons
**********************************************************************/
#programs
{
    margin: 0 auto;
    width: 716px;    
}
.program
{
    text-align: center;
    float: left;
    font-size: 11pt;
    width: 179px;
}
.program img
{
    margin-top: 4px;
}

.program a
{
    text-decoration: none;
}
.RotatingImage
{
    height: 143px; 
    overflow: hidden;
    padding-bottom: 2px;
}
/**********************************************************************
Custom Google search results CSS
**********************************************************************/
.gs-webResult .gs-visibleUrl-short { display:none !important; }
.gsc-tabsArea { display:none !important; }

	/* hide from ie on mac \*/
	#GalleryFlashContent {
		width: 570px;
		height: 242px;
	}
	/* end hide */
	
/**********************************************************************
Pretty forms - CSS and HTML layout from: http://www.alistapart.com/articles/prettyaccessibleforms/
**********************************************************************/


form.CmxForm legend {
   color: #333333;
   padding: 0 2px;
   padding-left: 0;
   font-weight: bold;
   _margin: 0 -7px; /* IE Win */
}

form.CmxForm label {
   display: inline-block;
   line-height: 1.8;
   vertical-align: top;
}

form.CmxForm fieldset
{
    background-position: left bottom;
    padding-left: 5px;
    margin-bottom: 12pt;
    border: 1px solid #ABA3A0;
    background: url(/Images/SiteTemplate/CmxFormFieldset.gif) left bottom repeat-x;
}

form.CmxForm fieldset ol {
   margin: 0;
   padding: 0;
}

form.CmxForm fieldset ol li fieldset {
   padding-left: 0;
}

form.CmxForm fieldset li {
   list-style: none;
   padding: 5px;
   margin: 0;
   padding: 5px 10px 7px;
   background: url(/Images/SiteTemplate/CmxFormDivider.gif) left top repeat-x;
}

form.CmxForm fieldset fieldset {
   background: none;
   border: none;
   margin: 3px 0 0;
}

form.CmxForm fieldset fieldset legend {
   padding: 0 0 5px;
   font-weight: normal;
}

form.CmxForm fieldset fieldset label {
   display: block;
   width: auto;
}

form.CmxForm em {
   font-weight: bold;
   font-style: normal;
   color: #f00;
}

form.CmxForm label {
   width: 190px;
}
 .fullline {
   width: auto !important;
}
 li.checkbox label {
   width: 500px !important;
   font-weight:normal;
}
 li.radio label {
   width: auto !important;
   font-weight:normal;
}


/* Width of labels */
form.CmxForm fieldset fieldset label {
   margin-left: 123px;
}
/* Width plus 3 (html space) */

/*\*//*/ form.CmxForm legend { display: inline-block; } /* IE Mac legend fix */

.FormShield table {
margin-bottom: 0px !important;
}