/* CAALL stylesheet
	Created: March 2, 2006
	Developed by: Marianna Fenton on behalf of HRSDC */
	
/* ----------- THIS STYLESHEET INCLUDES ALL LAYOUT RULES AND 
PRESENTATION OF ELEMENTS FOR THE CAALL WEB SITE - IF ANY CHANGES ARE MADE, PLEASE TEST
CHANGES PRIOR TO IMPLEMENTATION AND RECORD HISTORY ------------ */

/* 
	Change Made:body.mem-activities ul#sidenav li.on-activities a,
	Date:october 4 2006
	Author: Dave S 
	
	added new box to members sidebar
	
	Change Made:body.mem-activities ul#sidenav li.on-activities a,
	Date:December 1 2006
	Author: Dave S 
	
	added pandemic styles at end
	
*/



/* overall body rule - default font size and family, etc. */

/* this makes sure that a vertical scroll bar is present to avoid screen shifting on short pages */
html { min-height: 100%; margin-bottom: 1px; }

body {
	margin: 0 auto;
	width: 760px;
	padding: 0;
	border: 0;
	font-size: 0.8em;
	font-family: verdana, arial, tahoma, sans-serif;
	color: #333;
	background: #fff;
	text-align: center;
}

/* remove borders from all images */
img {
	border: none;
}

img.pdf {
	vertical-align: middle;
}

/* overall container */
#wrapper {
	margin: 0;
	padding: 0 17px 0 13px;
	width: 760px;
	background: #fff url(../images/bg_wrapper.jpg) repeat-y;
	color: #333;
	text-align: left;
}

/* this is for screen readers and mobility impaired users to skip to content - the following two rules
provided by WEBAIM: http://www.webaim.org  */
#hide a, #hide a:link, #hide a:visited, #hide a:hover  { 
	 position: absolute; 
	 left: 0; 
	 top: -500px; 
	 width: 1px; 
	 height: 1px; 
	 overflow: hidden;
 } 
  
 #hide a:active { 
	 position: static; 
	 width: auto; 
	 height: auto; 
 } 

/* brand and administrative navigation section */
#masthead {
	width: 730px;
	height: 108px;
	margin: 0;
	padding: 0;
	border-bottom: 3px solid #c8c8c8;
	background: transparent;
	color: #333;
}

img.logo {
	float: left;
}

/* when style sheet is disabled the CAALL brand text will show */
h1.brand {
	margin: 0;
	padding: 0;
	text-indent: -5000px;
	font-size: 18px;
}

/* ---------------- administrative navigation ----------------------- */

/* navigation list - home, contact us, site map and language switch */
ul#adminnav {
	margin: 0;
	padding: 22px 0 0 0;
	border: 0;
	list-style-type: none;
	float: right;
	text-align: center;
}

/* remove margins and padding from list elements */
ul#adminnav li {
	margin: 0;
	padding: 0;
	float: left;
}

/* admin nav link styles */
ul#adminnav li a, ul#adminnav li a:link, ul#adminnav li a:visited, ul#adminnav li a:active {
	display: block;
	padding: 0 20px 0 0;
	margin: 0;
	text-decoration: none;
	font-size: 9px;
	font-family: georgia, verdana, sans-serif;
	text-transform: uppercase;
	color: #9a9a9a;
	background: transparent;
}

/* admin nav link hover state */
ul#adminnav li a:hover {
	display: block;
	padding: 0 20px 0 0;
	margin: 0;
	color: #900;
	background: transparent;
}

/* on states for admin nav */
body#contact ul#adminnav li.on-contact a,
body#map ul#adminnav li.on-map a,
body#home ul#adminnav li.on-home a {
	color: #900;
	background: transparent;
}

/* icon placement within admin navigation */
/* home icon */
img.icon1 {padding: 0 0 7px 0;}

/* contact icon */
img.icon2 {padding: 3px 0 7px 0;}

/* map icon */
img.icon3 {padding: 1px 0 7px 0;}

/* language switch icon */
img.icon4 {padding: 0 0 7px 0;}


/* -------------------------- top navigation -------------------------- */

