/* 
    There are some layout features included in this document.  Each line applying to each one
    is marked as follows (in case you need to remove them).  When changing the value of properties marked 
    with these tags you should leave the original value in a comment so changes can be easily scanned.
  
      [cfw] Centred fixed width page
*/


/*****************************************************************************************
 *            Imports
 ****************************************************************************************/
/* content styling */
/*****************************************************************************************
 *             Content styles for standard (X)HTML elements
 ****************************************************************************************/
/* start from a clean slate */
* {
    margin: 0;
    padding: 0;
}
/************************
 * HEADINGS
 ************************/
 
h1 {
    font-size: 3.0em;
    font-weight: normal;
    padding: 0;
    margin: 0;
    line-height: 1.2;
    color: #13404b;
}
h2 {
    font-size: 1.5em;
    font-weight: bold;
    margin: 1em 0 0.5em 0;
    color: #55a84d;
}
h2 a {
}
h3 {
    font-size: 1.17em;
    font-weight: bold;
    margin: 1em 0 0.5em 0;
    color: #436ab7;
}
h3 a {
}
h4 {
    font-size: 1em;
    font-weight: bold;
    margin: 1.33em 0 0.67em 0;
    color: #333;
}
h4 a {
}
h5 {
    font-size: 1em;
    font-weight: normal;
    margin: 1.33em 0 0.67em 0;
    color: #333;
}
h5 a {
}

h6 {
    font-size: 1em;
    font-weight: normal;
    margin: 1.33em 0 0.67em 0;
}

/************************
 * BODY TEXT BLOCK ELEMENTS
 ************************/
 
p {
    line-height: 1.5; /*Adjust this property for optimum readability. Remeber - wider content may require a larger line height.*/
    margin: 0 0 1em 0;
}
blockquote {
    font-weight: bold;
    margin: 1em 0;
    padding: 0 0 0 30px;
}
pre {
    margin: 1em 0;
    padding: 0 0 0 30px;
}
address {
    margin: 1em 0;
    padding: 0 0 0 30px;
    font-family: inherit;
    font-style: normal;
}
dd address {
    margin: 0;
    padding: 0;
}

/************************
 * LISTS
 ************************/
ul {
    margin: 1em 0;
    padding: 0 0 0 15px;
    line-height: 1.5;
    list-style: none;
}
ul ul {
    margin: 0;
}
ol {
    margin: 1em 0;
    padding: 0 0 0 30px;
    list-style: decimal;
    line-height: 1.5;
}
ol ol {
    margin: 0;
    list-style: lower-alpha;
}
ol ol ol {
    list-style: lower-roman;
}
li {
    padding: 0;
    margin: 0 0 0.2em 0;
}
ul li {
    padding-left: 15px;
    background: url(/global/images/lib/ico_arrow.png) 0 0.5em no-repeat;
}
ul li ul li {
    background-image: url(/global/images/lib/ico_arrow-sub.png);
}
ul li ul li ul li {
    background-image: url(/global/images/lib/ico_arrow-sub-sub.png);
}

/* definition lists */
dl {
    padding: 0;
    margin: 1em 0;
}
dt {
    font-weight: bold;
}
dd {
    padding: 0 0 0 30px;
    margin: 0.5em 0;
}

/************************
 * INLINE TEXT ELEMENTS
 ************************/
i, em {
    letter-spacing: 0.08em;
    margin-right: 1px;
}
b, strong {
    font-weght: bold;
}
a:link,
a:active {
    text-decoration: underline;
    color: #0053a0;
}
a:hover,
a:focus {
    text-decoration: none;
    cursor: hand;
}
a:visited  {
    color: #cd5003;
}
/* treatment for 'help' text styles */
abbr, acronym, span.help {
  border-bottom: 1px dotted #333;
  cursor: help;
}
/* CODE: Designates a fragment of computer code.
   SAMP: Designates sample output from programs, scripts, etc.
   KBD: Indicates text to be entered by the user.
   VAR: Indicates an instance of a variable or program argument. */
code, samp, kbd, var {
}
/* quote */
q {
}
/* Contains a citation or a reference to other sources. */
cite {
}
/* Indicates that this is the defining instance of the enclosed term */
dfn {
}
/* subscript */
sub {
}
/* superscript */
sup {
}
/* small text */
small {
    font-size: 0.82em;
}

/************************
 * TABLE STYLES
 ************************/
 
