@font-face {
	font-family: "Anton";
	src: url('Anton-Regular.ttf');
	font-weight: 400;
	font-style: normal;
}


/* Elements */

#content-main {}


*,
*:before,
*:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}



#content-main a, .footerul a {
	color: #242e37;
	line-height: inherit;
	text-decoration: none;
	/*border-bottom: 2px dotted #8B2942;*/
	border-bottom: 1px solid #3e096e;
}

#content-main a:hover, #content-main a:focus, .footerul a:hover {
	color: #1a2128;
	border-bottom: 1px solid #00bed6;
	background-color: #e1e1e1;
	box-shadow: 5px 5px 5px #888888;

}

#content-main a.ui-link {
	background: url("../images/external.png") top right no-repeat;
	padding-right: 20px;
}


.zip a[download]:before {
	content: "";
	display: inline-block;
	width: 3px;
	height: 13px;
	height: 9px;
	border-top: 2px solid rgba(200, 111, 0, 1);
	border-left: 7px solid #fff;
	border-right: 1px solid rgba(200, 111, 0, 1);
	border-bottom: 2px solid rgba(200, 111, 0, 1);
	outline: 1px solid #999;
	background: rgba(200, 111, 0, 1);
	margin-right: 0.4em;
}


img {
	border: none;
}


a:focus img {
	opacity: 0.9;
}

body {

	color: #222222;
	padding: 0;
	margin: 0;
	font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	position: relative;
	cursor: default;
	background: white;
}

header {
	margin: 0;
	/*background: #e6e6e6;*/
}

nav {
	margin-top: -10px;

	padding: 0;
}

div, ul, ol, li, h1, h2, h3, form, p {
	margin: 0;
	padding: 0;
	direction: ltr;
}

h1, h2, h3 {
	font-family: "Open Sans", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
	font-weight: 300;
	font-style: normal;
	color: #222222;
	margin-top: 0.2em;
	margin-bottom: 0.5em;
	line-height: 1.4;

	/*text-rendering: optimizeLegibility;
	/*Non standard (and poss hurting NVDA)
	https://developer.mozilla.org/en-US/docs/Web/CSS/text-rendering
	Note: The text-rendering property is an SVG property that is not defined in any CSS standard.

	https://css-tricks.com/almanac/properties/t/text-rendering/#performance
	CSS-Tricks are more scathing: To avoid problems on older iOS devices, I
	wouldn't recommend using optimizeLegibility blindly and
	unconditionally on any pages longer than about 1,000 words. And I
	wouldn't recommend enabling it on Android at all.
	*/
}

.twelve.columns h4, .twelve.columns h5, .twelve.columns h6 {
	line-height: 1.62;
}

h1 {
	font-size: 2em;
}

h2 {
	font-size: 1.55em;
}

h3 {
	font-size: 1.25em;
}

h5, h6 {
	font-size: 1em;
}

address {
	font-style: normal;
	line-height: 1.2em;
	margin-left: 0.8em
}

hr.visuallyHiddenSpaceAbove {
	border: none;
	margin-top: 3.38em;
}

.highlighted{
	background-color:yellow;
	color:#000;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																		   q
The user agent adds opening and closing quotes for us, but they're a
little missable, so...
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
q {
	/*font-style: italic;*/
	}

q:before,
q:after {
	font-size: 110%;
	font-style: normal;
}

:lang(en) q:before,
:lang(en) q:after {
	font-weight: bold;
	font-weight: normal;
}

:lang(en) q.doubleQ:before {
	content: "\"";
}

:lang(en) q.doubleQ:after {
	content: "\"";
}



:lang(fr) q:before {
	padding-right: 0.2em;
}

:lang(fr) q:after {
	padding-left: 0.2em;
}



div#leftPart.members h2:nth-of-type(1n+2) {
	border-top: 1px solid #bbb;
	padding-top: 0.5em;
}


input[type="text"]:focus {
	-webkit-box-shadow: 0 0 5px #999999;
	-moz-box-shadow: 0 0 5px #999999;
	box-shadow: 0 0 5px #999999;
	border-color: #999999;
}

input[type="text"]:focus {
	background: #fafafa;
	border-color: #999999;
	outline: none;
}

input[type="submit"]:focus {
	background: #484848
}

/*
a.toTheTop {
	padding: 5px 30px 5px 5px;
	background: #fff url('../img/toparrow.png') top right no-repeat;
	color: #000;
	text-decoration: none;
	border-radius: 5px 5px 0px 0px;
	-moz-border-radius: 5px 5px 0px 0px;
	-webkit-border-radius: 5px 5px 0px 0px;
	border-top: 1px solid #461768;
	border-right: 1px solid #461768;
	border-left: 1px solid #461768;
}
*/
#content-main div.toTheTop {
	border-bottom: 1px solid #aaa;
	padding: 0px 0px 10px 0px;
	margin: 0 0 1em 0;
}

#content-main div.toTheTop>a {
	float: right;
	padding: 5px 5px 5px 5px;
	border-radius: 5px 5px 0px 0px;
	-moz-border-radius: 5px 5px 0px 0px;
	-webkit-border-radius: 5px 5px 0px 0px;
	border-top: 1px solid #aaa;
	border-right: 1px solid #aaa;
	border-left: 1px solid #aaa;
	border-bottom: 0px;
}

#content-main div.toTheTop>a:hover {
	box-shadow: 3px 3px 3px #bbb;
	background-color: #902A8C;
	color: #fff;
}


p.totop {
	text-align: right;
}


.widthsmall {
	max-width: 150px;
	float: left;
	height: 35px;
	border: 1px solid #cccccc;
}



label {
	font-size: 0.875em;
	color: #4d4d4d;
	cursor: pointer;
	display: block;
	font-weight: normal;
	margin-bottom: 0.5em;
}



ol, ul {
	font-size: 1em;
	line-height: 1.6;
	margin-bottom: 1.25em;
	list-style-position: outside;
	font-family: inherit;
}

ol {
	margin-left: 1.4em;
}

ul {
	margin-left: 1.4em;
}

ul li ul {
	margin-left: 2.5em;
	/* margin-bottom: 0; */
	font-size: 1em;
}

blockquote {
	line-height: 1.5;
	margin-left: 1.62em;
	margin-left: 2.38em;
}

blockquote+.source {
	margin-left: 1.62em;
	font-style: italic;
}


/* Classes */

.smalltext {
	font-size: 0.9em;
	line-height: 1em;
}

.columns {
	position: relative;
	padding-left: 0.9375em;
	padding-right: 0.9375em;
	float: left;

}

.one {
	position: relative;
	width: 8.33333%;
}

.two {
	position: relative;
	width: 16.66667%;
}

.three {
	position: relative;
	width: 25%;
}

.four {
	position: relative;
	width: 33.33333%;
}

.five {
	position: relative;
	width: 41.66667%;
}

.six {
	position: relative;
	width: 50%;
}

.seven {
	position: relative;
	width: 58.33333%;
}

.eight {
	position: relative;
	width: 66.66667%;
}

.nine {
	position: relative;
	width: 75%;
}

.ten {
	position: relative;
	width: 83.33333%;
}

.eleven {
	position: relative;
	width: 91.66667%;
}

.twelve {
	position: relative;
	width: 100%;
}

.alignCenter, .row .alignCenter {
	text-align: center;
}

.right {
	float: right;
}

.left {
	float: left;
}

.row {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
	margin-bottom: 0;
	/*max-width: 62.5em;
	max-width: 70em;
	max-width: 75em;*/
	max-width: 83em;
}

.row:before, .row:after {
	content: " ";
	display: table;
}

.row:after {
	clear: both;
}

.textreg {
	padding: 15px 5px 0px 8px;

}

ul.textreg {
	line-height: 1.4em;
	float: left;
}



.footerul a {
	border-bottom: 1px dotted #8B2942;

}

button {
	cursor: pointer;
	font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
	font-weight: normal;
	line-height: normal;
	margin: 0 0 1.25em;
	position: relative;
	text-decoration: none;
	text-align: center;
	display: inline-block;
	padding-top: 1em;
	padding-right: 2em;
	padding-bottom: 1.0625em;
	padding-left: 2em;
	font-size: 1em;
	background-color: #242e37;
	border: 1px solid #1a2128;
	color: white;
	-webkit-transition: background-color 300ms ease-out;
	-moz-transition: background-color 300ms ease-out;
	transition: background-color 300ms ease-out;
	padding-top: 1.0625em;
	padding-bottom: 1em;
	-webkit-appearance: none;
	font-weight: normal !important;
}



button:hover, button:focus {
	color: white;
}

/*AM's button */



input[type="submit"] {
	padding: 0.3em 0.6em 0.4em;
	font-size: 1.0em;
	float: left;
	margin: 5px 5px 5px 0;
	background-color: #323232;
	border-color: #323232;
	color: white;
	border-radius: 4px;
}

input[type="submit"]:hover {
	padding: 0.3em 0.6em 0.4em;
	margin: 5px 5px 5px 0;
	font-size: 1.0em;
	float: left;
	background-color: maroon;
	border: 1px solid maroon;
	color: white;
}



/* IDs */

#bottompage {
	/*background: #ced5db url('footerbot.jpg') top center no-repeat;*/
	background: #ced5db;
	background-image: url('../images/logobottom.png');
	background-position: 1300px 0;
	background-repeat: no-repeat;
	padding-top: 20px;
	min-height: 200px;

}

#bottompage a {
	color: #242e37;
}

.logobot {

	min-height: 200px;
	width: 100%;
}

.serverno {
	background: url('../images/servno.png') bottom left no-repeat;
}

/* topnav */

/*#navdiv {
	background: black;
	width: 100%;
	box-shadow: 0 0 10px #5b5b5b;
	border-bottom: 1px solid #242424;
}

#navdiv .top-bar2 {
	max-width: 62.5em;
	max-width: 75em;
	margin: 0 auto;

}

ul#topnavlist, ul#topnavlist2 {
	line-height: 1.2em;
}

#topnavlist, #topnavlist2 {
	list-style: none;
	margin: 0px 0px;
	padding: 0px 0px;
}

#topnavlist li, #topnavlist2 li {
	position: relative;
	display: inline;
	vertical-align: bottom;
	z-index: 9999;
	float: left;
	border-right:1px solid #4d4d4d;
	border-right: 1px solid #DFDEDE;
	min-height: 60px;
	added by AM
	color: #FFF;
}

#topnavlist a, #topnavlist2 a {
	display: inline-block;
	text-decoration: none;
	color: white;
	font-size: 1em;
	font-size: 0.9em;
	font-weight: 300;
	font-size: 0.9em;
	width: 150px;
	comment this one out if no equal width
}
*/
#mainwebsite {
	display: inline-block;
	text-decoration: none;
	color: white;
	font-size: 1em;
	font-weight: 300;
	/*font-size: 0.9em;*/
	width: 200px;
}

#topnavlist li.current a {
	background-color: #696969;
	min-height: 60px;
	/*min-height: 4em;*/
}

#topnavlist a.larger, #topnavlist2 a.larger {
	width: auto;
}

#topnavlist2 ul.dropdown {
	position: absolute;
	z-index: 1;
	/*background-color: #333333;*/
	background-color: black;
	/*top:100%; Uncommenting this makes the dropdowns work in IE7 but looks a little worse in all other browsers. Your call. */
	left: -9999px;
	margin: 0;
	margin-left: -40px;
	padding: 0;
	text-align: left;
}

#topnavlist2 ul.dropdown ul.dropdown {
	margin: 0;
}

#topnavlist2 ul li.has-dropdown ul {
	left: -9999px;
}

#topnavlist2 ul li.has-dropdown:hover ul, #topnavlist2 ul li.has-dropdown:focus ul, #topnavlist2 ul li.has-dropdown:active ul {

	left: -190px;
	left: 20px;
	top: 45px;

}

#topnavlist2 li li li a:focus, #topnavlist2 li li li a:active {
	position: relative;
	left: 19808px;
	/*background-color: #8B2942;*/
	background-color: #282828;
	color: white;

}

#topnavlist2 ul li {
	display: block;
	_display: none;
	background-color: black;
	color: #FFF;
	float: none;
}

#topnavlist2 ul li a {
	line-height: 30px;
}



#topnavlist2 ul li.lastitem {
	border-bottom: thin solid black;
}

#topnavlist2 li:hover ul, #topnavlist2 li:focus ul {
	left: 0px;

}

#topnavlist2 a:focus+ul {
	left: 0px;
}

#topnavlist a:focus, #topnavlist2 a:focus, #topnavlist a:hover, #topnavlist2 a:hover {

	color: white;
	/*min-height: 60px;*/
	min-height: 4em;


}



#topnavlist2 li li a:focus, #topnavlist2 li li a:active {
	position: relative;
	left: 9999px;
	background-color: #696969;
	/*background-color: #61459b;*/
	color: white;
}

#topnavlist2 li:hover ul a:focus, #topnavlist2 li:hover ul a:active, #topnavlist2 li:focus ul a:focus, #topnavlist2 li:focus ul a:active {
	position: relative;
	left: 0px;

}

#topnavlist2 ul a {
	white-space: nowrap;
	display: block;
	width: auto;
	height: auto;
}

.nav-button {
	display: none;
}

.electiondate {
	margin-top: 30px;
	margin-left: 20px;
	margin-bottom: 5px;
	text-align: left;
	text-transform: uppercase;
	float: left;
	border-right: 2px solid #e8b5ff;
	width: auto;
	color: black;
	font-size: 1.2em;
	font-weight: 900;
	padding-right: 10px;

}

.electiondate2 {
	margin-top: 30px;
	margin-left: 10px;
	text-transform: uppercase;
	float: left;
	color: black;
	font-size: 1.2em;
	font-weight: 900;
	vertical-align: middle;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
													   .eDatePart1 & .eDatePart2
A revised version of .electiondate and .electiondate2
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.eDatePart1 {
	margin-top: 30px;
	margin-left: 20px;
	margin-bottom: 5px;
	text-transform: uppercase;
	color: black;
	font-size: 1.2em;
	font-weight: 900;
	float: none;
	width: 100%;
}

.eDatePart2 {
	border-left: 2px solid #e8b5ff;
	padding-left: 0.62em;
	margin-left: 0.2em;
}





.top-bar2 {
	overflow: visible;
	height: 3.6em;
	/*height: 3.6em;*/
	/*line-height: 45px;*/
	position: relative;
	background: black;
	margin-bottom: 0px;
	padding-left: 0.9375em;
	padding-right: 0.9375em;

}

#topnavlist a, #topnavlist2 a, #mainwebsite {

	padding: 8px 10px;
	text-align: center;
}

/*for ie8 - cannot understand next line*/
#topnavlist2 .has-dropdown a {
	/*fix caused by above line*/
	padding-right: 35px;
}

.top-bar-section2 li a:not(.button) {
	padding: 0 15px;
	/*line-height: 45px;*/
	background: black;
	display: block;
}

.top-bar-section2 .has-dropdown a:not(.button) {
	padding-right: 35px;
}

.top-bar-section2 li a:not(.button):hover,
.top-bar-section2 li a:not(.button):focus {
	/*	background: #61459b;*/
	background: #5c5c5c;
}

/*.top-bar-section2 ul li:hover > a {
	background: #8B2942;
	color: white;
}*/

.top-bar-section2 .has-dropdown>a:after, #mainwebsite:after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	/*
	border: inset 5px;
	border-color: rgba(255, 255, 255, 1) transparent transparent transparent;
	*/
	border-style: solid;
	border-width: 5px 0px 5px 6px;
	border-color: transparent transparent transparent #fff;
	/*
	border-width: 6px 5px 0 5px;
	border-color: #ffffff transparent transparent transparent;
	*/
	border-width: 6px 5px 0 5px;
	border-color: #ffffff transparent transparent transparent;
	border-left-style: solid;
	margin-right: 15px;
	margin-top: -2.5px;
	position: absolute;
	top: 22.5px;
	right: 0;
}


.top-bar-section2 ul ul .has-dropdown>a:after {
	/*border-color: transparent transparent transparent rgba(255, 255, 255, 0.4);*/
	margin-top: 0;
	top: 13px;
}

/*new styles for top menu*/

#menubar {
	width: 340px;
	float: right;
	padding: 0px 0 0 0;
	text-align: right;
	padding: 0.3em 0em;
}

#navlist {
	padding: 0px;
	margin: 0px;
}



#navlist li {
	display: inline;
	list-style-type: none;
	padding: 0 .4em 0 .2em;
	margin: 0px;
	font-size: 0.75em;
	color: #1F2C33;
	border-right: 1px solid #1F2C33;
}

#navlist li a {
	text-decoration: none;
	color: black;
	font-weight: 600;
}



#navlist li a:hover {
	text-decoration: underline;

}



#navlist li.last {
	border: 0px solid white;
}


/*END new styles for top menu*/


/*New AM top nav */
#navlistnew {
	padding: 0px;
	margin: 0px;
	height: 100px;
	/*background: #005e63;*/
	background: #2e7c81;
	color: white;
	/*padding-top: 20px;*/
}

.navwrap {
	width: 1300px;
	margin: 0 auto;
}

#navlistnew img {
	margin: 0;
	float: left;
	/*height: 85px;
	box-shadow: 3px 3px 3px #cacaca;
	transform: rotate(-5deg);*/
}

#navlistnew ul {
	margin: 0;
}


#navlistnew li {
	display: inline;
	list-style-type: none;
	margin: 0px;
	border-right: 1px solid white;
	float: left;
}

#navlistnew li a.smallt {

	font-size: 0.9em;

}

#navlistnew li a {
	text-decoration: none;
	color: white;
	font-weight: 500;
	padding: 30px 10px 30px 10px;
	text-align: center;
	width: 180px;
	height: 100px;
	display: block;
	font-size: 1.1em;
	line-height: 1em;

}



#navlistnew li a:hover {
	background: black;

}



#navlistnew li.last {
	border: 0px solid white;
}




.titlenew {
	margin: 0 auto;
	text-align: center;
	text-transform: uppercase;
	color: black;
	font-size: 1.2em;
	font-weight: 900;
	float: none;
	width: 100%;
	padding: 10px 0;
	background: white;
}

.titlebot {
	background: #dfdfdf;
	border-bottom: 1px solid black;
}

.boxnew {
	/*border: 1px solid #dfdfdf;*/
	border: 1px solid #634488;
	padding: 5px;
	min-height: 380px;
	width: 400px;
	margin-right: 15px;
	background: white;
	float: left;
}

