﻿/*----------------------------------------------------------- 
CSS for LEGAL AID ONTARIO - Externa Site (www.legalaid.on.ca)
Version 4.0 - Governing page layout and text behaviour
            - CLeaning up previous version(s)   
Assembled by Chris Cowley - Sept 25/09
-------------------------------------------------------------*/ 
/*  HERO TEXT */
	.kicker {
		display: none;
	}
	.hero {
		font-weight: 400 !important;
		font-size:1.2em !important;
		color: #222 !important;
	}

/* PAGE LAYOUT - Main divs for page layout */
body {
	/*background: url(/images/bgtile_header.jpg) repeat-x top left;
	margin: 0px auto 0px;
	padding: 0px;*/
	
	text-align: center;
	width:100% !important;
}

#page {
	border: 0px solid #959596;
	/*background-color: #d5eac9;*/
	margin: 0px auto;
	padding: 0px;
	width: 890px;
	text-align: left;
	/* line-height: 17px; (looks a little better without it) */
	}


#pagemain { /* Background for main oae only */
	border: 0px solid #959596;
	background: url(/images/bgtile_mainpage.gif) center;
	margin: 0px auto;
	padding: 0px;
	width: 790px;
	text-align: left;
	}

/* --- HEADER SETUP: Logo & top persistent menu options --- */
#header {
	margin: 0 auto 0;
	width: 100%;
	color: #ffffff;
	font-size: 14px;
	padding: 0;
	overflow: hidden;
	height:auto;
 	background: #1a56a6	

 }
	
	#header ul {color: #ffffff;	float: right; list-style: none; width: 500px;}
	#header ul li {float: right; padding: 0 0 0 5px; margin: 0 0 0 5px; border-left: 1px solid white;}
	#header ul li.end, #footer ul li.end {border: none;}
	#header ul a, #header ul a:visited {text-decoration: underline;}
	#header ul a:hover {color: #fff;}
	#header a, #header a:visited {color: #ffffff; font-size: 10px; text-decoration: none; padding: 0px 0px 0px 3px;}
	#header a:hover {color: #f7941d;}


@media only screen and (max-width: 768px) {
#header a, #header a:visited {
	color: #ffffff;
	font-size: 14px; 
	text-decoration: none; 
	padding: 0px 0px 0px 3px;
   
   
}}

/* ADDITIONS FOR FRONT PAGE AND NEW HEADER  */

#cleanheader {background:#1a56a6;
				margin-left: auto;
				margin-right: auto;
				max-width:890px;
				}

#helpisnow {
	margin:	2em 4em 2em 4em;
	text-align: center;
}

#welcome-background {
	background:#1a56a6;
	padding: 2em 0 0 0;
	color: #fff;
}

#welcome-background a {
	padding:0;
	text-decoration: none !important;
	color: #fff;
}

#welcome-background a:hover {
	padding:0;
	text-decoration: none !important;
	color: #fff;
}

#welcome {
	margin-left:auto;
	margin-right:auto;
	max-width: 790px;
	text-align: left;
}

#welcome h1 {
	color: #fff;
	font-size: 3.6em;
}

#welcome p {
	font-size: 1.3em;
	text-decoration: none;
}


  @media (max-width: 767px) {
  	.home-nav h2 {
  		margin-top:0px !important;
  		margin-bottom: 0px;
  	}

  	.home-nav p {
  		margin:0;
  	}

  	.home-nav .col{
  		padding:2em;
  		}

  	#welcome {
  		padding:1em;
  	}

}
  

.dropbtn {
  
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
    width: 100%;
    margin: 0 0 2em 0;
    height: 3.5em;
}


.dropdown {
    position: relative;
    display: inline-block;
    width:100%;
}

.easy-autocomplete.eac-funky ul li,.easy-autocomplete.eac-funky ul .eac-category {
padding: 10px 12px;}


.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 160px;
    width:100%;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    text-align: center;
}
#eac-container-search li a {text-decoration: none !important;}

.eac-category  {
	font-weight: 700;
	font-size: 1.2em !important;
	color:#fff;
	background: #1a56a6 !important;
	font-style: normal;
	padding:1em !important;
			}
.eac-item {padding:1em !important;}


.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}



.dropdown a:hover {background-color: #ddd}

.show {display:block;}



#body {background: #fff !important;}



#quicklinksNav {overflow: hidden !important;
    clip: rect(1 1 1 1);
    margin: 0 !important;
    position: absolute;
    height: 1px !important;
    width: 1px !important;}



/* -- TOP MENU NAV -- */

.topmenunav {
	float: right;
    min-width: 250px;
    min-height: 10px;
    background-color: #01046b;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    max-width: 550px;
    padding: 0 1em 0 1em;
}

.topmenunav p {
	margin: 0;
	padding: 0;
	}

/* --- UPPER NAVBAR: Main menu options --- */
#navbar_top {
	background: #01046b; /* Dark blue background */
	font-size: 11px;
	color: #FFFFFF;
	font-weight: bold;
	margin: 0px auto 0px;
	padding: 0px 0px 0px 0px;
		/* border-top: 4px solid #016b42; */
		/*overflow: hidden;*/
	}
	#navbar_top table {width: 890px;} /* formerally 790px */
	#navbar_top td {padding-top:0.8em; padding-bottom:0.8em;}
	#navbar_top a, #navbar a:visited {color: #ffffff; text-decoration: none; padding: 0px 5px 0px 5px;}
	#navbar_top a:hover {color: #fff; padding: 5px 5px 5px 5px;	text-decoration: none;}
	
	/* Switching BG colour of TD in Navbar */
	td.off {background: #01046b;}
	td.on {background: #05479d;}


/* --- FINANCIAL ELIGIBILITY note --- */

figure.cardsort {
	width: 790px;
	margin: 0 auto;
	background: #fbd664;
	padding: 10px 0;
	font-family: Merriweather;
}

figure.cardsort img {
	float: left;
	margin: 10px 0 0 16px;
}

figure.cardsort h1 {
	margin: 2px 40px 14px 188px;
	text-align: left;
	font-size: 35px;
}

figure.cardsort h2 {
	margin: 2px 40px 12px 188px;
	text-align: left;
	font-size: 23px;
}

figure.cardsort p {
	margin: 2px 40px 8px 188px;
	text-align: left;
	font-size: 16px;
}

figure.cardsort input {
    font-size: 24px;
    padding: 12px 26px;
    border: 2px solid #5a5758;
    margin-bottom: 10px;
    background: #fff;
}



/* SITE-WIDE ALERT */

figure.sitewidealert {
	max-width: 790px;
	margin: 0 auto;
	background-color: #d02c10;
	padding: 10px 0;
	display: block;
	border-bottom-right-radius: 20px;
	border-bottom-left-radius: 20px;
}


figure.sitewidealert img {
	float: left;
	margin: 10px 0 0 16px;
	max-width:200px;
}

@media only screen and (max-width: 520px) {
figure.sitewidealert img {
    display: none;
   
}}


figure.sitewidealert h1 {
	margin: 2px 40px 14px;
	text-align: left;
	font-size: 35px;
	color: #fff;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 

}


figure.sitewidealert h2 {
	margin: 2px 40px 12px;
	text-align: left;
	font-size: 23px;
	color: #fff;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
}

figure.sitewidealert p {
	margin: 2px 40px 8px;
	text-align: left;
	font-size: 16px;
	color: #fff;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
	margin-right: 50px;
	line-height: 150%;

}

figure.sitewidealert a {
	color: #fff;
	text-decoration: underline;
}


figure.sitewidealert button {
    padding: 10px; 
    background: #fff;
    width: 150px;
    border-radius: 25px;
    text-align:center;
    margin: 0 auto;
    border: 0px;
    cursor: pointer;
    display: block;
    text-decoration: none !important;
    color: #000 !important;
    text-align: center !important;

    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
}


/* --- CLIENT FEEDBACK SURVEY --- */

figure.clientfeedback {
	max-width: 790px;
	margin: 0 auto;
	background: #F2634B;
	padding: 10px 0;
	font-family: Merriweather;
}

figure.clientfeedback img {
	float: left;
	margin: 10px 0 0 16px;
	max-width:200px;
}

@media only screen and (max-width: 520px) {
figure.clientfeedback img {
    display: none;
   
}}


figure.clientfeedback h1 {
	margin: 2px 40px 14px 188px;
	text-align: left;
	font-size: 35px;
	color: #fff;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
	padding-top:60px;
}


@media only screen and (max-width: 520px) {
figure.clientfeedback h1 {
    text-align: center;
    margin: 0px 0px 0px 0px;
    padding-top:0px;
   
}}

figure.clientfeedback h2 {
	margin: 2px 40px 12px 188px;
	text-align: left;
	font-size: 23px;
	color: #fff;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
}

figure.clientfeedback p {
	margin: 2px 40px 8px 188px;
	text-align: left;
	font-size: 16px;
	color: #fff;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
	margin-right: 50px;
	line-height: 150%;
	margin-left: 220px;
}

figure.clientfeedback a {
	color: #fff;
	text-decoration: underline;
}

@media only screen and (max-width: 520px) {
figure.clientfeedback p {
    margin-left: 50px;
   
}}

figure.clientfeedback input {
    font-size: 24px;
    padding: 12px 26px;
    border: 2px solid #5a5758;
    margin-bottom: 10px;
    background: #fff;
}

a.clientfeedbackstart {
    padding: 10px; 
    background: #fff;
    width: 150px;
    border-radius: 25px;
    text-align:center;
    margin-left: auto;
   
    margin-right: 50px;
    display: block;
    text-decoration: none !important;
    color: #000 !important;
    margin-bottom: 20px;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
}

@media only screen and (max-width: 500px) {
  a.clientfeedbackstart {
    width: 100px;
    margin-right: 25px;
    font-size: 12px;

   
}}

span.clientfeedbackclose {
    padding: 10px; 
    background: #fff;
    width: 150px;
    border-radius: 25px;
    text-align:center;
    margin-left: 340px;
    
    margin-right: 50px;
    display: block;
    text-decoration: none !important;
    color: #000 !important;
    text-align: center !important;
    float:left;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
}

@media only screen and (max-width: 767px) {
  span.clientfeedbackclose {
    margin-left: 40px;
   
}}

@media only screen and (max-width: 500px) {
  span.clientfeedbackclose {
    width: 100px;
    margin-left: 25px;
    font-size: 12px;

   
}}


div.clientfeedbackbuttons p {
	text-decoration: none;

}

/* --- CLIENT FEEDBACK SURVEY MINI --- */

figure.clientfeedbackmini {
	max-width: 890px;
	margin: 0 auto;
	background: #3d78c6;
	padding: 10px 0;
	font-family: Merriweather;
    border-radius: 0 0 25px 25px;
}

figure.clientfeedbackmini img {
	
	max-width:60px;
}


figure.clientfeedbackmini h1 {
	font-size: 30px;
	color: #fff;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
	
}

figure.clientfeedbackmini h2 {
	margin: 2px 40px 12px 188px;
	text-align: left;
	font-size: 23px;
	color: #fff;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
}

figure.clientfeedbackmini p {
	
	font-size: 14px;
	color: #fff;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
	margin: 0 50px 0 50px;
	line-height: 150%;
	
}

figure.clientfeedbackmini input {
    font-size: 24px;
    padding: 12px 26px;
    border: 2px solid #5a5758;
    margin-bottom: 10px;
    background: #fff;
}

a.clientfeedbackstartmini {
    padding: 10px; 
    background: #fff;
    width: 150px;
    border-radius: 25px;
    text-align:center;
    margin-left: auto;
   
    margin-right: 50px;
    display: block;
    text-decoration: none !important;
    color: #000;
    margin-bottom: 10px;
    font-size: 12px;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
}

@media only screen and (max-width: 500px) {
  a.clientfeedbackstartmini {
    width: 100px;
    margin-right: 25px;
   
}}

span.clientfeedbackclosemini {
    padding: 10px; 
    background: #fff;
    width: 150px;
    border-radius: 25px;
    text-align:center;
    margin-left: 50px;
    cursor: pointer;
    margin-right: 50px;
    display: block;
    text-decoration: none !important;
    color: #000 !important;
    text-align: center !important
;    float:left;
    font-size: 12px;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 
}

@media only screen and (max-width: 767px) {
  span.clientfeedbackclosemini {
    margin-left: 40px;
   
}}

@media only screen and (max-width: 500px) {
  span.clientfeedbackclosemini {
    width: 100px;
    margin-left: 25px;
   
}}

div.clientfeedbackbuttonsmini p {
	text-decoration: none;

}



/* --- NAVBAR / CONTENT SPACER --- */
#content_main {margin-top:15;}

figure.devwarning {
		background-color: #C3FA40;
		width: 100%;
		margin-top:0px;
		position: relative;

}

p.devwarning_content {
	color: #000;
	max-width: 900px;
	font-weight: 400;
	margin-left: auto;
	margin-right: auto;
}

	

/* --- LEFT HAND NAVIGATION BAR: Sub-page menus --- */
#leftnav {
	float: left;
	width: 170px;
	font-size: 11px;
	margin: 3.9em 0px 2px 3px;
	padding: 0;
	}

#leftnav h3 {
	margin-top: 0;
	margin-bottom: 0;
	}