/* container for top navigation */
#wrapper-topnav {
	margin: 0;
	padding: 0;
	width: 730px;
	clear: both;
	min-height: 35px;
	background: url(../images/bg_topnav.gif);
}

/* top navigation */
ul#topnav {
	margin: 0;
	padding: 0;
	list-style-type: none;
	clear: both;
	width: 730px;
	text-align: center;
}

/* style for top nav list elements */
ul#topnav li {
	margin: 0;
	padding: 0;
	text-align: center;
	display: inline;
}

/* styles for top navigation links */
ul#topnav li a, ul#topnav li a:link, ul#topnav li a:visited, ul#topnav li a:active {
	display: block;
	width: 144px;
	float: left;
	padding: 10px 0 10px 0;
	margin: 0;
	color: #999;
	/* old arrow graphic - removed due to similarities - background: url(../images/topnav_arrow.gif) top right no-repeat; */
	text-transform: uppercase;
	text-decoration: none;
	font-size: 10px;  /* might have to fix this for IE */
	font-weight: bold;
	border-right: 1px solid #fff;
	border-top: 2px solid #fff;
	border-bottom: 2px solid #fff;
}

/* top nav link hover state */
ul#topnav li a:hover {
	display: block;
	padding: 10px 0 10px 0;
	color: #900;
	background: #a8a8a8;
	text-decoration: underline;
}

/* special width for ABOUT CAALL - far left nav topic */
ul#topnav li.leftwidth a, ul#topnav li.leftwidth a:link, ul#topnav li.leftwidth a:visited, ul#topnav li.leftwidth a:hover, ul#topnav li.leftwidth a:active {
	width: 147px;
}

/* special width for FOR MEMBERS - far right nav topic */
ul#topnav li.rightwidth a, ul#topnav li.rightwidth a:link, ul#topnav li.rightwidth a:visited, ul#topnav li.rightwidth a:hover, ul#topnav li.rightwidth a:active {
	border-right: none;
	width: 147px;
}

/* on states for top nav - main navigation */
body#about ul#topnav li.on-about a,
body#structure ul#topnav li.on-structure a,
body#lib ul#topnav li.on-lib a,
body#news ul#topnav li.on-news a,
body#members ul#topnav li.on-members a {
	color: #900;
	background: #f7f7f7;
}

/* ----------------------------- side navigation - 1st level topics ------------------------------ */

/* side navigation list */
ul#sidenav {
	margin: 0;
	padding: 0;
	border: 0;
	list-style-type: none;
	width: 147px;
	float: left;
}

/* side navigation list elements */
ul#sidenav li {
	margin: 0;
	padding: 0;
	display: inline; /* for IE only */
}

/* style for side navigation links */
ul#sidenav li a, ul#sidenav li a:link, ul#sidenav li a:visited, ul#sidenav li a:active {
	display: block;
	padding: 10px 3px 10px 15px;
	margin: 1px 0 2px 1px;
	font-size: 80%;
	background: #dadbd5;
	color: #333;
	text-decoration: none;
	border-left: 3px solid #dadbd5;
}

/* hover state for side navigation */
ul#sidenav li a:hover {
	display: block;
	background: #f7f7f7;
	color: #c83233;
	border-left: 3px solid #c83233;
	text-decoration: underline;
}

/* this adds a down arrow on the side navigation when there are additional topics underneath -- add a class to the link when
this is required, i.e. <a href="" class="expand">link</a> */
ul#sidenav li a.expand, ul#sidenav li a:link.expand, ul#sidenav li a:visited.expand, ul#sidenav li a:active.expand {
	background: #dadbd5 url(../images/sidenav_arrow_down.gif) 5% 50% no-repeat;
}

/* this ensures that the hover state matches the remaining side nav hover states */
ul#sidenav li a:hover.expand {
	background: #f7f7f7 url(../images/sidenav_arrow_down.gif) 5% 50% no-repeat;
	color: #c83233;
	border-left: 3px solid #c83233;
	text-decoration: underline;
}