table {
    margin: 0 0 1em 0;
    padding: 0;
    border-collapse: collapse;
    font-size: 1em; /* stop stupid IE/win text size bug */
}
caption {
    padding: 3px 5px 3px 0;
    font-weight: bold;
    text-align:left;
}
th {
    padding: 7px 15px;
    text-align: left;
    background-color: #0a253d;
    border: 1px solid #144b6b;
    color: #fff;
    font-weight: bold;
}
td {
    padding: 6px 15px;
    border: 1px solid #144b6b;
    vertical-align: top;
    background-color: #fff;
    color: #333;
}
/* table row striping */
tr.arb-even td {
    background-color: #eaebef;
}
/* highlight hovered row */
tr.arb-hover td {
    background-color: #f0f6fc;
}

/************************
 * MISCELLANEOUS
 ************************/
 
/* stop borders on images used as links */
img {
    border: none;
}
/* IE puts a margin on <form> elements which we NEVER want.  Remove it */
form {
    margin: 0;
    padding: 0;
}

/* page components */
/*****************************************************************************************
 *            Header internal layout / styles
 ****************************************************************************************/
#header {
}
#header #logo {
    position: absolute;
    left: 0;
    top: 10px;
}
/************************
 * Search form
 ************************/
#header #search-form {
    float: right; display: inline;
    margin: 10px 2px 0 0;
    padding: 2px 0 0 0;
    background: #FFF;
}
#header #search-form .form-item,
#header #search-form .button {
    float: left; display: inline;
    vertical-align: middle; /* align the button and text field input vertically middle */
}
#header #search-form .form-item {
    border-top: 1px solid #7F7F7F;
}
#header #search-form .text {
    font-size: 0.91667em; /* 11px */
    width: 137px;
    padding: 0 5px !important;
    margin: 0;
    *margin-top: -1px;
    height: 14px;
    border: 1px solid #404040;
    border-right-color: #D4D0C8;
    border-bottom-color: #D4D0C7;
    border-left-color: #808080;
    background-color: #FFF;
}
#header #search-form .button {
    width: auto;
    padding: 0;
    height: auto;
    border: none;
}
/************************
 * Header links
 ************************/
#header ul#header-links {
    float: right; display: inline;
    margin: 15px 0 0 0;
    padding: 0 30px 0 0;
    background: #FFF;
    list-style: none;
}
#header ul#header-links li {
    line-height: 1;
    float: left; display: inline;
    margin: 0;
    padding: 0;
    background-image: none;
}
#header ul#header-links li a {
    display: block;
    /* text-indent:-50000px; */
}
#header ul#header-links li a span {
    background: url(/global/images/bg_combined.gif) 0 -60px no-repeat;
}
/* ABOUT LINK */
#header ul#header-links li#about-link a {
    width: 51px;
}
#header ul#header-links li#about-link a span {
    background-position: 0 -60px;
}
/* rollover */
#header ul#header-links li#about-link a:hover span,
#header ul#header-links li#about-link a:focus span {
    background-position: 0 -80px;
}
/* active */
#header ul#header-links li#about-link a.active span {
    background-position: 0 -100px;
}
/* VISIT LINK */
#header ul#header-links li#visit-link a {
    width: 53px;
}
#header ul#header-links li#visit-link a span {
    background-position: -51px -60px;
}
/* rollover */
#header ul#header-links li#visit-link a:hover span,
#header ul#header-links li#visit-link a:focus span {
    background-position: -51px -80px;
}
/* active */
#header ul#header-links li#visit-link a.active span {
    background-position: -51px -100px;
}
/* ENGAGE LINK */
#header ul#header-links li#engage-link a {
    width: 68px;
}
#header ul#header-links li#engage-link a span {
    background-position: -104px -60px;
}
/* rollover */
#header ul#header-links li#engage-link a:hover span,
#header ul#header-links li#engage-link a:focus span {
    background-position: -104px -80px;
}
/* active */
#header ul#header-links li#engage-link a.active span {
    background-position: -104px -100px;
}
/* EDUCATION LINK */
#header ul#header-links li#education-link a {
    width: 73px;
}
#header ul#header-links li#education-link a span {
    background-position: -172px -60px;
}
/* rollover */
#header ul#header-links li#education-link a:hover span,
#header ul#header-links li#education-link a:focus span {
    background-position: -172px -80px;
}
/* active */
#header ul#header-links li#education-link a.active span {
    background-position: -172px -100px;
}
/*****************************************************************************************
 *            Primary Navigation layout / styling
 ****************************************************************************************/
#primary-navigation {
    background: #FFF;
}

/*****************************************************************************************
 *             MENU CONTAINERS (ul's)
 ****************************************************************************************/
/************************
 * top level (and below) menus
 ************************/
 
#primary-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0 0 0 5px;
    float: right;
    background: #FFF;
}