.boxnew2small {
	min-height: 200px;
}

.boxnewsmall {
	/*border: 1px solid #dfdfdf;*/
	border: 1px solid #2e7c81;
	/*border: 1px solid #902a8c;*/
	padding: 5px;
	min-height: 380px;
	width: 200px;
	margin-right: 20px;
	background: white;
	float: left;
}

.boxtwitter {
	/*border: 1px solid #dfdfdf;*/
	border: 1px solid #2e7c81;
	/*border: 1px solid #902a8c;*/
	padding: 0px;
	min-height: 500px;
	width: 300px;
	margin-right: 20px;
	background: white;
	float: left;
}

.boxtwitter h2 {
	color: white;
	background: #636363;
	padding: 5px;
	margin: 0;
	font-size: 1.1em;
	text-align: center;
}

/*Phone and email*/
.contactdl dl {}

.contactdl dd {
	float: left;
	padding: 0px;
	width: 70%;
}

.contactdl dt {
	float: left;
	background: #636363;
	color: white;
	padding: 20px;
	clear: both;
	width: 140px;
	line-height: 1.3;
}

/*Longer phone labels (now inc 'TTY' bleed into each other, fix
  2022-03-15-1602 */
.contactdl dl::after {
	content: "";
	display: table;
	clear: both;
}

.contactdl dl div:before,
.contactdl dl div:after {
	content: " ";
	/* 1 */
	display: table;
	/* 2 */
}

.contactdl dl div:after {
	clear: both;
}

/*	.contactdl dl {
padding: 0.5em;
}
.contactdl dt {
float: left;
clear: left;
width: 100px;
text-align: right;
font-weight: bold;
background: #636363;
color: white;
padding: 10px;
margin-top: 0;
}
.contactdl dd {
margin: 30px 0 0 110px;
padding: 0 0 0.5em 0;
}*/

.boxnew h2 {
	/*background: #ebebeb;*/
	background: #634488;
	color: white;
	padding: 8px;
	margin: 0 0 20px 0;
	text-align: center;
}

.boxnewsmall h2 {
	background: #2e7c81;
	color: white;
	padding: 8px;
	margin: 0 0 20px 0;
	text-align: center;
}

.boxnew p {
	margin: 15px;
}

.boxfull {
	border: 1px solid #dfdfdf;
	padding: 5px;
	width: 88%;
	background: white;
	margin-top: 30px;
	min-height: 63px;
}

.boxfull h2 {
	background: #ebebeb;
	padding: 8px;
	margin: 0 20px 20px 0;
	float: left;
	width: 200px;

}

.col1home {
	float: left; 
	margin: 0 auto;
	width: 65%;
}

.col2home {
	float: left;
	width: 30%;
}

.animate {

	animation-name: rot;
	animation-duration: 2s;
}

@keyframes rot {
	from {
		transform: rotate(15deg);
	}

	to {
		transform: none;
	}
}

a.animate2 {
	width: 350px;
	height: 180px;
	background: linear-gradient(195deg, #d7d3de, #ddd9e3, #e2dfe7, #e8e6ec, #eeecf1, #f3f2f5, #f9f9fa, #ffffff);
	border: 1px solid #adadad;
	/*border-top-right-radius: 90px;
  border-top-left-radius: 60px;
  border-bottom-left-radius: 80px;
  border-bottom-right-radius: 70px;*/
	border-radius: 30px;
	box-shadow: 3px 3px 3px #767676;
	padding: 40px 20px 20px 20px;
	text-align: center;
	font-size: 2em;
	font-weight: 300;
	top: 50px;

	position: relative;
	animation-name: homeaniaXX;
	animation-duration: 2s;
	transition-timing-function: ease;

	display: block;
}

a.animate2:hover {
	background: linear-gradient(195deg, #b4b1ba, #bebcc4, #c9c7cd, #d4d2d7, #dedde1, #e9e8eb, #f4f4f5, #ffffff);

}



@keyframes homeani {
	from {
		left: 0px;
	}

	to {
		left: 70%;
		transform: rotate(10deg);
	}

}

@keyframes homeania {
	from {
		transform: rotate(5deg);
	}

	to {
		transform: rotate(-2deg);
	}



}

/*@keyframes homeani {
  from {right: 200%;}
  to {left: 70%; transform:rotate(10deg);}

}*/



a.newad,
a.introebra {
	display: block;
	margin-top: 60px;
	color: #005e63;
	font-size: 3em;
	animation: mymove 2s;
	text-decoration: none;
}

a.newad:hover,
a.introebra:hover {
	border-bottom: 1px solid black;
	border-right: 1px solid black;
	color: #009ba6;
}

@keyframes mymove {
	from {
		color: #00b9c6;
	}

	to {
		color: #005e63;
	}
}

.bigpromowrap {
	background: transparent url('../images/promotop4.jpg') top center no-repeat;
	min-height: 300px;
}

.bigpromo {
	margin: 0 auto;
	width: 1200px;
	padding: 10px 100px 10px 700px;
}

#content-main a.thebutton {
	/*border: 1px solid #a9a9a9;
	background: linear-gradient(180deg, #e6e1e2, #eae5e6, #edeaea, #f1eeee, #f4f2f2, #f8f6f7, #fbfbfb, #ffffff);*/
	background: linear-gradient(90deg, #634488, #68478f, #6d4b95, #724e9c, #7752a3, #7c55aa, #8159b1, #865cb8);
	color: white;
	border-radius: 10px;
	padding: 10px 20px;
	border-bottom: none;
	box-shadow: 0 0 0 #888888;
}

#content-main a.thebutton:hover, #content-main a.thebutton:focus {
	background: linear-gradient(210deg, #595758, #636162, #6d6b6c, #787576, #828080, #8d8a8b, #989595, #a3a0a0);
}

#content-main .datenew {
	float: left;
	width: 120px;
	margin-right: 20px;
}

#content-main .provincenew {
	float: left;
	width: 150px;
	margin-right: 20px;
}



#content-main .subjectnew {
	float: left;
	width: 700px;

}

#content-main ul.whatsnew li {

	list-style-type: none;
	margin: 0;

}

#content-main ul.whatsnew li a {
	/*background: #f2f2f2;*/
	background: #ebe5f3;
	margin: 10px 0;
	list-style-type: none;
	display: block;
	width: 100%;
	min-height: 70px;
	border-bottom: none;
	padding: 10px;
}

#content-main ul.whatsnew li a:hover {
	background: #dacfe9;
	box-shadow: 1px 1px 1px #d8d8d8;
}

select.firstselect {
	display: block;
	width: auto;
	font-size: 1em;
	border: 1px solid #C9CBCC;
	margin: 10px 20px 20px 0;
	padding: 8px;
}

.choosecommission {
	border: 1px solid #dacfe9;
	padding: 10px;
	background: #ebe5f3;
	border-radius: 3px;
}

.col1com {
	float: left;
	/*width: 800px;*/
	width: 70%;
}

.col2com {
	float: left;
	/*width: 300px;*/
	width: 25%;
	margin-left: 10px;

}

.col1 {
	float: left;
	width: 40%;
	margin-right: 10%;
}

.col2 {
	float: left;
	width: 50%;
}

#content-main ul.homepromo21 {
	margin-left: 0;
}

#content-main ul.homepromo21 li {
	margin-left: 0;
}

#content-main ul.homepromo21 li {
	list-style-type: none;

}

#content-main ul.homepromo21 li a {
	padding: 200px 10px 10px 10px;
	width: 43%;
	margin: 0 20px 20px 0;
	float: left;
	border: 1px solid #c9c9c9;
	text-align: center;
	font-size: 1.1em;
	box-shadow: 3px 3px 3px #f0f0f0;
	font-weight: bold;
}

#content-main ul.homepromo21 li a:hover, #content-main a.imagelink:hover, #content-main ul.homepromo21 li a:focus, #content-main a.imagelink:focus {
	opacity: 0.7;
	border: 1px solid #005e63;
}

#content-main a.imagelink {
	padding: 200px 10px 10px 10px;
	width: 400px;
	margin: 0 20px 20px 0;
	border: 1px solid #c9c9c9;
	text-align: center;
	font-size: 1.1em;
	box-shadow: 3px 3px 3px #f0f0f0;
	font-weight: bold;
	display: block;
}

#content-main a.jeunes {
	background: #dee4e4 url('../images/home/jeunes2.jpg') top center no-repeat;
}

#content-main a.seats {
	background: #dee4e4 url('../images/home/seats.png') top center no-repeat;
}

#content-main a.current {
	background: #dee4e4 url('../images/home/current2.jpg') top center no-repeat;
}

#content-main a.participate {
	background: #dee4e4 url('../images/home/participate3.jpg') top center no-repeat;
}

#content-main a.commissions {
	background: #dee4e4 url('../images/home/commissions3.jpg') top center no-repeat;
}

/*END AM top nav */


/*Adjusted from pattern in world-2021-11-16-1046-b4-adjust-map-buttons.css.
  flex now used to simplify and standardize positions as we head down from
  desk toward phone*/
#content-main p.viewer {
	/* display: flex; */
	float:left;
	/*justify-content: space-evenly;*/
	margin-right:1.5em;
}
#content-main p.viewer+div {
}

#content-main p.viewer a:hover,
#content-main p.viewer a:focus {
	outline: 2px solid #902a8c;
	opacity: 1;
}

#content-main p.viewer>a {
	padding: 85px 10px 10px 10px;
	width: 9.7em;
	min-height: 9.7em;
	display: block;
	/*border: 1px solid #c9c9c9;*/
	text-align: center;
	font-size: 1em;
	line-height: 1.1em;
	box-shadow: 3px 3px 3px #d2d2d2;
	font-weight: bold;
}

/*Just gap from L button to right...*/
#content-main p.viewer>a:nth-of-type(1) {
	margin-right: 0.31em;
}

/*...and R button to left*/
#content-main p.viewer>a:nth-of-type(2) {
	margin-left: 0.31em;
}

/*Lose double border*/
.btnRevealUl.__selectLike ul {
	border-bottom: none !important;
}

#content-main a.mapviewer {
	background: #dee4e4 url('../images/mapviewer.png') top center no-repeat;
}

#content-main a.mapviewer2 {
	background: #dee4e4 url('../images/mapviewer2.png') top center no-repeat;
}

#content-main a.mapviewer:hover, #content-main a.mapviewer2:hover {
	opacity: 0.7;
}

#content-main a.mapviewerb {
	background: #dee4e4 url('../images/mapviewerb.png') top center no-repeat;
}

#content-main a.mapviewer2b {
	background: #dee4e4 url('../images/mapviewer2b.png') top center no-repeat;
}

#content-main a.mapviewerb:hover, #content-main a.mapviewer2b:hover {
	opacity: 0.7;
}


/*What's new*/
/*.neuf {
		border: 1px solid #c5c5c5;
		width: 98%;
		min-height: 80px;
		display: flex;
		align-items: center;
		padding-right: 10px;
	}

	.neuf h2 {
		width: 30%;
		min-width: 5em;
		font-size: 3em;
		line-height: 1.2em;
		color: white;
		padding: 20px 40px 20px 20px;
		background: url('../images/newarrow.png') top right no-repeat;
		margin: 0;
		text-transform: uppercase;
	}

	.neuffra h2 {
		font-size: 2em;
		padding-bottom: 30px;
		padding-top: 40px;
		width: 30%;
	}*/

.neuf {
	border: 1px solid #c5c5c5;
	width: 98%;
	min-height: 80px;
	display: flex;
	align-items: center;
	padding-right: 10px;
}




h2.neufh2 {
	width: 98%;
	/*text-align: center;*/
	font-size: 1.2em;
	line-height: 1.2em;
	color: white;
	padding: 15px;
	/*background: url('../images/newarrow.png') top right no-repeat;*/
	background: #902A8C;
	margin: 0;
	text-transform: uppercase;
}

.neuffra h2 {
	font-size: 2em;
	padding-bottom: 30px;
	padding-top: 40px;
	width: 30%;
}

.neuf ul {
	margin-right: 1%;
	margin-top: 1.38em;
	display: flex;

}

.neuf ul li {
	list-style-type: none;
	margin-left: 0.62em;
}


#content-main .neuf li a {
	background: #dcdcdc;
	display: block;
	padding: 0.62em;
	line-height: 1.2em;
	min-height: 120px;
}

#content-main .neuffra li a {
	min-height: 120px;
}

/* New styles after removing twitter feed */

.neuf2 {
	border: 1px solid #c5c5c5;
	width: 98%;
	/*display: flex;*/
	align-items: center;
	padding-right: 10px;
}
.neuf2 ul {
	margin-right: 1%;
	margin-top: 1.38em;
	/*display: flex;*/

}

.neuf2 ul li {
	list-style-type: none;
	margin-left: 0;
}


#content-main .neuf2 li a {
	background: #dcdcdc;
	display: block;
	padding: 0.62em;
	line-height: 1.2em;
	min-height: 120px;
	margin-bottom: 10px;
}

#content-main a.nicebutton2 {
	/*width: 300px;*/
	padding: 10px;
	display: block;
	background: #1B4450;
	color: white;
	box-shadow: 3px 3px 3px #d8d8d8;
	border-radius: 5px;
	text-align: center;
	line-height: 1.1em;
}

#content-main a.nicebutton2:hover {
	background: #2C7C82;
	/*color: black;*/
}



#content-main a.nicebutton {
	width: 120px;
	padding: 10px;
	display: block;
	background: #1B4450;
	color: white;
	box-shadow: 3px 3px 3px #d8d8d8;
	border-radius: 5px;
	text-align: center;
	line-height: 1.1em;
}

#content-main a.nicebutton:hover {
	background: #2C7C82;
	/*color: black;*/
}

.margintop {
	margin-top: 20px;
	margin-left: 20px;
	margin-right: 20px;
}

label.float1 {
	float: left;
	margin-right: 10px;
	margin-top: 10px;
}

label.float1 {
	color: black;
}


.themap img {
	float: right;
	width: 200px;
	margin: 20px 0 20px 20px;
	display: block;
}



.bound li {
	margin-bottom: 15px;
}

#provTerrB {
	background: white;
	color: black;
	border: none;
}

/* buttons on links*/


p {
	font-family: inherit;
	font-weight: normal;
	font-size: 1em;
	line-height: 1.6;
	margin-bottom: 1.25em;

	/*text-rendering: optimizeLegibility;
	/*Non standard (and poss hurting NVDA)
	https://developer.mozilla.org/en-US/docs/Web/CSS/text-rendering
	Note: The text-rendering property is an SVG property that is not defined in any CSS standard.

	https://css-tricks.com/almanac/properties/t/text-rendering/#performance
	CSS-Tricks are more scathing: To avoid problems on older iOS devices, I
	wouldn't recommend using optimizeLegibility blindly and
	unconditionally on any pages longer than about 1,000 words. And I
	wouldn't recommend enabling it on Android at all.
	*/
}


.hidden {
	position: absolute;
	left: 0px;
	top: -500px;
	width: 1px;
	height: 1px;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
}

.widthSearch {
	float: left;
	max-width: 180px;
	height: 33px;
	border: 1px solid #c2c2c2;
	margin-top: 5px;

}

/*h1 {margin-top:20px}	*/

h1.ways {
	background: url("../img/ways.jpg") no-repeat;
	padding: 20px 0 0px 120px;
	margin-top: 10px;
	border-bottom: 1px solid #00bed6;

}

/*h2.cand {
	background: url('../img/titleback.png') bottom center repeat-x;
	padding-bottom:5px;
	margin-bottom:10px;
	line-height: 1.8em;
}*/

/*.canbox {
	border: 1px solid #242e37;
	margin-top: 20px;

}

.canbox h3 {
	background-color: #242e37;
	color: white;
	margin: 0 0 10px 0;
	padding: 5px;
}

.canbox p, .canbox label {
	margin: 5px;
}*/

#navaid a {
	font-size: .8em;
	position: absolute;
	left: -10000px;

	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

#navaid a:focus, #navaid a:hover, #navaid a:active {
	position: relative;
	left: 0px;
	top: 0px;
	color: white;
	background-color: #8b2942;
	padding: 5px;
	width: auto;
	height: auto;
}

.clearall {
	clear: both;
}

/*Ways to vote images*/


/*h1.info {
	height: 60px;
background-color: #72243A;
color: #FFF;
text-align: center;
padding-top: 10px;
width:100%;
text-align: center;
margin-bottom:15px
} */

#content-main {
	min-height: 400px;
	margin-bottom: 30px;
}

#navlist li {
	text-align: center;
	display: inline;
	list-style-type: none;
	padding-right: 20px;
}

.footerul {
	font-size: 0.9em;
	line-height: 1.3em;
}

.footerul h2 {
	font-size: 1.4em;

}

/* SPR styles */

/*Social media page*/

/*#content-main a.twitter {
	background: #d7d7d7 url(../img/twitterfs.png) top left no-repeat;

}

#content-main a:hover.twitter, #content-main a:focus.twitter {
	background: #bdbdbd url(../img/twitterfs.png) top left no-repeat;

}

#content-main a.youtube {
	background: #d7d7d7 url(../img/youtubefs.png) top left no-repeat;

}

#content-main a:hover.youtube, #content-main a:focus.youtube {
	background: #bdbdbd url(../img/youtubefs.png) top left no-repeat;

}

#content-main a.facebook {
	background: #d7d7d7 url(../img/facebookf.png) top left no-repeat;

}

#content-main a:hover.facebook, #content-main a:focus.facebook {
	background: #bdbdbd url(../img/facebookf.png) top left no-repeat;

}*/

input[type=submit] {
	-webkit-appearance: none;

}

/*New styles for 2019 */



.featurebox8 a {
	width: 60%;
	margin: 0 0 20px 0;
	/*padding: 340px 0 0 5px;*/
	padding: 425px 0 0 15px;
	border: 1px solid #fffff;
	background: #dedede url(../img/home/feature10z.jpg) top center no-repeat;
	min-height: 572px;
	font-size: 1.3em;
	font-weight: bold;
	color: #292929;
	text-align: left;
	display: block;
	text-decoration: none;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	float: right;
}

.featurebox8 a:hover {

	background: #f6e1ff url(../img/home/feature10z.jpg) top center no-repeat;

}

.itsourvote {
	margin-top: -40px;
	/*margin-top: 10px;*/
	margin-right: 10px;
	float: right;
}