/* use this when a side nav item does not have a related page,
but has sub navigation topics beneath it i.e. select jurisdiction on resource library page */
ul#sidenav li.nolink a:hover.expand {
	background: #dadbd5 url(../images/sidenav_arrow_down.gif) 5% 50% no-repeat;
	color: #333;
	border-left: 3px solid #dadbd5;
	text-decoration: none;
}

/* on states for top level side nav  */
body.about-overview ul#sidenav li.on-overview a,
body.about-constitution ul#sidenav li.on-constitution a,
body.about-partnerships ul#sidenav li.on-partnerships a,
body.about-projects ul#sidenav li.on-projects a,
body.struct-overview ul#sidenav li.on-overview a,
body.struct-members ul#sidenav li.on-members a,
body.lib-overview ul#sidenav li.on-overview a,
body.news-overview ul#sidenav li.on-overview a,
body.news-bulletin ul#sidenav li.on-bulletin a,
body.news-events ul#sidenav li.on-events a,
body.news-releases ul#sidenav li.on-releases a,
body.news-reports ul#sidenav li.on-reports a,
body.members-overview ul#sidenav li.on-overview a,
body.mem-activities ul#sidenav li.on-activities a,
body.mem-affairs ul#sidenav li.on-affairs a,
body.mem-relations ul#sidenav li.on-relations a,
body.mem-standards ul#sidenav li.on-standards a,
body.mem-health ul#sidenav li.on-health a,
body.mem-policy ul#sidenav li.on-policy a,
body.mem-women ul#sidenav li.on-women a {
	color: #900;
	text-decoration: none;
	background: #f7f7f7;
	border-left: 3px solid #c83233;
}

/* on states for top level nav with expanding topics underneath */
body.struct-comm ul#sidenav li.on-comm a.expand,
body.news-meetings ul#sidenav li.on-meetings a.expand {
	color: #900;
	text-decoration: none;
	background: #f7f7f7 url(../images/sidenav_arrow_down.gif) 5% 50% no-repeat;
	border-left: 3px solid #c83233;
}

/* ----------------------------- side navigation - 2nd level topics ------------------------------ */

/* 2nd level lists */
ul#sidenav li ul {
	margin: 0;
	padding: 0;
}

/* 2nd level list elements */
ul#sidenav li ul li {
	margin: 0;
	padding: 0;
}

/* 2nd level link styles */
ul#sidenav li ul li a, ul#sidenav li ul li a:link, ul#sidenav li ul li a:visited, ul#sidenav li ul li a:active {
	padding: 5px 5px 5px 20px;
	font-size: 80%;
	text-decoration: none;
	background: #fce8e8;  /* pinkish */
	color: #333;
	border-left: 3px solid #fce8e8;
}

/* 2nd level hover states */
ul#sidenav li ul li a:hover {
	padding: 5px 5px 5px 20px;
	font-size: 80%;
	color: #c83233;
	background: #f7f7f7;
	border-left: 3px solid #c83233;
	text-decoration: underline;
}

/* on states for 2nd level nav */

body.struct-affairs ul#sidenav li ul li.on-affairs a, /* structure section sub nav starts */
body.struct-relations ul#sidenav li ul li.on-relations a,
body.struct-standards ul#sidenav li ul li.on-standards a,
body.struct-health ul#sidenav li ul li.on-health a,
body.struct-policy ul#sidenav li ul li.on-policy a,
body.struct-firstnations ul#sidenav li ul li.on-firstnations a,
body.struct-women ul#sidenav li ul li.on-women a,
body.lib-alberta ul#sidenav li ul li.on-alberta a,  /* library section sub nav starts */
body.lib-bc ul#sidenav li ul li.on-bc a,
body.lib-fed ul#sidenav li ul li.on-fed a,
body.lib-manitoba ul#sidenav li ul li.on-manitoba a,
body.lib-nb ul#sidenav li ul li.on-nb a,
body.lib-nfld ul#sidenav li ul li.on-nfld a,
body.lib-nwt ul#sidenav li ul li.on-nwt a,
body.lib-ns ul#sidenav li ul li.on-ns a,
body.lib-nunavut ul#sidenav li ul li.on-nunavut a,
body.lib-ontario ul#sidenav li ul li.on-ontario a,
body.lib-pei ul#sidenav li ul li.on-pei a,
body.lib-quebec ul#sidenav li ul li.on-quebec a,
body.lib-sask ul#sidenav li ul li.on-sask a,
body.lib-yukon ul#sidenav li ul li.on-yukon a,
body.news-issues ul#sidenav li ul li.on-issues a, /* news section sub nav starts */
body.news-press ul#sidenav li ul li.on-minreports a,
body.news-presentations ul#sidenav li ul li.on-presentations a {
	color: #900;
	text-decoration: none;
	background: #f7f7f7;
	border-left: 3px solid #c83233;
}