/*****************************************************************************************
 *             MENU ITEM CONTAINERS (li's)
 ****************************************************************************************/
/************************
 * top level (and below) menu items  
 ************************/
 
#primary-navigation li {
    background-image: none;
    float: left; display: inline;
    line-height: 1em;
    position: relative;
    margin: 0;
    padding: 0;
    _height: 0;
}

/*****************************************************************************************
 *             MENU ITEM'S (a's)
 ****************************************************************************************/
/************************
 * top level (and below) links  
 ************************/
 
#primary-navigation ul li a {
    display: block;
    padding: 0;
    margin: 0;
    color: #E14C13;
    background: #FFF;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.083334em; /* 13px */
    height: 15px;
    line-height: 15px;
    width: 100px;
    /* text-indent:-500000px; */
}
/* active state */
#primary-navigation li a.active {
    color: #A9A9A9;
}
/* hover state */
#primary-navigation li a:hover,
#primary-navigation li a:focus {
    color: #FFAB4B;
}

/*****************************************************************************************
 *            Link image replacement
 ****************************************************************************************/
#primary-navigation ul li a span {
    background: url(/global/images/bg_combined.gif) 0 0 no-repeat;
}
/************************
 *  film section link 
 ************************/
 
#primary-navigation ul li#film-section-link a {
    width: 40px;
}
#primary-navigation ul li#film-section-link a span {
    background-position: 0 0;
}
/* rollover */
#primary-navigation ul li#film-section-link a:hover span,
#primary-navigation ul li#film-section-link a:focus span {
    background-position: 0 -20px;
}
/* active */
#primary-navigation ul li#film-section-link a.active span {
    background-position: 0 -40px;
}
/************************
 *  exhibition section link 
 ************************/
 
#primary-navigation ul li#exhibition-section-link a {
    width: 94px;
}
#primary-navigation ul li#exhibition-section-link a span {
    background-position: -40px 0;
}
/* rollover */
#primary-navigation ul li#exhibition-section-link a:hover span,
#primary-navigation ul li#exhibition-section-link a:focus span {
    background-position: -40px -20px;
}
/* active */
#primary-navigation ul li#exhibition-section-link a.active span {
    background-position: -40px -40px;
}
/************************
 *  events section link 
 ************************/
 
#primary-navigation ul li#events-section-link a {
    width: 142px;
}
#primary-navigation ul li#events-section-link a span {
    background-position: -134px 0;
}
/* rollover */
#primary-navigation ul li#events-section-link a:hover span,
#primary-navigation ul li#events-section-link a:focus span {
    background-position: -134px -20px;
}
/* active */
#primary-navigation ul li#events-section-link a.active span {
    background-position: -134px -40px;
}
/************************
 *  workshops section link 
 ************************/
 
#primary-navigation ul li#workshops-section-link a {
    width: 154px;
}
#primary-navigation ul li#workshops-section-link a span {
    background-position: -276px 0;
}
/* rollover */
#primary-navigation ul li#workshops-section-link a:hover span,
#primary-navigation ul li#workshops-section-link a:focus span {
    background-position: -276px -20px;
}
/* active */
#primary-navigation ul li#workshops-section-link a.active span {
    background-position: -276px -40px;
}
/************************
 *  resources section link 
 ************************/
 
#primary-navigation ul li#resources-section-link a {
    width: 155px;
}
#primary-navigation ul li#resources-section-link a span {
    background-position: -430px 0;
}
/* rollover */
#primary-navigation ul li#resources-section-link a:hover span,
#primary-navigation ul li#resources-section-link a:focus span {
    background-position: -430px -20px;
}
/* active */
#primary-navigation ul li#resources-section-link a.active span {
    background-position: -430px -40px;
}

/* page variant styles */
/*
 *        Home page specific content styles
 */
 
/*****************************************************************************************
 *             Layout
 ****************************************************************************************/
body.home-page .row {
    position: relative;
    zoom: 1;
    margin-bottom: 15px;
}
body.home-page .row:after { /* contain floats */
    content: '.';
    clear: both;
    overflow: hidden;
    visibility: hidden;
    height: 0;
    display: block;
}
body.home-page .col {
    float: left; display: inline;
    margin-left: 10px;
}
/* col widths */
body.home-page .flash {
    width: 580px;
}
body.home-page #exhibition,
body.home-page #film,
body.home-page #news {
    width: 180px;
}
body.home-page #quicklinks,
body.home-page #whats-on,
body.home-page #visit-us {
    width: 172px;
}
/* col margins */
body.home-page .first-col {
    margin: 0;
}
body.home-page #film,
body.home-page #news {
    margin-left: 20px;
}
/*****************************************************************************************
 *             Common content styles
 ****************************************************************************************/