/*.tag1 {
	float: left;
	position: relative;
	display: block;
}*/

.featureboxdouble {
	width: 60%;
	margin: 0 0 20px 0;
	min-height: 572px;
	display: block;
	float: right;
	/*background: #eeeeee;*/
}

a.featuredoubleimg1 {
	padding: 30px 20px 0 475px;
	border: 1px solid #fffff;
	background: #eeeeee url(../img/home/feature1.jpg) top left no-repeat;
	font-size: 1.8em;
	line-height: 1.4em;
	min-height: 280px;
	color: #292929;
	text-align: left;
	display: block;
	text-decoration: none;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

a.featuredoubleimg2 {
	padding: 30px 20px 0 475px;
	border: 1px solid #fffff;
	background: #eeeeee url(../img/home/feature2.jpg) top left no-repeat;
	font-size: 1.8em;
	line-height: 1.4em;
	min-height: 280px;
	color: #292929;
	text-align: left;
	display: block;
	text-decoration: none;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

a.featuredoubleimg1:hover, a.featuredoubleimg2:hover {
	opacity: 0.7;
}

.featurebox8-2 a {
	width: 60%;
	margin: 0 0 20px 0;
	/*padding: 340px 0 0 5px;*/
	padding: 355px 0 0 5px;
	border: 1px solid #fffff;
	background: #dedede url(../img/home/feature10y.jpg) top center no-repeat;
	min-height: 560px;
	font-size: 1.3em;
	color: #292929;
	text-align: left;
	display: block;
	text-decoration: none;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	float: left;
}

.featurebox8-2 a:hover {

	background: #f6e1ff url(../img/home/feature10y.jpg) top center no-repeat;

}





ul.homeprom {
	margin-left: 15px;
}

ul.homeprom li {
	list-style-type: none;
	float: left;
	margin: 10px 40px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

ul.homeprom li a {
	padding: 210px 5px 10px 5px;
	width: 345px;
	/*width: 16.5em;*/
	display: block;
	text-decoration: none;
	color: #292929;
	line-height: 1em;
	border: 1px solid #d6d6d6;
	min-height: 265px;
}

ul.homeprom2 {
	margin-left: -15px;
}

ul.homeprom2 li {
	list-style-type: none;
	float: left;
	margin: 20px 12px 25px 22px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

ul.homeprom2 li a {
	padding: 155px 5px 10px 5px;
	width: 200px;
	display: block;
	text-decoration: none;
	color: #292929;
	line-height: 1.0em;
	border: 1px solid #d6d6d6;
	min-height: 210px;
	float: left;
	font-size: 0.95em;
}





/* Styles from AM - 44 GE ***********************/

ul.home44 {
	float: left;
	margin-top: 10px;
}

ul.home44 li {
	list-style-type: none;
	/*float: left;*/
	/*margin: 20px 12px 25px 22px;*/
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

ul.home44 li a {
	padding: 220px 5px 20px 5px;
	width: 355px;
	margin: 0 40px 35px -20px;
	display: block;
	text-decoration: none;
	text-align: center;
	color: #292929;
	line-height: 1.0em;
	border: 1px solid #d6d6d6;

	float: left;
	font-size: 1.2em;
	font-weight: 600;

}

ul.home44 li a.box4c2 {
	background: #eeeeee url('../img/home/box4c2.jpg') top center no-repeat;
}

ul.home44 li a.health {
	background: #eeeeee url('../img/home/health2.png') top center no-repeat;
}

ul.home44 li a.health:hover, ul.home44 li a.health:focus, ul.home44 li a.empbig:hover, ul.home44 li a.empbig:focus {
	opacity: 0.7;
}

ul.home44 li a.empbig {
	background: #eeeeee url('../img/home/empbig.png') top center no-repeat;
}

h2.homevote {
	width: auto;
	height: 80px;
	line-height: 1.1em;
}



/* END Styles from AM - 44 GE -------------------------------*/

ul.homeprom4, ul.homeprom4f {
	margin-left: 0;
}

ul.homeprom4 li, ul.homeprom4f li {
	list-style-type: none;
	float: left;
	margin: 20px 20px 25px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


#content-main ul.homeprom4 li a {
	padding: 155px 5px 10px 5px;
	/*width: 175px;*/
	width: 300px;
	display: block;
	text-decoration: none;
	color: #292929;
	line-height: 1em;
	border: 1px solid #d6d6d6;
	min-height: 210px;
	float: right;
	font-size: 1.2em;
	font-weight: 500;
	text-align: center;
}


.box102a {
	background: #eeeeee url('../img/home/box102a.png') top center no-repeat;
}

.box202a {
	background: #eeeeee url('../img/home/box202a.png') top center no-repeat;
}

#content-main ul.homeprom4 li a:hover, #content-main ul.homeprom li a:hover, #content-main ul.homeprom4 li a:focus, #content-main ul.homeprom li a:focus {
	opacity: 0.8;
	border: 1px solid red;
	background: none;

}

ul.homeprom5 {
	margin-left: 15px;
}

ul.homeprom5 li {
	list-style-type: none;
	float: left;
	margin: 10px 40px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

ul.homeprom5 li a {
	padding: 210px 5px 10px 5px;
	width: 535px;
	/*width: 16.5em;*/
	display: block;
	text-decoration: none;
	color: #292929;
	line-height: 1.1em;
	border: 1px solid #d6d6d6;
	min-height: 260px;
}

ul.homeprom6 {
	margin-left: 15px;
}

ul.homeprom6 li {
	list-style-type: none;
	float: left;
	margin: 10px 40px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

ul.homeprom6 li a {
	padding: 40px;
	width: 535px;
	display: block;
	text-decoration: none;
	color: #292929;
	line-height: 1.1em;
	border: 1px solid #d6d6d6;
	background: #eaeaea;
	min-height: 100px;
	text-align: center;
	font-size: 1.3em;
	font-weight: bold;
	vertical-align: middle;
}

ul.homeprom6 li a:hover, ul.homeprom6 li a:focus {
	background: #dddddd;
	border: 1px solid #ff9393;
}


.box100 {
	background: #eeeeee url('../img/home/box100.png') top center no-repeat;
}

.box100a {
	background: #eeeeee url('../img/home/box100a.png') top center no-repeat;
}

.box100saf {
	background: #eeeeee url('../img/home/box100saf.png') top center no-repeat;
}

.box101 {
	background: #eeeeee url('../img/home/box101.png') top center no-repeat;
}

.box102 {
	background: #eeeeee url('../img/home/box102.png') top center no-repeat;
}

.box200 {
	background: #eeeeee url('../img/home/box200.png') top center no-repeat;
}

.box201 {
	background: #eeeeee url('../img/home/box201.png') top center no-repeat;
}

.box202 {
	background: #eeeeee url('../img/home/box202.png') top center no-repeat;
}

.box205 {
	background: #eeeeee url('../img/home/box205.png') top center no-repeat;
}

.box205a {
	background: #eeeeee url('../img/home/box205a.png') top center no-repeat;
}

.box206 {
	background: #eeeeee url('../img/home/box206.png') top center no-repeat;
}

.box207 {
	background: #eeeeee url('../img/home/box207.png') top center no-repeat;
}

.box300 {
	background: #eeeeee url('../img/home/box300.png') top center no-repeat;
}

.box301 {
	/*background:  #eeeeee url('../img/home/box301.png') top center no-repeat;*/
	background: #eeeeee url('../img/home/box205a.png') top center no-repeat;
}

.box400 {
	background: #eeeeee url('../img/home/box400.png') top center no-repeat;
}

.box401 {
	background: #eeeeee url('../img/home/box401.png') top center no-repeat;
}

.box1a {
	background: #eeeeee url('../img/outicon.png') top center no-repeat;
}

.box2a {
	background: #eeeeee url('../img/studenticon.png') top center no-repeat;
}

.box3a {
	background: #eeeeee url('../img/votingicon.png') top center no-repeat;
}

ul.homeprom li a:hover, ul.homeprom2 li a:hover, ul.homeprom5 li a:hover {
	opacity: 0.8;
	border: 1px solid #ff8282;
}

.box4b:hover, .box4c:hover, .box4c2:hover, .box5b:hover, .box6b:hover, .box7b:hover, .box7c:hover, .box8b:hover, .box9b:hover, .box100:hover, .box100a:hover, .box100saf:hover,
.box102:hover, .box200:hover, .box201:hover, .box202:hover, .box205:hover, .box205a:hover, .box206:hover, .box10b:hover, .box1a:hover, .box2a:hover, .box3a:hover, .box6c:hover, .box4b:focus, .box4c:focus, .box4c2:focus, .box5b:focus, .box6b:focus, .box7b:focus, .box7c:focus, .box8b:focus, .box9b:focus, .box100:focus, .box100a:focus,
.box102:focus, .box200:focus, .box201:focus, .box202:focus, .box205:focus, .box205a:focus, .box206:focus, .box10b:focus, .box1a:focus, .box2a:focus, .box3a:focus, .box6c:focus, .box100saf:focus, .box101:hover, .box101:focus, .box301:hover, .box301:focus, .box401:hover, .box401:focus, .box11c:hover, .box11c:focus, .box12b:hover, .box12b:focus, .box10b20:hover, .boxstu2:focus, .boxstu2:hover, .boxltcf:focus, .boxltcf:hover, .boxca:focus, .boxca:hover, .boxvic:focus, .boxvic:hover, .boxvicf:focus, .boxvicf:hover {
	opacity: 0.8;
}

.bighome5 {
	font-size: 1.3em;
	font-weight: 600;
	text-align: center;


}

.box4b {
	background: #eeeeee url('../img/home/box4b.jpg') top center no-repeat;
}

.box4c {
	background: #eeeeee url('../img/home/box4c.jpg') top center no-repeat;
}

.box4c2 {
	background: #eeeeee url('../img/home/box4c2.png') top center no-repeat;
}

.boxstu2 {
	background: #eeeeee url('../img/home/boxstu2.png') top center no-repeat;
}

.boxltcf {
	background: #eeeeee url('../img/home/boxltcf.png') top center no-repeat;
}

.boxvic {
	background: #eeeeee url('../img/home/boxvic.png') top center no-repeat;
}

.boxvicf {
	background: #eeeeee url('../img/home/boxvicf.jpg') top center no-repeat;
}

.boxca {
	background: #eeeeee url('../img/home/boxca.png') top center no-repeat;
}

.box5b {
	/*background: #bb83ca  url('../img/home/box5b.jpg') top center no-repeat;*/
	background: #eeeeee url('../img/home/box5b.jpg') top center no-repeat;
}

.box6b {
	background: #eeeeee url('../img/home/box6b.jpg') top center no-repeat;
}

.box6c {
	/*background: #fce200  url('../img/home/box6c.jpg') top center no-repeat;*/
	background: #eeeeee url('../img/home/box6c.jpg') top center no-repeat;
}

.box7b {
	background: #eeeeee url('../img/home/box7b.jpg') top center no-repeat;
}

.box7c {
	/*background: #00bed6  url('../img/home/box7c.jpg') top center no-repeat;*/
	background: #eeeeee url('../img/home/box7c.jpg') top center no-repeat;
}

.box8b {
	background: #eeeeee url('../img/home/box8b.jpg') top center no-repeat;
}



.box9b {
	background: #eeeeee url('../img/home/box9b_long.jpg') top center no-repeat;
}

.box10b {
	background: #eeeeee url('../img/home/box10b.jpg') top center no-repeat;
}

.box10b20 {
	background: #eeeeee url('../img/home/faqhome.png') top center no-repeat;
}

.box11c {
	background: #eeeeee url('../img/home/box12b.png') top center no-repeat;
}

.box12b {
	background: #eeeeee url('../img/home/box13b.jpg') top center no-repeat;
}

.emptybox {
	background: #eeeeee;
}

.vis19 {
	width: 38%;
	border: 1px solid #bababa;
	/*background: #94d40b url('../img/home/vis20.png') 250px 70px;
	background: #b683bb url('../img/home/vis21.png') 280px 50px;*/
	background: #b683bb;
	background-repeat: no-repeat;
	/*background: #94c93d;*/
	padding: 20px 10px 10px 10px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	float: left;
	height: 345px;
}

.vis19b {
	width: 38%;
	border: 1px solid #bababa;
	background: #b683bb;
	padding: 20px 10px 10px 10px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	float: right;
	height: 330px;
}

.vis19f ul {}

.vis19fb {
	height: 330px;
}

.vis19 h2, .vis19b h2 {
	margin-top: 0px;
	text-align: center;
}

.vis19 p.textfi {
	margin-left: 25px;
	margin-top: 10px;
	font-weight: bold;
	float: left;
}

.vis19b p.textfib {
	float: left;
	font-weight: bold;

}


p.visfind {
	float: left;
	min-height: 138px;
	padding-top: 3px;

}

ul.listvis {
	margin-left: 30px;
	margin-top: 5px;
	float: left;
}

ul.listvisb {
	margin-left: 30px;
	float: left;
}

ul.listvisbf {
	margin-left: 100px;

}

ul.listvis li {
	font-size: 1.2em;
}

li.padright {
	padding-right: 150px;
}

#vissearch {
	margin-left: 30px;
	float: left;
	margin-top: 5px;
	position: relative;
}

#vissearchb {
	margin-left: 54px;
	/*float: left;*/
	margin-top: 5px;
	position: relative;
}

#vissearchf {
	margin-left: 30px;
	float: left;
	margin-top: 5px;
	position: relative;
}

.visotherf {
	/*float: right;
	width: 150px;*/
	margin-left: 15px;
	margin-top: 35px;
	clear: both;
}

.visother {
	/*float: right;
	width: 150px;*/
	margin-left: 30px;
	margin-top: 65px;
	/*	position: relative;*/
	clear: both;
}

.visotherb {

	margin-right: 80px;
	margin-top: 65px;

}

button.tinyvis {
	padding: 7px 12px;
	font-size: 1.0em;
	float: left;
	background: #61459b;
	border: 1px solid #61459b;
	color: white;
	font-weight: 600;
}

button.tinyvis:hover, button.tinyvis:focus {
	background: #2d2048;
	border: 1px solid #2d2048;
}

a.standalone {
	padding: 10px 10px 10px 280px;
	margin: 0 0 40px 18px;
	width: 95%;
	display: block;
	text-decoration: none;
	color: #292929;
	line-height: 1em;
	border: 1px solid #d6d6d6;
	min-height: 200px;
	background: #e0e0e0 url('../img/home/adsicon.png') top left no-repeat;
	font-size: 1.2em;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

a.standalone:hover, a.standalone:focus {
	/*background: #ecffff url('../img/home/adsicon.png') top left no-repeat;*/
	opacity: 0.8;
}

.standalone h3 {
	font-size: 1.5em;
}

.breadc {
	margin: 0 auto;
	/*background-color: #e7e7e7;
	border-bottom: 1px solid #a8a8a8;*/
	/*background: #e6e6e6;*/
	min-height: 30px;
}

.breadwrap {
	text-align: left;
	width: 900px;
	margin-top: 0px;
}

/*
#breadcrumbs ol{
	list-style:none;
	margin:0px;
	padding:0px;
}
#breadcrumbs ol li{
	display:inline;
}
*/

#content-main .nobord {
	border-bottom: 0px;
}

#content-main a.nobord:hover {
	border-bottom: 0px;
	background-color: transparent;
	box-shadow: none;
	opacity: 0.6;
}

#navbread {
	padding: 0px;
	margin: 0px;
}



#navbread li {
	display: inline;
	list-style-type: none;
	padding: 0 .4em 0 .2em;
	margin: 0px;
	font-size: 0.75em;
	color: #1F2C33;

}

#navbread li a {
	/*text-decoration: none;*/
	color: #1F2C33;
	padding: 0px 10px 0px 0px;
	background: url('../img/dark-arrow.gif') center right no-repeat;
}



#navbread li a:hover {
	text-decoration: underline;
	color: #660000;
}



.waysvoteam {
	border: 1px solid #ABABAB;
	margin: 10px 30px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: 340px;
	float: left;
	padding: 10px 15px;
	min-height: 640px;
}

.optionsregister {
	border: 1px solid #ABABAB;
	margin: 10px 30px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: 45%;
	float: left;
	padding: 10px 15px;
	min-height: 300px;
}

.optionsregister ul li {
	margin-bottom: 15px;
}

.idoptions {

	margin: 10px 40px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: 335px;
	float: left;
	padding: 210px 10px 15px 10px;
	min-height: 640px;
}

.idoptions h2 {
	font-size: 1.3em;
	margin-bottom: 20px;
}

.option1 {
	background: url(../img/voteridoption1.png) top center no-repeat;


}

.option2 {
	background: url(../img/voteridoption2.png) top center no-repeat;

}

.option3 {
	background: url(../img/voteridoption3.png) top center no-repeat;

}

.borderoption2 {
	border: 6px solid #00bbd4;
	width: 93%;

}

.borderoption2 h2 {
	background: #00bbd4;
	color: white;
	font-size: 1.5em;
	font-weight: 600;
	padding: 5px;
	margin: 0;
}

.borderoption2 h3 {
	color: #00606c;
	font-size: 1.2em;
	font-weight: 600;
	margin-top: 30px;
}

.waysvote2 {
	margin: 10px 25px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: 30%;
	float: left;
	padding: 300px 15px 10px 15px;
	min-height: 700px;
}

.waysvote3 {
	margin: 10px 25px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: 22%;
	float: left;
	padding: 250px 15px 10px 15px;
	min-height: 610px;
}

.waysvote4 {
	margin: 10px 25px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: 100%;
	float: none;
	padding: 15px 10px 15px 300px;
	min-height: 200px;
}

.waysvote5 {
	margin: 10px 25px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: 22%;
	float: left;
	padding: 10px 15px 10px 15px;
	min-height: 350px;

}

.tall5 {
	min-height: 380px;
}

.advanceways5 {
	border-top: 20px solid #94d40b;
}

.rooffice5 {
	border-top: 20px solid #bb83ca;
}

.votemail5 {
	border-top: 20px solid #00bed6;
}

.other5 {
	border-top: 20px solid #e95ebe;
}

.electiondayways4 {
	background: url(../img/electionday4.png) top left no-repeat;
	background-size: 270px;
}

.electiondayways {
	background: url(../img/electionday.png) top center no-repeat;
}

.advanceways {
	background: url(../img/advanceways.png) top center no-repeat;
}