#leftnav ul {
	margin-bottom: 0;
}

#left-nav {
	color:#016b42; 
	text-decoration: none; 
	background: #a9cbf8;
	margin: 0;
	/* padding: 10px 0 10px 0;
    border-radius: 5px; */
	}

	#left-nav img {display: inline; border: 1px solid black;}
	#left-nav a	{color:#0d4b96; text-decoration: none; border-top: 1px solid #cdeafc; border-bottom: 1px solid #5492df; padding-right:3px;} 
	#left-nav a:hover {color:white; background:#3d78c6;
		/*text-decoration:underline; */}
	#left-nav a.active:hover {text-decoration:none; color:white; background:#7dbc8b;} 

	.top-level a, 
	.second-level a, 
	.third-level a,	 
	.fourth-level a	{display:block; margin:0; padding:5px 0 5px 0;}

	.top-level a	{padding-left:5px;} 
	.second-level a	{background:#ABCDF8; padding-left:1em;} 
	.third-level a	{background:#e7e7e7;} 
	.fourth-level a	{background:#e1e1e1;} 
	.top-level a	{color:#000; background:#a9cbf8;} 
	
	.top-level a#site-home	{font-size:1.1em; font-weight:bold; background:#3d78c6; color:white; border-top: none;} 

	.second-level a, 
	.third-level a, a.open
	.fourth-level a, a.open	{color:#000; background:#e2eaf2;}

	a.active	{color:#000; background:#d5eac9; font-weight:bold;} 
	a.active2	{color:#000; background:#d5eac9;}
	a.active3	{color:#000; background:#d5eac9;} 
	a.active4	{color:#000; background:#d5eac9;} 


	/* Styling for new left nav with accessibility setup */
	.level-two,
	.level-three,
	.level-four {display:block; margin:0; padding:5px 0 5px 0;}
 

	.level-two a {background:#c9e0ff; padding-left:1.0em;}
	.level-three a {background:#e2eaf2; padding-left:1.5em;}
	.level-four a {background:#e9e9e9; padding-left:2.0em;}

	/* .level-three li {background:#3F9;} */








/* --- OPEN DATA --- */

#longdesc {border-bottom: 2px solid rgba(151, 151, 151, 0.76);
    padding-bottom: 20px;}

#opendatasets {width: 100%;}
#opendatadownload {float: left;
    width: 50%;
    position: relative;}

@media only screen and (max-width: 500px) {
  #opendatadownload {
    width: 100%;
       
}}

#openmetadata {float: right;
    width: 40%;
    display: block;}

@media only screen and (max-width: 500px) {
  #openmetadata {
    width: 100%;
       
}}



.opendownloadfile {background: #c9e0ff;
    max-width: 70px;
    border-left: 10px solid #a0b3cd;
    /* padding-left: 5px; */
    padding: 5px;
	margin-bottom:3px;
	margin:10px;
	border-radius: 3px;}


.datadescriptionmeta dt{
    background: #d5eac9;
    border-left: 10px solid #a6b69c;
    padding: 5px;
    margin-bottom: 3px;
    border-radius: 3px;}

.datadescriptionmeta dd{
	margin-left: 25px;
	display: list-item;}
    

/* --- BREADCRUMBS --- */
#breadcrumbs {display: none;
	visibility: hidden;
	/*margin: 10px 5px 0px 190px;*/
	/*color: #898989;*/
	/*font-size: xx-small;*/
	/*overflow: hidden;*/
	}
	#breadcrumbs a {display: none; visibility: hidden; /*text-decoration: none;color: #777777;*/}
	

/* --- ARTICLE space: Full span of page content area --- */
#article {
	float: right;
	width: 700px;
	margin: 0px 0px 10px 0px;
	padding: 8px 0 15px 0;
	overflow:hidden;
	line-height:1.4em;
	}


ul.gettingprimarylist {list-style-type:none !important;
	}

	
/* --- 3 Column setup: Content area is split into Left Nav - Main area - Right Sidebar --- */
#content_3col {
	background: #ffffff;
	width: 600px;
	float: right;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	overflow:hidden;
	}

#col3_centre {
	float: left;
	width: 400px;
	margin: 0px 0px 20px 0px;
	padding: 0;
	line-height:1.4em;
	}

#col3_right {
	float: right; 
	width: 180px;
	margin: 0px 0px 0px 0px;
	padding: 0px 5px 5px 0px;
	}
	
	/* internal div for right hand column - gives the rounded top */
	.roundTop h3, #roundTop2 h3 {
	color: white;
	background: #5c88c5;
	padding: 0 5px 5px 5px;
	margin:0 0 5px 0;
	border: none;
	}

	.roundTop {
	background: url(../images/rightColTop.jpg) no-repeat top left;
	padding: 3px 0 0px 0;
	}

	#roundTop2 {
	background: url(../images/largeBlueCol.jpg) no-repeat top left;
	width: 190px;
	margin-right: 10px;
	float: left;
	padding: 5px 0 0 0;
	}
	

/* ///////////////////////////////////////////////////////////////////////////////////// */
/* FOOTER /////////////////////////////////////////////////////////////////////////////// */