body.home-page .col h2 {
    font-size: 1em; /* 12px */
    font-weight: bold;
    color: #FFF;
    margin: 0 30px 0 0;
    padding: 8px 0 0 18px;
}
body.home-page .col .content {
    padding: 0 9px 10px 18px;
    min-height: 50px;
    _height: 50px;
}
body.home-page .col .content h3 {
    font-size: 1em; /* 12px */
    font-weight: bold;
    color: #FFF;
    margin: 0;
    padding: 0;
}
body.home-page .col .content p {
    font-size: 0.91667em; /* 11px */
    line-height: 1;
    color: #FFF;
    margin: 0;
    padding: 0;
}
body.home-page .col .content ul {
    margin: 10px 0 0 0;
    padding: 0;
    list-style: none;
    color: #FFF;
}
body.home-page .col .content ul li {
    margin: 0;
    padding: 0;
    background: none;
}
body.home-page .col .content a {
    color: #FFF;
    text-decoration: none;
}
body.home-page .col .content a:hover,
body.home-page .col .content a:focus {
    text-decoration: underline;
}
/*****************************************************************************************
 *             Colours
 ****************************************************************************************/
/************************
 * Black = default
 ************************/
body.home-page .col {
    background: url(/global/images/bg_combined.gif) 100% 0 no-repeat;
}
body.home-page .col h2 {
    background: #000 url(/global/images/bg_combined.gif) 0 -150px no-repeat;
}
body.home-page .col .content {
    background-color: #000;
}
/************************
 * Orange
 ************************/
body.home-page .orange {
    background-position: 100% -500px;
}
body.home-page .orange h2 {
    background-position: 0 -250px;
}
body.home-page .orange h2,
body.home-page .orange .content {
    background-color: #FB9428;
}
/************************
 * #333333
 ************************/
body.home-page .hex333333 {
    background-position: 100% -8500px;
}
body.home-page .hex333333 h2 {
    background-position: 0 -750px;
}
body.home-page .hex333333 h2,
body.home-page .hex333333 .content {
    background-color: #333333;
}
/************************
 * #3377bb
 ************************/
body.home-page .hex3377bb {
    background-position: 100% -9500px;
}
body.home-page .hex3377bb h2 {
    background-position: 0 -850px;
}
body.home-page .hex3377bb h2,
body.home-page .hex3377bb .content {
    background-color: #3377bb;
}
/************************
 * #7777bb
 ************************/
body.home-page .hex7777bb {
    background-position: 100% -1000px;
}
body.home-page .hex7777bb h2 {
    background-position: 0 -950px;
}
body.home-page .hex7777bb h2,
body.home-page .hex7777bb .content {
    background-color: #7777bb;
}
/************************
 * #aa2288
 ************************/
body.home-page .hexaa2288 {
    background-position: 100% -1500px;
}
body.home-page .hexaa2288 h2 {
    background-position: 0 -1050px;
}
body.home-page .hexaa2288 h2,
body.home-page .hexaa2288 .content {
    background-color: #aa2288;
}
/************************
 * #dd0088
 ************************/
body.home-page .hexdd0088 {
    background-position: 100% -2000px;
}
body.home-page .hexdd0088 h2 {
    background-position: 0 -1050px;
}
body.home-page .hexdd0088 h2,
body.home-page .hexdd0088 .content {
    background-color: #dd0088;
}
/************************
 * #ee3399
 ************************/
body.home-page .hexee3399 {
    background-position: 100% -10000px;
}
body.home-page .hexee3399 h2 {
    background-position: 0 -1250px;
}
body.home-page .hexee3399 h2,
body.home-page .hexee3399 .content {
    background-color: #ee3399;
}
/************************
 * #ff88aa
 ************************/
body.home-page .hexff88aa {
    background-position: 100% -9000px;
}
body.home-page .hexff88aa h2 {
    background-position: 0 -1350px;
}
body.home-page .hexff88aa h2,
body.home-page .hexff88aa .content {
    background-color: #ff88aa;
}
/************************
 * #ee1122
 ************************/
body.home-page .hexee1122 {
    background-position: 100% -2500px;
}
body.home-page .hexee1122 h2 {
    background-position: 0 -1450px;
}
body.home-page .hexee1122 h2,
body.home-page .hexee1122 .content {
    background-color: #ee1122;
}
/************************
 * #ff7722
 ************************/
body.home-page .hexff7722 {
    background-position: 100% -3500px;
}
body.home-page .hexff7722 h2 {
    background-position: 0 -1550px;
}
body.home-page .hexff7722 h2,
body.home-page .hexff7722 .content {
    background-color: #ff7722;
}
/************************
 * #ffaa11
 ************************/