.rooffice {
	background: url(../img/rooffice.png) top center no-repeat;
}

.votemail {
	background: url(../img/votema.png) top center no-repeat;
}

a.ui-link {

	background: url(../images/external.png) no-repeat top right;
	padding-right: 20px;
	/*padding-top: -15px;*/

}


.box2019 {
	border: 1px solid #ABABAB;
	margin: 10px 25px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: auto;
	padding: 10px 15px;
}

.box2019_dark {
	border: 1px solid #ABABAB;
	margin: 10px 25px 30px 0;
	background: #ddd;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: auto;
	padding: 10px 15px;
}

.box2019nowidth {
	border: 1px solid #ABABAB;
	margin: 10px 25px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);

	padding: 10px 15px;
}

.canbox2019 {
	border: 1px solid #ABABAB;
	margin: 10px 25px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: auto;
}

.canbox2019 p, .canbox2019 h3, .canbox2019 ul li {
	margin: 10px;
}

.canbox2019 h2 {
	padding: 10px;
	background: #606060;
	color: white;
	margin: 0;
	text-align: center;
	font-size: 1.3em;
}

.canbox2019portal h2 {
	padding: 10px 10px 10px 50px;
	background: #8b0000 url(../img/lock.png) top left no-repeat;
	color: white;
	margin: 0;
	text-align: center;
	font-size: 1.3em;
}

.canbox400 {
	min-height: 550px;
}

.candidatesspace ul li {
	margin-bottom: 10px;
}

#content-main ul.related {
	margin: 0;
	padding: 0;
	/*display: table-row;*/
}

#content-main ul.related li {
	list-style-type: none;
	float: left;
	margin: 5px 10px;
}

#content-main .related a, #content-main a.related {
	width: 260px;
	min-height: 60px;
	/*background: #dbdbdb;*/
	background-image: linear-gradient(to right top, #cbcbcb, #d3d5d6, #dbdfdf, #e4e9e7, #f0f2ed);
	box-shadow: 3px 3px 3px #b5b5b5;
	border-radius: 3px;
	border: 1px solid #ccd5d1;
	text-align: center;
	padding: 10px;
	margin: 10px 10px 40px 10px;
	display: block;
	vertical-align: middle;
}

#content-main .related a:hover, #content-main .related a:focus, #content-main a.related:hover, #content-main a.related:focus {
	/*background-image: linear-gradient(to right top, #c9b1c9, #debec5, #e6d0c8, #e9e2d8, #f0f2ed);*/
	background-image: none;
	background-color: #00bed6;
	/* color: white;*/
}

#content-main a.related2 {
	width: 150px;
	height: auto;
	background-image: linear-gradient(to right top, #cbcbcb, #d3d5d6, #dbdfdf, #e4e9e7, #f0f2ed);
	box-shadow: 3px 3px 3px #b5b5b5;
	border-radius: 3px;
	border: 1px solid #ccd5d1;
	text-align: center;
	/*padding: 8px 10px 8px 10px;*/
	padding: 20px;
	margin: 5px;
}

#content-main a.related2:hover {
	background-image: none;
	background-color: #00bed6;
	color: white;
}

#content-main a.related3 {
	width: 200px;
	height: auto;
	background-image: linear-gradient(to right top, #cbcbcb, #d3d5d6, #dbdfdf, #e4e9e7, #f0f2ed);
	box-shadow: 3px 3px 3px #b5b5b5;

	border-radius: 3px;
	border: 1px solid #ccd5d1;
	text-align: center;
	padding: 8px 10px 8px 10px;
	margin: 0 20px 20px 20px;
	display: block;
}

#content-main a.largewidth {
	width: 300px;
}

#content-main a.related3:hover, #content-main a.related3:focus {
	background-image: none;
	background-color: #00bed6;
	color: white;
}

#content-main ul.petitbouton {
	margin-bottom: 40px;
}

#content-main ul.petitbouton li {
	list-style-type: none;

}

#content-main .petitbouton a {
	width: 350px;
	float: left;
	min-height: 150px;
	background: #dbdbdb;
	/*background: #e95ebe;*/
	box-shadow: 3px 3px 3px #b5b5b5;
	border-radius: 3px;
	/*border: 1px solid #ccd5d1;*/
	text-align: center;
	font-size: 1.4em;
	color: #222222;
	padding: 40px 20px 20px 20px;
	margin: 10px 20px 40px 10px;

}

#content-main .petitbouton a:hover, #content-main .petitbouton a:focus {
	background: #6c6c6c;
	color: white;
}


.copyright {
	background: #222222;
	color: white;
	text-align: center;
	padding: 30px 0;
}


#bottompage .followusicons {
	text-align: center;
	vertical-align: middle;

}

.followusicons a {
	background: #4c4c4c;
	border-radius: 3px;
	color: white;
	width: 350px;
	padding: 20px;
	text-align: center;
	margin: 0 auto;
	box-shadow: 3px 3px 3px #bdbdbd;
}

.followusicons a:hover {
	background: #61459b;
	color: white;

}

.followusicons p {
	font-size: 1.2em;
	font-weight: 600;
	line-height: 1em;
	margin-top: 20px;
}

.followusicons img {
	vertical-align: middle;

}

#bottompage .followusicons a {
	border-bottom: none;
	display: block;
	/*width: 300px;*/
}

#bottompage .followusicons a:hover {
	opacity: 0.8;
	border-bottom: none;
	box-shadow: 0px;
	/*width: 300px;*/
	margin: 0 auto;
}

.accessibilitytop {
	background: url(../img/accessibilitytop.jpg) top center no-repeat;
	width: 100%;
	height: 300px;
	margin-bottom: 20px;

}

.accessibilitytop2 {
	background: url(../img/accessibilitytop2.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	float: right;

}

.registrationtop {
	background: url(../img/registrationtop.jpg) top right no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
	display: block;
}

.registrationtop.ge44 {
	background: url(../img/registrationtop-ge44.jpg) top right no-repeat;
}

.abroadtop {
	background: url(../img/abroadtop.jpg) top right no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
}

.faqvotingtop {
	background: url(../img/faqvotingtop.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
}

.faqidtovotetop {
	background: url(../img/faqidtovote.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
}

.faqvictop {
	background: url(../img/faqvictop.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
}

.faqpollingstations {
	background: url(../img/faqpollingstations.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
}

.faqtimeoff {
	background: url(../img/faqtimeoff.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
}

.faqvotebymail {
	background: url(../img/faqvotebymail.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
}

.faqemp {
	background: url(../img/faqemp.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
}

.faqelesigns {
	background: url(../img/faqelesigns.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
}

.faqcovid {
	background: url(../img/faqcovid.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
}

.faqoth {
	background: url(../img/faqoth.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
}

.campustop {
	background: url(../img/campustop.jpg) top right no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	margin-left: 20px;
	float: right;
	display: block;
}

.faqregistrationtop {
	background: url(../img/faqregistration.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	float: right;
}

.accessibilitytop3 {
	background: url(../img/accessibilitytop3.jpg) top center no-repeat;
	width: 500px;
	height: 300px;
	margin-bottom: 20px;
	float: right;
}

#content-main ul.foire li {
	list-style-type: none;

}

#content-main .foire a {
	min-width: 130px;
	float: left;
	min-height: 70px;
	background: #dbdbdb;
	text-align: center;
	padding-top: 20px;
	margin: 10px 10px 40px 10px;
}

#content-main ul.foire>a.activefaq {
	background-color: #faf0ff;
}

#content-main a.reg19but {
	display: block;
	max-width: 350px;
	color: white;
	font-size: 1.2em;
	font-weight: 500;
	padding: 10px 25px 10px 10px;
	border-radius: 4px;
	/*background: #363636 url(../img/butarrow.png) top right no-repeat;*/
	background: rgb(54, 54, 54);
	background: linear-gradient(176deg, rgba(54, 54, 54, 1) 40%, rgba(87, 88, 88, 1) 62%, rgba(145, 146, 147, 1) 100%);
	border-bottom: none;
	text-decoration: none;
	/*margin: auto;*/
	text-align: center;
}



#content-main a.reg19butsmall {

	width: 150px;
}

.row a.reg19butf {
	color: white;
	font-size: 1.4em;
	font-weight: 600;
	padding: 10px 25px 10px 10px;
	border-radius: 4px;
	width: 300px;
	height: 100px;
	/*background: #4f5b66 url(../img/butarrow.png) top right no-repeat;*/
	background: rgb(54, 54, 54);
	background: linear-gradient(90deg, rgba(54, 54, 54, 1) 35%, rgba(209, 212, 213, 1) 100%);
	border-bottom: none;
}

#content-main a:hover.reg19but, #content-main a:focus.reg19but {

	/*	background: #184350 url(../img/butarrow_hover.png) top right no-repeat;*/
	background: #184350;
}

#content-main a.contactbut {
	display: block;
	max-width: 250px;
	color: white;
	font-size: 1.6em;
	line-height: 1.4em;
	font-weight: 500;
	padding: 20px 10px 30px 100px;
	border-radius: 6px;
	background: rgb(54, 54, 54) url(../img/contactbutton.png) top left no-repeat;
	border-bottom: none;
	text-decoration: none;
	text-align: center;
	box-shadow: 3px 3px 3px #a7a7a7;
	/*margin: 0 auto;*/
}

#content-main a.contactbut:hover, #content-main a.contactbut:focus {
	background-color: #727272;
}


/*Social media page*/
#content-main ul.socialbut1 li {
	list-style-type: none;
	margin-bottom: 10px;
}

#content-main ul.socialbut1 {
	margin-left: 0px;
}

#content-main a.socialbutt {
	text-decoration: none;
}

#content-main a.socialbutt {
	display: block;
	max-width: 400px;
	min-height: 47px;
	height: auto;
	color: #131313;
	font-size: 1em;
	line-height: 1.38em;
	font-weight: inherit;
	padding: 12px 10px 12px 65px;
	border-radius: 4px;
	background: #e9e9e9;
	border-bottom: none;
}

#content-main a:hover.subs {
	background: #bdbdbd;
}

#content-main a.twitter {
	background: #e9e9e9 url(../img/twitterfs.png) top left no-repeat;
}

#content-main a:hover.twitter, #content-main a:focus.twitter {
	background: #bdbdbd url(../img/twitterfs.png) top left no-repeat;
}

#content-main a.youtube {
	background: #e9e9e9 url(../img/youtubefs.png) top left no-repeat;
}

#content-main a:hover.youtube, #content-main a:focus.youtube {
	background: #bdbdbd url(../img/youtubefs.png) top left no-repeat;
}

#content-main a.facebook {
	background: #e9e9e9 url(../img/facebookf.png) top left no-repeat;
}

#content-main a:hover.facebook, #content-main a:focus.facebook {
	background: #bdbdbd url(../img/facebookf.png) top left no-repeat;
}

#content-main a.linkedin {
	background: #e9e9e9 url(../img/linkedin.png) top left no-repeat;
}

#content-main a:hover.linkedin, #content-main a:focus.linkedin {
	background: #bdbdbd url(../img/linkedin.png) top left no-repeat;
}

#content-main a.instagram {
	background: #e9e9e9 url(../img/instagram2.png) top left no-repeat;
}

#content-main a:hover.instagram, #content-main a:focus.instagram {
	background: #bdbdbd url(../img/instagram2.png) top left no-repeat;
}

.faq4 h2 {
	background: #efefef;
	padding: 10px;
	border: 1px solid #c1c1c1;
	box-shadow: 5px 5px 5px #d9d9d9;
}

.indent {
	margin-left: 20px;
}

.indent.alert {
	background: yellow;
}

.indent162 { padding-left: 1.62em; }
.indent238 { padding-left: 2.38em; }

#content-main ul.relatedsmall {
	margin: 0;
	padding: 0;

}

#content-main ul.relatedsmall li {
	list-style-type: none;
	float: left;
	margin: 5px 10px;
}

#content-main .relatedsmall a {

	background-image: linear-gradient(to right top, #cbcbcb, #d3d5d6, #dbdfdf, #e4e9e7, #f0f2ed);
	box-shadow: 3px 3px 3px #b5b5b5;
	border-radius: 3px;
	border: 1px solid #ccd5d1;
	text-align: center;
	padding: 20px 30px;
	margin: 10px 15px 40px 5px;
	display: block;
	vertical-align: middle;

}

#content-main ul.relatedsmallspread li a {
	height: 150px;
	padding: 0px;
	width: 150px;
}

#content-main ul.relatedsmallabr li a {
	height: 70px;
	vertical-align: middle;
	width: 300px;
	margin: 0 15px 20px 5px;
}

/*#content-main ul.relatedcandidate li a {
		height: 150px;
		width: 200px;
}*/

/*#content-main ul.repo li a {
		height: 75px;
		width: 180px;
}*/

#content-main ul.relatedcan li a {
	height: 70px;
}

#content-main .relatedsmall a:hover, #content-main .relatedsmall a:focus {

	background: #00bed6;
	/*color: white;
	 font-weight: 600;*/
}

#content-main ul.spreadbutton li {
	display: inline;
	float: left;
}

#content-main ul.spreadbutton li a {
	width: 160px;
	height: 70px;
	background-image: linear-gradient(to right top, #cbcbcb, #d3d5d6, #dbdfdf, #e4e9e7, #f0f2ed);
	box-shadow: 3px 3px 3px #b5b5b5;
	border-radius: 3px;
	border: 1px solid #ccd5d1;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	margin: 10px;
	display: block;
	padding: 7px;
}

#content-main ul.spreadbutton li a:hover, #content-main ul.spreadbutton li a:focus {
	background: #00bed6;
	/* color: white;*/
}

#content-main ul.verticalbuttons {
	margin: 0;
	padding: 0;

}

#content-main ul.verticalbuttons li {
	list-style-type: none;
	margin: 5px 10px;
}

#content-main .verticalbuttons a {

	background-image: linear-gradient(to right top, #cbcbcb, #d3d5d6, #dbdfdf, #e4e9e7, #f0f2ed);
	box-shadow: 3px 3px 3px #b5b5b5;
	border-radius: 3px;
	border: 1px solid #ccd5d1;
	text-align: center;
	padding: 30px 30px;
	margin: 10px 15px 30px 5px;
	display: block;
	vertical-align: middle;
	width: 280px;
}

#content-main .verticalbuttons a:hover, #content-main .verticalbuttons a:focus {

	background: #00bed6;

}

.pesn {
	border: 1px solid #696969;
	padding: 0;
	max-width: 500px;
}

.pesn h2 {
	padding: 10px;
	margin: 0;
	text-align: center;
	color: white;
	background: #696969;

}

.pesn p {
	margin: 10px 30px;
	float: left;
	max-width: 300px;
}

.pesn h3 {
	margin: 10px 20px;
	float: left;
	width: 70px;
}

.pesn ul {
	float: left;
	max-width: 300px;
	margin-bottom: 0;
}

.pesn ul li {
	margin: 10px 10px 10px 25px;
}

.pesnsmall {
	border: 1px solid #696969;
	padding: 0;
	margin-bottom: 20px;
	max-width: 340px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.pesnsmall h2 {
	padding: 10px;
	margin: 0;
	text-align: center;
	color: white;
	background: #696969;
	font-size: 1.3em;
}

.pesnsmall p {
	margin: 10px 20px;
	float: left;
	max-width: 240px;
	font-size: 0.9em;
}

.pesnsmall h3 {
	margin: 10px 20px 0 10px;
	float: left;
	width: 30px;
	font-size: 1.1em;
}

.pesnsmallf h3 {
	width: 60px;

}

.pesnsmall ul {
	float: left;
	max-width: 230px;
	margin-bottom: 20px;
	font-size: 0.9em;
}

.pesnsmall ul li {
	margin: 20px 10px 0 15px;
	line-height: 1.1em;
}

p.phoneno {
	font-size: 1em;
}

.box2019cand {
	border: 1px solid #ABABAB;
	margin: 10px 25px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: auto;
	padding: 10px 15px;
	width: 450px;
	min-height: 200px;
	float: left;
}



#content-main ul.canpage {
	margin: 0;
	padding: 0;

}

#content-main ul.canpage li {
	list-style-type: none;
	float: left;
	margin: 5px 5px;
}

#content-main .canpage a {

	background-image: linear-gradient(to right top, #cbcbcb, #d3d5d6, #dbdfdf, #e4e9e7, #f0f2ed);
	box-shadow: 3px 3px 3px #b5b5b5;
	border-radius: 3px;
	border: 1px solid #ccd5d1;
	text-align: center;
	padding: 20px 30px;
	margin: 10px 15px 40px 5px;
	display: block;
	vertical-align: middle;
	width: 220px;
	min-height: 80px;
	line-height: normal;
}

#content-main .canpage a:hover, #content-main .canpage a:focus {
	background: #00bed6;
}

.gris {
	background: #eeeeee;
}

h3.gris {
	padding: 5px;
	margin-top: 40px;
}

#content-main ul.repo li {
	display: inline;
	float: left;
}

#content-main ul.repo li a {
	width: 160px;
	height: 60px;
	background-image: linear-gradient(to right top, #cbcbcb, #d3d5d6, #dbdfdf, #e4e9e7, #f0f2ed);
	box-shadow: 3px 3px 3px #b5b5b5;
	border-radius: 3px;
	border: 1px solid #ccd5d1;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	margin: 10px;
	display: block;
	padding: 12px 5px 5px 5px;
	line-height: 1.1em;
}

#content-main ul.repo li a:hover, #content-main ul.repo li a:focus {
	background: #00bed6;
	color: white;
}

table.sec, table.sec td, table.sec th {
	border: 1px solid #bcbcbc;
	border-collapse: collapse;
}

table.sec th.lightgrey {
	padding: 20px 10px;
	background: #e8e8e8;
	text-align: left;
}

table.sec th, table.sec td {
	padding: 10px;
}

table.sec {
	margin-bottom: 30px;
}


.alignLeft {
	text-align: left;
}

.simplegraybox {
	padding: 10px;
	border: 1px solid #d9d9d9;
	background-color: #f2f2f2;
	margin-top: 40px;
}

.campusbox {
	min-height: 510px;
}

.vicshadow {
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	margin-left: 30px;

}



.floatRight {
	float: right;
}

.floatRightmargin {
	float: right;
	margin-right: 100px;

}

.floatRightmargin label {
	margin-top: 0;
}