/* --------------------- Banner Images within INNER PAGES ------------------------ */

/* main layout of banner images - default image for admin type pages */
#inner-banner {
	width: 730px;
	height: 82px;
	clear: both;
	margin: 0;
	padding: 0 0 0 0;
	/* try removing this again to avoid similarity -- border-top: 3px solid #c83233; */
	background: transparent url(../images/header_admin.jpg) center right no-repeat;
	color: #333;
}

/* swap banner images for MAIN SECTIONS here on BODY ID - one image for each main section */
body#structure #inner-banner {background: transparent url(../images/header_structure.jpg) center right no-repeat;}
body#about #inner-banner {background: transparent url(../images/header_about.jpg) center right no-repeat;}
body#news #inner-banner  {background: transparent url(../images/header_about.jpg) center right no-repeat;}
body#members #inner-banner {background: transparent url(../images/header_members.jpg) center right no-repeat;}
body#lib #inner-banner  {background: transparent url(../images/header_library.jpg) center right no-repeat;}

/* specific flags for the library section */
body.lib-alberta #inner-banner {background: transparent url(../images/header_alberta.jpg) center right no-repeat !important;}
body.lib-bc #inner-banner {background: transparent url(../images/header_bc.jpg) center right no-repeat !important;}
body.lib-fed #inner-banner {background: transparent url(../images/header_federal.jpg) center right no-repeat !important;}
body.lib-manitoba #inner-banner {background: transparent url(../images/header_manitoba.jpg) center right no-repeat !important;}
body.lib-nb #inner-banner {background: transparent url(../images/header_nb.jpg) center right no-repeat !important;}
body.lib-nfld #inner-banner {background: transparent url(../images/header_nfld.jpg) center right no-repeat !important;}
body.lib-ns #inner-banner {background: transparent url(../images/header_ns.jpg) center right no-repeat !important;}
body.lib-nunavut #inner-banner {background: transparent url(../images/header_nunavut.jpg) center right no-repeat !important;}
body.lib-nwt #inner-banner {background: transparent url(../images/header_nwt.jpg) center right no-repeat !important;}
body.lib-ontario #inner-banner {background: transparent url(../images/header_ontario.jpg) center right no-repeat !important;}
body.lib-pei #inner-banner {background: transparent url(../images/header_pei.jpg) center right no-repeat !important;}
body.lib-quebec #inner-banner {background: transparent url(../images/header_quebec.jpg) center right no-repeat !important;}
body.lib-sask #inner-banner {background: transparent url(../images/header_sask.jpg) center right no-repeat !important;}
body.lib-yukon #inner-banner {background: transparent url(../images/header_yukon.jpg) center right no-repeat !important;}

/* ----------------- END OF NAVIGATION RULES AND MAIN PAGE LAYOUT ELEMENTS ------------ */


/*  ----------------- INNER PAGE CONTENT STYLES  ----------------- */

/* main page headings */ 

h1, h2, h3, h4 {
	font-family: arial, verdana, sans-serif;
	margin: 0;
}

h1  { 
	font-size: 130%;
	font-weight: bold;
	color: #c83233;
	padding: 7px 0 5px 0;
}

/* sub headings */
h2 {
	font-size: 115%;
	color: #600;
	padding: 7px 0 3px 0;
}

h3 {
	font-size: 110%;
	color: #900;
	font-weight: bold;
	padding: 8px 0 5px 0;
}

h4 {
	font-size: 100%;
	color: #666;
}

/* default link states */
a, a:link, a:visited, a:active {
	color: #600;
	background: transparent;
	text-decoration: underline;
}