body.home-page .hexffaa11 {
    background-position: 100% -4000px;
}
body.home-page .hexffaa11 h2 {
    background-position: 0 -1650px;
}
body.home-page .hexffaa11 h2,
body.home-page .hexffaa11 .content {
    background-color: #ffaa11;
}
/************************
 * #ffff00
 ************************/
body.home-page .hexffff00 {
    background-position: 100% -4500px;
}
body.home-page .hexffff00 .content a {
    color: #333333;
}    
body.home-page .hexffff00 h2 {
    background-position: 0 -1750px;
    color: #333333;
}
body.home-page .hexffff00 h2,
body.home-page .hexffff00 .content {
    background-color: #ffff00;
}
/************************
 * #ccdd22
 ************************/
body.home-page .hexccdd22 {
    background-position: 100% -5000px;
}
body.home-page .hexccdd22 .content a {
    color: #333333;
}    
body.home-page .hexccdd22 h2 {
    background-position: 0 -1850px;
    color: #333333;
}
body.home-page .hexccdd22 h2,
body.home-page .hexccdd22 .content {
    background-color: #ccdd22;
}
/************************
 * #99cc33
 ************************/
body.home-page .hex99cc33 {
    background-position: 100% -5500px;
}
body.home-page .hex99cc33 h2 {
    background-position: 0 -2450px;
}
body.home-page .hex99cc33 h2,
body.home-page .hex99cc33 .content {
    background-color: #99cc33;
}
/************************
 * #55bb44
 ************************/
body.home-page .hex55bb44 {
    background-position: 100% -6000px;
}
body.home-page .hex55bb44 h2 {
    background-position: 0 -1950px;
}
body.home-page .hex55bb44 h2,
body.home-page .hex55bb44 .content {
    background-color: #55bb44;
}
/************************
 * #00aa99
 ************************/
body.home-page .hex00aa99 {
    background-position: 100% -6500px;
}
body.home-page .hex00aa99 h2 {
    background-position: 0 -2050px;
}
body.home-page .hex00aa99 h2,
body.home-page .hex00aa99 .content {
    background-color: #00aa99;
}
/************************
 * #55ccdd
 ************************/
body.home-page .hex55ccdd {
    background-position: 100% -7000px;
}
body.home-page .hex55ccdd h2 {
    background-position: 0 -2150px;
}
body.home-page .hex55ccdd h2,
body.home-page .hex55ccdd .content {
    background-color: #55ccdd;
}
/************************
 * #00bbff
 ************************/
body.home-page .hex00bbff {
    background-position: 100% -7500px;
}
body.home-page .hex00bbff h2 {
    background-position: 0 -2250px;
}
body.home-page .hex00bbff h2,
body.home-page .hex00bbff .content {
    background-color: #00bbff;
}
/************************
 * #0088cc
 ************************/
body.home-page .hex0088cc {
    background-position: 100% -8000px;
}
body.home-page .hex0088cc h2 {
    background-position: 0 -2350px;
}
body.home-page .hex0088cc h2,
body.home-page .hex0088cc .content {
    background-color: #0088cc;
}
/************************
 * Blood orange
 ************************/
body.home-page .blood-orange {
    background-position: 100% -1000px;
}
body.home-page .blood-orange h2 {
    background-position: 0 -650px;
}
body.home-page .blood-orange h2,
body.home-page .blood-orange .content {
    background-color: #E14B13;
}
/************************
 * Pink
 ************************/
body.home-page .pink {
    background-position: 100% -1500px;
}
body.home-page .pink h2 {
    background-position: 0 -350px;
}
body.home-page .pink h2,
body.home-page .pink .content {
    background-color: #E22A79;
}
/************************
 * Dark grey
 ************************/
body.home-page .dark-grey {
    background-position: 100% -2000px;
}
body.home-page .dark-grey h2 {
    background-position: 0 -450px;
}
body.home-page .dark-grey h2,
body.home-page .dark-grey .content {
    background-color: #434343;
}
/************************
 * Red
 ************************/
body.home-page .red {
    background-position: 100% -2500px;
}
body.home-page .red h2 {
    background-position: 0 -550px;
}
body.home-page .red h2,
body.home-page .red .content {
    background-color: #E32611;
}
/************************
 * Gradient
 ************************/
body.home-page .gradient {
    background-position: 100% -3000px;
}
body.home-page .gradient h2 {
    background-color: transparent;
    background-position: 0 -250px;
}
body.home-page .gradient .content {
    background-color: transparent;
    min-height: 30px;
    _height: 30px;
}
/************************
 * Flash
 ************************/