.downloadinfographic p {
	border: 1px solid #cecece;
	background-color: #eaeaea;
	box-shadow: 5px 5px 5px #888888;
	padding: 5px 10px;
	float: right;
	display: block;
	margin: 5px 0 0 0;
}

.shadow2019 {
	border: 1px solid #cecece;
	box-shadow: 5px 5px 5px #888888;
}

.videoWrapper {
	clear: both
}

.italic {
	font-style: italic;
}

.uCase {
	text-transform: uppercase;
}

#content-main ul.relatedsmall li {
	list-style-type: none;
	float: left;
	margin: 5px 10px;
}

#content-main .relatedsmall a {

	background-image: linear-gradient(to right top, #cbcbcb, #d3d5d6, #dbdfdf, #e4e9e7, #f0f2ed);
	box-shadow: 3px 3px 3px #b5b5b5;
	border-radius: 3px;
	border: 1px solid #ccd5d1;
	text-align: center;
	padding: 20px 30px;
	margin: 10px 15px 40px 5px;
	display: block;
	vertical-align: middle;

	margin-left: 20px;

}

.bold {
	font-weight: bold;
}

.fixreg {
	max-width: 620px;
}

.backtop {
	text-align: right;
	/*background: url('../../templates/images/top.gif') top right no-repeat;*/
	background: url('../img/top.png') top right no-repeat;
	padding-right: 35px;
	text-align: right;
	font-size: 0.9em;
}

.visapply {
	/*float: right;*/
	width: 300px;
	background: #d3d3d3;
	padding: 0;
	margin: 0 0 20px 30px;
	box-shadow: 5px 5px 5px #888888;
	text-align: center;
	height: auto;
}

.visapplyf {
	width: 350px;
}

.visapply h3 {
	font-size: 2em;
	background: #555555;
	color: white;
	margin: 0 0 20px 0;
}

.visapply input.widthsmall {
	margin-left: 60px;
}

.visapplyf input.widthsmall {
	margin-left: 80px;
}

.spaceneeded {
	height: 40px;
	width: auto;
	display: block;
}

.smallspace {
	height: 20px;
	width: auto;
	display: block;
}

ul.faqul li {
	margin-bottom: 15px;
}

#content-main a.vrs {
	border: 1px solid #d5d5d5;
	max-width: 400px;
	background: #ededed url('../img/SRV_Button.png') 10px 10px no-repeat;
	padding: 10px 10px 20px 100px;
	display: block;

	border-radius: 5px;
	box-shadow: 3px 3px 3px #a7a7a7;
	text-decoration: none;
}

#content-main a.vrs:hover, #content-main a.vrs:focus {
	background: #d8d8d8 url('../img/SRV_Button.png') 10px 10px no-repeat;
	;
}

.allcaps {
	text-transform: uppercase;
}

table.hours {
	background: white;
	margin-bottom: 1.25em;
	border: solid 1px #dddddd;
}


table.hours {
	width: 100%;
}

caption.bigcap {
	font-size: 1.3em;
	padding-bottom: 5px;
}

table.hours thead,
table.hours tfoot {
	background: whitesmoke;
	font-weight: bold;
}

table.hours caption {
	font-size: 1.3em;
}

table.hours thead th.black, table.hours th.black {
	background: #383838;
	color: white;
	font-weight: 200;
	font-size: 1.1em;
}

table.hours thead tr th,
table.hours thead tr td,
table.hours tfoot tr th,
table.hours tfoot tr td {
	padding: 0.5em 0.625em 0.625em;
	font-size: 1em;
	color: #222222;
	text-align: left;

}

table.hours tr th,
table.hours tr td {
	padding: 0.5625em 0.625em;
	font-size: 1em;
	color: #222222;
	vertical-align: top;
}

table.hours tr.even, table.hours tr.alt, table.hours tr:nth-of-type(even) {
	background: #dcdcdc;
}

table.hours thead tr th,
table.hours tfoot tr th,
table.hours tbody tr td,
table.hours tr td,
table.hours tfoot tr td {
	display: table-cell;
	line-height: 1.125em;
}

table tr.even, table tr.alt, table tr:nth-of-type(even) {
	background: #dcdcdc;
}

/*a11y202302160837*/
table.simpleLight tr.even, table.simpleLight tr.alt, table.simpleLight tr:nth-of-type(even) {
	background: #fff;
}

table.simpleLight tr.even td, table.simpleLight tr.alt td, table.simpleLight tr:nth-of-type(even) td,
table.simpleLight tr.even th, table.simpleLight tr.alt th, table.simpleLight tr:nth-of-type(even) th {
	border-top: 1px solid rgba(46, 124, 129, 0.16);
	border-bottom: 1px solid rgba(46, 124, 129, 0.16);
}

table.ranking {
	width: 98%
}

.ranking caption {
	padding: 5px;

}

.leftalign {
	text-align: left;
	font-size: 1.5em;
}

table.ranking {
	border-collapse: collapse;
}

.ranking td, .ranking th {
	border: #737171 solid 1px;
	padding: 10px;
}

.ranking th.header {
	background-color: #00bed6;
}

.ranking th.header2 {
	background-color: #393939;
	color: white;
}

table {
	background: white;
	margin-bottom: 1.25em;
	border: solid 1px #dddddd;
}

#navlist li {
	text-align: center;
	display: inline;
	list-style-type: none;
	padding-right: 20px;
}

.width33 {
	width: 32%;
}

.width30 {
	width: 30%;
}

.width40 {
	width: 40%;
}

.width50 {
	width: 50%;
}

.width60 {
	width: 60%
}

.width70 {
	width: 70%
}

.width80 {
	width: 80%
}

.width90 {
	width: 90%
}

.widthFull {
	width: 100%
}

.alignRight {
	text-align: right;
}

.minHeight5 {
	min-height: 5em
}


p.EDMessages {
	border: 1px solid black;
	padding: 10px;
	margin-bottom: 15px;
	background-color: yellowgreen;
	border-color: gray;
	font-weight: bold;
	color: black;
	width: auto;

}

.largefont {
	font-size: 1.2em;
}


/* ==========================================================================
   GE43 AB
   ========================================================================== */

/*From world3*/
/*.waysvote3 {
				.
				.
				.
			   min-height: 600px;
			}*/
/*So for taller content, extra class, so the shorter content currently shown does not get huge gaps*/
.waysvote3.abTaller {
	/*min-height: 1060px;*/
	min-height: 850px;
}


/* ul.abNoUl
		   ========================================================================== */

.abNoUl,
.abNoUlGapBelow {
	list-style: none;
	margin: 0;
	padding: 0;
}

.abNoUlGapBelow {
	margin-bottom: 1.62em;
}

.abNoUl li p {
	line-height: 1.38;

}

/* div.footNav & .abFootNav
		   ========================================================================== */

.abFootNav {
	border-top: 1px solid #CED5DB;
	margin-top: 4.85em;
}

.abFootNav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	float: left;
}

.abFootNav li {
	float: left;
	margin-right: 1.38em;
}

.abFootNav li a {
	display: block;
	padding: 0.62em;
	border: 1px solid #CED5DB !important;
	border-top: none !important;
	background: #666;
	color: #fff !important;
}

.abFootNav li a:hover {
	color: #000 !important;
}

.footNav {
	border-top: 1px solid #CED5DB;
}

.footNav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	float: right;
}

.footNav li {
	float: left;
	margin-right: 1.38em;
}

.footNav li a {
	display: block;
	padding: 0.62em;
	/*border-bottom: none !important;*/
	border: 1px solid #CED5DB !important;
	border-top: none !important;
}

.footNav li a span {
	border-bottom: 1px solid;
}

/* *.abThreeChilds
		   ========================================================================== */

ul.abThreeChilds>li {
	width: 30%;
	float: left;
}


/* *.abMinHeightN
		   *.abMinHeight
		   		.abMinHeightN
		   			To set heights for items
		   		.abMinHeight
		   			An overall class to allow rules to be applied to
		   			all .abMinHeight items
		   ========================================================================== */

/*Set heights*/
.abMinHeight18>* {
	min-height: 18em;
}

.abMinHeight22>* {
	min-height: 22em;
}

/*.abMinHeight20 etc*/
/*.abMinHeight33 etc*/

/* *.abHighLight
		   ========================================================================== */

.abHighLight {
	background: #FFFF00;
}

/* *Utility classes
		   ========================================================================== */

.linkMissing,
.abWeird {
	position: relative;
	outline: 1px dashed red;
}

.abWeird {
	outline: 1px dashed orange;
}

.linkMissing:after {
	content: "!";
	position: absolute;
	left: -1em;
	top: -0.8em;
	line-height: 1;
	background: red;
	color: yellow;
	font-weight: normal;
	font-size: 12px;
	white-space: nowrap;
	width: 1.0em;
	height: 1.0em;
	border-radius: 50%;
	text-align: center;
}

.abWeird:after {
	outline: 1px solid orange;
	content: "Check...";
	position: absolute;
	left: -1em;
	top: -0.8em;
	line-height: 1;
	background: rgba(255, 165, 0, 0.38);
	color: black;
	font-weight: normal;
	font-size: 12px;
	white-space: nowrap;
	/*width: 1.0em;*/
	/*height: 1.0em;*/
	/*border-radius: 50%;*/
	text-align: center;
}

.abTemp, .abOrphans {
	border: 3px dashed rgba(255, 255, 0, 1);
	background: rgba(255, 255, 0, 0.2);
	padding: 1em;
	transform: rotate(1.623deg);
}

.abTemp a, .abOrphans a {
	text-decoration: underline !important;
}

.abPage {
	border: 3px dashed rgba(255, 255, 0, 1);
	background: rgba(255, 255, 0, 0.2);
	font-size: 62%;
	font-weight: normal;
	color: red;
}

.abNoWrap {
	white-space: nowrap;
}

.abGoBlock {
	display: block;
}

.abPushDown {
	margin-bottom: 1.0em;
}

.abShortLine {
	line-height: 1.1em;
}

/* Auto identify links with the .ui-link class
				Added 2019-09-06-T-0826
			   ==========================================================================

					:lang(en) a.ui-link:after {
					    content: " (external link)";
					}

					:lang(fr) a.ui-link:after {
					    content: " (lien externe)";
					}*/


/* Health and safety page */

.healthsaf h2 {
	font-size: 2em;
	text-align: center;
	margin-top: 20px;
}

.saf1 {
	padding: 40px 0 60px 300px;
	background: url('../img/safety/img1.png') top left no-repeat;
	border-bottom: 1px solid black;
}

p.saf2 {
	padding: 15px 0 10px 60px;
	background: url('../img/safety/img2.png') top left no-repeat;
}

#content-main ul.saf3 {
	margin: 20px 0 270px 20px;
}

#content-main ul.saf3 li {
	text-align: center;
	float: left;
	list-style-type: none;

	/*margin-right: 5px;
	margin-bottom: 30px;*/

	width: 200px;
	margin: 0 5px 30px 0;
	padding: 180px 20px 0 20px;
	display: block;
	line-height: 1.3em;
}

#content-main ul.saf3 li.san {
	background: url('../img/safety/img3.png') top center no-repeat;
}

#content-main ul.saf3 li.mark {
	background: url('../img/safety/img4.png') top center no-repeat;
}

#content-main ul.saf3 li.poll {
	background: url('../img/safety/img5.png') top center no-repeat;
}

#content-main ul.saf3 li.sannew {
	background: url('../img/safety/new/img3.png') top center no-repeat;
}

#content-main ul.saf3 li.marknew {
	background: url('../img/safety/new/img4.png') top center no-repeat;
}

#content-main ul.saf3 li.marknewf {
	background: url('../img/safety/new/img4f.png') top center no-repeat;
}

#content-main ul.saf3 li.pollnew {
	background: url('../img/safety/new/img5.png') top center no-repeat;
}

#content-main ul.saf3 li.masnew {
	background: url('../img/safety/new/img6.png') top center no-repeat;
}

#content-main ul.saf3 li.pennew {
	background: url('../img/safety/new/img7.png') top center no-repeat;
}

#content-main ul.saf3 li.disnew {
	background: url('../img/safety/new/img8.png') top center no-repeat;
}

.bordersaf {
	border-bottom: 1px solid black;
}

#content-main ul.saf3 li.mas {
	background: url('../img/safety/img6.png') top center no-repeat;
}

#content-main ul.saf3 li.pen {
	background: url('../img/safety/img7.png') top center no-repeat;
}

#content-main ul.saf3 li.dis {
	background: url('../img/safety/img8.png') top center no-repeat;
}

/* END - Health and safety page */

ul.lispace li {
	margin-bottom: 15px;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	   Utilities
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.blocky {
	display: block;
}

.lineblock {
	display: inline-block;
}

.marginBelow { margin-bottom: 0.62em; }
.marginBelow238 { margin-bottom: 2.38em; }
.marginBelow338 { margin-bottom: 3.38em; }

.marginAbove { margin-top: 0.62em; }
.marginAbove238 { margin-top: 2.38em; }
.marginAbove338 { margin-top: 3.38em; }

.blockyWithMargins {
	display: block;
	margin: 1em 0 1em 1em;
}

.inlineBlocky {
	display: inline-block;
}

ul.listWithMargeBelow li {
	margin-bottom: 1.0em;
}

.margBelow {
	margin-bottom: 1.62em;
}

a[href^="tel:"]:before {
	content: "\260e";
	margin-right: 0.5em;
}

.mailIcon:before,
a[href^="mailto:"]:before {
	content: "\2709";
	margin-right: 0.5em;
}

a[href^="mailto:"].noIcon:before {
	display: none;
}

/*Stop icon breaking over two lines a11y202202281043*/
a[href^="tel:"],
a[href^="mailto:"] {
	/*display: inline-block;*/
	/*No, this makes wide links on narrow displays go block w/ a line
		  under it all w/ a gap after the wrap

		  Redo*/
}

dd {
	line-height: 1.6;
}

.liMargeBelow>li {
	margin-bottom: 1em;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
End of utilities
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#content-main .items li {
	list-style-type: none;
}

#content-main .items li a {
	width: 160px;
	height: 14em;
	float: left;
	text-align: center;
	margin: 10px;
	display: block;
	border: thin solid #ccc;
	text-decoration: none;
	line-height: 22px;
	background: #f8f8f8;
}

#content-main .items li a:hover {
	border: thin solid #b22222;
}

#content-main .items li a.xwide {
	width: 400px;
}

.red {
	color: #b22222;
}

#content-main a.backtop2 {
	text-align: right;
	background: url('../img/top2.png') top left no-repeat;
	padding-left: 38px;
	text-decoration: underline;
	border-bottom: none;
}

#content-main a.backtop2:hover, #content-main a.backtop2:focus {
	box-shadow: 0 0 0 white;
	color: #b22222;
	border: none;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																   .takeNoHeight
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.takeNoHeight {
	font-size: 1px;
	line-height: 1;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																			  IE
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
[hidden] {
	display: none;
}

.boxright {
	width: 50%;
	float: left;
	margin-right: 5%;

}

.boxpromo {
	min-height: 400px;
	padding: 0;
	border: 1px solid #6a0032;
	margin: 10px 25px 30px 0;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	width: 35%;
	float: right;
	background: url('/abo/int/vis/images/back.png') bottom right no-repeat;
}

.boxpromo p {
	margin: 10px;
}

.boxpromo h2 {
	background: #6a0032;
	margin: 0;
	padding: 10px;
	font-weight: 600;
	min-height: 70px;
	color: white;
	text-align: center;
}

.boxpromo ul {
	margin: 10px 10px 10px 20px;
}

.boxpromo ul li {
	margin-left: 20px;
}

img.imgceo {
	float: right;
	margin: 0 0 20px 20px;
}

#content-main a.homepromo {
	/*border: 1px solid black;*/
	border-bottom: none;
	background: #0bbbd3 url('/am/visitors/images/homepromo.png') top left no-repeat;
	min-height: 100px;
	max-width: 760px;
	display: block;
	padding: 35px 10px 10px 180px;
	font-size: 1.5em;
	/*color: white;*/
	box-shadow: 5px 5px 5px #a8a8a8;
}

#content-main a.homepromo2 {
	/*border: 1px solid black;*/
	border-bottom: none;
	background: #6a0032 url('/am/visitors/images/homepromo2.png') top left no-repeat;
	min-height: 100px;
	max-width: 760px;
	display: block;
	padding: 30px 10px 10px 180px;
	font-size: 1.5em;
	color: white;
	box-shadow: 5px 5px 5px #a8a8a8;
	border-radius: 5px;
}

#content-main a.homepromo:hover, #content-main a.homepromo2:hover {
	opacity: 0.7;
}

.boxnav {
	float: right;
	width: 200px;
	margin: -80px 10px 10px 20px;

}

ul.visnav li {
	list-style-type: none;

}

#content-main ul.visnav li a {
	text-align: center;
	padding: 80px 5px 10px 5px;
	width: 200px;
	display: block;
	text-decoration: none;
	color: white;
	line-height: 1.1em;
	border: 1px solid #d6d6d6;
	min-height: 100px;
	float: left;
	font-size: 1em;
	margin-bottom: 10px;
}

#content-main a.institutional {
	background: #6a0032 url('/am/visitors/images/institutional.png') top center no-repeat;
	color: white;
}

#content-main a.framework {
	background: #aa7f2d url('/am/visitors/images/institutional.png') top center no-repeat;
	color: white;
}

#content-main a.candvis {
	background: #8a961e url('/am/visitors/images/institutional.png') top center no-repeat;
	color: white;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																  beyond-nav.css
Content of beyond-nav.css moved from beyond-nav.css to here, world.css,
2021-11-16-0834
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/*#navaid for EBRA*/
#navaid a:focus, #navaid a:hover, #navaid a:active {
	position: absolute;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
														   .buttonRevealedUl
															  A wT component
Case specific rules
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/*Avoids the effect of an untargeted rule for NAV elsewhere*/
.btnRevealUl#provTerr {
	margin-top: inherit;
}

.btnRevealUl#provTerr button {
	margin-bottom: 0;
	width: 100%;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	.boundaryImg
Choices as to what is display "block" chosen so AT reads out contiguous text
as just that. So we get this:
	The cat sat on the mat.
and not this:
	The cat sat.
	On the mat.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.boundaryImg a.theImage {
	float: right;
	margin-left: 1.62em;
	max-width: 30%;
	border-bottom: none !important;
}

.boundaryImg a.theImage p {
	margin-bottom: 0;
}

