*, *::after, *::before { box-sizing: border-box }

* {
  font-kerning: auto;
	text-rendering: optimizeLegibility;
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important; 
	-webkit-focus-ring-color: rgba(255, 255, 255, 0) !important }

html { 
	overflow-y: scroll;
  text-size-adjust: 100% }

body {
  background: #fff;
  color: #002b54;
	font-family: "Roboto Slab", BlinkMacSystemFont, -apple-system, Helvetica, Arial, serif;
	font-size: 16px;
	line-height: 1.5em;
	margin: 0;
	padding: 0 }

a {	
	border: none;
	font-weight: 400;
	text-decoration: none }

figure { margin: 0 }

::selection, ::-moz-selection {
	background: #ccff00;
  color: #333 }

/* --- Frequent Shortcuts --- */

.aic { align-items: center }
.db { display: block }
.dib { display: inline-block }
.fldr { flex-direction: row }
.flex { display: flex }
.flwr { flex-wrap: wrap }
.m0a { margin: 0 auto }
.mb0 { margin-bottom: 0 }
.mb15 { margin-bottom: 15px }
.mb30 { margin-bottom: 30px }
.mb45 { margin-bottom: 45px }
.mt0 { margin-top: 0 }
.mt10 {	margin-top: 10px }
.mt15 {	margin-top: 15px }
.mt30 {	margin-top: 30px }
.mt45 {	margin-top: 45px }
.mt60 {	margin-top: 60px }
.ovh { overflow: hidden }
.txtc { text-align: center }
.txtr { text-align: right }
.txtu { text-transform: uppercase }
.vab { vertical-align: bottom }
.vam { vertical-align: middle }
.w100 { width: 100% }

/* --- Structure & Header --- */

.container, .crumbs, .footcontent, .releases, .standard { max-width: 1140px; }
.single { max-width: 845px; }

.breadcrumbs {
  background: #1a6eab;
  border-bottom: 3px solid #145888;
	color: #fff; }

.breadcrumbs a {
	border-bottom: 1px solid #60a2d1;
  color: #fff; }

.breadcrumbs a:hover, .breadcrumbs a:focus { color: #8ebdde; }

.breadcrumbs a.current { border: 0; }

.colourbar {
  background: #002b54;
  height: 15px; }

.crumbs ul {
	list-style: none;
	margin: 0;
  padding: 8px 0 10px 15px; }

.crumbs ul > li + li::before {
	color: #4a95cb;
  content: "/\00a0";
	padding-right: 3px;	}

.crumbs li {
	display: inline-block;
  padding-right: 8px; }

.logo {
  margin: 15px auto;
  width: 215px; }

.logo figure {
  background: url(/supports/st-albert-logo.svg);
  background-repeat: no-repeat !important;
  background-size: contain !important;
	height: 88px;
	padding: 0;
  width: 215px; }

.padder { padding: 45px 0 60px; }

.skip {
	height: 1px;
  left: -1000px;
  position: absolute;
	top: -1000px;
	width: 1px; }

.skip:active, .skip:focus, .skip:hover {
	background: #3B8635;
	border-radius: 0 0 6px;
  color: #fff;
  font-weight: 700;
  height: auto;
  left: 0;
  padding: 10px 25px 10px 15px;
	top: 0;	
	width: auto; }

.stage {
	background: url(/supports/blue_fragments_footer_small.svg) left bottom no-repeat #fff;
  padding: 45px 0 120px; }

@media (min-width: 600px){
	.stage {
		background: url(/supports/blue_fragments_footer.svg) center bottom no-repeat #fff;
		padding: 45px 0 160px; }
}

/* --- Typography --- */

@font-face {
  font-family: "franklin-gothic-urw";
  font-display: swap;
  font-style: normal;
  font-weight: 400;
  src: url("https://use.typekit.net/af/9cb78a/0000000000000000000118ad/27/l?primer=51e46510a8bcdb92fa139186fdd3d43fc0ac4348ee92477ba51cd46504e98815&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/9cb78a/0000000000000000000118ad/27/d?primer=51e46510a8bcdb92fa139186fdd3d43fc0ac4348ee92477ba51cd46504e98815&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/9cb78a/0000000000000000000118ad/27/a?primer=51e46510a8bcdb92fa139186fdd3d43fc0ac4348ee92477ba51cd46504e98815&fvd=n4&v=3") format("opentype"); }

@font-face {
  font-family: "franklin-gothic-urw";
  font-display: swap;
  font-style: normal;
  font-weight: 700;
  src: url("https://use.typekit.net/af/b825af/0000000000000000000118b1/27/l?primer=51e46510a8bcdb92fa139186fdd3d43fc0ac4348ee92477ba51cd46504e98815&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/b825af/0000000000000000000118b1/27/d?primer=51e46510a8bcdb92fa139186fdd3d43fc0ac4348ee92477ba51cd46504e98815&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/b825af/0000000000000000000118b1/27/a?primer=51e46510a8bcdb92fa139186fdd3d43fc0ac4348ee92477ba51cd46504e98815&fvd=n7&v=3") format("opentype"); }

@font-face {
  font-family: 'Roboto Oblique';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/robotoslab/v13/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjo0oSmb2Rj.woff2) format('woff2'); }

h1, h2, h3, h4, .sserif { font-family: "franklin-gothic-urw", "Franklin Gothic Medium", Helvetica, Arial; }
	
h1, h2, h3, h4 { font-weight: 700; }

h1 { font-size: 2.056em; }

h2 { font-size: 1.611em; }

h3 { font-size: 1.278em; }

h4 {
	font-size: 1em;
	text-transform: uppercase; }

h5 { 
	font-style: normal;
	font-weight: 400; }

em { font-style: italic; }

strong {
	font-style: normal;
	font-weight: 700; }

small {
  color: #666;
  font-size: 0.875em; }

@media (min-width: 600px) {
	h1 { font-size: 2.25em; }
	
	h2 { 
		font-size: 1.625em;
		line-height: 1.166em; }
}

/* --- Page Content --- */

article { 
  font-size: 18px;
  padding: 0 15px; }

article h1 {
  border-bottom: 1px solid #ddd;
	line-height: 1em;
	margin: 0 auto 45px;
	max-width: 100%;
	padding-bottom: 45px; }

hr {
  border: none;
  border-bottom: 1px solid #eee; }

.notice {
  background: #c6007e;
  border-radius: 50%;
  color: #fff;
  display: inline-block;
  font-weight: 700;
  height: 32px;
  margin-right: 5px;
  text-align: center;
  width: 32px; }

.pinch { padding: 0 15px; }

.reading { 
	max-width: 755px;
	padding: 0 15px; }

.reading a {color: #3B8635; }

.reading a:focus, .reading a:hover {
	border-bottom: 1px solid #2f6b2a;
	color: #3B8635; }

.reading p, .reading li {
	font-weight: 300;
  line-height: 1.777em; }

.reading li {
	font-size: 1em;
	padding: 0 5px 15px 0; }

.reading li ul, .reading li ol { margin-top: 15px; }

.reading ul, .reading ol { padding-left: 30px; }

.return {
  margin-top: 30px;
  padding: 5px 30px 0 0;
  text-align: right;
  width: 100%; }

.return span {
  border-top: 1px dashed #ddd;
  padding: 15px 15px 0; }

/* --- Footer --- */

footer {
  background: #002b54;
  background: linear-gradient(45deg, #002b54, #00152a);
  color: #fff; 
	font-size: 0.875em; }

footer a { color: #c1d72f; }

footer a:hover, footer a:focus { border-bottom: 1px solid #c1d72f; }

footer figure a {	border-bottom: 3px solid #002b54; }

footer figure a:hover, footer figure a:focus { border-bottom: 3px solid #c1d72f; }

footer h5 {
	color: #fff;
  font-size: 1.1538em; }

.acknowledge, .disclosures { border-top: 1px solid #194065; }

.acknowledge {
	background: rgba(255,255,255,0.05);
	margin-top: 15px;
	padding: 30px 15px; }

.acknowledge a { display: inline-block; }

.acknowledge h5 {
	font-size: 1em;
	font-weight: 700; }

.disclosures { padding: 15px; }

.disclosures p a {
	display: inline-block;
	margin: 10px; }

.disclosures p, .footset { max-width: 290px; }

.ff-facebook a { background-position: 0 -20px; }
.ff-instagram a { background-position: -80px -20px; }
.ff-twitter a { background-position: -40px -20px; }
.ff-youtube a { background-position: -120px -20px; }
.ff-flickr a { background-position: -160px -20px; margin-right: 0; }

.footcard {
	flex-grow: 1;
	margin: 0 15px 15px;
  width: 100%; }

.footfollow {
	list-style: none;
	margin: 15px 0;
	max-width: 300px;
	padding: 10px 0; }

.footfollow li {
  display: inline-block;
	margin: 0 4px; }

.footfollow li a {
	background-image: url(/supports/footer_sprites.png);
  border: 0;
  display: block;
  height: 37px;
  width: 37px; }
  
.footfollow li a:hover span, .footfollow li a:focus span {
  background: rgba(0,43,84,0.5);
  display: block;
  height: 37px; }

.footlogo {
	padding: 25px 0 0;
  width: 100px; }

.footlogo a:hover, .footlogo a:focus { border: 0; }

.footlogo span {
	background: url(/supports/footer_sprites.png) 0 0;
  height: 16px;
  width: 100px; }

.footlogo span:hover, .footlogo a:focus { opacity: 0.5; }

.footset {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap; }

@media (max-width:600px) {
	footer h5 {
		font-weight: 700;
		margin: 15px 0;
		text-align: center; }
	
	.acknowledge div { max-width: 290px; }
	
	.copyright { font-size: 0.857em;	}
	
	.footcard {	margin-bottom: 0;	}
	
	.footcard p a {
		display: inline-block;
		padding: 5px 0;	}
	
	.footcard.last { text-align: left !important; }
}

@media (min-width:600px) {
	.acknowledge h5, .acknowledge p {	display: inline; }
	
	.acknowledge h5:after {	content: ' ~ ';	}
	
	.acknowledge div, .disclosures p, .footset { max-width: 580px; }
	
	.footcard { 
		margin: 0 5px 15px 10px;
    width: 46%; }
}

@media screen and (min-width: 840px){
	.acknowledge div, .disclosures p, .footcontent, .footset { max-width: 740px; }
	
	.acknowledge a { display: inline; }
}

@media (min-width:1160px) {
	footer { font-size: 0.8125em; }
	
	.acknowledge div, .disclosures p, .footcontent, .footset { max-width: 1280px; }
	
	.disclosures p a { display: inline; }
	
	.footcard { 
		margin: 0 15px 15px;
    width: 22%; }
}

/* --- Results --- */

.leader, .leaders {
  font-weight: 700 !important;
  line-height: 1em !important;
  margin: 0; }

.leader { font-size: 2em; }
.leaders { font-size: 1.5em; }

.leading {
  background: rgba(0,0,0,0.2);
  border-radius: 6px 6px 0 0;
  text-align: center; }

.notation {
  border-top: 1px dashed #ddd;
  margin: 0;
  padding: 10px 0; }

.outcome {  background: #f2f2f2; }
.outcome hr { border-color: #ccc; }

.question {
  background: #5d1fb4;
  box-shadow: 0 8px 6px -5px #aaa;
  color: #fff; }

.question p { font-size: 0.875em; }

.questiondeck {
  display: flex;
	flex-wrap: wrap;
  margin-bottom: 2em;
	width: 100%; }

.rank {
  border-bottom: 1px dotted rgba(0,0,0,.5);
  font-weight: 700 !important;
  margin: 0 auto 1em;
  padding-bottom: 0.5em;
  width: 120px; }

.shortcuts {
  display: flex;
	flex-wrap: wrap; }

.shortcuts .slide-25 { padding: 1em 0 1em 2em; }

.slidebase {
  background: #f8f8f8;
  border-radius: 0 0 8px 8px;
  display: flex;
  font-size: 0.833em;
	flex-wrap: wrap;
  margin: 0 1% 45px;
  padding-bottom: 6px;
  width: 98%; }

.slidebase.blue { border-top: 10px solid rgba(26,110,171,.10); }
.slidebase.green { border-top: 10px solid rgba(59,134,53,.10); }
.slidebase.orange { border-top: 10px solid rgba(255,86,24,.10); }
.slidebase.violet { border-top: 10px solid rgba(93,31,180,.10); }

.slidebase i {
  border-radius: 50%;
  color: #fff;
  font-size: 12px;
  font-style: normal;
  padding: 0 6px; }

.slidebase.blue i { background: #1a6eab; }
.slidebase.green i { background: #3b8635; }
.slidebase .notation i { 
  background: #aaa !important;
  margin-right: 2px; }

.slidebase span {
  border-radius: 6px;
  display: inline-block;
  font-weight: 700;
  margin-right: 3px;
  min-width: 26px;
  text-align: center; }

.slidebase.blue span { background: rgba(26,110,171,.05); }
.slidebase.green span { background: rgba(59,134,53,.05); }
.slidebase.orange span { background: rgba(255,86,24,.05); }
.slidebase.violet span { 
  background: rgba(93,31,180,.05);
  float: left;
  margin-right: 8px;
  padding: 15px 0; }

.slidedeck {
  border-radius: 8px;
  color: #fff !important;
  display: flex;
	flex-wrap: wrap;
	width: 100%; }

.slidedeck.blue { background: #1a6eab; }
.slidedeck.green { background: #3b8635; }
.slidedeck.mayoral i { margin-top: 6px; }
.slidedeck.orange { background: #ff5618; }
.slidedeck.violet { background: #5d1fb4; }

.slidedeck i {
  background: #fff;
  border-radius: 50%;
  color: #1a6eab;
  font-size: 13px;
  font-style: normal;
  height: 18px;
  line-height: 1.4em;
  margin: 3px 0 0 4px;
  position: absolute;
  top: 6px;
  width: 18px; }

.slidedeck span {
  padding-right: 22px;
  position: relative; }

.slide-25, .slide-33, .slide-50, .slide-100 {	padding: 1em 2em; }
.slide-25 {	width: 25% }
.slide-33 {	width: 33% }
.slide-50 {	width: 50% }
.slide-100 { width: 100% }

.underline {
	background: #8d62ca;
	display: block;
  height: 1px;
  margin-bottom: 15px;
  width: 75px; }

.votes { font-size: 0.875em; }

.winning .chart { background: linear-gradient(to left,#3b8635,#295d25); }
.winning .tally { font-weight: 800; }


/* --- Charts --- */

.cb10 { width: 10% }
.cb15 { width: 15% }
.cb20 { width: 20% }
.cb25 { width: 25% }
.cb30 { width: 30% }
.cb70 { width: 70% }
.cb75 { width: 75% }
.cb80 { width: 80% }
.cb85 { width: 85% }
.cb90 { width: 90% }

@media (max-width:500px) {
  .cb10,.cb15,.cb20,.cb25,.cb30,.cb70,.cb75,.cb80,.cb85,.cb90 { width: 100%; } 
}

.chart {
  background: linear-gradient(to left,#1a6eab,#0d3755);
  border-radius: 0 9px 9px 0;
  color: #fff;
  display: block;
  font-weight: 700;
  padding: 6px; }

.chart small { color: #fff !important; }

.chartbase {
  background: #ddd;
  border-radius: 0 9px 9px 0;
  float: left;
  margin-bottom: 10px; }

.dataset::after, .dataset::before {
  content: " ";
  display: table; }

.dataset {
  clear: both;
  overflow: hidden; }

.label {
  float: left;
  padding: 5px 0 15px; }

.questiondeck .dataset .chart { background: linear-gradient(to left,#5d1fb4,#37126c); }

.questiondeck .dataset .tally {
  margin-top: 0;
  padding-top: 0;
  line-height: 1em; }

.progress {
  background: #f2f2f2;
  padding: 1em 2em; }

.progress hr { border-color: #ddd; }

.progress small { color: #444; }

.tally {
  float: right;
  padding: 5px 0 15px;
  text-align: right; }

@media (max-width:750px) {
  .questiondeck .slide-50 { width: 100% }
  .questiondeck .dataset .tally { margin-top: 4px; }
}

@media (max-width:625px) {
  .chart, .tally { float: none; text-align: left; }
  .progress .cb90, .questiondeck .cb20, .questiondeck .cb80 { width: 100%; }
}

@media (max-width:600px) {
  .slide-25, .slide-33 {	width: 50% }
  .slide-25, .slide-33, .slide-50, .slide-100 { padding: 1em 1em; }
  .tally { margin-left: 4px; }
}

@media (max-width:500px) {
  .notation { 
    margin-top: 25px;
    padding: 10px 0 0; }
  .slide-33, .slide-50 { width: 100% }
  .slide-50 { padding: 0 1em }
  .slidebase .slide-50 p:last-of-type, .slidedeck .slide-33 p:last-of-type, .slidedeck .slide-50 p:last-of-type { margin-bottom: 0 }
  .slidebase, .slidedeck { padding-bottom: 15px }
  .slidedeck .slide-33, .slidedeck .slide-50 { padding: 0.5em; }
  .questiondeck .slide-50 { padding: 1em }
}


/* --- Dark Mode --- */

@media (prefers-color-scheme: dark) {

  article h1, hr { border-color: #555; }
  
  body {
    background: #333;
    color: #fff }
  
  small, .progress small { color: #eee; }
  
  .chartbase { background: #444; }
  
  .logo figure { background-image: url(/supports/st-albert-logo-night.svg); }
 
  .notation { border-top: 1px dashed #777; }
  
  .progress, .outcome, .slidebase { background: #555; }
  
  .progress hr { border-color: #666; }
  
  .question { box-shadow: 0 8px 6px -5px #222; }
  
  .questiondeck .dataset .chart { background: linear-gradient(to left,#6d35bb,#41157d); }
  
  .rank { border-bottom: 1px dotted rgba(255,255,255,.3); }
  
  .reading a { color: #c1d72f }

  .reading a:focus, .reading a:hover {
    border-bottom-color: #c1d72f;
    color: #c1d72f }
  
  .return span { border-color: #555; }
  
  .slidebase { border-top-color: rgba(0,0,0,.10) !important; }
  
  .slidebase.blue i, .slidebase.green i { background: #333; }
  
  .slidebase span { background: rgba(255,255,255,.05) !important; }
  
  .stage { background-color: #333; }
}