body.home-page .flash {
    background-color: transparent;
    background-position: 0 0;
    background-repeat: no-repeat;
}
body.home-page .flash .content {
    padding: 70px 10px 0 417px;
    background-color: transparent;
}
body.home-page .flash .content p {
    margin-bottom: 0.5em;
}
/*****************************************************************************************
 *             1st Row
 ****************************************************************************************/
body.home-page #quicklinks {
    position: absolute;
    left: 0;
    bottom: 0;
}
body.home-page #hero-flash {
    height: 222px;
    margin-left: 182px; 
    background: none;
}
body.home-page #hero-flash .content-container {
    height: 222px;
}
body.home-page #hero-flash.flash-replaced {
    background-image: none !important;    
}
/*****************************************************************************************
 *             2nd Row
 ****************************************************************************************/
 
 
/*****************************************************************************************
 *             3rd Row
 ****************************************************************************************/
/************************
 * Visit Us
 ************************/
body.home-page #visit-us .content {
    padding-bottom: 8px;
}
/************************
 * Video
 ************************/
body.home-page #video-flash {
    width: 448px; 
    height: 295px;
    background: none;
}
body.home-page #video-flash.flash-replaced {
    background-image: none !important;    
}
body.home-page #video-flash .content {
    padding: 0;
    margin: 0;
}
/************************
 * Watch
 ************************/
body.home-page #watch {
    width: 132px;
    margin-left: 0;
}
body.home-page #watch .content {
    padding-right: 15px;
    margin-bottom: 9px;
    min-height: 219px;
    _height: 219px;
}
body.home-page #watch .content h3 {
    font-weight: bold;
    font-style: italic;
    font-size: 1em;
    padding: 1em 0;
    margin: 0;
}
body.home-page #watch .content p {
    margin-bottom: 1em;
    line-height: 1.1em;
}
body.home-page #watch .content p.alternate, body.home-page #watch .alternate p {
    color: #797979;
}
body.home-page #watch .alternate {
    display: inline;
    color: #797979;
    margin-bottom: 1em;
}
/*****************************************************************************************
 *             Calendar
 ****************************************************************************************/
/************************
 * Day week buttons
 ************************/
 
body.home-page ul#day-week {
    margin: 8px 4px 0 4px;
    padding: 0;
    list-style: none;
}
body.home-page ul#day-week li {
    float: left; display: inline;
    width: 81px;
    margin: 0;
    padding: 0;
    background: #e2673f;
    border-top: 1px solid #e2673f;
    border-bottom: 1px solid #ffd678;
    /*
    border-right-color: #e25014;
    border-color: #ffd678;
    border-left: none;
    border-right: none;
    border-top: none;
    */
    text-align: center;
}
body.home-page ul#day-week li#day-button.selected-view,
body.home-page ul#day-week li#week-button.selected-view 
{
    background-color: #ff7f1e;
    border: 1px solid #ffd678;
    border-bottom: none;
    padding-bottom: 1px;
}
body.home-page ul#day-week li#week-button,
body.home-page ul#day-week li#day-button {
    background-color: #e25014;    
}
body.home-page ul#day-week li a {
    color: #FFF;
    text-decoration: none;
    outline: none;
    font-size: 9px;
}
body.home-page ul#day-week li#day-button.selected-view,
body.home-page ul#day-week li#week-button.selected-view 
{
    background-color: #ff7f1e;
    border: 1px solid #ffd678;
    border-bottom: none;
    padding-bottom: 1px;
}
body.home-page ul#day-week li#day-button:hover,
body.home-page ul#day-week li#day-button:focus,
body.home-page ul#day-week li#week-button:hover,
body.home-page ul#day-week li#week-button:focus {
    background-color: #f5895d;
    border-top: 1px solid #f5895d;
}
body.home-page ul#day-week li#day-button.selected-view:hover,
body.home-page ul#day-week li#day-button.selected-view:focus,
body.home-page ul#day-week li#week-button.selected-view:hover,
body.home-page ul#day-week li#week-button.selected-view:focus  {
    background-color: #ff7f1e;
    border-top: 1px solid #ffd678;
}
/************************
 * Calendar body
 ************************/