.boundaryImg a.theImage img {
	max-width: 100%;
	/*a11y202110291432 NOT block or AT does not roll on to explain the link
		  opens a full sized img*/
	/*NO --> display: block;*/
}

.boundaryImg a.theImage span:not([aria-hidden]) {
	text-decoration: underline;
	padding: 0em 0.62em 0.38em 0.62em;
	display: inline-block;
	/*Add the same rules used for visually hidden here if we want to make
		  the caption text invisible to everyone. Except AT users.*/
}

/*.boundaryImg a.theImage:hover img,
.boundaryImg a.theImage:hover span:not([aria-hidden]) {
	outline: 2px solid #902a8c;
}*/

.boundaryImg a.theImage:hover span:not([aria-hidden]) {
	margin-top: -5px;
	padding-top: 5px;
}

.boundaryImg a.theImage:hover,
.boundaryImg a.theImage:focus {
	background: #902a8c !important;
	color: #fff !important;
	box-shadow: none !important;
}

.boundaryImg li {
	margin-bottom: 0.62em;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	   #rightNav
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
div#rightNav {
	outline: 0;
	box-shadow: 0 0 0;
	margin-top: 0;
	padding-top: 0;
}

div#rightNav nav {
	margin-top: 0;
}

div#rightNav ul {
	margin: 0 0 2em 0;
}

/*('div' added to boot specificity of competing rule elsewhere)*/



/*div#rightNav>ul>li {

}*/

div#rightNav nav ul li {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

#rightNav nav ul li a {
	border: 1px solid #d0d0d0;
	border-bottom: none;
	/*padding: 0.5em 0.85em;*/
	padding: 0.2em 0.85em;
	display: block;
	font-size: 1.2em;
	font-weight: 500;
	text-decoration: none;
}

#rightNav nav ul li:last-of-type a {
	border-bottom: 1px solid #d0d0d0;
}

#content-main #rightNav nav ul li a:hover,
#content-main #rightNav nav ul li a:focus {
	background: #902a8c;
	border: 1px solid #902a8c;
	border-bottom: none;
	color: white;
	box-shadow: 0 0 0;
	border-bottom: none;
}

#content-main #rightNav nav ul li:last-of-type a:hover,
#content-main #rightNav nav ul li:last-of-type a:focus {
	border-bottom: 1px solid #902a8c;
}



div#rightNav h2 {
	width: 100%;
	margin: 0;
	text-align: center;
	/*color: #1B4450;*/
	color: white;
	margin: 0;
	background: #1B4450;
	padding: 5px;
}




/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
								 Adjustments to bread ready for responsive bread
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
div.breadc {
	display: block;
}

#breadcrumbs {
	border-bottom: 1px solid #e0e0e0;
	padding-top: 0.162em;
	padding-bottom: 0.162em;
	background: #f8f8f8;
	margin-left: -0.9375em;
	margin-right: -0.9375em;
	padding-left: 0.9375em;
	padding-right: 0.9375em;
}

#breadcrumbs ul {
	margin: 0;
}

#breadcrumbs ul li:first-of-type {
	margin-left: 0;
}

#breadcrumbs li a {
	color: #000;
	display: inline-block;
	padding: 0.2em;
}

/*Loose the non-link/text-only last LI in the breadcrumb as it's a
	  duplication of H1*/
ul#breadcrumb li:last-of-type {
	display: none !important;
}

/*Undo previous style (ideally go edit it then del this)*/
ul#breadcrumb li+li:before {
	display: none;
}

/*Prepare to place the chevrons*/
ul#breadcrumb li span.progDev {
	position: relative;
	margin-right: 1em;
}

/*Place the chevrons*/
ul#breadcrumb li span.progDev::after {
	color: #a0a0a0;
	font-family: "Material Icons";
	content: "\e5cc";
	font-size: 162%;
	display: block;
	position: absolute;
	top: -0.462em;
	left: 0;
}

/*Last LI to have no chevron. The last LI has no A tag, so these two rules
	  remove the chevron from after that LI and also from after the last
	  visible LI (identifiable by the JS-added class .noShow)*/
ul#breadcrumb li:last-of-type span.progDev::after,
ul#breadcrumb li.noShow span.progDev::after {
	display: none;
}

/*Adjust the logo in the footer to stay in-view on not-wide desktop and
	  make responsive*/
#bottompage {
	background-position: 100% 0;
}

#bottompage .row {
	padding-right: 200px;
}

dl div {
	margin-bottom: 0.62em;
}

/* ------ FROM ebra.css ------ */
a {
	cursor: pointer
}

/* --- main nav--- */
div.navwrap ul li:nth-child(1).red {
	background-color: #000
}

div.navwrap ul li:nth-child(2).com {
	background-color: #000
}

div.navwrap ul li:nth-child(3).part {
	background-color: #000
}

div.navwrap ul li:nth-child(4).cont {
	background-color: #000
}

/* --- the breadcrumb ---*/
ul#breadcrumb li {
	display: inline;
	margin-left: 0.5em;
}

/* --- breadcrtumbs --- overide line 2149 of world.css */
nav#breadcrumbs.breadwrap {
	width: auto;
}

ul#breadcrumb li+li:before {
	padding: 8px;
	color: #902A8C;
	content: "/\00a0";
}



/*--- Provincial choices ---*/
div#content-main a.lnkContainer {
	float: left;
	width: 20%;
	padding: 5px;
	margin: 0 0.5em 0.5em 0;
	display: block;
	border: none;
	outline: 1px dotted #3e096e;
}

.lnkBox {
	border: 1px solid #634488;
	padding: 5px;
	margin: 0 0 1em 0;
	background: white;
}

.lnkBox h2 {
	background: #634488;
	color: white;
	padding: 8px;
	margin: 0 0 20px 0;
	text-align: center;
}
@media screen and (max-width: 660px) {
	div#content-main a.lnkContainer {
		width: 45%;
	}
}

.threeColumns{
	column-count:3;
}
@media screen and (max-width: 800px) {
		.threeColumns{
		column-count:2;
	}
}
@media screen and (max-width: 400px) {
		.threeColumns{
		column-count:1;
	}
}	


/* - - - - - - REDISTRIBUTION PAGES - - - - - - */

/** --- formula section --- **/

.formBox {
	background: #E0E0E0;
	padding: 20px 10px 0px 10px;
	border: 1px solid #AEAEAE;
	text-align: center;
	margin-bottom: 20px;
}

.formula {
	background-color: #600;
	color: white;
	padding: 10px;
	font-weight: 500;
	line-height: 2em;
	margin-bottom: 10px;
}

.borderBot {
	padding-bottom: 15px;
	border-bottom: 1px solid black;
	font-size: 1.3em;
	text-align: center;
}

.borderBotLast {
	font-size: 1.3em;
	text-align: center;
	padding-bottom: 0px;
}

/** --- tables --- **/

.redis tr.even, .redis tr.alt, .redis tr:nth-of-type(even) {
	background: #fff !important;
}

.redis {
	border-collapse: collapse;
	margin: 25px 0;
	font-size: 0.9em;
	font-family: sans-serif;
	background-color: #fff;
}

.redis thead tr {
	background-color: #009879;
	color: #ffffff;
	text-align: left;
}

.redis th, .redis td {
	padding: 12px 15px;
	border: thin solid #000;
}

.redis tbody tr {
	border-bottom: thin solid #dddddd;
}

.redis tbody tr:nth-of-type(even) {
	background-color: #f3f3f3;
}

.redis caption {
	font-size: 1.3em;
	font-weight: bold;
	margin: 10px 0;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	TABLE.simple
Assumptions
-----------
CAPTION, THEAD and TBODY are used.

Defaults
--------
Colour; by default captions and visual cue lines indicating data versus
headers, are teal.
TD alignment; by default all TD data is RH aligned.

Optional classes examples
-------------------------
ebraPurp		| <table class="simple ebraPurp">
	Colour option purple, add class ebraPurp to the TABLE.
tdCenter		| <table class="simple tdCenter">
thCenter		| <table class="simple thCenter">
tdLeft			| <table class="simple tdLeft">
	For when you want *all* your TDs to be center (or left) aligned
tHeadAbott		| <table class="simple tHeadAbott">
	Vertical align bottom in THEAD
lastTdCenter	| <table class="simple lastTdCenter">
	For when you want the *last* TDs in each TR to be centered.
lastTdCenter	| <table class="simple firstTdCenter">
	For when you want the *first* TDs in each TR to be centered.
firstTdLeft		| <table class="simple firstTdLeft">
	For when you want the *first* TDs in each TR to be left aligned.
<tr class="tAright">
	Not part of table.simple, tAright (defined elsewhere) applies text-align:
	right). Also see tAleft and tAcenter.
tFootThRight	| <table class="simple tFootThRight">
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
table.simple + table.simple {
	margin-top: 3.62em;
}

table.simple {
	width: 100%;
	border-spacing: 0;
}

table.simple th,
table.simple td {
	padding: 0.38em;
	line-height: 1.38;
}

table.simple td {
	text-align: right;
}

table.simple.tdCenter td,
table.simple.thCenter th {
	text-align: center;
}

table.simple.tdLeft td {
	text-align: left;
}

table.simple.lastTdCenter tr td:last-of-type {
	text-align: center;
}

table.simple.firstTdCenter tr td:first-of-type {
	text-align: center;
}

/* for columns with numbers */
table.simple.lastTdRight tr td:last-of-type {
	text-align: right;
}


/* for non-number columns if you're not using tdLeft */
table.simple.firstTdLeft tr td:first-of-type {
	text-align: left;
}

table.simple tbody th,
table.simple tfoot th {
	text-align: left;
}

table.simple caption {
	font-weight: bold;
	text-align: left;
	padding: 1.38em 0.62em;
	background: rgba(46, 124, 129, 1.0);
	color: #fff;
	line-height: 1.38;
}
table.simple.nocaption thead th{
	background: rgba(46, 124, 129, 1.0);
	color: #fff;
	text-align:left;
}
table.simple caption h5 {
	font-size: 105%;
}


table.simple th,
table.simple td {
	border-right: 1px solid #dcdcdc;
}

table.simple tr.even th,
table.simple tr.even td,
table.simple tr.alt th,
table.simple tr.alt td,
table.simple tr:nth-of-type(even) th,
table.simple tr:nth-of-type(even) td {
	border-right: 1px solid #fff;
}

/*a11y202302160837*/
table.simple.simpleLight tr.even th,
table.simple.simpleLight tr.even td,
table.simple.simpleLight tr.alt th,
table.simple.simpleLight tr.alt td,
table.simple.simpleLight tr:nth-of-type(even) th,
table.simple.simpleLight tr:nth-of-type(even) td {
	border-right: 1px solid #dcdcdc;
}

table.simple tr th:last-child,
table.simple tr td:last-child {
	border-right: none;
}

/*a11y202302160837*/
table.simple.simpleLight tr th:last-child,
table.simple.simpleLight tr td:last-child {
	border-right: inherit;
}

.simpleLightSpan td {
	border: 1px solid #dcdcdc !important;
}

table.simple thead tr:last-of-type th {
	border-bottom: 2px solid #7EAEB1 !important;
}

/*	table.simple tfoot tr:last-of-type th,
	table.simple tfoot tr:last-of-type td {
		border-top: 2px solid #7EAEB1 !important;
		font-weight: bold;
	} 2022-06-09-0922 Above a two TR TFOOT is not catered for, so:*/
table.simple tfoot tr:first-of-type th,
table.simple tfoot tr:first-of-type td {
	border-top: 2px solid #7EAEB1 !important;
}

table.simple tfoot th,
table.simple tfoot td {
	font-weight: bold;
}

table.simple tbody th,
table.simple tbody tr:nth-of-type(even) th {
	border-right: 2px solid #7EAEB1 !important;
}

table.simple.tHeadAbott thead {
	vertical-align: bottom;
}

table.simple .minWid20 {
	min-width: 33% !important;
}

table.simple.verySimple tbody tr{
	background:#fff;
}
table.simple.verySimple tfoot tr{
	background:#fafbfa;
}
	
table.tFootThRight tfoot th {
	text-align: right;
}

/*Purple version*/
table.simple.ebraPurp caption {
	background: #902A8C;
}

table.simple.ebraPurp thead tr:last-of-type th {
	border-bottom: 2px solid #D5AED3 !important;
}

table.simple.ebraPurp tfoot tr:last-of-type th,
table.simple.ebraPurp tfoot tr:last-of-type td {
	border-top: 2px solid #D5AED3 !important;
}

table.simple.ebraPurp tbody th,
table.simple.ebraPurp tbody tr:nth-of-type(even) th {
	border-right: 2px solid #D5AED3 !important;
}

/*Highlit | content of rows*/
table.simple tr.special {
	color: #902A8C;
}

/*Highlit | space above a row*/
table.simple tr.rowDrop>* {
	padding-top: 2.38em;
}

/*Negative/Positive cells cells (red)*/
table.simple .negative {
	background: rgba(255, 229, 229, 0.80);
}

table.simple .positive {
	background: rgba(229, 242, 229, 0.80);
}

/*Bold row border*/
table.simple .boldRow th,
table.simple .boldRow td {
	border: 2px solid #000;
}

table.simple .boldRow th,
table.simple .boldRow td {
	border-left: inherit;
	border-right: inherit;
}

table.simple .boldRow th {
	border-left: 2px solid #000;
}

table.simple .boldRow td:last-of-type {
	border-right: 2px solid #000 !important;
}

table.simple.densePs p {
	margin-bottom: 0;
	margin-top: 0.38em;
}

table.simple.shortAbuttons p.aButton {
	margin-top: -0.62em !important;
}

table.simple.shortAbuttons p.aButton a {
	padding-top: 0.1em !important;
	padding-bottom: 0.1em !important;
}

/*Some featured row types*/
	table.simple .featureRow th,
	table.simple .featureRow td {
		font-weight: bold;
	}

	table.simple .spacedRow th,
	table.simple .spacedRow td {
		padding-top: 2.38em;
	}

/*a11y202302160837*/
	table.simple .backgroundRow th,
	table.simple .backgroundRow td {
		background: rgba(46, 124, 129, 0.16);
		background: #f0f0f0;
	}





table.simple.thRow tbody th{
	font-weight: normal;
	text-align: left;
}
table.simple.thRow tbody td{
	text-align: center;
}
/*One-offs
	/com/sk/prop/othaut/*/
#table_202205031336 thead th {
	vertical-align: bottom;
}

#table_202205031336 thead th strong {
	display: block;
}

#table1-com-ab-prop-othaut tbody td,
#table1-com-ab-rprt-othaut tbody td {
	text-align: center;
}

#mb-prop-othaut-table-1 tbody th,
#mb-prop-othaut-table-1 tfoot th,
#mb-prop-othaut-table-2 tbody th,
#mb-prop-othaut-table-2 tfoot th {
	text-align: left;
}


.onP6 table tbody tr,
.onP6 table tfoot tr{ 
	background-color:#fff;
	border:1px solid #efefef;
}
.onP6 table td, .onP6 table th{	
	border-left: none !important;
	border-right: none !important;
	border-bottom:1px solid #ddd;
}
.onP6 table th:first-child{
	text-align: left;
}
.onP6 table thead{
	background-color: #DBE6E9;
}	
.onP6 table tfoot{
	empty-cells: show;
}
.onP6 table tfoot th{
	color: #006633;
}
.onP6 table tfoot tr:nth-of-type(2),
.onP6 table tfoot tr:nth-of-type(3){ 
	background-color:#eee;
}
.onP6 table tfoot tr:nth-of-type(5),
.onP6 table tfoot tr:nth-of-type(6){ 
	background-color:#fefefe;
}
.onP6 table#tbl1A tfoot tr:nth-of-type(2),
.onP6 table#tbl1A tfoot tr:nth-of-type(3){ 
	background-color:#fefefe;
}
.onP6 table#tbl1A tfoot tr:nth-of-type(5),
.onP6 table#tbl1A tfoot tr:nth-of-type(6){ 
	background-color:#eee;
}
.onP6 .lightgreyBG{
	background-color:#eee !important;
}

@media only screen and (max-width: 500px) {

	/* - - - - - - - - - - - - - - -*/
	/*todo Move to mobile file*/
	table.simple th,
	table.simple td {
		padding-left: 0.2em;
		padding-right: 0.2em;
	}
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-500px*/

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	 NAV.pageNav
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.pageNav ul {
	margin: 2.38em 0 1.62em 0;
	list-style-type: none;
	display: flex;
	justify-content: center;
}

.pageNav ul li {
	margin-right: 0.38em;
}

.pageNav ul a {
	display: block;
	padding: 0.38em 0.62em;
	background: #f0f0f0;
}





/** --- specific colours --- **/

.lightgreyBG {
	background-color: #CCCCCC;
}

.tweet {

	border: 1px solid gray;
	max-width: 300px;
	max-height: 490px;
	margin: 0 auto;

}

/* - - - - - end REDISTRIBUTION PAGES - - - - - */

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	Social Media
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
#bottompage .row {
	padding-right: 0;
}

.socialA a {
	text-decoration: none;
	display: inline-block;
	color: #fff !important;
	padding: 0.62em 1.38em;
	border-radius: 4px;
	background: #4c4c4c;
	border-bottom: none;
	box-shadow: 3px 3px 3px #bdbdbd;
	margin-top: 3.24em;
	margin-left: 1.62em;
	margin-right: 1.62em;
	text-align: center;
}

/*	#content-main a.socialbutt {
		width: inherit;
	}*/
.socialA a:hover {
	background: #2e7c81;
}

#bottompage {
	background-image: none;
	background-position: inherit;
	background-repeat: inherit;
}

.footFlex {
	display: flex;
	justify-content: space-between;
	position: relative;
}

.footFlex::after {
	content: "";
	display: block;
	width: 200px;
	height: 200px;
	background-image: url('../images/logobottom.png');
}

#content-main a.twitter {
	background: #d7d7d7 url(../images/twitterfs.png) top left no-repeat;

}

#content-main a:hover.twitter, #content-main a:focus.twitter {
	background: #bdbdbd url(../images/twitterfs.png) top left no-repeat;

}

#content-main a.facebook {
	background: #d7d7d7 url(../images/facebookf.png) top left no-repeat;

}

#content-main a:hover.facebook, #content-main a:focus.facebook {
	background: #bdbdbd url(../images/facebookf.png) top left no-repeat;

}

#content-main a.instagram {
	background: #d7d7d7 url(../images/instagram2.png) top left no-repeat;
}