/* default hover state */
a:hover {
	color: #900;
	background: #f7f7f7;
}

/* breadcrumb layout */
.breadcrumbs {
	font-size: 85%;
	margin: 0;
	padding: 9px 0 8px 0;
	border-bottom: 1px dotted #666;
	width: 385px;
}

/* breadcrumb links */
.breadcrumbs a, .breadcrumbs a:link, .breadcrumbs a:visited, .breadcrumbs a:active {
	color: #c83233;
	background: transparent;
	text-decoration: underline;
}

/* breadcrumb link hover state */
.breadcrumbs a:hover {
	background: #f7f7f7;
	color: #900;
}

strong {
	color: #666;
}

strong.answer, strong.popout {
	color: #f00;
}

em.jurisdiction, em.popout {
	margin: 7px 0 10px 0;
	display: block;
	color: #c83233;
}

/* center content layout */
#content {
	margin: 0 190px 0 165px;
	padding: 0 0 20px 0;
	border: 0;
	text-align: left;
	line-height: 1.6em;
	background-color: #fff;
	font-size: 85%;
	color: #333;
	min-height: 300px; /* currently minimum height only works in standards-compliant browsers - hopefully IE 7 will render this correctly as well */
}

/* use this when you want the content to stretch right across page - no right margin */
#content-fullwidth {
	margin: 0 60px 0 165px;
	padding: 0 0 20px 0;
	font-size: 85%;
	line-height: 1.6em;
	min-height: 300px; /* currently minimum height only works in standards-compliant browsers - hopefully IE 7 will render this correctly as well */
}

/* paragraphs within main content area */
#content p, #content-fullwidth p {
	margin: 5px 0 9px 0;
	padding: 0;
}

/* container for related links box */
#floatright-wrapper {
	margin-right: 30px;
}

/* on every inner page a related links box is presented -- styles for this section are here */
#relatedlinks {
	width: 148px;
	float: right;
	background: #f7f7f7;
	margin: 1px 0 10px 10px;
	padding: 0 0 10px 0;
}

/* main heading of related links box */
#relatedlinks h2 {
	text-transform: uppercase;
	color: #c83233;
	font-size: 80%;
	background: #bababa;
	margin: 0;
	padding: 10px;
	font-family: verdana, arial, sans-serif;
}

/* paragraph text within related links box */
#relatedlinks p {
	padding: 12px 10px 3px 10px;
	margin: 0;
	font-size: 80%;
}

#relatedlinks p a, #relatedlinks p a:link, #relatedlinks p a:visited, .relatedlinks p a:active {
	font-size: 100%;
	color: #900;
	background: transparent;
	text-decoration: underline;
	margin-top: 5px;
}

#relatedlinks p a:hover {
	background: #f7f7f7;
	color: #c83233;
}

/* read more text within related links box */
#relatedlinks p.relatedlinkmore {
	margin-top: 0;
	padding-top: 0;
}

/* read more link styles within related links box */
.relatedlinkmore a, .relatedlinkmore a:link, .relatedlinkmore a:visited, .relatedlinkmore a:active {
	padding-top: 0;
	margin-top: 0;
	font-size: 80%;
	color: #D49C01;
	background: transparent;
	text-decoration: underline;
}

/* read more hover state within related links box */
.relatedlinkmore a:hover {
	background: #f7f7f7;
	color: #900;
}

/* related link box divider to separate different types of additional resources */
#relatedlinks .divider {
	border-bottom: 2px solid #bababa;
	margin: 0 10px 0 10px;
	padding: 5px 0 0 0;
}

/* this is for the resource library section to tell users that links are only available in one language */
.legend {
	float: right;
	padding: 40px 45px 0 0;
	margin: 0;
	width: 125px;
	font-size: 70%;
}

/* this is to denote alternate formats */
.alternate-format {
	float: right;
	padding: 40px 45px 0 0;
	margin: 0;
	width: 125px;
	font-size: 70%;
}

/* styles for contact us page */
#contact-content {
	margin: 7px 0 0 0;
	padding: 0;
}

#contact-content p {
	margin: 0;
	padding: 10px 10px 10px 0;
}