body.home-page #cal,
body.home-page #cal-week {
    text-align: center;
    color: #FFF;
    border-left: 1px solid #fcd77c;
    border-right: 1px solid #fcd77c;
    border-bottom: 1px solid #fcd77c;
    margin: 0 4px;
    _height: 180px;
    min-height: 180px;
}
body.home-page #cal-outer {
    background: #FF7F1E;
    /*min-height: 184px;
    _height: 184px;*/
}
body.home-page #cal-week {
    display: none;
}
body.home-page #cal table,
body.home-page #cal-week table {
    margin: 0 auto;
    padding: 0;
    border-collapse: separate;
}
body.home-page #cal table tr,
body.home-page #cal-week table tr {
    
}
body.home-page #cal table th,
body.home-page #cal-week table th {
    margin: 0;
    padding: 0;
    background: transparent;
    border: none;
    text-align: center;
    color: #000;
}
body.home-page #cal table th acronym,
body.home-page #cal-week table th acronym {
    border: none;
    color:  #E14C13;
}
body.home-page #cal table td,
body.home-page #cal-week table td {
    margin: 1px;
    padding: 0;
    background: #FFAB4B;
    border: 1px solid #E14C13;
    text-align: center;
    color: #343434;
}
body.home-page #cal table td.non-current-month,
body.home-page #cal-week table td.non-current-month {
    background: transparent;
}
body.home-page #cal table td.today,
body.home-page #cal-week table td.today {
    background: #fbe7d1;
    font-weight: bold;    
}
body.home-page #cal table td a,
body.home-page #cal-week table td a {
    color: #343434;
    text-decoration: none;    
}
body.home-page #cal table td a:hover,
body.home-page #cal-week table td a:hover,
body.home-page #cal table td a:focus,
body.home-page #cal-week table td a:focus {    
    text-decoration: underline;
}
body.home-page #calendar-today {
    background: #FF7F1E;
    padding: 5px 5px 5px 14px;
}
body.home-page #calendar-today img {
    display: block;
}
/************************
 * Month back / forward links
 ************************/
body.home-page #cal table caption {
    text-align: center;
    font-weight: bold;
    color: #FFF;
    padding: 15px 0;
}
body.home-page #cal table caption a {
    font-weight: normal;
    color: #FFF;
    text-decoration: none;
}
body.home-page #cal table caption a#cal-prev-month {
    float: left; display: inline;
}
body.home-page #cal table caption a.next-link {
    float: right; display: inline;
}
body.home-page #cal table td.arb-hover {
    background-color: #E32611 !important;
}

/*****************************************************************************************
 *             Home bookmark
 ****************************************************************************************/
#home-bookmark table {
    margin-right: 5px;
}
#home-bookmark table,
#home-bookmark table tr {
    border: none;
    background-color: #FFF;
    padding: 0;    
}
#home-bookmark table tr td {
    border: none;
    background-color: #FFF;    
    padding: 5px;            
    vertical-align: middle;
}
#home-bookmark table tr td img {
    margin-left: 7px;
}
/*****************************************************************************************
 *             Footer
 ****************************************************************************************/
body.home-page table#tblFooter {
    margin: 20px auto;
    border-collapse: collapse;
}
body.home-page table#tblFooter tr {
    margin: 0;
    padding: 0;
    border: none;
}
body.home-page table#tblFooter tr td {
    margin: 0;
    padding: 0;
    border: none;
    background-color: #FFF;
}
body.home-page a.footLinks,
body.home-page a.footer {
    color: #999;
    text-decoration: none;
    font-size: 0.91667em; /* 11px */
}
body.home-page a.footLinks:hover,
body.home-page a.footLinks:focus,
body.home-page a.footer:hover,
body.home-page a.footer:focus {
    text-decoration: underline;
}
body.home-page table#tblFooter tr td img {
    padding-bottom: 5px;
}

/*****************************************************************************************
 *            Main document sections layout
 ****************************************************************************************/
body {
    text-align: center; /* center the #page element in IE5/win [cfw] */
}
#page {
    position: relative; zoom: 1;
    z-index: 1;
    width: 765px; /* max page width to not scroll at 800x600 [cfw] */
    text-align: left; /* reset the text alignment after IE5/win hack above [cfw] */
    margin: 0 auto; /* ceneter the #page element in all but IE5/win [cfw] */
}

/************************
 * header, primary navigation and breadcrumb
 ************************/
 
#page #header {
    position: relative; zoom: 1;
    height: 93px;
    z-index: 2;
}
#page #primary-navigation {
    position: absolute;
    top: 45px;
    left: 175px;
    z-index: 3;
}
/* 
    ie don't like #breadcrumb being position absolute in some designs,
    so float it and make it 0 size to not affect layout then position absolute the ol inside 
*/
#page #breadcrumb {
    width: 0;
    height: 0;
    float: left;
}
#breadcrumb ol {
    position: absolute;
    line-height: 1.0em;
    top: 120px; /* just below primary navigation */
    left: 220px; /* line up with content when there's secondary nav in place */
    padding: 0;
    margin: 20px 0 0 0;
    width: 600px;
}