#content-main a:hover.instagram, #content-main a:focus.instagram {
	background: #bdbdbd url(../images/instagram2.png) top left no-repeat;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	.members img
CSS designed for images that are 180px wide.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.members .personBio {
	float: right;
	margin-left: 1.62em;
	margin-bottom: 1.62em;
	padding: 3px;
	border: 1px solid #d0d0d0;
	background: #fafafa;
	max-width: 180px;
}

.members .personBio img {
	max-width: 100%;
	margin: auto;
	display: block;
}

.members .personBio span {
	text-align: center;
	display: block;
	padding: 0.38em 0.62em 0.2em 0.62em;
	line-height: 1.38;
}

.members .noImg {
	display: none;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																		.wrapvis
VIS button-like link
- moved warning inside link so read out if arrow key or tab navigating with AT
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.wrapvis {
	float: right;
	width: 30%;
	max-width: 180px;
	margin-left: 1.62em;
	margin-right: 70px;
}

#content-main a.vislink {
	text-align: center;
}

#content-main a.vislink span:nth-of-type(1) {
	display: block;
	box-shadow: #bfbfbf 3px 3px 3px;
	border-radius: 5px;
	background: #902A8C;
	color: white;
	padding: 1.38em;
}

#content-main a.vislink span:nth-of-type(2) {
	padding-top: 0.38em;
	display: block;
	line-height: 1.2;
}

#content-main a.vislink:hover span:nth-of-type(1) {
	background: #dcdcdc;
	color: #3a3a3a;
}

#content-main a.grayone {}

#content-main a.grayone {
	display: block;
	box-shadow: #bfbfbf 3px 3px 3px;
	border-radius: 5px;
	background: #dcdcdc;
	color: #3a3a3a;
	padding: 1.38em;
	text-align: center;
	border-bottom: none;
}

#content-main a.grayone:hover {
	background: #3a3a3a;
	color: #dcdcdc;
}

#content-main ul.grayone li {
	float: left;
	list-style-type: none;
	margin-right: 20px;
}

.vislink.autoWidth {
	display: inline-block;
	border-bottom: none !important;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																		.aButton
																		.bButton
.aButton and .bButton, generic button-like links
	p.aButton a
.bButton, same, but must have the span, so:
	p.bButton a span
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
	.aButton,
	.bButton {
		margin-bottom: 0.62em;
	}

	.aButton a,
	.bButton a {
		background: #4c4c4c;
		box-shadow: 3px 3px 3px #bdbdbd;
		border-radius: 5px;
		color: white !important; /*:'( bullying #content rule forcing this*/
		padding: 0.38em 0.62em;
		padding-bottom: 0.38em !important;
		display: inline-block;
	}

	.aButton a > span,
	.bButton a > span {
		border-bottom: 1px solid rgba(255, 255, 255, 0.38);
		padding-bottom: 0.2em;
	}

	.aButton:hover a,
	.bButton:hover a {
		background: #2e7c81 !important;
	}

	.bButton:hover a > span {
		border-bottom: 1px solid rgba(255, 255, 255, 0.62);
	}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																		.subHead
Use with this HTML
 <span class='visualHide'>&ndash;</span> <span class='subHead'>My subhead</span>
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.subHead {
	display: block;
	color: #1B4450;
	font-size: 75%;
	margin-top: -0.2em;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																		   ol a)
ol of type "a" is auto presented with a) b) c)
HTML
	<ol type="a" class="twoBracket">
Checks
	Check the format of any list inside this list (if any) to be sure you are
	happy with the numbering format that flows down.
Variations
	.dotty
		Add class .dotty to the OL for a. b. c.
	.twoBracket
		Add class .twoBracket to the OL for (a) (b) (c)
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/*Type "a"*/
ol[type="a"] {
	counter-reset: list;
}


ol[type="a"]>li {
	list-style: none;
	position: relative;
	margin-left: 0.62em;
}


ol[type="a"]>li:before {
	content: counter(list, lower-alpha) ") ";
	counter-increment: list;
	position: absolute;
	left: -1.38em;
	left: -1.48em;
}

/*ol.natural
dUH : / Rules like "ol[type="a"]" have a GLOBAL scope; wHAT a twit (I was) for
not scoping. So can't retroactively scope now, unless we find all uses and
modify HTML pages. So, instead, this is an "undo" class for when you need to
not have this stuff happen. */
	ol.natural[type="a"] {
		counter-reset: inherit;
	}

	ol.natural[type="a"]>li {
		list-style: inherit;
		position: inherit;
	}

	ol.natural[type="a"]>li:before {
		display: none;
	}

	/*	Insite a blockquote, depth is this "left" value (nasty)*/
	ol.natural.inBq[type="a"]>li:before {
		content: ")";
		display: block;
		position: absolute;
		left: 6.42em;
	}

ol[type="a"].dotty>li:before {
	content: counter(list, lower-alpha) ". ";
}

ol[type="a"].twoBracket>li:after {
	position: absolute;
	content: "(";
	left: -1.85em;
	top: 0;
}

/*Type "i"*/
ol[type="i"] {
	counter-reset: ilist;
}

ol[type="i"]>li {
	list-style: none;
	position: relative;
	margin-left: 0.62em;
	margin-left: 0.38em;
}

ol[type="i"]>li:before {
	content: counter(ilist, lower-roman) ") ";
	counter-increment: ilist;
	position: absolute;
	left: -1.38em;
}

ol[type="i"].dotty>li:before {
	content: counter(ilist, lower-roman) ". ";
}

ol[type="i"].twoBracket>li:after {
	position: absolute;
	content: "(";
	left: -1.85em;
	top: 0;
}

/* iNoAuto
		If you have an "i" type list that needs to use the HTML "start"
		attribute to start mid-way through a roman sequence, then use this
		class and the HTML like this
			<ol type="i" class="iNoAuto" start="4">
		for example, to start at iv*/
ol[type="i"].iNoAuto {
	counter-reset: inherit;
}

ol[type="i"].iNoAuto>li {
	list-style: inherit;
	position: inherit;
}

ol[type="i"].iNoAuto>li:before {
	content: inherit;
	counter-increment: inherit;
	position: inherit;
	left: inherit;
}

/* twoBracket numeric
		*/
ol.twoBracketNum {
	counter-reset: list;
}

ol.twoBracketNum>li {
	list-style: none;
	position: relative;
	margin-left: 0.62em;
}

ol.twoBracketNum>li:before {
	content: counter(list, decimal) ") ";
	counter-increment: list;
	position: absolute;
	left: -1.38em;
}

ol.twoBracketNum>li:after {
	position: absolute;
	content: "(";
	left: -1.75em;
	top: 0;
}

/*The list at the top of this page for example:
			  ebra2022/com/qc/prop/othaut/sop_e.aspx*/
span.oddListPrefix {
	position: relative;
}

span.oddListPrefix span {
	position: absolute;
	left: -1em;
}

ol.oddListPrefix>li {
	margin-left: 1.38em !important;
}






























/*2022-06-09-1133 Need to use two brackets with a non A type OL so looks
	  like it would be safe to reduce the specificity of above rule BUT just
	  in case, making a new class*/
ol.twoBracketNumeric {
	counter-reset: numericList;
}

ol.twoBracketNumeric>li {
	list-style: none;
	position: relative;
	margin-left: 0.62em;
}

ol.twoBracketNumeric>li:before {
	content: counter(numericList, decimal) ") ";
	counter-increment: numericList;
	position: absolute;
	left: -1.38em;
}

ol.twoBracketNumeric.dotty>li:before {
	content: counter(numericList, decimal) ". ";
}

ol.twoBracketNumeric>li:after {
	/*.twoBracket*/
	position: absolute;
	content: "(";
	left: -1.75em;
	top: 0;
}