#contact-content em {
	margin: -17px 0 0 170px;
	display: block;
}

img.contact-icons {
	margin: 0;
	border: 0;
	vertical-align: middle;
	padding: 0 25px 0 0;
}

/* general unordered and unordered list rules */
ol, ul {
	margin-top: 3px;
	margin-bottom: 3px;
}

ol li, ul li {
	padding: 2px 0;
}

/* lower alpha ordered lists */
ol.lower-alpha {
	list-style-type: lower-alpha;
}

/* lower alpha ordered lists */
ol.upper-alpha {
	list-style-type: upper-alpha;
}

/* lower roman ordered lists */
ol.lower-roman {
	list-style-type: lower-roman;
}

/* lists that bring users to anchors down one page */
ul.anchored-menu {
	margin: 0;
	padding: 0 0 10px 20px;
	border: 0;
	list-style: none;
}

ul.anchored-menu li {
	margin: 0;
	padding: 0;
	display: block;
}

/* data tables */

/* use the table caption tag to describe the content that the table contains */
caption {
	font-size: 110%;
	text-align: left;
	color: #600;
	font-weight: bold;
	margin: 0;
	padding: 0;
}

/* main data table styles */
table.standard {
	border-collapse: collapse;
	width: 97%;
	font-size: 90%;
	margin: 0 0 5px 0;
}

/* main data table headings */
table.standard th {
	text-align: left;
	border: 3px solid #fff;
	padding: 5px 2px 5px 2px;
	background: #fce8e8;
	font-size: 110%;
	color: #333;
}

/* styles for rows and columns */
table.standard tr, table.standard td {
	padding: 3px 2px 3px 2px;
	border: 3px solid #fff;
	background: #f7f7f7;
	vertical-align: top;
}

table.standard th.center, table.standard td.center {
	text-align: center;
}

table.standard td.highlight {
	background: #ffc;
	color: #333;
}

table.standard td.highlight-blue {
	background: #cce5ff;
	color: #333;
}

/* date that shows at the bottom of the data table */
div.table-date {
	font-size: 80%;
	text-align: right;
	padding-right: 15px;
	padding-bottom: 3px;
}

/* footnote text */
.footnote {
	font-size: 80%;
	color: #666;
	background: #f7f7f7;
}

/* when an alternate version is available, used this within h2 tag */
h2 span a, h2 span a:link, h2 span a:visited, h2 span a:active {
	font-size: 80%;
	padding-left: 33px;
	color: #3e70a1;
	background: transparent;
	margin: 0;
}

h2 span a:hover {
	color: #900;
}

/* back to top division */
.topofpage {
	text-align: right;
	border-bottom: 1px dotted #ccc;
	padding-bottom: 5px;
}

/* back to top links */
a.top, a:link.top, a:visited.top, a:active.top {
	text-decoration: underline;
	color: #3e70a1; /* bluey */
	font-size: 85%;
}

a:hover.top {
	color: #900;
}


/* ------------------------ Footer Layout and style --------------------------- */
#footer {
	padding: 0;
	margin: 0;
	width: 730px;
	height: 30px;
	clear: both !important;
	font-size: 80%;
	color: #6c6c6c;
	background: #dadbd5;
}

/* link text on left - removed this for now - determine if content will be available for "terms of use" */
#footer span.terms a, #footer span.terms a:link, #footer span.terms a:visited, #footer span.terms a:active {
	float: left;
	margin-left: 20px;
	padding: 8px 0 8px 0;
	background: transparent;
	color: #666;
}

/* hover state on link text on left */
#footer span.terms a:hover {
	background: transparent;
	color: #900;
	text-decoration: underline;
}

/* copyright text - ENGLISH */
#footer span.copyright {
	float: right;
	padding: 8px 0 8px 0;
	margin-right: 107px;
}

/* copyright text - FRENCH */
#footer span.copyright-french {
	float: right;
	padding: 8px 0 8px 0;
	margin-right: 30px;
}

/* decision class for members side */
.decision {
	background-color: #f7f7f7;
	border: 1px solid #c7c7c7;
	padding: 6px;
	margin-bottom: 8px;
	color: #000;
}