/************************
 * secondary navigation & content columns
 ************************/
 
/* no secondary nav */
#page #content {
    min-height: 530px;
    margin-top: 7px;
}
/* breathe in at the left a little to make room for secondary nav */
body.has-secondary-navigation #page #content {
    float: right; display: inline;
    margin-left: -220px;
    width: 100%;
    margin-top: 0;
}
/* push content away from space where secondary nav will be */
body.has-secondary-navigation #page #content-inner {
    padding-left: 220px;
}
/* move into the space we created next to #content */
#page #secondary-navigation {
    float: left; display: inline;
    width: 180px;
    margin-top: 41px; /* clear primary navigation */
    margin-bottom: 10px;
    z-index: 1; /* make sure this isn't hidden underneath #content in FF */
    position: relative;
}

/************************
 * misc
 ************************/
#page #footer {
    clear: both;
    padding: 20px 0;
}


/*****************************************************************************************
 *            Page layout / styles
 ****************************************************************************************/
body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 75%; /* 12px */
    background: #FFF url(/global/images/bg_body-repeat.gif) 0 0 repeat;
    color: #000;
}
#page {
}
#page-inner {
}


/*****************************************************************************************
 *             Page Title internal layout / styles
 ****************************************************************************************/
#page-title {
}
body.has-breadcrumb #page-title {
    padding-top: 2.0em; /* leave room for breadcrumb, ie spacks with margin here */
}
#page-title h1 {
}


/*****************************************************************************************
 *             Content area internal layout
 ****************************************************************************************/
#content {
}
/************************
 * No sub content
 ************************/
#content #main {
}

/************************
 * With sub content
 ************************/
/* prep the main content, leaving room beside it for sub content */
body.has-sub-content #content #main {
    float: left; display: inline;
    width: 100%;
    padding: 0;
    margin: 0;
    margin-right: -231px; /* sub content width + margin each side of sub content  */
}
/* leave room for side content to sit, it get's shifted into this space */
body.has-sub-content #content #main-inner {
    margin-right: 231px; /* sub content width + margin each side of sub content  */
}
/* shift the sub content into the space left by #main-inner */
body.has-sub-content #content #sub {
    float: right; display: inline;
    width: 221px;
}

/************************
 * Top of page Link
 ************************/
 
#top-page-link {
    margin-top: 3em;
}
#top-page-link a {
}


/*****************************************************************************************
 *            Content styles for custom classes and id's
 ****************************************************************************************/
/************************
 * Form prompt text
 ************************/
 
input.displayingPromptValue {
    color: #666;
}


/*****************************************************************************************
 *            Utility styles
 ****************************************************************************************/
/************************
 *  IMAGE-REPLACED: accessible text image replacement
 ************************/
/*
  Usage: <tag class="image-replaced">the text to replace<span></span></tag>
*/
.image-replaced {
    position: relative;
    overflow: hidden;
}
.image-replaced span {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: transparent;
    background-position: left top;
    background-repeat: no-repeat;
}

/************************
 * accessibility styles
 ************************/
/* hide items in a way still accessibly to screen readers (and unstyled browsers of course) */
.accessibility, hr {
    position: absolute !important;
    top: -1000em !important;
    left: -1000em !important;
}

/************************
 * clearfix, a class to clear floated elements
 ************************/
 
/* clearfix for good browsers */
html > body .clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
/* clearfix for IE/mac */
.clearfix {
    display: inline-block;
}
/* Hides from IE-mac, clearfix for IE/win and reset for not IE/mac */
@media all {
    * html .clearfix {
        _height: 0;
    }
    
    .clearfix {
        display: block;
    }
}

/************************
 * flash inclusion
 ************************/
/* These are standard flash inclusion styles... do not modify */
@media screen {
    .flash-text-replaced embed,
    .flash-text-replaced object {
        visibility: visible !important;
        margin: 0;
        clear: none;
        _margin-right: -3px; /* account for IE 6 putting 3px of margin on the left when next to a floated element */
    }
    
    html.flash-text-has-flash span.alt {
        display: block;
    }
    .flash-text-replaced span.alt {
        position: absolute;
        left: -10000px;
        top: -10000px;
    }
}
.flash-replaced .alt {
        position: absolute;
        left: -10000px;
        top: -10000px;
}
/* custom font tweaks go here */
html.flash-text-has-flash .box h2 {
    line-height: 1.45;
    letter-spacing: -1px;
    zoom: 1; /* stop ie 6 putting 3px of internal margin on our text (and pushing the embed element down when it's inserted */
}
