﻿/* specific divs */
#container
{
    background-position: center top;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    font-family: Calibri, Arial, Times New Roman;
    min-width: 800px;
    max-width: 1024px;
    background-image: url( 'squares.jpg' );
    background-repeat: repeat;
}

#sms_news_feed
{
    margin: 5px 5px 5px 5px;
    padding: 10px;
    border: thin solid #000000;
    text-align: center;
    background-color: #FFFFFF;
    color: #FFFFFF;
    clear: both;
    width: 97%;
    overflow: hidden;
    vertical-align: middle;
}


#sms_footer
{
    margin: 5px 5px 5px 5px;
    padding: 10px;
    border: thin solid #000000;
    text-align: center;
    background-color: #3366FF;
    color: #FFFFFF;
    clear: both;
    width: 97%;
    overflow: hidden;
    vertical-align: middle;
}

#sra_footer
{
    margin: 2% auto 2% auto;
    text-align: center;
    float: left;    width: 100%;    overflow: hidden;}    

#copyright_footer
{
    margin-left: auto;
    margin-right: auto;
    text-align: right;
    float: left;    width: 100%;    overflow: hidden;}

#access_buttons
{
     position:relative;
     top:2px;
     text-align:right;
     padding:0px 10px 2px 0px;
}

#top_bar
{
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

p
{
    margin: 0em 0em 1em 1em;
}

body 
{ 
    font-size: 100%;
    text-align: right;
}

     

.access_medium
{
    border-width: 1px;
    border-style: solid;
    font-family: Arial;
}

.access_large
{
    border-width: 1px;
    border-style: solid;
    font-family: Arial;
    font-size: 150%;
}

.access_contrast
{
    border-width: 1px;
    border-style: solid;
    font-family: Arial;
    font-size: 150%;
    color: #00FF00;
    background-color: #000000;
}


.header_text1
{
    color: #FFFFFF;
    font-weight: 200;
    background-color: #0033CC;
    vertical-align: middle;
}

.header_text2
{
    color: #000000;
    font-weight: 200;
    background-color: #C0C0C0;
    vertical-align: middle;
}



.main_text1
{
    padding: 0px;
    color: #FFFFFF;
}

.main_text1_large
{
    padding: 0px;
    margin: 0px;
    font-size: 200%;
    vertical-align: top;
}
.main_text1_medium
{
    padding: 0px;
    margin: 0px;
    font-size: 150%;
    vertical-align: top;
}

.sidebar_header_text1
{
    color: #FFFFFF;
    font-weight: 200;
    vertical-align: middle;
    font-style: normal;
}


.sidebar_main_text1
{
    color: #000000;
}

td.sidebar_list_bg
{
    border: thin solid #000000;
    background-color: #3399FF;
    color: #000080;
    padding: 1em;
}

.list_text1_large
{
    font-size: 150%;
    color: #FFFF66;
}

hr
{
    width: 100%;
    text-align: left;
}

a:link
{
    text-decoration: none;
    color: inherit;
}

a:visited 
{ 
	text-decoration: none; 
	color: inherit;
}

a:hover, a:active
{
    text-decoration: underline;
    font-style: inherit;
    font-variant: inherit;
    text-transform: inherit;
}

a href
{
    text-decoration: underline;
}
a img, a span
{
    border: none;
    vertical-align: top;
}

img.sra
{
    width:15em;
    height:auto;
}
    
img.vid_img
{
    float:left;
}
    
.li_no_bullets
{
    list-style-type: none;
    vertical-align: middle;
}

.li_no_bullets li
{
    margin-bottom: 3px;
}

.li_bullets
{
    list-style-type: circle;
}

.li_numbered_light
{
    list-style-type: decimal;
    color: #FFFFFF;
}

.li_numbered_dark
{
    list-style-type: decimal;
    color: #FFFFFF;
}



/* Left 1/3 column */
#leftColumn
{
    float: left;
    width: 33%;
    overflow: hidden;
    position:relative;
}
.leftColumn-inner
{
    margin: 5px;
}


/* Centre 1/3 column */
#centreColumn { float: left; width: 34%; overflow: hidden; position: relative;}
.centreColumn-inner
{
    margin: 5px;
}

/* Right 1/3 column */
#rightColumn { float: right; width: 33%; overflow: hidden;  position: relative;}
#rightColumn2 { float: right; width: 33%; overflow: hidden; position: relative;}
.rightColumn-inner
{
    margin: 5px 20px 5px 5px;
}

/* Right 2/3 column */
#rightColumn_2_3 { float: right; width: 67%; overflow: hidden;  position: relative;}
.rightColumn_2_3-inner
{
    margin: 5px;
}

/* Left 2/3 column */
#leftColumn_2_3 { float: left; width: 67%; overflow: hidden;  position: relative;}
#leftColumn_2_3_2 { float: left; width: 67%; overflow: hidden; position: relative;}
.leftColumn_2_3-inner
{
    margin: 5px;
}

/* Left 1/2 column */
#left_1_2_Column
{
    float: left;
    width: 50%;
    overflow: hidden;
    position:relative;
}

/* Right 1/2 column */
#right_1_2_Column
{
    float: right;
    width: 50%;
    overflow: hidden;
    position:relative;
}

/* -----------------Full width Rows -----------------------*/
#fullRow1
{    float: left;    width: 100%;    overflow: hidden; position: relative;}

#fullRow1_column
{    float: left; width: 99%;    overflow: hidden; position: relative;}


.fullRow-inner
{
    margin: 5px;
}


.leftRow_2_3-inner
{
    width: 66%;
    position: relative;
    float: left;
    clear: left;
    margin: 5px 5px 5px 5px;
}

.leftRow_1_3-inner
{
    width: 32%;    
    position: relative;    
    float: left;    
    clear: left;
}

.centreRow_1_3-inner
{
    width: 32%;    
    position: relative;    
    float: left;
}

.rightRow_1_3-inner
{
    width: 33%;
    float: right;
    margin: 5px 20px 5px 5px;

}

.invisible_box1
{    
    border-style: none;    
    border-width: thin;    
    float: left;    
    width: 95%;    
    clear: both;
}
/* Full width Rows */
#fullRow2{ float: left; width: 100%; overflow: hidden;  position: relative;}


/* Full width Rows */
#fullRow3{ float: left; width: 100%; overflow: hidden;  position: relative;}


/* ----------------- Boxs --------------- */
.light_box1
{
    /* This padding works because it is offset by the margin in the spacer box */
    padding: 5px 15px 5px 5px;
    background-color: #DEDFE7;
    border: 1px solid #000000;
    float: left;
    clear: both;
    color: #182C42;
    margin: 0px 0px 5px 0px;
    width: 100%;
    text-align: justify;
    z-index: 100;
}

.mid_box1
{
    padding: 5px 15px 5px 5px;
    background-color: #DEDFE7;
    border: 1px solid #000000;
    float: left;
    clear: left;
    color: #182C42;
    margin: 0px 0px 5px 0px;
    width: 100%;
    text-align: justify;
    z-index: 100;
}

.dark_box1
{
    padding: 5px 15px 5px 5px;
    background-color: #4279D6;
    border: 1px solid #000000;
    float: left;
    color: #FFFFFF;
    width: 100%;
    margin: 0px 0px 5px 0px;
    text-align: justify;
    z-index: 100;
}

.spacer_box1
{
    /* This margin allows the actual box inside to have a padding and be 100% */
    margin: 0px 17px 0px 7px;
}

.dark_box1 h1
{
    font-weight: bold;
    font-size: 110%;
    text-align: center;
}

.mid_box1 h1
{
    font-weight: bold;
    font-size: 110%;
    text-align: center;
}

.light_box1 h1
{
    font-weight: bold;
    font-size: 110%;
    text-align: center;
}

.dark_box1 h2
{
    font-weight: bold;
    font-size: 110%;
    text-align: left;
    text-indent: 1em;
}

.mid_box1 h2
{
    font-weight: bold;
    font-size: 110%;
    text-align: left;
    text-indent: 1em;
}

.light_box1 h2
{
    font-weight: bold;
    font-size: 110%;
    text-align: left;
    text-indent: 1em;
}

/* Put these at the bottom for the IE7 z-index bug */
#menu_bar
{
    text-align: center;
    float: left;
    width: 100%;
    position: relative;
    z-index: 3000;
}


/* Un-selected buttons */
.home_page_button, .family_page_button, .employment_page_button, .people_page_button, .news_page_button, .fees_page_button, .links_page_button, .contact_page_button, .access_page_button
{
    padding: 5px;
    color: #000000;
    font-weight: 100;
    vertical-align: middle;
/*    height: 40px;
    width: 110px;*/
    background-color: #DEDFE7;
    position: relative;
}


/* Hover over Un-selected buttons */

.home_page_button:hover, .family_page_button:hover, .employment_page_button:hover, .people_page_button:hover, .news_page_button:hover, .fees_page_button:hover, .links_page_button:hover, .contact_page_button:hover, .access_page_button:hover
{

}

/* Selected buttons */

#home_page .home_page_button, #family_page .family_page_button, #employment_page .employment_page_button, #people_page .people_page_button, #news_page .news_page_button, #fees_page .fees_page_button, #links_page .links_page_button, #contact_page .contact_page_button, #access_page .access_page_button
{
    padding: 10px 5px 10px 5px;
    color: #FFFFFF;
    font-weight: 100;
    background-color: #3F78D2;
    vertical-align: middle; /*    background-image: url('sunburst.jpg');
    background-repeat: no-repeat; */
/*    height: 40px;
    width: 110px;*/
    position: relative;
}

#menu_bar ul li
{
    display: inline;
    text-align: center;
    list-style-type: none;
    width: 110px;
    height: 40px;
}

#menu_bar ul ul
{
    display:none;
    width: 110px;
    height: 40px;
    z-index: 1000;
}

#menu_bar ul li:hover ul
{
    display: block; /* this and position:absolute make this work I think */
    position: absolute;
    top: 25px;
    left: 0px;
    z-index: 500;
    width: 100px;
    height: 60px;
    padding: 5px;
    color: #000000;
    font-weight: 100;
    vertical-align: middle;
    background-color: #DEDFE7;
    border-width: thin;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
}
/*
#menu_bar .employment_sub_menu ul li:hover ul
{
    width: 110px;
    height: 40px;
}
*/




#menu_bar ul li:hover li
{
/*    border-width: thin;
    border-top-style: solid;*/
}

#employment_page #menu_bar ul li:hover ul
{
    display: block; /* this and position:absolute make this work I think */
    position: absolute;
    top: 28px;
    left: 0px;
    z-index: 500;
    width: 100px;
    height: 60px;
    padding: 5px;
    color: #000000;
    font-weight: 100;
    vertical-align: middle;
    background-color: #DEDFE7;
    border-width: thin;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
}


#menu_bar ul li:hover li
{
/*    border-width: thin;
    border-top-style: solid;*/
}

#menu_bar .fees_sub_menu ul li:hover ul
{
    left: 15px;
}



#fees_page #menu_bar ul li:hover ul
{
    display: block; 
    position: absolute;
    top: 28px;
    left: 0px;
    z-index: 500;
    width: 100px;
    height: 60px;
    padding: 5px;
    color: #000000;
    font-weight: 100;
    vertical-align: middle;
    background-color: #DEDFE7;
    border-width: thin;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
}

/* Google CSS modified to remove errors */
.gfg-root {
  width : 100%;
  height : auto;
  position : relative;
  overflow : hidden;
  text-align : center;
  font-family: "Arial", sans-serif;
  font-size: 12px;
  border: 1px solid #BCCDF0;
}

.gfg-title {
  font-size: 14px;
  font-weight : bold;
  color : #3366cc;
  background-color: #E5ECF9;
  line-height : 1.4em;
  overflow : hidden;
  white-space : nowrap;
}

.gfg-title a {
  color : #3366cc;
}

.gfg-subtitle {
  font-size: 12px;
  font-weight : bold;
  color : #3366cc;
  background-color: #E5ECF9;
  line-height : 1.4em;
  overflow : hidden;
  white-space : nowrap;
  margin-bottom : 5px;
}

.gfg-subtitle a {
  color : #3366cc;
}

.gfg-entry {
  background-color : white;
  width : 100%;
  height : 6.9em;
  position : relative;
  overflow : hidden;
  text-align : left;
  margin-top : 3px;
}

/* To allow correct behavior for overlay */
.gfg-root .gfg-entry .gf-result {
  position : relative;
  background-color : white;
  width : auto;
  height : 100%;
  padding-left : 20px;
  padding-right : 5px;
}

.gfg-list {
  position : relative;
  overflow : hidden;
  text-align : left;
  margin-bottom : 5px;
}

.gfg-listentry {
  line-height : 1.5em;
  overflow : hidden;
  white-space : nowrap;
  padding-left : 15px;
  padding-right : 5px;
  margin-left : 5px;
  margin-right : 5px;
}

.gfg-listentry-odd {
  background-color : #F6F6F6;
}

.gfg-listentry-even {
}

.gfg-listentry-highlight { 
  background-image : url('garrow.gif');
  background-repeat: no-repeat;
  background-position : center left;
}

/*
 * FeedControl customizations.
 */

.gfg-root .gfg-entry .gf-result .gf-title {
  font-size: 14px;
  line-height : 1.2em;
  overflow : hidden;
  white-space : nowrap;
  margin-bottom : 2px;
}

.gfg-root .gfg-entry .gf-result .gf-snippet {
  height : 3.8em;
  color: #000000;
  margin-top : 3px;
}

/*
 * Easy way to get horizontal mode, applicable via js options to gadget.
 */

.gfg-horizontal-container {
  position : relative;
}

.gfg-horizontal-root {
  height : 1.5em;
  position : relative;
  white-space : nowrap;
  overflow : hidden;
  text-align : center;
  font-family: "Arial", sans-serif;
  font-size: 13px;
  border: 1px solid #AAAAAA;
  padding : 5px;
  margin-right : 80px;
}

.gfg-horizontal-root .gfg-title {
  font-weight : bold;
  background-color: #FFFFFF;
  line-height : 1.5em;
  overflow : hidden;
  white-space : nowrap;
  float : left;
  padding-left : 10px;
  padding-right : 12px;
  border-right: 1px solid #AAAAAA;
}

.gfg-horizontal-root .gfg-title a {
  color : #444444;
  text-decoration : none;
}

.gfg-horizontal-root .gfg-entry {
  width : auto;
  height : 1.5em;
  position : relative;
  overflow : hidden;
  text-align : left;
  margin-top : 0px;
  margin-left : 0px;
  padding-left : 10px;
}

/* To allow correct behavior for overlay */
.gfg-horizontal-root .gfg-entry .gf-result {
  position : relative;
  background-color : white;
  width : 100%;
  height : 100%;
  line-height : 1.5em;
  overflow : hidden;
  white-space : nowrap;
}

.gfg-horizontal-root .gfg-list {
  display : none;
}

/*
 * FeedControl customizations.
 */

.gfg-horizontal-root .gfg-entry .gf-result .gf-snippet,
.gfg-horizontal-root .gfg-entry .gf-result .gf-author {
  display : none;
}

.gfg-horizontal-root .gfg-entry  .gf-result .gf-title {
  color: #0000cc;
  margin-right : 3px;
  float : left;
}

.gfg-horizontal-root .gfg-entry .gf-result .gf-spacer {
  float : left;
}

.gfg-horizontal-root .gfg-entry .gf-result .gf-spacer,
.gfg-horizontal-root .gfg-entry .gf-result .gf-relativePublishedDate {
  display : block;
  color: #AAAAAA;
}

.gfg-branding {
  white-space : nowrap;
  overflow : hidden;
  text-align : left;
  position : absolute;
  right : 0px;
  top : 0px;
  width : 80px;
}

.gfg-collapse-open, .gfg-collapse-closed {
  background-repeat : no-repeat;
  background-position : center;
  cursor : pointer;
  float : right;
  width : 17px;
  height : 20px;
}

.gfg-collapse-open {
  background-image : url('arrow_open.gif');
}

.gfg-collapse-closed {
  background-image : url('arrow_close.gif');
}

.gfg-collapse-href {
  float : left;
}

.clearFloat {
  clear : both;
}