#footer {
	/* background: #013372; (org blue) */
	/* background:#1e1e1e; (near black) */
	/* background:#DAE1E7; (dark blue-grey ) */
	/* background:#f9f7f7;  */
	width: 100%; 
	font-size: 0.95em;
	text-align: left;
	/* padding-top:5px; */
	margin-top:2em; 
	clear: both; /* this should work in both ie and FF, works on everything else. */ 
}

	#footer p {color:#000;}
	#footer ul {list-style: none;}
	/* #footer ul li {float: left; padding-right: 5px; margin: 5px 5px 0 0; border-right: 0px solid #0076a3;} */
	#footer a {color: #000; text-decoration:none;}
	#footer a:hover {color: #cd7d1f;}


	.bigfoot {font-size:1.1em; border-bottom:1px solid #e7e7e7; font-weight:bold; padding-bottom:3px; line-height:18px;}

	/*  For the mouseover links to social media */
	#footertooltip {display:none;}
	#footertoolbox:hover #footertooltip {display:block;}


/* Footer update (April 2015) -------------------------------- */
.footerinfobox {
	float:left; 
	width:23%; 
	margin:0 1% 0 1%;
	font-size:0.95em;
	
}

.footerboxinfo h3 {color:#000;}
.footerboxinfo a {color:#000; text-decoration:none;}
.footerinfobox a:hover {color:#0C33AC;}


.footer-container-toprow {
	background:#f9f7f7;
	border-top:4px solid #000;
	margin:0 auto;
	padding:6px;
	overflow:auto;
	displaY:block;
	}

.footer-container-bottomrow {
	border-top:2px dotted #000;
	padding:6px;
	background:#fff;
	display:block;
	}
	.footer-bottomrow-linkline {
		margin:0 2em 0em 2em;
		text-align:center;
		list-style:none;
		list-style-type:none;
		}
		.footer-bottomrow-linkline li {
			display:inline;
			padding: 0 1em 0 1em;
			border-right:1px solid #777;
			}
			.footer-bottomrow-linkline li:last-child {border-right:0px;}


.footer-linkbox {
	float:left;
	width:23%;
	/* box-sizing:border-box; */
	padding:0 1% 6px 1%;
	display:inline-block;
	}
	.footer-linkbox h3 {
		color:#1D1D1D; 
		font-size:1.2em; 
		border-bottom:2px solid #777;
		margin:3px 0 5px 0;
		background:#E9E9E9;
		padding:5px;
		display:block;
		}
	.footer-linkbox ul {list-style:none; list-style-type:none; padding:0px;}
	.footer-linkbox li {}

		@media only screen and (max-width: 640px) {
		.footer-linkbox {width:48%;}
			}
		@media only screen and (max-width: 380px) {
		.footer-linkbox {width:98%;}
   			}


/* ---------------------------------------------------------------------------------------------------------- */


/* ---------------------------------------------------------------------------------------------------------- */
/* DROP DOWN MENU */

/* MAIN/Default page - Single drop down menu - Javascriptarray */
#sddm {	margin: 0; padding: 0; z-index: 30}
#sddm li {margin: 0; padding: 0; list-style: none; float: left; /* font: bold 11px arial */}
#sddm li a {display: block; margin: 0 1px 0 0; padding: 4px 10px; width: 180px; background: #3d78c6; color: #FFF; /* text-align: center; */ text-decoration: none}
#sddm li a:hover {background: #49A3FF}
#sddm div {position: absolute; visibility: hidden; margin: 0; padding: 0; width: 280px; background: #EAEBD8; border: 1px solid #5970B2}
#sddm div a {position: relative; display: block;
		margin: 0;
		padding: 5px 10px;
		width: auto;
		/* white-space: nowrap; removing allow the menu options to wrap */
		text-align: left;
		text-decoration: none;
		background: #EAEBD8;
		color: #2875DE;
		/* font: 11px arial */}

#sddm div a:hover {background: #49A3FF; color: #FFF}


/* Info for Lawyers / Single drop down menu - Javascriptarray */
#infodm {	margin: 0; padding: 0; z-index: 30}
#infodm li {margin: 0; padding: 0; list-style: none; float: left; /* font: bold 11px arial */}
#infodm li a {display: block; margin: 0 1px 0 0; padding: 4px 10px; width: 280px; background: #74a6cc; color: #FFF; /* text-align: center; */ text-decoration: none}
#infodm li a:hover {background: #49A3FF}
#infodm div {position: absolute; visibility: hidden; margin: 0; padding: 0; width: 380px; background: #EAEBD8; border: 1px solid #5970B2}
#infodm div a {position: relative; display: block;
		margin: 0;
		padding: 5px 10px;
		width: auto;
		/* white-space: nowrap; removing allow the menu options to wrap */
		text-align: left;
		text-decoration: none;
		background: #EAEBD8;
		color: #2875DE;
		/* font: 11px arial */}

#infodm div a:hover {background: #49A3FF; color: #FFF}



/* ---------------------------------------------------------------------------------------------------------- */




/* ---------------------------------------------------------------------------------------------------------- */
/* LAYOUT / BEHAVIOURS FOR SPECIFIC PAGES */



/* MAIN PAGE: Urgent message / top message box (after menu / before banner slider) ---- */
#messagebox-topbox {
	display:block;
}


.messagebox-topbox-blackcommunities {
	max-width:820px;
	margin:0 auto 1em auto;
	padding:10px 24px 10px 24px;
	background:#fbd664;
		border-radius: 0 0 25px 25px;
    	border: 2px solid #fbd664;
}

.button-closemessasebox {
	text-align:center;
	display:block;
	}
	.button-closemessasebox a {
		font-size:;
		text-decoration:none;
		background:#fff;
		padding:5px 20px;
		border-radius: 25px;
    	border: 2px solid #c09a26;
		}
		.button-closemessasebox a:hover {background:#f9e7af;}
		.button-closemessasebox a:hover {background:#f9e7af;}





/* BANNER SLIDER ON MAIN PAGE - SLIDESJS banner */
.slides_container {
    width:790px;
    height:250px;
  }
.slides_container div {
    width:790px;
    height:250px;
    display:block;
  }

.pagination {
	margin:6px auto 0;
	width:100px;
	float:right;
}

.pagination ol,ul {
	list-style:none;
}

.pagination li {
	float:left;
	margin:0 1px;
}

.pagination li a {
	display:block;
	width:12px;
	height:0;
	padding-top:12px;
	background-image:url(/images/pagination.png);
	background-position:0 0;
	float:right;
	overflow:hidden;
}

.pagination li.current a {
	background-position:0 -12px;
}



/* NEWSROOM ------------------------------------------------------------------------------------------------ */
	/* NEWSROOM: en/news/default.asp ---- */
	#newsroomleft {float: left;width: 290;background: url(/images/newsroom_bgtile.gif);}
		#newsroomleft p {padding: 5px 5px 0px 65px;}

	#newsroomright {float: right;width: 290;background: url(/images/newsroom_bgtile.gif);}
		#newsroomright p {padding: 5px 5px 0px 65px;}
	
	#newsroomright_yellow {float: right; width: 180; line-height:15px; background: #fffe97;
		/* background: url(../images/rightColTop.jpg) no-repeat top left; */}
	#newsroomright_yellow h4, #newsroomright_yellow p {padding: 5px 5px 5px 5px;}


	/* NEWS ARCHIVES/HOT BYTES/MEDIA ENQUIRIES - Layout for list of postings */
	#postinglist_left {float:left; width: 20%; border-top: 1px solid #e7e7e7;}
	#postinglist_right {float:right; width:80%; padding-top:5px;}



	/* NEWS lead (sub-heading to a news posting) ------ */
	.lead {
		font-size:1.15em;
		color:#555;
		margin:1em 0 1em 0;
		padding:0 0 0em 0;
		border-bottom:0px solid #e7e7e7;
		}



	/* News article images (sidebar / accent pictures) -- */
	.news-articlephoto-sidebar {
		float:right;
		width:35%;
		margin:0 0 1em 1em;
	}

	.news-articlephoto-sidebar img {
		height:auto;
		width:100%;
	}

		@media all and (max-width: 500px) {
			.news-articlephoto-sidebar {width:96%; padding:0 2% 0 2%;}
			}


/* ----------------------------------------------------------------------------------------------------- */



/* DASHBOARDS: en/news/dashboards.asp - split page -- */
	.dashboard_left {float: left; width: 200; border-top: 1px solid #d6d6d6;}
	.dashboard_right {float: right; width: 400;	border-top: 1px solid #d6d6d6;}


/* SIDEBARS ---------------------------------------------------------------------------------------------- */
	/* SIDEBAR BOX - Grey background OLD VERSION*/
	#sidebar_old_grey {float:right; width:180px; background:#e7e7e7; padding:5px; margin-left:5px;}
	
	/* SIDEBAR BOX - Grey background */
	#sidebarclear {float:right; width:180px; padding:5px; margin:0 0 1.5em 1.5em;}
	#sidebarclear aside h2 {color:#05a; margin:1em 0 1em 0;}
	#sidebarclear aside h3 {color:#05a; margin:1em 0 1em 0;}
	

	/* SIDEBAR BOX - White background */
	#sidebarwhite {float:right; width:180px; background:#ffffff; padding:5px; margin-left:5px;}

	/* SIDEBAR BOX - Yellow background */
	#sidebaryellow {float:right; width:180px; background:#fffe97; padding:5px; margin-left:5px;}

	/* Sidebar - standard ----------------- */
	.sidebar-standard {
		float:right;
		width:33%;
		margin:0 0 1em 1em;
		border-top:1px solid #fff;
		border-bottom:1px solid #fff;
		}
		.sidebar-standard:hover {border-top:1px solid #00558c; border-bottom:1px solid #00558c;}
		.sidebar-standard:focus {border-top:1px solid #00558c; border-bottom:1px solid #00558c;}
	
		.sidebar-standard h2 {color:#00558c; font-size:1.25em; font-weight:normal; margin:0 0 0.5em 0; padding:0 0 0 0;}
	
			@media all and (max-width: 500px) {
			.sidebar-standard {width:96%; padding:0 2% 0 2%;}
			}
	
	
	
	

/* GETTING LEGAL HELP TWISTIE QUESTIONS */
	#twistiequestion {
	background:#ffffcc;
	padding:5px;
	margin-left:20px;
	}

	#twistiequestion p { background:#ffffcc; 
	}


/* FORMS LIBRARY - en/info/form.asp - Background Switcher */
	#switcherbg {background-color:#ffffff;}
	#switcherbg:hover {background-color:#deefef;} 

/* -- STICKY SIDEBAR -- */

.stickysidebar{
	z-index:1000px;
}
	
/* ---------------------------------------------------------------------------------------------------------- */





/* ---------------------------------------------------------------------------------------------------------- */
/* TABLE BEHAVIOUR */


th {
	font-weight:normal;
	text-align:left;
}

th p {
	align:left;
	
}


/* Tables for eligibility charts (general) ---- */
.eligibilitytable {	
	table-layout: fixed; width: 400px;
	font-size: 1.4em;
	font-weight: normal;
	padding: 0.5em;
	margin:0 0 1.5em 0;
	border: none;
	border-collapse: collapse;
	text-align:center; 
    vertical-align:middle;
}
.eligibilitytable caption {
 	display: none;
	visibility:hidden;	
 }
.eligibilitytable-head {
 	font-family: arial, helvetica, sans-serif;
 	font-weight: normal;
 	color:#fff;
 	background-color: #0D9E99;
 	padding:0.9em;
 	margin:0;
 	border:none;
	text-align:center; 
    vertical-align:middle;
}
.eligibilitytable-head1 { 	font-family:  helvetica, arial, sans-serif;
 	font-weight: normal;
 	color:#fff;
 	background-color: #0D9E99;
 	padding:0.35em;
 	margin:0;
 	border:none;
}
.eligibilitytable-col1 { 
	font-family: arial, helvetica, sans-serif;
 	font-weight:bold;
 	color:#0D9E99;
 	background-color: #fff;
 	padding:0;
 	margin:0;
 	border:none;	border-bottom: 2px solid #87CFCC;
	text-align:center; 
    vertical-align:middle;

}
.eligibilitytable-col2 { 
	font-family: arial, helvetica, sans-serif;
 	font-size: 1.1em;
 	color:#fff;
 	background-color: #262260;
 	padding:0.5em;
 	margin:0;
 	border:none;	border-bottom: 2px solid #87CFCC;
}
  .eligibilitytable-col3 {
  	font-size: 1.1em;
  	font-family:  helvetica, arial, sans-serif;
  	color:#fff;
 	background-color: #00547A;
 	padding:0.5em;
 	margin:0;
 	border:none;	border-bottom: 2px solid #87CFCC;
 }



/* Tables for eligibility charts (for Domestic Violence pages) ----- */
.eligibilitytable-dv {	
	table-layout: fixed; width: 400px;
	font-size: 1.4em;
	font-weight: normal;
	padding: 0.5em;
	margin:0 0 1.5em 0;
	border: none;
	border-collapse: collapse;
	text-align:center; 
    vertical-align:middle;
}
.eligibilitytable-dv caption {
 	display: none;
	visibility:hidden;	
 }
.eligibilitytable-dv-head {
 	font-family: arial, helvetica, sans-serif;
 	font-weight: normal;
 	color:#fff;
 	background-color: #a1245f;
 	padding:0.9em;
 	margin:0;
 	border:none;
	text-align:center; 
    vertical-align:middle;
}
.eligibilitytable-dv-head1 { 	font-family:  helvetica, arial, sans-serif;
 	font-weight: normal;
 	color:#fff;
 	background-color: #a1245f;
 	padding:0.35em;
 	margin:0;
 	border:none;
}
.eligibilitytable-dv-col1 { 
	font-family: arial, helvetica, sans-serif;
 	font-weight:bold;
 	color:#a1245f;
 	background-color: #fff;
 	padding:0;
 	margin:0;
 	border:none;	border-bottom: 1px solid #a1245f;
	text-align:center; 
    vertical-align:middle;

}
.eligibilitytable-dv-col2 { 
	font-family: arial, helvetica, sans-serif;
 	font-size: 1.1em;
 	color:#fff;
 	background-color: #262260;
 	padding:0.5em;
 	margin:0;
 	border:none;	border-bottom: 1px solid #a1245f;
}
  .eligibilitytable-dv-col3 {
  	font-size: 1.1em;
  	font-family:  helvetica, arial, sans-serif;
  	color:#fff;
 	background-color: #00547A;
 	padding:0.5em;
 	margin:0;
 	border:none;	border-bottom: 1px solid #a1245f;
 }








/* Tables with zebra stripping charts */

.zebratable {border-color:#0072bc;
			width:100%;
			border-spacing: separate;
			border-collapse:collapse;
			font-size:1em;
			text-align:right;
			margin-bottom:2.5em;
			margin-top:1.5em;}

.zebraleft {text-align: left !important;}
			
.zebratable td {padding:0.7em;}
.zebratable th {padding:0.7em;}
			
.zebraheader {background-color:#0072bc;
			font-size:1.1em;
			color:#fff;}

.zebragray {background-color:#e5e5e5;}


.zebra tbody tr:nth-child(4n+2) {
   background-color: #e5e5e5;
}

.zebraodd tbody tr:nth-child(2n+2) {
	background-color: #e5e5e5;
}

.zebraeven tbody tr:nth-child(2n+1) {
	background-color: #e5e5e5;
}

.zebraeven div:nth-child(2n+1) {
	background-color: #e5e5e5;
}


.zebrafirst tbody th {font-weight: 600;}





/* CALL US */

.calluszebra {
   background-color: #F5F5F5;
}

#callus h3 {font-size: 1.20em; color: #000 !important; padding:0px 5px 0px 5px !important;}



	/* ////////////////////////////////////////////////////// */
	/* TABLE: Expense reports (Proactive disclosure section) ------------------------------------------- */
	.table-expensereport-data {
		width:100%;
		margin:0 0 2em 0;
		border-collapse:collapse;
		}

	.table-expensereport-data caption {text-align:left;}
	.table-expensereport-data caption h2 {color:#00558c; font-size:1.3em; margin:0 0 .4em; padding:0px;}
		.table-expensereport-data caption h3 {color:#00558c; font-size:1.3em; margin:0 0 .4em; padding:0px;} /* H3 is the same for instances where there is an addedum to the report -- */

	.table-expensereport-data thead tr {background:#e5e5e5;}
		.table-expensereport-data thead tr:hover {background:#00558c; color:#fff;}
	.table-expensereport-data thead th {padding:0.3em 0.1em 0.3em 0.1em; text-align:right;}
		.table-expensereport-data thead th:first-child {text-align:left;}

	.table-expensereport-data tbody tr {border-bottom:1px solid #e5e5e5;}
		.table-expensereport-data tbody tr:hover {background:#e9e9e9;}
	.table-expensereport-data tbody th {padding:0.3em 0.1em 0.3em 0.1em;}
	.table-expensereport-data tbody td {padding:0.3em 0.1em 0.3em 0.1em; text-align:right;}

	.table-expensereport-data .table-row-subtotal {background:#ffffcc;}
		.table-expensereport-data .table-row-subtotal:hover {background:#ffff00;}


	.table-expensereport-total {
		width:100%;
		margin:0 0 2em 0;
		border:1px solid #777;
		border-collapse:collapse;
		}

	.table-expensereport-total caption {text-align:left;}
	.table-expensereport-total caption h2 {color:#00558c; font-size:1.4em; margin:0 0 .4em; padding:0px;}
		.table-expensereport-total caption h3 {color:#00558c; font-size:1.4em; margin:0 0 .4em; padding:0px;} /* H3 is the same for instances where there is an addedum to the report -- */

	.table-expensereport-total thead tr {background:#00558c; color:#fff;}
		.table-expensereport-total thead tr:hover {background:#00558c; color:#fff;}
	.table-expensereport-total thead th {padding:0.5em 0.1em 0.5em 0.1em; text-align:right;}
		.table-expensereport-total thead th:first-child {text-align:left;}

	.table-expensereport-total tbody tr {border-bottom:1px solid #e5e5e5;}
		.table-expensereport-total tbody tr:hover {background:#e9e9e9;}
	.table-expensereport-total tbody th {padding:0.3em 0.1em 0.3em 0.1em;}
	.table-expensereport-total tbody td {padding:0.3em 0.1em 0.3em 0.1em; text-align:right;}

	.table-expensereport-total .table-row-total {background:#ffff00;}
		.table-expensereport-total .table-row-total:hover {background:#f90;}


	/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////// 
	TABLE > Proactive disclosure section > Expense reports (revised for new data layout (Dec 2016/2016-17 Q2) -- */
	.table-disclosure-expenses-data {
		width:100%;
		margin:0 0 1em 0;
		padding:0px;
		border-collapse:collapse;
		font-size:0.9em;
		}
		.table-disclosure-expenses-data th {padding:3px; border:1px solid #777;}
		.table-disclosure-expenses-data td {padding:3px; border:1px solid #777;}


		.table-disclosure-expenses-data thead tr {background:#0077bc; color:#fff;}
		.table-disclosure-expenses-data thead th {padding-top:8px; padding-bottom:8px;}

		.table-disclosure-expenses-data tbody tr:nth-child(even) {background: #e9e9e9;}
		.table-disclosure-expenses-data tbody tr:nth-child(odd) {background: #FFF;}

			.table-disclosure-expenses-data tbody tr:hover,
			.table-disclosure-expenses-data tbody tr:focus {background:#BCCDE7!important;}

		.table-disclosure-expenses-data .dataNumbers {text-align:right;}
		.table-disclosure-expenses-data .dataNumbersTotal {background:#ffffcc; text-align:right;}

	.table-disclosure-expenses-total {
		width:100%;
		margin:0 0em 2em 0em;
		padding:0;
		border-collapse:collapse;
		}

		.table-disclosure-expenses-total th {padding:3px; border:1px solid #777;}
		.table-disclosure-expenses-total td {padding:3px; border:1px solid #777;}

		.table-disclosure-expenses-total thead tr {background:#00558c; color:#fff;}
		.table-disclosure-expenses-total thead th {padding-top:8px; padding-bottom:8px;}

		.table-disclosure-expenses-total tbody td {text-align:right;}

		.table-disclosure-expenses-total tbody tr:nth-child(even) {background: #e9e9e9;}
		.table-disclosure-expenses-total tbody tr:nth-child(odd) {background: #FFF;}

			.table-disclosure-expenses-total tbody tr:hover,
			.table-disclosure-expenses-total tbody tr:focus {background:#BCCDE7!important;}

		
			/* ----------------------------------------------------------------
			Breadcrumb nav menu for the Expense reports page -- */
			.disclosure-expenses-breadcrumbNav {}

			.disclosure-expenses-breadcrumbNav ul {list-style:none; list-style-type:none; margin:0 0 0em 0; padding:8px 0 8px 0; border-top:1px solid #777; border-bottom:1px solid #777;}
			.disclosure-expenses-breadcrumbNav li {display:inline; padding:0 5px 0 5px; border-left:1px solid #00558c; }

			.disclosure-expenses-breadcrumbNav a {color:#00558c; text-decoration:none;}
				.disclosure-expenses-breadcrumbNav a:hover,
				.disclosure-expenses-breadcrumbNav a:focus {border-bottom:2px solid #00558c; text-decoration:none;}


	/* ////////////////////////////////////////////////////// */
	/* PROACTIVE DISCLOURE: Styling for expense report pages ------------------------------------------- */
	.expensereport-leftcolumn {
		float:left;
		width:20%;
		display:inline-block;	
		}
		.expensereport-leftcolumn h3 {color:#00558c; font-size:1.2em; font-weight:300; margin:0; padding:0px;}
		.expensereport-leftcolumn h4 {color:#00558c; font-size:1.2em; font-weight:300; margin:0; padding:0px;} /* Same size for the addendum tables */


	.expensereport-rightcolumn {
		float:right;
		width:75%;
		display:inline-block;	
		}


		@media all and (max-width: 700px) {
			.expensereport-leftcolumn {width:100%; display:block;}
			.expensereport-rightcolumn {width:100%; display:block;}
			}


	/* ////////////////////////////////////////////////////// */
	/* TABLE FOR SHOWING LIST OF DATES (plain table) ------------------------------------------- */
	.table-dates-plain {
		width:100%; 
		border:0px;
		margin:0 0 1em 0;
		border-collapse:collapse;
		}
		.table-dates-plain thead tr {background:#BFC9E9;}
		.table-dates-plain thead th {border:1px solid #e7e7e7; padding:5px;}
		.table-dates-plain tbody th,
		.table-dates-plain tbody td {
			border:1px solid #e7e7e7;
			padding:5px;
			}

	/* ///////////////////////////////////////////////////////////////////// */
	/* --------------------------------------------------------
	5.7.1 General table styling ---------------------------- */
		caption {text-align:left;}
		th {font-weight:normal; text-align:left;}

		.table-row-subtotal {background:#FFFFDF!important;}
		.table-row-total {background:#FFFF87!important;}

	/* --------------------------------------------------------
	5.7.1 Standard table type ------------------------------ */
		.table-standard-content {
			font-size:0.9em; 
			width:100%;
			margin:0 0 1em 0;
			border-collapse:collapse;
			}
			.table-standard-content thead tr {background:#0072bc; color:#fff;}
			.table-standard-content th {border:1px solid #00558c; padding:5px; vertical-align:top;}
			.table-standard-content td {border:1px solid #00558c; padding:5px;}

			.table-standard-content tbody tr:hover {background:#C9D9F4!important;}

			.table-standard-content tbody tr:nth-child(even) {background: #e9e9e9;}
			.table-standard-content tbody tr:nth-child(odd) {background: #FFF;}



		.table-standard-data {
			font-size:0.9em;
			width:100%;
			margin:0 0 1em 0;
			border-collapse:collapse;
			}
			.table-standard-data thead tr {background:#0072bc; color:#fff;}
			.table-standard-data th {border:1px solid #00558c; padding:5px; vertical-align:top;}
			.table-standard-data td {border:1px solid #00558c; padding:5px; text-align:right;}

			.table-standard-data tbody tr:hover {background:#C9D9F4!important;}

			.table-standard-data tbody tr:nth-child(even) {background: #e9e9e9;}
			.table-standard-data tbody tr:nth-child(odd) {background: #FFF;}





		/* --------------------------------------------------------
		5.7.2 Plain table type ------------------------------ */
		.table-plain-content {
			font-size:0.9em; 
			width:100%;
			margin:0 0 1em 0;
			border-collapse:collapse;
			}
			.table-plain-content thead tr {background:#e5e5e5; color:#00558c;}
			.table-plain-content thead th {border:1px solid #555;} 
			.table-plain-content th {border-bottom:1px solid #555; padding:5px;}
			.table-plain-content td {border-bottom:1px solid #555; border-left:1px solid #555; padding:5px;}

			.table-plain-content tbody tr:hover {background:#C9D9F4!important;}

			.table-plain-content tbody tr:nth-child(even) {background: #f9f9f9;}
			.table-plain-content tbody tr:nth-child(odd) {background: #FFF;}



		.table-plain-data {
			font-size:0.9em;
			width:100%;
			margin:0 0 1em 0;
			border-collapse:collapse;
			}
			.table-plain-data thead tr {background:#e5e5e5; color:#00558c;}
			.table-plain-data thead th {border:1px solid #555;} 
			.table-plain-data th {border-bottom:1px solid #555; padding:5px;}
			.table-plain-data td {border-bottom:1px solid #555; border-left:1px solid #555; padding:5px; text-align:right;}

			.table-plain-data tbody tr:hover {background:#C9D9F4!important;}

			.table-plain-data tbody tr:nth-child(even) {background: #f9f9f9;}
			.table-plain-data tbody tr:nth-child(odd) {background: #FFF;}



/* standard table */

.table {
  width: 100%;
  max-width: 100%;
  margin-bottom: 1rem;
  border-spacing:0px;
   }
  .table th,
  .table td {
    padding: 0.75rem;
    vertical-align: top;
    border-top: 1px solid #eceeef; }
  .table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #eceeef; }
  .table tbody + tbody {
    border-top: 2px solid #eceeef; }
  .table .table {
    background-color: #fff; }


.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(0, 0, 0, 0.05); }

.table-hover tbody tr:hover {
  background-color: rgba(0, 0, 0, 0.075); }



.table-hover .table-active:hover {
  background-color: rgba(0, 0, 0, 0.075); }
  .table-hover .table-active:hover > td,
  .table-hover .table-active:hover > th {
    background-color: rgba(0, 0, 0, 0.075); }



.table-hover .table-success:hover {
  background-color: #d0e9c6; }
  .table-hover .table-success:hover > td,
  .table-hover .table-success:hover > th {
    background-color: #d0e9c6; }



.table-hover .table-info:hover {
  background-color: #c4e3f3; }
  .table-hover .table-info:hover > td,
  .table-hover .table-info:hover > th {
    background-color: #c4e3f3; }



.table-hover .table-warning:hover {
  background-color: #faf2cc; }
  .table-hover .table-warning:hover > td,
  .table-hover .table-warning:hover > th {
    background-color: #faf2cc; }

.

.table-hover .table-danger:hover {
  background-color: #ebcccc; }
  .table-hover .table-danger:hover > td,
  .table-hover .table-danger:hover > th {
    background-color: #ebcccc; }

.thead-inverse th {
  color: #fff;
  background-color: #174b90; }



.table-inverse {
  color: #fff;
  background-color: #174b90; }
  .table-inverse th,
  .table-inverse td,
  .table-inverse thead th {
    border-color: #fff; }
  .table-inverse.table-bordered {
    border: 0; }



/* ---------------------------------------------------------------------------------------------------------- */
/* TEXT & CONTENT BEHAVIOUR */

html,body	{padding:0; font-size:90%;}

html,body,
p,ul,ol,li, 
td,th,dl,dt, 
blockquote,
h1,h2,h3,h4,h5	{font-family:verdana,arial,helvetica,sans-serif;}

table,tr,td,th {font-size:1em;}

body,p,li,dd,dt,th,td,
blockquote, pre, code, xmp,
#left-nav,
#related-links	{font-size:1em;}

p	{margin:0; padding:0 0 .75em 0;}
.first	{padding:0 0 .5em 0;}
ul.first	{margin:0; padding:0 0 .5em 1.25em;}
ul	{margin:0; padding:0.5em 0 1em 2em; list-style: disc outside none;}
/* ol	{padding:.5em .5em .5em 2.2em;} */
ul ul, ul ol, ol ol, ol ul {padding-bottom:0;}
dl	{}
li	{margin:0; padding-bottom:.5em; line-height:1.4em;}
dt	{margin:0; padding:0; font-weight:bold; line-height:1.4em;}
dd	{margin:0; padding:0em 0em .25em 3em; line-height:1.4em;}

ul.no-bullets	{padding:0 0 1em 0; list-style-type:none;}
ul.anchor-links	{padding:0 0 1em 35px;}

/* make all ul bullets into arrows */
ul.arrows {
list-style: disc;
}

/*LEXICON */

.lexicon  {font-size: 0.85em;
    		text-align: center;
    		padding: 10px, 0 10px, 0;
    		margin-bottom: 20px;
    		border-bottom: 1px solid #1748a5;
    	}

    	.lexicon a:after {content: "\20|\20";}
    	.lexicon a {text-decoration: none;}
    	.lexicon a:first-child:before {content:"";}
    	.lexicon a:last-child:after {content:"";}


@media only screen and (max-width: 768px) {
.lexicon-each-letter {text-align: center;
						display:block;
						background-color: #1748a5;
						padding:1px 0 10px 0;}
.lexicon-each-letter h3 {color: #fff !important;}
}


@media only screen and (min-width: 768px) {
.lexicon-each-letter {display: block;
						float:left;
						margin-left: 20px;
						width:2%;
						font-size: 1.2em;
}}


/*BACK TO TOP */
.top {text-align: right; padding-top:20px;}




/* HIDDEN TEXT */
.hidden 
{position:absolute;
left:-10000px;
top:auto;
width:1px;
height:1px;
overflow:hidden;}





/* Text groups/tags */
.note	{color:#666; font-size:.85em;}
.caption	{font-weight:bold;}
.caption,.copyright	{font-size:.9em; color:#666; letter-spacing:.05em; padding:0;}
.byline	{float:right; font-size:.75em; font-weight:normal; font-style:italic; color:#999;}
.confidential	{font-weight:bold; color:#a00;}
.newspost {text-decoration: none; font-size: 0.8em;	line-height: 15px; padding: 2px 3px 2px 5px;}
	.newspost a {text-decoration: none ;}

	.kicker {display: none;}
/* .kicker	{font-size:.8em; color:#666; padding:0 0 5px 0; font-weight:bold;} */
.sub-title	{padding:.5em 0 .5em 0; color:#666; font-weight:bold; font-style: italic;} /* fix with targeting */

.translatetag {background-color: #07a6d1; border: 10px solid #07a6d1;}


.pullquote {
      float:right; 
      width:40%; 
      padding:1em 1em 0 1em; 
      border-top:5px solid #888; 
      margin: 0.5em 0.5em 1em 3em;
      }

.pullquote p {
      /* font-family: Georgia, "Times New Roman", Times, serif; */
      font-size:1.4em; 
      line-height:1.5em;
      color:#525252;
      text-indent: -0.5em;
      }

.pullquote p attrib { 
      margin-left:1.1em;
      display:block;
      text-indent: -1.1em;
      font-size: 0.9em !important;
}


.pullquote_fullwidth {
      /* width:100%; */
      margin: 0.5em 2.5em 0.5em 2.5em ;
      }

.pullquote_fullwidth p {
      /* font-family: Georgia, "Times New Roman", Times, serif; */
      font-size:1.2em; 
      line-height:1.4em;
      color:#525252;
      /* text-indent: -0.5em; */
      }

.pullquote_fullwidth p attrib { 
      margin: 0 0 2em 1.5em;
      padding:0px;
	display:block;
      text-indent: -1.1em;
	font-weight:500;
      font-size: 0.8em !important;
}







/* FIGURE (for pictures, charts and other similar things (HTML 5) -------- */
figure {
	border:0;
	height:auto;
	width:auto;
	padding:0;
	margin:0;
}

figcaption {
	font-size:0.9em;
	color:#888;	
	margin-bottom:0.5em;
}







/* Universal link behaviour */
a {color:#1748a5;}
a, a:active, a:visited {
	text-decoration: underline; 
	color:#1748a5; /* old - color: #1748a5; */
	}
a, a:hover, a:focus {
	text-decoration:underline;
	color:#1748a5; /* old - color: #3660b0; */
	}



/* Header treatments  ----------------------------------------------------- */
h1,h2,h3,h4,h5,h6,
.sub-title	{margin:0; padding:0;}


.sub-head	{color:#555; margin:0.5em 0 1em 0; }


h1	{font-size:2.0em; font-weight:normal; line-height:1.5em;}
h2	{font-size:1.7em; font-weight:normal; line-height:1.5em;}
#content-main h2	{margin-top:.5em;}
.frontfloat h2, .frontFloatEnd h2 {padding: 0 0 10px 0;}

h2.small	{font-size:1.2em; font-weight:bold;}


h3	{font-size:1.4em; margin: 0; border-top: 0px solid #ccc; font-weight:normal;}
h4	{font-size:1.2em; margin: 0; font-weight:normal;}

h5,h6	{font-size:1em;}


.pagetitleheader {
	color:#05a; 
	border-bottom:2px solid #05a; 
	margin-bottom:1em; 
	font-size:2.2em;
	padding: 1em 0 0.4em 0;

}

.pagetitleheader-career {
	color:#05a; 
	border-bottom:2px solid #05a; 
	margin-bottom:1em; 
	font-size:2.2em;
	padding: 1em 0 0 0;

}

.pagetitleheader-career h2 {
	margin:0 0 0.5em 0 !important;
}


p.warning {
	background-color: #ffd9d9;
	border-left: 12px solid #f00;
	padding: 6px 14px 6px 14px;
}



/* Bar colours: usually used in right sidebars */
.bar-green-dark	{background:#7a3; color:#fff; padding:.3em .5em; margin-bottom:5px;}
.bar-green-med-dark	{background:#9c3; color:#fff; padding:.3em .5em; margin-bottom:5px;}
.bar-green-med-light	{background:#bd6; color:#000; padding:.3em .5em; margin-bottom:5px;}
.bar-green-light	{background:#8dc63f; color:#fff; padding:.3em .5em; margin-bottom:5px;}

.bar-blue-med-dark	{background:#47b; color:#fff; padding:.3em .5em; margin-bottom:5px;}
.bar-blue-dark	{background:#05a; color:#fff; padding:.3em .5em; margin-bottom:5px;}
.bar-blue-med	{background:#69c; color:#fff; padding:.3em .5em; margin-bottom:5px;}
.bar-blue-med-light	{background:#9be; color:#000; padding:.3em .5em; margin-bottom:5px;}
.bar-blue-med-round	{background:#5c88c5; color:#fff; padding:.3em .5em; margin-bottom:5px;}
.bar-blue-light	{background:#27aae1; color:#fff; padding:.3em .5em; margin-bottom:5px;}

.bar-purple	{background:#92278f; color:#fff; padding:.3em .5em; margin-bottom:5px;}

.bar-gray-dark	{background:#666; color:#fff; padding:.3em .5em; margin-bottom:5px;}
.bar-gray-med-dark	{background:#999; color:#fff; padding:.3em .5em; margin-bottom:5px;}
.bar-gray-med-light	{background:#ccc; color:#000; padding:.3em .5em; margin-bottom:5px;}
.bar-gray-light	{background:#e7e7e7; color:#000; padding:.3em .5em; margin-bottom:5px;}

.bar-red-dark	{background:#9d0a0e; color:#ffffff; padding:.3em .5em; margin-bottom:5px;}
.bar-orange-dark	{background:#F90; color:#ffffff; padding:.3em .5em; margin-bottom:5px;}
.bar-orange	{background:#f15a29; color:#ffffff; padding:.3em .5em; margin-bottom:5px;}
.bar-center-blue {background:#69c; color:#fff; padding:.3em .5em; margin: 0px 10% 0px 10%; font-size:1em; font-weight:bold; text-align:center;}



/* Colours */
.primary-blue-dark	{color:#000668;}
.primary-blue-med	{color:#0853a4;}
.primary-blue-light	{color:#5c88c5;}

.blue-dark	{color:#05a;}
.blue-med-dark	{color:#47b;}
.blue-med	{color:#69c;}
.blue-med-light	{color:#9be;}
.blue-light	{color:#cef;}

.black	{color:#000;}
.white	{color:#ffffff;}
.gray-dark	{color:#666;}
.gray-med-dark	{color:#999;}
.gray-med	{color:#aaa;}
.gray-med-light	{color:#ccc;}
.gray-light	{color:#ddd;}
.gray-lightest	{color:#eee;}

.green-dark	{color:#00673d;}
.green-med-dark	{color:#9c3;}
.green-med-light	{color:#bd6;}
.green-light	{color:#dfb;}

.yellow-med	{color:#fe2;}
.yellow-light	{color:#ffa;}

.orange-dark	{color:#c60;}
.orange-med	{color:#f90;}

.red-dark	{color:#a00;}
.red-med	{color:#c33;}

.pink-med	{color:#f76;}
.pink-light	{color:#fcc;}

.violet-dark	{color:#936;}
.violet-med-dark	{color:#969;}
.violet-med-light	{color:#b7b;}
.violet-light	{color:#ede;}

.white {color:#ffffff;}

.alert-stop	{color:#c00;}
.alert-go	{color:#0f0;}
.alert-caution	{color:#ff0;}




	/* - Behaviours for H1, H2 and H3 headers - */
	#article h1, #col3_centre h1 {color: #01046b;} 
	#article h2, #col3_centre h2 {padding: 0; margin:1.3em 0 0.5em 0; } 
	#article h3, #col3_centre h3 {color: #1748a5; padding: 0px 0 0 0; margin: 0.7em 0 5px 0; border-top: 0px solid #ccc;}
	#article h4, #col3_centre h3 {padding: 0px 0 0 0; margin: 0.4em 0 5px 0;}
	.minisidebar {font-size:1.1em;
					color:#05a;}


	/* Behaviours for Lists - */
	#article ul {list-style: disc outside none;}
	#col3_centre ul {list-style: disc outside none;}

	#col3_right ul {list-style: none; margin: 0; padding: 5px 0 0 0;}
	#col3_right ul ul {padding: 0 0 0 12px; margin: 0;}
	

/* ---------------------------------------------------------------------------------------------------------- */


/* LIST TREATMENTS ------------------------------------------------------------------------------------------- */

dl, dt, dd {margin:0; padding:0;}

	/* Questions and answers: Using a DL list to sort out a Q&A page (better semantics) -- */
	.list-dl-qanda {margin:0 0 2em 0;}
	.list-dl-qanda dd {margin:0 0 1em 1.5em}

	/* Page organizing sub-groups (title and content in 2 columns like the Proactive disclosure pages, etc.) -- */
	.list-sub-group {
		width:100%;
		display:flex;
		flex-direction:row;
		flex-wrap: wrap;
		}
		.list-sub-group dt {flex: 1 0 160px; margin:0 20px 0 0; padding:0px;}
		.list-sub-group dd {flex: 1 0 380px;}

		.list-sub-group dt h2 {
			color:#00558c; 
			font-size:1.4em; 
			font-weight:normal; 
			border-top:1px solid #00558c;
			margin:0 0 1em 0;
			padding:1em 0 0 0;
			}

			.list-sub-group dt h2 a {text-decoration:none;}
				.list-sub-group dt h2 a:hover,
				.list-sub-group dt h2 a:focus {text-decoration:underline;}

	.list-sub-group-container {
		padding:3px;
		border:1px solid #fff;
		-webkit-transition: all .2s;
		transition: all .2s;
		}

		.list-sub-group-container:hover,
		.list-sub-group-container:focus {
			border:1px solid #999;
			}

		.list-sub-group-container h3 {font-size:1.25em; font-weight:normal; margin:0em 0 1em 0; padding:0px;}
			.list-sub-group-container h3 a {text-decoration:none;}
				.list-sub-group-container h3 a:hover,
				.list-sub-group-container h3 a:focus {text-decoration:underline;}
		.list-sub-group-container h4 {font-size:1.15em;}


	/* BIOgraphis list (DL list and flex box being used to sort out list of bio information ------------------------ */
	.list-bio-group {
		width:100%;
		display:block;
		}
		.list-bio-group dd {margin:0px; padding:0px;}

	.list-bio-group-container {
		border:1px solid #fff;
		-webkit-transition: all .2s;
		transition: all .2s;
		width:94%;
		margin: 0 2% 1em 0%;
		padding:2%; display:flex;
		flex-direction:row;
		flex-wrap: wrap;
		}
		.list-bio-group-container dt {flex: 1 0 120px; max-width:130px; margin: 0 10px 0 0;}
		.list-bio-group-container dd {flex: 1 0 280px;}

		.list-bio-group-container:hover,
		.list-bio-group-container:focus {
			border:1px solid #999;
			}

		.list-bio-group-container dt img {width:100%; height:auto; border:0;}

		.list-bio-group-container h3 {font-size:1.25em; font-weight:normal; margin:0px 0 0.5em 0!important; padding-top:0px!important;}
			.list-bio-group-container h3 a {text-decoration:none;}
				.list-bio-group-container h3 a:hover,
				.list-bio-group-container h3 a:focus {text-decoration:underline;}
		.list-bio-group-container h4 {font-size:1.15em;}


	/* GLOSSARY list (using DL) ------------------------------- */
	.list-glossary {margin:0 0 1em 0;}
		.list-glossary dt {font-size:1.1em; font-weight:bold;}
		.list-glossary dt {margin:0; padding:0px;}
		.list-glossary dd {margin: 0 0 1em 1em!important; padding:0px;}






/* ---------------------------------------------------------------------------------------------------------- */
/* HEADER CLASSES ------- */
.header-sectiondivider {
	color:#00558c;
	border-top:1px solid #00558c;
	margin:1em 0 0.5em 0; 
	padding:1.5em 0 0 0;
	}



/* ---------------------------------------------------------------------------------------------------------- */
/* SPECIFIC BEHAVIOURS */

/* -- Expanding Text/Twisties -- */
.short { display:inline; }
.long { display:none; /* background-color: #ffffff; */ }



/* -- Expanding Text/Twisties Styling -- */
.twistie_title {
	background:#0072bc;
	padding:3px;
	color:#ffffff;
	text-decoration:none;
}

	.twistie_title a {text-decoration:none; color:#ffffff; font-weight:strong; font-size:1.1em;}
	.twistie_title a:hover {text-decoration:none; color:#ffffff; font-size:1.1em; font-weight:strong;}

.twistie_box {
	border:1px solid #0072bc;
	padding:3px;
}






/* -- Post-It-Note Mouseover text -- */
a.infobox{
    position:relative; /*this is the key*/
    z-index:24; background-color:#ffffcc;
    color:#000;
    text-decoration:none;}

	a.infobox:hover{z-index:25; background-color:#ff0}
	a.infobox span{display: none}
	a.infobox:hover span{ /*the span will display just on :hover state*/
    float:right;
	display:block;
    position:relative;
    top:1em; left:1em; width:15em;
	padding:2px;
   /*  border:1px solid #ffff00; */
	z-index:25;
    background-color:#ffffcc; color:#000;
    text-decoration: none;}

/* -- Acronyms -- */
	/* Original bold & red version acronym { cursor: help;  font-weight: bold; border-bottom: 1px solid red } */
acronym { cursor: help;  border-bottom: 1px solid green }


/* -- Arrow: for sart of text -- */
.arrowDiv {background: url(../images/icon_bluearrow.gif) 0 12px no-repeat; padding: 10px 0  10px 20px;}
.arrowDiv2 {background: url(../images/icon_bluearrow.gif) 0 12px no-repeat; padding: 10px 10px  10px 20px; float: left; width: 270px;}

/* This is for the Arrow divs, background image */
.inlineArrow {background: url(../images/icon_greenarrow.gif) no-repeat 0 2px; padding: 0 0 0 13px; margin: 5px 0 0 0;}
.inlineArrow_down {background: url(../images/icon_goldarrow.gif) no-repeat 0 2px; padding: 0 0 0 13px; margin: 5px 0 0 0;}


/* little inline icons - Work in some occassions */
.pdf, .word, .qt, .flash, .print, .b3, .excel, .f3, .qn {
padding: 6px 0 0 20px; /*common padding for everything*/
}
	.pdf {background:url(../images/icon_pdf.gif) no-repeat 0 2px;}
	.word {background:url(../images/icon_word.gif) no-repeat left;}
	.qt {background:url(../images/icon_quicktime.gif) no-repeat left;}
	.flash {background:url(../images/icon_flash.gif) no-repeat left;}
	.print {background:url(../images/icon_printer.gif) no-repeat left;}
	.b3 {background:url(../../images/icon_b3.gif) no-repeat left;}
	.excel {background: url(../images/icon_excel.gif) no-repeat left;}
	.f3 {background: url(../images/icon_f3.gif) no-repeat left;}
	.qn {background: url(../images/icon_qnewsletter.gif) no-repeat left;}



/* -- Clearing the Float to keep the bottom menu down -- */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* .clearfix {display: inline-block;} */

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */






/* ---------------------------------------------------------------------------------------------------------- */








/* Nick's line-height experiment */

#article, #article p, #article ul li, #article ol li {
	line-height: 1.7em;
}

#content_3col, #content_3col #col3_centre, #content_3col p, #content_3col ul li {
	line-height: 1.7em;
}

/* Contact page */


.contactnav {
	font-size:1.25em; 
	line-height: 1.75em;
}

.contactnav-list {
	list-style: none; 
	font-size: 1.2em; 
	margin-bottom: 20px;
}


.contactlocal {display:inline-block !important;}
.contactlocalext {display:inline-block !important;}

.contactleft {
    float: left;
    padding: none;
    max-width: 30%;
    border-top: #05a solid 5px;
	}

@media only screen and (max-width:768px) {
		.contactleft-mobile {    
			float: none;
		    padding: 1em 0px 5px 0px;
		    max-width: 100%;
		    border-top: #05a solid 5px;}
		}

.contactright {
	margin-left: 40%;
    margin-top: 3em;
}

@media only screen and (max-width:768px) {
		.contactright-mobile {    
			margin-left: 0%;
    		margin-top: 0;
    		width:100%;}
		}

.contactheader {
	border-top: none; 
	padding-top:0px; 
	margin-top:0px; 
	font-size:1.33em; 
	margin-bottom:1.25em;
}


/* OUTAGES */
/* ---------------------------------------------------------------------------------------------------------- */

#outage
	{
	overflow: hidden !important; 
	clip:rect(1 1 1 1); 
	margin:0 !important; 
	position:absolute;
	width:1px; 
	height:1px;
	padding-top:2px;
	}
.outagebox-outer
	{background-color: #fff;
	}

.outagebox-inner
	{
	max-width: 790px;
	background: #F5F5F5;
	padding: 10px 0;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	}

.outagebox-header
	{
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 1.8em !important;
	font-weight:normal;
	color:#05a;
	line-height:1.5em;
	}

.outage-text
	{
	padding: 20px;
	}
.outage-text a
	{
	color:#05a !important;
	padding:0px !important;
	}

.site-outage {
	margin: 0 auto;
    text-align: left;
    max-width: 890px;
    background: #ffffff;
}

.site-outage-container {
	width: 100%;
    background: #fff;  
    padding:.04em;
}

.site-outage-container div:last-of-type {
     margin-bottom: -2em;
}

.site-outage-container div:first-of-type {
	padding-top: 1em;
}

.site-outage-container h1, .site-outage-container h2, .site-outage-container h3 {
	    font-size: 1.4em;
    font-weight: 400;
    font-style: normal;
}

@media only screen and (max-width:768px) {
		.site-outage-container div:last-of-type   {
			margin-bottom: 0.5em;
}}







/* Accessible menu experiment */
/* ---------------------------------------------------------------------------------------------------------- */

#secondaryNav 	
	{
	overflow: hidden !important; 
	clip:rect(1 1 1 1); 
	margin:0 !important; 
	position:absolute;
	width:1px; 
	height:1px;
	padding-top:2px;
	}


	
.secondaryNavHead 	
	{
	font-size: 1.1em;
	font-weight: bold;
	background: #3d78c6;
	color: white;
	border: none;	
	}

ul.secondaryNavItem
	{
	margin-left:0;
	padding:0 !important;	
	margin-top:0 !important;
	}

ul.secondaryNavItem li
	{
    list-style: none;
    display: inline;
	
	}

ul.secondaryNavItem ul a 
	{
	float:left;
	width:100%;
	padding:0 !important;	
	margin-top:0 !important;
	}

#left-navSide {
	display:block;
	color:#016b42; 
	text-decoration: none; 
	/* background: #a9cbf8; original blue */
	background: #74a7ea;
	margin: 0;
	}

	#left-navSide img {display: inline; border: 1px solid black;}
	#left-navSide a	{color:#0d4b96; text-decoration: none; border-top: 1px solid #cdeafc; border-bottom: 1px solid #5492df;} 
	#left-navSide a:hover {color:white; background:#3d78c6;
		/*text-decoration:underline; */}
	#left-navSide a.active:hover {text-decoration:none; color:white; background:#7dbc8b;} 
	
#footerNav
	{
	overflow: hidden !important; 
	clip:rect(1 1 1 1); 
	margin:0 !important; 
	position:absolute;
	width:1px; 
	height:1px;
	padding-top:2px;
	}

	
#footerNav-Contact, #footerNav-Disclaimer
		{
	overflow: hidden !important; 
	clip:rect(1 1 1 1); 
	margin:0 !important; 
	position:absolute;
	}	
	

/* Accessible skip to content experiment */
/* ---------------------------------------------------------------------------------------------------------- */

#skip a {position:absolute; left:-1000em; width:20em; font-size:150%} 
 #skip a:focus {position:static; width:auto; height:auto;} 
 
#skip
	{left:50%;margin-left:-5.25em;margin-top:0;width:auto;z-index:50; display:block; clear:both;
	}

#skip a,#skip a:link,#skip a:visited
	{background:#444;background:rgba(0,0,0,0.6);
	color:#fff;
	display:block;
	font-size:0.94em;
	line-height:1.7;
	padding:1px 10px 2px 10px;
	text-decoration:none;
	-khtml-border-radius:0 0 10px 10px;
	-moz-border-radius:0 0 10px 10px;
	-webkit-border-radius:0 0 10px 10px; 
	border-radius:0 0 10px 10px;
	}

#skip a:hover,#skip a:active,#skip a:focus
	{outline:0;
	}



/* Charge list 100% width entry */
/* ---------------------------------------------------------------------------------------------------------- */
#charge {width: 100%;
		}


/* form padding */
/* ---------------------------------------------------------------------------------------------------------- */
.category .form .contents {
	margin-left: 50px;
	margin-right: 150px;
}

/* Top of page link */
/* ---------------------------------------------------------------------------------------------------------- */
#topofpage {
/*	background: url(../images/topofpage.png) no-repeat center center;
	text-indent: -9999px; */
	position: fixed;

	bottom: 20px;
	right: 20px;
	border-radius: 5px;
	z-index: 1;
	cursor: pointer;
	background: rgba(0, 114, 188, 0.6);

}

#topofpage a {
	display: inline-block;
	color: #fff;
	font-size: 22px;
	font-weight: 800;
	padding: 3px 7px 0px;
}

.totop {
	font-size: 10px;
	text-align: right;
}


/*TWO COLUMN LISTS (using CSS TO make the magic happen) */

.css2column {
	-webkit-column-count: 2; /* Chrome, Safari, Opera */ 
	-moz-column-count: 2; 	/* Firefox */ 
	column-count: 2;
	}


	.css2column ul li {
    	padding-left: 1em;
	    text-indent: -1em;
		}
	.css2column ul {
	    list-style: disc inside !important;
		}

	@media only screen and (max-width:768px) {
		.css2column {padding-right:10px;}
		}


.css2columnOL li {margin-left:25px;}
.css2columnOL  {margin-left:-25px;}




/*QUESTIONS / ANSWERS */

.questions dt, dd {font-size: 1em ; line-height: 1.7em ; padding: 0 0 .75em 0 ;}

/* DEFINITION LIST NUMBER COUNTER */
		.counter {
			counter-reset: dl-counter;
		}
		.counter dt {
			position: relative;
			
		}
		.counter dt:before {
			content: counter(dl-counter);
			counter-increment: dl-counter;
			position: absolute;
			left: 0;
			top: 0;
			font: bold 30px/1 Sans-Serif;
		}
		.counter dd {
			margin: 0 0 50px 0;
		}	
		.counter dt, .counter dd {
			padding-left: 50px;
		}






#footercontainer
		{background:#1a56a6;
		border-top:#01046b solid 2em;
		margin-top: 2em;
		}

#footer {
			margin-left:auto;
			margin-right:auto;
			padding-bottom: 2em;
			max-width: 890px;
			
		}

#footer h3 {color:#D0DCEC;}

#footer ul {padding-left:0;
			}

#footer a {color:#fff;}

#footer p, #disclaimer a {color:#D0DCEC;}

#social a {color:#000;}

.row {margin-left: 0;
		margin-right: 0;}

  @media (max-width: 767px) {
    .row {
          margin-left: 0 !important; }

           }




.disclaimer .col-md-9 {
  display: inline-block;
}



/* frontpage work */
.page-template-main article h1 {
  display: none; }

.page-template-main #full-width-page-wrapper {
  /* padding-top: 0px; */ }

.home-nav .row .col {
  height: 200px;
  text-align: center;
  font-family: "Karmilla", -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
  

  @media (max-width: 767px) {
    .home-nav .row .col {
      height: auto; } }

.home-nav h2 {
  font-size: 1.6rem;
  margin-bottom: 8px;
  font-weight: 800; }

.home-nav a {
  text-decoration: none;
  color: #000; }
  .home-nav a:hover {
    text-decoration: underline; }

.lang-fr .home-nav h2 {
  padding-top: 0px; }
  @media (max-width: 767px) {
    .lang-fr .home-nav h2 {
      padding-top: 3px; } }

.lang-fr .home-nav p {
  font-size: 0.8rem; }

.easy-autocomplete-container ul li div {
	word-break: break-word !important;
}



.home-nav .row:nth-child(1) .col:nth-child(1) {
  background-color: #D0DCEC; }
  @media (max-width: 767px) {
    .home-nav .row:nth-child(1) .col:nth-child(1) {
      background-image: none;
      background-color: #D0DCEC; }
      .home-nav .row:nth-child(1) .col:nth-child(1) a {
        color: #000; } }

.home-nav .row:nth-child(1) .col:nth-child(2) {
  background-color: #B9CBE3; }
  @media (max-width: 767px) {
    .home-nav .row:nth-child(1) .col:nth-child(2) {
      background-image: none;
      background-color: #B9CBE3; }
      .home-nav .row:nth-child(1) .col:nth-child(2) a {
        color: #000; } }

.home-nav .row:nth-child(1) .col:nth-child(3) {
  background-color: #D0DCEC;
  background-image: url("/images/front_mobile.png");
  background-size: cover; }
  .home-nav .row:nth-child(1) .col:nth-child(3) a {
    color: #fff; }
  @media (max-width: 767px) {
    .home-nav .row:nth-child(1) .col:nth-child(3) {
      background-image: none;
      background-color: #D0DCEC; }
      .home-nav .row:nth-child(1) .col:nth-child(3) a {
        color: #000; } }

.home-nav .row:nth-child(2) .col:nth-child(1) {
  background-color: #D0DCEC;
  color: #fff;
  background-image: url("/images/front_steps.png");
    background-size: cover; }
  .home-nav .row:nth-child(2) .col:nth-child(1) a {
    color: #fff; }
  @media (max-width: 767px) {
    .home-nav .row:nth-child(2) .col:nth-child(1) {
      background-image: none;
      background-color: #B9CBE3; }
      .home-nav .row:nth-child(2) .col:nth-child(1) a {
        color: #000; } }

.home-nav .row:nth-child(2) .col:nth-child(2) {
  background-color: #A3BBDA; }
  @media (max-width: 767px) {
    .home-nav .row:nth-child(2) .col:nth-child(2) {
      background-image: none;
      background-color: #D0DCEC; }
      .home-nav .row:nth-child(2) .col:nth-child(2) a {
        color: #000; } }

.home-nav .row:nth-child(2) .col:nth-child(3) {
  background-color: #B9CBE3; }
  @media (max-width: 767px) {
    .home-nav .row:nth-child(2) .col:nth-child(3) {
      background-image: none;
      background-color: #B9CBE3; }
      .home-nav .row:nth-child(2) .col:nth-child(3) a {
        color: #000; } }

.home-nav .row:nth-child(3) .col:nth-child(1) {
  background-color: #B9CBE3; }
  @media (max-width: 767px) {
    .home-nav .row:nth-child(3) .col:nth-child(1) {
      background-image: none;
      background-color: #D0DCEC; }
      .home-nav .row:nth-child(3) .col:nth-child(1) a {
        color: #000; } }

.home-nav .row:nth-child(3) .col:nth-child(2) {
  background-color: #D0DCEC; }
  @media (max-width: 767px) {
    .home-nav .row:nth-child(3) .col:nth-child(2) {
      background-image: none;
      background-color: #B9CBE3; }
      .home-nav .row:nth-child(3) .col:nth-child(2) a {
        color: #000; } }

.home-nav .row:nth-child(3) .col:nth-child(3) {
  background-color: #D0DCEC;
  background-image: url("/images/front_woman.png");
  background-size: cover; }
  @media (max-width: 767px) {
    .home-nav .row:nth-child(3) .col:nth-child(3) {
      display: none; } }

/* LINE DIVISION */
.divide {
	border-top:1px solid #666;
	 	  padding-top:1em !important;
}

/* NEWS BANNER */

.banner {
	border: 0px;
    width: 100%;
    height: auto;
    margin: 2.5em 0 -2em 0;
}

.b3banner {
	border: 0px;
    width: 100%;
    height: auto;
    margin: 2.5em 0 0em 0;
    background:#429539;
}





@media  (min-width: 770px) and (max-width: 1092px){
 .newsbanners {display:none !important;
 }}


/* ALT TEXT TOOL */

 .alttexttitle {
 	font-weight: 700 !important;
 }

 .altdisplay {
    background: #ffecd8 !important; 
    padding: 1em 0.5em 1em 0.5em !important;
    font-size: 1em !important;

 }

#togglealtcontainer {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
}


/* CALL OUTS */
.bs-callout {
    padding: 20px;
    margin: 20px 0;
    border: 1px solid #eee;
    border-left-width: 5px;
    border-radius: 3px;
}
.bs-callout h4 {
    margin-top: 0;
    margin-bottom: 5px;
}
.bs-callout p:last-child {
    margin-bottom: 0;
}
.bs-callout code {
    border-radius: 3px;
}
.bs-callout+.bs-callout {
    margin-top: -5px;
}
.bs-callout-default {
    border-left-color: #777;
}
.bs-callout-default h4 {
    color: #777;
}
.bs-callout-primary {
    border-left-color: #428bca;
}
.bs-callout-primary h4 {
    color: #428bca;
}
.bs-callout-success {
    border-left-color: #5cb85c;
}
.bs-callout-success h4 {
    color: #5cb85c;
}
.bs-callout-danger {
    border-left-color: #d9534f;
}
.bs-callout-danger h4 {
    color: #d9534f;
}
.bs-callout-warning {
    border-left-color: #f0ad4e;
}
.bs-callout-warning h4 {
    color: #f0ad4e;
}
.bs-callout-info {
    border-left-color: #5bc0de;
}
.bs-callout-info h4 {
    color: #5bc0de;
}




/* /////////////////////////////////////////////// */
/* SPECIAL CASE CONTENT -------------------------- */

	/* TIMELINE ------------------------------------
   		(used on the historical overview page ) -- */


   			.timeline-container {
		max-width:1024px; 
		margin:0em auto 0em auto;
		display:flex;
		flex-wrap: wrap;
		}

		@media all and (max-width: 1024px) {
			.timeline-container {
				margin:1em 1em 1em 1em;
				}
			}

		.timeline-item-half {
			flex: 1 45%;
			padding: 0;
				min-width: 20px; 
			max-width:45%;			
			}

		.timeline-item-center {
			flex: 1 10%;
			padding: 0;
				min-width: 20px; 
			max-width:10%;	

				display:flex;		
				justify-content: center;
				align-items: center; /* to vertically align -- */

			background-image: url("/images/bg-timeline.png");
				background-repeat: repeat;
				background-position: center;			
			text-align:center;
			}

			.timeline-item-center img {
				border:0px;
				transition-duration: 0.3s;				
				border-radius:25px; 
				}

				.timeline-item-center img:hover,
				.timeline-item-center img:focus {
					border:3px solid #f90;
				}				



		.timeline-item-content {
			width:100%;
			display:block;
		}


		.timeline-date-solo {
			display: flex;
			align-items: center;
			width:100%;
			padding-top:0px;
			color:#777;
			font-size:1.3em;
			 /* background:#ffffcc; */
		}

			.timeline-date-solo p {margin:0; padding:0;}



		.timeline-date-link {
			width:100%;
			color:#333;
		} 
		.timeline-date-link a {
				color:#00558c;
				text-decoration:none;
			}
			.timeline-date-link a:hover,
			.timeline-date-link a:focus {
				color:#f90;
			}

			.timeline-note {color:777; font-size:0.9em;}


		.timeline-align-right,
		.timeline-align-right p {
			text-align:right!important;
			width:100%; 
		
		}



		#item-01 {display:inline-block;}
		#item-01-details {display:none;}
		#item-01-button-open {display:inline-block;}
		#item-01-button-close {display:none;}

		#item-02 {display:inline-block;}
		#item-02-details {display:none;}
		#item-02-button-open {display:inline-block;}
		#item-02-button-close {display:none;}

		#item-03 {display:inline-block;}
		#item-03-details {display:none;}
		#item-03-button-open {display:inline-block;}
		#item-03-button-close {display:none;}

		#item-04 {display:inline-block;}
		#item-04-details {display:none;}
		#item-04-button-open {display:inline-block;}
		#item-04-button-close {display:none;}	