/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
															   .eight.columns OL
	...and a small adjust to OLs in the main body
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.eight.columns ol li {
	margin-bottom: 0.62em;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	 .flexAcross
Assumes we will wrap items to a new row if we run out of room / on a smaller
device.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.flexAcross {
	display: flex;
	flex-wrap: wrap;
}

.flexAcrossGap {
	gap: 1.62em;
}

.flexAcross > * {
	margin-right: 0.62em;
	margin-bottom: 0.62em;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	  .corrspond
Correspondence / letter style.
Assumptions:
	- each it titled with an H2
	- any internal headings are H3 - 6
																	   .monoLang
Usage example:
	<p class="monoLang">Please note this item is only available in one
	official language.</p>
		<div class="corrspond" lang="fr">
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.corrspond {
	background: #f8f8f8;
	padding: 16px;
	border: 3px solid #f0f0f0;
	/*outline: 3px solid #e8e8e8;*/
	margin-bottom: 16px;
}

.corrspond h2 {
	/*background: #e8e8e8;*/
	color: #858585;
	margin: -16px -16px 16px -16px;
	padding: 0.62em 16px 0.38em 16px;
}

.corrspond h5 {
	margin-bottom: 0;
}

/*2023-03-22-1556*/
.corrspond h4 + ol {
	margin-top: -0.38em;
}

.corrspond blockquote,
blockquote.simple {
	border-left: 6px solid rgba(0, 0, 0, 0.062);
	border-left: none; /* :'(  */
	padding-left: 0.62em;
}

blockquote.simple {
	margin-bottom: 1.62em;
}

.corrspond blockquote + p,
blockquote.simple + p {
	margin-top: 1.38em;
}

.monoLang {
	/*background: #f8f8f8;*/
	/*padding: 0.62em 0.62em 0.38em 0.62em;*/
	/*border: 3px solid #f0f0f0;*/
	margin: 1.62em 0;
}

/*.innerLetter {}*/



































/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	  .topOfPage
																	  .backApage
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/*Both .topOfPage and .backApage*/
.topOfPage, .backApage {
	text-align: right;
}

.topOfPage a, .backApage a {
	display: inline-block;
	padding: 0.38em 0.62em;
	background: #f0f0f0;
}

/*Specific use cases*/
.corrspond .topOfPage,
.corrspond .backApage {
	margin-bottom: -0.38em;
	margin-right: -0.38em;
}

/*Just .backApage*/
.backApage a {
	padding-left: 1.62em;
	position: relative;
}

.backApage a:before {
	font-family: "Material Icons";
	content: "\e5c4";
	font-size: 138%;
	position: absolute;
	left: 0.1em;
	top: 0.1em;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																		PDF link
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.pdfLink {
	/*text-align: right;*/
}

.pdfLink a:before {
	content: "";
	display: inline-block;
	width: 10px;
	height: 13px;
	border: 1px solid #eee;
	border-top: 6px solid #DA1F24;
	outline: 1px solid #999;
	background: #e1e1e1;
	margin-right: 0.2em;

}

.notPdf a:before {
	display: none;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																		 details
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
details + h3 {
	margin-top: 1.62em;
}

details.ecDetails {
	margin: .5em 0;
}

/*Make the clickable summary react like a clickable target*/
details.ecDetails summary:hover {
	cursor: pointer;
}

/*Show border around collapsed content, and further indicate this
	is clickable*/
details.ecDetails summary span {
	text-decoration: underline;
}
details.ecDetails summary h3 {
	text-decoration: underline;
	display: inline;
	font-size: 98%;
	line-height: 1.9em;
}	
details.ecDetails[open] summary {
	margin-bottom: 0.5em;
}

/*Now the whole details is expanded and we are showing a border
	around it, *stop* showing a border around the summary. This helps
	show it is the same text area, but 'expanded'*/
details.ecDetails[open] span {
	border: none;
}

/*Follow the same in-house EC style for whan the summary has focus.*/
details.ecDetails summary:focus span,
details.ecDetails[open] summary span {
	outline: 1px dashed red;
	background: #ffffcc;
}

details.ecDetails summary {
	position: relative;
	margin-left: 0.85em;
}

details.ecDetails summary:before {
	content: "\e147";
	font-family: "Material Icons";
	font-size: 162%;
	position: absolute;
	top: -0.185em;
	left: -0.5em;
	background: #fff;
}

details.ecDetails[open] summary:before {
	content: "\e15c";
	font-family: "Material Icons";
}

/*Remove fussy large Chrome focus border*/
details.ecDetails summary {
	outline: none;
}

/*
	Slow-open to improve recognition vs. "what suddenly happened?"
	*/
details.ecDetails[open] summary~* {
	animation: sweep .38s ease-in-out;
}

@keyframes sweep {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

details.ecDetails[open].defined {
	border: 1px solid #eee;
	background: #f8f8f8;
	padding: 1.38em;
	padding-bottom: 0.62em;
}

details.ecDetails[open].defined summary:before {
	background: #f8f8f8;
}

details.ecDetails[open].defined summary {
	margin-top: -23px;
	margin-left: -9.5px;
}

p+details.ecDetails.defined {
	margin-top: -1em;
	margin-bottom: 2.62em;
}





/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	   Proposals
																		  .props
																		.pIndent
Odd items of CSS for Proposals

WARNING:
- KILLS AUTOMATIC LIST STYLE in order that so manually written bullet
numbering / lettering that is present is not duplicated.
- DO NOT USE THIS CLASS with an OL where you *want* the OL to produce its own
numbers/letters.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/*
	<div id="leftPart" class="eight columns">
	.props on the container on these pages allows:
		- LIs to have increased space between
		- the ULs (etc) there to have a little more positional emphasis
	*/
.props ul,
.props ol,
ul.props,
ol.props {
	list-style: none;
	margin-left: 0;
}

.props.indent {
	margin-left: 1.62em;
}

.props li {
	margin-bottom: 0.62em;
}

.props ul>li>ul {
	margin-top: 0.38em;
	margin-left: 2.62em;
}

.props li>ol {
	/*margin-top: 1.38em;*/
}

/*
	li > p
	   > p .pIndent
	When an li has some copy, then some more copy but it's indented but it's
	not a new li, such as bc/prop/59007/
    */
.pIndent {
	margin-left: 1.62em;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
											  .eight.columns other OL UL adjusts
Added 2022-05-04-0829
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.eight.columns li>ol {
	margin-top: 0.85em;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																 .visuallyHidden
																	  class

Hide only visually, but have it available for screen readers:
https://snook.ca/archives/html_and_css/hiding-content-for-accessibility

1. For long content, line feeds are not interpreted as spaces and small width
causes content to wrap 1 word per line:
https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe

Extends the .visuallyHidden class to allow the element
to be focusable when navigated to via the keyboard:
https://www.drupal.org/node/897638
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.visuallyHidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	white-space: nowrap;
	/* 1 */
}

.visuallyHidden.focusable:active,
.visuallyHidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
	white-space: inherit;
	color: white;
	background-color: #2E7C81;
	padding: 0.38em;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	   Utilities
(moved from beyond-nav 2022-01-27)
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/**
	 * For modern browsers
	 * 1. The space content is one way to avoid an Opera bug when the
	 *    contenteditable attribute is included anywhere else in the document.
	 *    Otherwise it causes space to appear at the top and bottom of elements
	 *    that are clearfixed.
	 * 2. The use of `table` rather than `block` is only necessary if using
	 *    `:before` to contain the top-margins of child elements.
	 */
.wt_cf:before,
.wt_cf:after {
	content: " ";
	/* 1 */
	display: table;
	/* 2 */
}

.wt_cf:after {
	clear: both;
}

/**
	 * For IE 6/7 only
	 * Include this rule to trigger hasLayout and contain floats.
	 */
.wt_cf {
	*zoom: 1;
}

.clearBefore::after {
	content: "";
	display: table;
	clear: both;
}

.densePs p {
	margin-bottom: 0;
}

.densePs p:last-of-type {
	margin-bottom: 1.25em;
}

.notListy {
	list-style: none;
	margin-left: 0;
}

.spacedLi li {
	margin-top: 1.38em;
}

.spacedLi li:first-of-type {
	margin-top: 0;
}

/*Generic aligners*/
.tAright {
	text-align: right;
}

.tAcenter {
	text-align: center;
}

.tAleft {
	text-align: left;
}

/*Lists no bullets*/
ul.noBullets {
	list-style-type: none;
}

/*a11y202302080857*/
	.eight.columns > ul.noBullets {
		margin-left: 0;
	}

/*.spanLikeTbl*/
.spanLikeTbl span {
	display: inline-block;
}

.spanLikeTbl li span:nth-of-type(1) {
	width: 20%;
}

.spanLikeTbl li span:nth-of-type(2) {
	width: 55%;
}

.spanLikeTbl li span:nth-of-type(3) {
	width: 20%;
}

.spanLikeTbl li {
	border-bottom: 1px solid #d8d8d8;
}

@media only screen and (max-width: 1100px) {

	/* - - - - - - - - - - - - - - -*/
	.spanLikeTbl span {
		display: block;
	}


}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-500px*/

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																 Occasional imgs
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
main img {
	max-width: 100%;
}

main .imgMargTop img {
	margin-top: 2.38em;
	margin-bottom: 2.38em;
}

main .imgOutline img {
	outline: 1px solid #cacaca;
}

main h3+img {
	margin-bottom: 1.62em;
}

img + .altNeeded + details,
img + details {
	margin-top: 1.62em;
}

/*9EEADi^^DE24<@G6C7=@H]4@>^2^aa`gbcfd*/
main .corrspond img:not([class]) + p {
	margin-top: 1.62em;
}

.comment {
	text-align: right;
}

.comment span,
span.comment {
	background: rgba(255, 255, 0, 0.2);
	border: 1px solid darkorange;
	color: rgba(113, 62, 0, 1.0);
	padding: 0.2em;
}

.commentBlock {
	background: rgba(255, 255, 0, 0.2);
	border: 1px solid rgba(255, 140, 0, 0.38);
	color: rgba(113, 62, 0, 1.0);
	padding: 0.2em;
	padding-bottom: 0;
	margin-bottom: 1.62em;
	transform: rotate(0.38deg);
}

.commentBlockIntro {
	text-align: right;
	background: rgba(255, 255, 0, 0.2);
	border-bottom: 1px solid rgba(255, 140, 0, 0.38);
	margin: -0.2em;
	margin-bottom: 0.62em;
	color: rgba(113, 62, 0, 1.0);
	padding: 0.2em;
}

.commentBlockIntro span {
	font-size: 85%;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																		href #??
Show diagnostic message based on particular invalid HREF value.

What?
- - -
#99 is invalid since an ID must start with a letter, so #99 is a great HREF
 value since its invalidness stops a temp link click resulting in a jump to
 top. But moving on from this basic benefit, we can target differen numbers
 with different messages, so here we go:

	Style these messages as:
	i = info
	w = warning

	i	#99	-	Link not set
	i	#98	-	Content not yet provided by client
	w	#97	-	Link goes to a demo URL - replace this before go live
HTML
	<a href="#95" class="noLink"></a>
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* 'i' info All (yellow comments style)*/
a[href="#99"]:after, a[href="#98"]:after, a[href="#97"]:after, a[href="#96"]:after,
a[href="#95"]:after, a[href="#94"]:after {
	background: rgb(255, 255, 229);
	line-height: 1;
	border: 1px solid rgba(247, 209, 0, 0.62);
	border-radius: 0.2em;
	color: rgba(113, 62, 0, 1.0);
	padding: 0.2em 0.2em;
	font-size: 11px;
	font-weight: normal;
	content: "toBeSet";
	display: inline-block;
	margin-left: 0.2em;
/*	background: rgba(255, 255, 0, 0.2);
	border: 1px solid rgba(247, 209, 0, 1.0);
	outline: 1px solid rgba(247, 209, 0, 1.0);
	color: rgba(113, 62, 0, 1.0);
	padding: 0.2em;
	font-size: 14px;
	font-weight: normal;
	content: "";
	display: inline-block;
	margin-left: 0.2em;
	transform: rotate(1.62deg);*/
}

/* 'w' warning (red warning style)*/
a[href="#98"]:after, a[href="#96"]:after {
	background: rgba(255, 0, 0, 0.062);
	border: 1px solid red;
	outline: 1px solid red;
	color: rgba(208, 24, 132, 1.0);
}

a[href="#99"]:after {
	content: "Link not set";
}

a[href="#98"]:after {
	content: "Content not yet provided by client";
}

a[href="#97"]:after {
	content: "(+remove link)";
}

a[href="#96"]:after {
	content: "Do not re-publish this changed page until, end May?";
}

a[href="#95"]:after {
	content: "French text required";
}

a[href="#94"]:after {
	content: "This text approved?";
}

a.noLink {
	border-bottom: none !important;
	text-decoration: none !important;
}

a.topRight {
	position: absolute;
	top: 0.38em;
	right: 0.38em;
}

a[href="#94"] {
	position: relative;
}

a[href="#94"]:after {
	position: absolute;
	width: 12em;
}



/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																		 .msgAll
																		   .msgN
Assorted messages
- .msgAll so we can loose all in one go
- all are :after so we don't affect content
HTML
<span class='msg1 msgAll'>Portion of page where msg is to be shown</span>
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.msgAll {
	/*display: none;*/
}

.msgAll:after,
.alerter /*not great CSS ("content" when no pseudo - but this is a diag class soo) */ {
	background: rgb(255, 255, 229);
	line-height: 1;
	border: 1px solid rgba(247, 209, 0, 0.62);
/*	outline: 1px solid rgba(247, 209, 0, 1.0);*/
	border-radius: 0.2em;
	color: rgba(113, 62, 0, 1.0);
	padding: 0.2em 0.2em;
	font-size: 11px;
	font-weight: normal;
	content: "toBeSet";
	display: inline-block;
	margin-left: 0.2em;
}

.alerter {
	font-size: 14px;
}

.alerter.wrapped {
	line-height: 1.62;
}

.msgAllBefore:before {
	background: rgb(255, 255, 229);
	border: 1px solid rgba(247, 209, 0, 1.0);
	outline: 1px solid rgba(247, 209, 0, 1.0);
	color: rgba(113, 62, 0, 1.0);
	padding: 0.2em;
	font-size: 11px;
	font-weight: normal;
	content: "toBeSet";
	display: inline-block;
	margin-left: 0.2em;
	transform: rotate(1.62deg);
}

.msg1:after {
	content: "Del subhead?";
}

.msg2:after {
	content: "Respect Caption bg colour from source or keep all the same?";
}

.msg3:after {
	content: "Does this list show the correct French place names/spelling?";
}

.msg4:after {
	content: "Should THIS be the title of the page?";
}

.msg5:after {
	content: "cARRY oN fROM hERE";
}

.msg6:after {
	content: "Map titles unapproved";
}

.msg7:after {
	content: "Does this PDF include all corrections?";
}

.msg8:after {
	content: "FR not yet coded";
}

.msg9:after {
	content: "NNNs to be replaced in all these (Population: NNN) (Map NNN)";
}

.msg10:after {
	content: "Do NOT FTP, FR page waiting on content (AB)";
}

.msg11:after {
	content: "ALT is missing";
}

.msg12:after {
	content: "Should this copy be deleted?";
}

.msg13:after {
	content: "See map for comment";
}

.msg10before:before {
	content: "Do NOT FTP, FR page waiting on content (AB)";
}

.msg11before:before {
	content: "Replace this table with XML fed FN";
}

.msg12before:before {
	content: "XML being changed to reflect source doc...";
}

.msg13before:before {
	content: "ALT is missing";
}

.msg14before:before {
	content: "Brackets to finish";
}

.msg15before:before {
	content: "The content of 'Text version' below MUST be edited";
}












/* Styles for commissions home pages */

#content-main a.mypromo {
	width: 120px;
	padding: 10px;
	display: inline-block;
	background: #1B4450;
	color: white;
	box-shadow: 3px 3px 3px #d8d8d8;
	border-radius: 5px;
	text-align: center;
	line-height: 1.1em;
	margin-right: 20px;
	margin-bottom: 10px;
}

#content-main a.mypromo:hover {
	background: #2C7C82;
}

h2.comnewtitle {
	margin-bottom: 0;
	margin-top: 20px;
	font-size: 1.4em;
}

.comnew {
	/*display: flex;
	align-items: center;*/
	border: 1px solid #f1f1f1;
	background: #f1f1f1;
	padding: 15px 15px 0px 15px;
	clear: both;
}

.comnew+h2 {
	margin-top: 1.62em;
}

.anchorNav {
	margin-bottom: 2.38em;
}

.alignRight {
	text-align: right;
}

.floatLeft {
	float: left;
}

div#rightNav a.smalllink {
	font-size: 0.9em;
	border-bottom: 1px solid black;
	text-align: center;
}

.note {
	border: 1px solid #dedede;
	background: #f9f9f9;
	margin-bottom: 20px;
}
.noteWhite {
	border: 1px solid #dedede;
	background: #fff;
	margin-bottom: 1em;
	padding:1em;
}

.note h2 {
	background: #dedede;
	/*color: white;*/
	padding: 10px;
	margin: 0;
}

.note p {
	margin: 10px;
}

.note ul {
	margin-left: 1.62em;
}

#content-main a.phearing {
	float: right;
	display: block;
	max-width: 170px;
	color: white;
	font-size: 1.1em;
	line-height: 1.1em;
	font-weight: 500;
	padding: 20px 10px 20px 60px;
	border-radius: 6px;
	/*background: #902A8C url(../images/phearing.png) top left no-repeat;*/
	background: #1B4450 url(../images/phearing.png) top left no-repeat;
	border-bottom: none;
	text-decoration: none;
	text-align: center;
	box-shadow: 3px 3px 3px #a7a7a7;
	margin: 0 30px 15px 15px;
}

#content-main a.phearing:hover {
	background: #4e4e4e url(../images/phearing.png) top left no-repeat;
}

img.myborder {
	border: 2px solid #a8a8a8;
	width: auto;
	box-shadow: 5px 5px 5px #d9d9d9;
	margin-bottom: 20px;
	/*display: block;*/
}

ul.toc {
	list-style-type: none;
	margin-bottom: 2em;
}

ul.toc li>ul li {
	margin: 20px 0;
}

.clearall {
	clear: both;
}

h3.mybord {
	border-left: 10px solid #2C7C82;
	padding-left: 13px;
}


.faq h2 {
	font-size: 1.2em;
	/*border-left: 10px solid #2C7C82;
	padding-left: 13px;*/
	margin-top: 40px;
	/*color: #2C7C82;*/
	padding: 15px 10px;
	background: #f2f2f2;
	border: 1px solid #d2d2d2;
}

.faq p {
	margin-left: 40px;
}

/*Readability tweak for lists like com/nb/prop/othaut/reru2_e.aspx*/
#leftPart.eight.columns li>ul {
	margin-top: 0.85em;
}


.freaky {
	background: lightgreen;
	display: inline-block;
	border: 1px solid lightgreen;
}

.docList li>ul {
	margin-bottom: 0.38em;
	margin-top: 0.2em !important;
}

.fn-lnk {
	padding: 0 0.38em;
	margin-left: 0.2em;
	border: 1px solid #999;
	white-space: nowrap;
	background: #fff;
}

.noteam {
	background: #ffffcc;
	border: 1px solid #7a7a7a;
	padding: 5px;
	font-style: italic;
}

blockquote {
	margin: 0 30px;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																		 .dlFlex
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
	.dlFlex dt {
		line-height: 1.62;
		font-weight: bold;
	}

	.dlFlex dd {
		margin: 0;
		line-height: 1.62;
	}

	.dlFlex div {
		display: flex;
	}

	.dlFlex div:nth-of-type(odd) {
		background: #f8f8f8;
	}

	.dlFlex div:nth-of-type(even) {
		background: #fff;
	}

	/*.dlFlex div > * { width: 48%; }*/

	.dlFlex div dt {
		margin-right: 2%;
		width: 30%;
	}

	.dlFlex div dd {
		width: 68%;
	}

	@media only screen and (max-width: 1000px){/* - - - - - - - - - - - - - - -*/
		.dlFlex div {
			display: inherit;
		}
		.dlFlex div dt,
		.dlFlex div dt {
			width: 100%;
		}
		.dlFlex div dt {
			margin-right: 0;
			border-top: 1px solid rgba(0, 0, 0, 0.1);
			padding-top: 0.2em;
		}
		.dlFlex div dd {
			margin-left: 0;
		}
		.dlFlex div:nth-of-type(even) {
			background: inherit;
		}

		#content-main p.viewer {
			float:none;
			margin-right:0em;
		}
	}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-1000px*/

.altNeeded::after {
	content: "ALT is missing";
	background: yellow;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	  .signature
																		  .sigXx
Example HTML
	<div class="signature sigXx">
		<p>The Honourable Justice...</p>
		<p>Chair, Federal Electoral Boundaries...</p>
	</div>

	<div class="signature sigXx">
		<p>Elvis Presley</p>
		<p>Member, Federal Electoral...</p>
	</div>

	<div class="signature sigXx">
		<p>Misty Chain</p>
		<p>Member, Federal Electoral...</p>
	</div>

Add a new Xx class for each prov' e.g NS uses <div class="signature sigNs">
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
	/*	Generic rules*/
		.signature {
			margin-bottom: 1.62em;
		}

		.signature p {
			margin-bottom: 0;
		}

		.signature p:nth-of-type(2) {
			font-style: italic;
			max-width: 475px;
		}

		.signature::before {
			content: "";
			display: block;
			width: 100%;
			max-width: 475px;
			min-height: 4em;
			border-bottom: 1px solid;
		}

	/*Ea province additions*/
		/*NS*/
			.signature.sigNs:nth-last-of-type(3)::before { background: url('../com/ns/rprt/imgs/image005.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigNs:nth-last-of-type(2)::before { background: url('../com/ns/rprt/imgs/image003.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigNs:nth-last-of-type(1)::before { background: url('../com/ns/rprt/imgs/image007.png') no-repeat 0 0; background-size: auto 100%; }

		/* PEI */
			.signature.sigPei::before { background: url('../com/pei/rprt/imgs/sig1.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigPei:nth-of-type(2)::before { background: url('../com/pei/rprt/imgs/sig2.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigPei:nth-of-type(3)::before { background: url('../com/pei/rprt/imgs/sig3.png') no-repeat 0 0; background-size: auto 100%; }

		/* NB */
			.signature.sigNb::before { background: url('../com/nb/rprt/imgs/sig2.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigNb:nth-of-type(2)::before { background: url('../com/nb/rprt/imgs/sig1.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigNb:nth-of-type(3)::before { background: url('../com/nb/rprt/imgs/sig3.png') no-repeat 0 0; background-size: auto 100%; }

		/* MB */
			.signature.sigMb::before { background: url('../com/mb/rprt/imgs/sig1.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigMb:nth-of-type(2)::before { background: url('../com/mb/rprt/imgs/sig2.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigMb:nth-of-type(3)::before { background: url('../com/mb/rprt/imgs/sig3.png') no-repeat 0 0; background-size: auto 100%; }

		/* NL */
			.signature.sigNl::before { background: url('../com/nl/rprt/imgs/sig1.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigNl:nth-of-type(2)::before { background: url('../com/nl/rprt/imgs/sig2.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigNl:nth-of-type(3)::before { background: url('../com/nl/rprt/imgs/sig3.png') no-repeat 0 0; background-size: auto 100%; }

		/* SK */
			.signature.sigSk::before { background: url('../com/sk/rprt/imgs/sig2.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigSk:nth-of-type(2)::before { background: url('../com/sk/rprt/imgs/sig1.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigSk:nth-of-type(3)::before { background: url('../com/sk/rprt/imgs/sig3.png') no-repeat 0 0; background-size: auto 100%; }

		/* AB */
			.signature.sigAb::before { background: url('../com/ab/rprt/imgs/bm2.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigAb:nth-of-type(2)::before { background: url('../com/ab/rprt/imgs/db.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigAb:nth-of-type(3)::before { background: url('../com/ab/rprt/imgs/drw.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigAb:nth-of-type(4)::before { background: url('../com/ab/rprt/imgs/os.png') no-repeat 0 0; background-size: auto 100%; }

		/* QC */
			.signature.sigQc::before { background: url('../com/qc/rprt/imgs/jc.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigQc:nth-of-type(2)::before { background: url('../com/qc/rprt/imgs/ab.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigQc:nth-of-type(3)::before { background: url('../com/qc/rprt/imgs/lm.png') no-repeat 0 0; background-size: auto 100%; }

		/* BC */
			.signature.sigBc:nth-of-type(1)::before { background: url('../com/bc/rprt/imgs/ms.png') no-repeat 0 0; background-size: auto 100%; 
				min-height: 8em;
				position: relative;
				top: 30px;
				border-bottom: 0px;		
				}
			.signature.sigBc:nth-of-type(2)::before { background: url('../com/bc/rprt/imgs/kc.png') no-repeat 0 0; background-size: auto 100%; border-bottom: 0px;	}
			.signature.sigBc:nth-of-type(3)::before { background: url('../com/bc/rprt/imgs/sl.png') no-repeat 0 0; background-size: auto 100%; border-bottom: 0px;	}
			.signature.sigBc>p{border-top:1px solid #000;}
			
		/* ON */
			.signature.sigOn::before { background: url('../com/on/rprt/imgs/sig1.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigOn:nth-of-type(2)::before { background: url('../com/on/rprt/imgs/sig2.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigOn:nth-of-type(3)::before { background: url('../com/on/rprt/imgs/sig3.png') no-repeat 0 0; background-size: auto 100%; }	

		/*XX
		Duplicate this example and uncomment your duplicate, then edit it:
		- replace Xx in three spots
		- replace yourImg-A.png, yourImg-B.png and yourImg-C.png with your filenames*/
			/*
			.signature.sigXx::before { background: url('../com/xx/rprt/imgs/yourImg-A.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigXx:nth-of-type(2)::before { background: url('../com/xx/rprt/imgs/yourImg-B.png') no-repeat 0 0; background-size: auto 100%; }
			.signature.sigXx:nth-of-type(3)::before { background: url('../com/xx/rprt/imgs/yourImg-C.png') no-repeat 0 0; background-size: auto 100%; }
			*/

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																.invisibleOnProd
Also see '__never_upload_this_file_to_prod.css'

IMPORTANT
Do NOT comment out these rules.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
	.invisibleOnProd {
		display: none;
	}





/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	   .boldDash
A stylized UL for bold text precded by a visual dash, also, use span blocky as
needed:
	<ul class="boldDash">
		<li>aaa</li>
		<li>bbb <span class="blocky">(ccc)
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
	.boldDash {
		list-style-type: none;
		padding-left: 0;
		margin-left: 0;
		font-size: 116%;
	}

	.boldDash > li {
		margin-bottom: -1em;
	}

	.boldDash .blocky {
		margin-top: -0.5em;
		margin-bottom: 0.62em;
	}

	.boldDash > li:first-of-type {
		margin-top: -1em;
	}

	.boldDash > li:last-of-type {
		margin-bottom: inherit;
	}

	.boldDash > li::before {
/*		a11y
		https://developer.mozilla.org/en-US/docs/Web/CSS/list-style#accessibility_concerns*/
		content: "-";

		font-size: 185%;
		margin-right: 0.62em;
	}

	.boldDash > li span.blocky {
		margin-left: 1.62em;
	}

	.boldDash > li > ul {
		list-style-type: none;
		margin-top: -0.38em !important;
		margin-left: 2.0em;
		font-size: 90%;
	}

	.boldDash > li > ul > li::before {
		/*ally\
		https://developer.mozilla.org/en-US/docs/Web/CSS/list-style#accessibility_concerns */
		content: "\200B";
	}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																		  .flash
To get a flash of fading yellow bachground upon focus, give the element
the flash class, e.g:
	<summary><h3 class="flash" id="cama-final">Modified maps</h3></summary>

Why? Sometimes it's helpful to briefly spotlight a portion of the page. This
is an easy way to help people notice where their focus needs to be. For
example you link to an ID of an item inside a DETAILS tag. When the user
clicks, the flash-fade suggests to them that the DETAILS tag is where their
item is to be found.

More: 9EEADi^^D?@@<]42^2C49:G6D^9E>=02?504DD^J6==@H\7256\E649?:BF6\4DD\2?:>2E:@?D
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
	*.flash:target {
		-webkit-animation: target-fade 3s 1;
		-moz-animation: target-fade 3s 1;
	}
	@-webkit-keyframes target-fade {
		0% { background-color: yellow; }
		100% { background-color: rgba(0,0,0,0); }

		0% { color: #000; }
		100% { color: inherit;}

	}
	@-moz-keyframes target-fade {
		0% { background-color: yellow; }
		100% { background-color: rgba(0,0,0,0); }

		0% { color: #000; }
		100% { color: inherit;}
	}
	/*Small adjust to not flash the whole page on scroll to top*/
	html:target {
		-webkit-animation: none;
		-moz-animation: none;
	}