*,
.mfp-container,
img.mfp-img {
	box-sizing: border-box
}

.credits,
.selector li {
	transition: all ease-in-out .2s
}
.progress-bar {
    display: none;
}

.mobile-account-balance {
    display: none;
}
.mfp-close,
a {
	text-decoration: none
}

.bx-wrapper {
	position: relative;
	margin: 0 auto 60px;
	padding: 0
}

.bx-wrapper img {
	max-width: 100%;
	display: block
}

.bx-wrapper .bx-viewport {
	box-shadow: 0 0 5px #ccc;
	border: 5px solid #fff;
	left: 0;
	background: #fff;
	-webkit-transform: translatez(0);
	-ms-transform: translatez(0);
	transform: translatez(0)
}

.bx-wrapper .bx-controls-auto,
.bx-wrapper .bx-pager {
	position: absolute;
	bottom: -30px;
	width: 100%
}

.bx-wrapper .bx-loading {
	min-height: 50px;
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/CB-bx_loader.gif) center center no-repeat #fff;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2000
}

.bx-wrapper .bx-pager {
	text-align: center;
	font-size: .85em;
	font-family: Arial;
	font-weight: 700;
	color: #666;
	padding-top: 20px
}

.bx-wrapper .bx-controls-auto .bx-controls-auto-item,
.bx-wrapper .bx-pager .bx-pager-item {
	display: inline-block
}

.bx-wrapper .bx-pager.bx-default-pager a {
	background: #666;
	text-indent: -9999px;
	display: block;
	width: 10px;
	height: 10px;
	margin: 0 5px;
	outline: 0;
	border-radius: 5px
}

.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:hover {
	background: #000
}

.bx-wrapper .bx-prev {
	left: 10px;
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/CB-controls.png) 0 -32px no-repeat
}

.bx-wrapper .bx-next {
	right: 10px;
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/CB-controls.png) -43px -32px no-repeat
}

.bx-wrapper .bx-prev:hover {
	background-position: 0 0
}

.bx-wrapper .bx-next:hover {
	background-position: -43px 0
}

.bx-wrapper .bx-controls-direction a {
	position: absolute;
	top: 50%;
	margin-top: -16px;
	outline: 0;
	width: 32px;
	height: 32px;
	text-indent: -9999px;
	z-index: 9999
}

.bx-wrapper .bx-controls-direction a.disabled {
	display: none
}

.bx-wrapper .bx-controls-auto {
	text-align: center
}

.bx-wrapper .bx-controls-auto .bx-start {
	display: block;
	text-indent: -9999px;
	width: 10px;
	height: 11px;
	outline: 0;
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/CB-controls.png) -86px -11px no-repeat;
	margin: 0 3px
}

.bx-wrapper .bx-controls-auto .bx-start.active,
.bx-wrapper .bx-controls-auto .bx-start:hover {
	background-position: -86px 0
}

.bx-wrapper .bx-controls-auto .bx-stop {
	display: block;
	text-indent: -9999px;
	width: 9px;
	height: 11px;
	outline: 0;
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/CB-controls.png) -86px -44px no-repeat;
	margin: 0 3px
}

body,
html {
	height: 100%
}

.header-links,
.header-links>ul li,
p img {
	margin: 0
}

.bx-wrapper .bx-controls-auto .bx-stop.active,
.bx-wrapper .bx-controls-auto .bx-stop:hover {
	background-position: -86px -33px
}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
	text-align: left;
	width: 80%
}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
	right: 0;
	width: 35px
}

.bx-wrapper .bx-caption {
	position: absolute;
	bottom: 0;
	left: 0;
	background: #666\9;
	background: rgba(80, 80, 80, .75);
	width: 100%
}

.bx-wrapper .bx-caption span {
	color: #fff;
	font-family: Arial;
	display: block;
	font-size: .85em;
	padding: 10px
}

.subheader,
p.lead {
	color: #777
}

a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	vertical-align: baseline
}

.freep,
.mfp-container:before,
.mfp-content {
	vertical-align: middle
}

audio,
canvas,
video {
	display: inline-block
}

audio:not([controls]) {
	display: none;
	height: 0
}

[hidden] {
	display: none
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
section {
	display: block
}

body {
	overflow: hidden;
	font: 14px/21px Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%
}

blockquote,
q {
	quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
	content: '';
	content: none
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

header {
	position: fixed!important;
	max-width: none
}

header.menu-stick,
header.nav-up,
header.nav-up:hover {
	top: -100%
}

.menu-stick.nav-down,
header.nav-down {
	top: 0
}

.header-links {
	clear: none;
	width: auto;
	display: none
}

.cb,
hr {
	clear: both
}

.cd-top, .refresh-btn { text-align: center; padding: 5px 15px 10px; background-color: #cccccc; background-color: rgba(200, 200, 200, 0.8); z-index: 50; position: fixed; bottom: 90px; right: 10px; color: #fff; font-size: 0.8em; text-transform: uppercase; transition: all .2s ease-in 0s; display: none; }
.cd-top i, .refresh-btn i { font-size: 1.5em; display: block; }
.cd-top.cd-is-visible, .refresh-btn.cd-is-visible { display: block; }
.cd-top.cd-fade-out, .refresh-btn.cd-fade-out { opacity: .5; }
.cd-top:hover, .refresh-btn:hover { color: #323232; opacity: 1; }

.slide-menu-inner {
	top: 100%
}

#nav-close-btn,
#nav-open-btn2,
#outer-wrap+p {
	display: none
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 300;
	background: 0 0
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	font-weight: inherit
}

.white-popup dt,
strong {
	font-weight: 700
}

h1 {
	margin-bottom: 14px
}

h2 {
	margin-bottom: 10px
}

h3 {
	margin-bottom: 8px
}

h4 {
	font-size: 21px;
	margin-bottom: 4px
}

h5 {
	font-size: 17px
}

h6 {
	font-size: 14px
}

p.lead {
	font-size: 21px
}

blockquote cite a,
blockquote cite a:visited,
body {
	color: #555
}

blockquote,
blockquote p,
em {
	font-style: italic
}

small {
	font-size: 80%
}

figure figcaption {
	padding: 0;
	font-size: initial
}

blockquote cite {
	display: block;
	font-size: 12px;
	color: #fff;
	font-style: normal;
	margin-top: 10px
}

.hidden,
.mobile-show {
	display: none
}

blockquote cite:before {
	content: "\2014 \0020"
}

hr {
	border: solid #ddd;
	border-width: 1px 0 0;
	margin: 10px 0 30px;
	height: 0
}

a {
	color: #0078a9;
	outline: 0
}

a:focus,
a:hover {
	color: #333
}

ol,
ul {
	margin-bottom: 20px
}

ul {
	list-style: none
}

ol {
	list-style: decimal
}

ol,
ul.circle,
ul.disc,
ul.square {
	margin-left: 30px
}

ul.square {
	list-style: square
}

ul.circle {
	list-style: circle
}

ul.disc {
	list-style: disc
}

ol ol,
ol ul,
ul ol,
ul ul {
	margin: 4px 0 5px 30px;
	font-size: 90%
}

ol ol li,
ol ul li,
ul ol li,
ul ul li {
	margin-bottom: 6px
}

li {
	margin-bottom: 12px
}

img {
	max-width: 100%;
	height: auto
}

.selector,
.selector .darkness {
	position: relative;
	height: 100%
}

.fr {
	float: right
}

.fr img,
img.fr {
	margin: 0 0 10px 10px
}

.fl {
	float: left
}

.fl img,
img.fl {
	margin: 0 10px 10px 0
}

.half.alpha,
.third.alpha {
	margin-right: 1%
}

.cr {
	clear: right
}

.cl {
	clear: left
}

.bx-wrapper,
.section {
	clear: both
}

.half {
	float: left;
	width: 49%
}

.half * {
	-moz-box-sizing: border-box
}

.half.omega {
	margin-left: 1%
}

.third {
	float: left;
	width: 32.333%
}

.third.beta {
	margin: 0 .5%
}

.third.charlie {
	margin-left: 1%
}

.nav a,
.selector span {
	display: block
}

body {
	background: #F2ECE3;
	line-height: normal;
	font-family: Lora, Georgia, "Times New Roman", Times, serif
}

.selector {
	width: 100%;
	margin: 0;
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/03/Rivers1-video2-poster.jpg) top center #111;
	background-size: cover
}

.selector .darkness {
	background: rgba(0, 0, 0, .8);
	width: 100%
}

.selector ul {
	height: 200px;
	bottom: 0;
	margin: 0;
	position: absolute;
	width: 100%;
	border-top: 2px solid #fff
}

.cssvhunit .selector ul {
	height: 30%;
	height: 30vh;
}

.b-lazy h3,
.quote blockquote {
	color: #fff;
	position: relative;
	bottom: -50%;
box-shadow: none;
}

.selector li {
	width: 33.333%;
	height: 100%;
	float: left;
	-webkit-transition: all ease-in-out .2s;
	margin: 0
}

.selector .part1 {
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/RIVERS1-OPENING.jpg) center center;
	background-size: cover
}

.selector .part2 {
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/Rivers2-Photo2.jpg) center center;
	background-size: cover
}

.selector .part3 {
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/1465426594_4584590010001_20151026-Aerial-Winnipeg-MM-0969.jpg) center center;
	background-size: cover
}

.selector ul:hover li {
	width: 28.333%
}

.selector ul:hover li:hover {
	width: 43.333%
}

.selector li a {
	display: block;
	height: 100%;
	width: 100%;
	background: rgba(0, 0, 0, .7);
	color: #fff;
	font-size: 2em
}

.selector .title {
	height: 400px;
}

.cssvhunit .selector .title {
	height: 60%;
	height: 60vh;
}

.selector h1,
.selector h2,
.selector p {
	color: #fff;
	margin: 0
}

.selector li+li {
	border-left: 2px solid #fff
}

.selector small {
	font-size: .6em;
}

h3,
h3 a {
	font-size: 1.5em
}

.b-lazy h3 {
	padding: .5em 1em;
	font-size: 2em;
	max-width: 40%;
	-webkit-transform: translateY(-40%);
	-ms-transform: translateY(-40%);
	transform: translateY(-40%);
	text-transform: none;
	border-bottom: 2px solid #fff;
	text-align: left;
	text-shadow: 0 0 5px rgba(0, 0, 0, .9);
}

.b-lazy h3.fr {
	text-align: right;
}

.credits,
.horizontal-center,
.nav a,
.scroll-fo-mo {
	text-align: center
}

p {
	line-height: 1.8em;
	margin: 1.5em 0;
	font-size: 1.2em
}

.written p:first-child:first-letter {
	float: left;
	font-size: 4em;
	line-height: .6em;
	padding-top: .1em;
	padding-right: 5px;
	padding-left: 0
}

.quote blockquote {
	font-size: 3em;
	max-width: 50%;
	margin: 0 auto;
	-webkit-transform: translateY(-40%);
	-ms-transform: translateY(-40%);
	transform: translateY(-40%);
	padding: 0 1em;
	text-shadow: 0 0 10px rgba(0, 0, 0, .4);
	background: 0 0;
	width: auto;
	text-align: initial;
}

.quote blockquote:before {
	content: "\201C";
	position: absolute;
	top: -.3em;
	left: 0;
	font-size: 6em;
	opacity: .2;
	color: inherit;
	font-family: inherit
}

.darkbg blockquote,
.whitebg blockquote,
.darkbg h3 {
	color: #000;
	background: rgba(255, 255, 255, .8);
	max-width: 90%;
	float: left;
	font-size: 2em;
	text-shadow: none;
	padding: 1em
}

.whitebg cite {
	color: #333
}

.high blockquote {
	bottom: auto;
	top: 20%;
	max-width: 90%
}

.low blockquote {
	bottom: -80%;
	max-width: 90%
}

.darkbg blockquote,
.darkbg h3 {
	width: 100%;
	max-width: 100%;
	background: rgba(0, 0, 0, .8);
	color: #fff
}

.darkbg h3 {
	max-width: 50%;
	font-size: 1.5em
}

.nav a {
	width: 100%;
	position: relative;
	background: rgba(0, 0, 0, .6);
	color: #fff;
	height: 100px
}

.nav a span {
	position: absolute;
	left: 0;
	width: 100%;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%)
}

.nav li {
	width: 33.333%;
	float: left;
	height: 100%;
	margin: 0
}

.inner-wrap,
.outer-wrap {
	width: 100%;
	position: relative;
	overflow: hidden
}

.riversnav li.one {
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/RIVERS1-OPENING.jpg) no-repeat 0px 30%;
}

.riversnav li.two {
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/Rivers2-Photo2.jpg) no-repeat center center;
}

.riversnav li.three {
	background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/1465426594_4584590010001_20151026-Aerial-Winnipeg-MM-0969.jpg) no-repeat center center;
}

.nav li.one,
.nav li.three,
.nav li.two {
	background-size: cover
}

.inner-wrap {
	left: 0
}

.freep,
.nav-wrapper .fab,
.nav-wrapper .fa {
	position: relative;
	background: 0 0;
	box-shadow: none;
	color: #f1f1f1;
	top: 0;
	right: inherit;
	height: 35px;
	float: left;
	padding: 10px
}

.freep {
	width: 105px;
	padding: 6px 5px 9px 10px;
	vertical-align: middle;
}

.title .freep {
	position: absolute
}

.opener {
	width: 100%;
	float: left;
	background: #222;
	background: rgba(0, 0, 0, .4);
	box-shadow: 0 0 15px rgba(0, 0, 0, .4)
}

.opener .fa-facebook,
.opener .fa-twitter {
	float: right
}

.opener [class*=fa-]:hover {
	color: #fff
}

.nav-wrapper {
	position: fixed;
	top: -100px;
	height: 100px;
	z-index: 800;
	left: 0;
	width: 100%;
	transition: all ease-in-out .5s;
	-webkit-transition: all ease-in-out .5s;
	font-size: 16px
}

.js-nav .nav-wrapper {
	top: 0
}

.full,
.intro .full {
	height: 600px;
	width: 100%
}

.cssvhunit .full,
.cssvhunit .intro .full {
	height: 100%;
	height: 100vh;
}

.vertical-center {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%)
}

.horizontal-center {
	margin: 0 auto
}

.scroll-fo-mo {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 10px;
	background: #222;
	background: rgba(0, 0, 0, .5);
	z-index: 10
}

.section {
	width: 100%;
	float: left;
	position: relative;
	z-index: 2;
	font-size: 16px
}

.csstransforms.csstransforms3d .fade-in.ready {
	opacity: 0;
	-webkit-animation: fader ease-in-out 1;
	animation: fader ease-in-out 1;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-duration: 1.2s;
	animation-duration: 1.2s
}

.csstransforms.csstransforms3d .fade-in-one.ready {
	-webkit-animation-delay: 0s;
	animation-delay: 0s
}

.csstransforms.csstransforms3d .fade-in-two.ready {
	-webkit-animation-delay: 3.2s;
	animation-delay: 3.2s
}

.csstransforms.csstransforms3d .fade-in-three.ready {
	-webkit-animation-delay: 5.2s;
	animation-delay: 5.2s
}

.csstransforms.csstransforms3d .fade-in-four.ready {
	-webkit-animation-delay: 6.2s;
	animation-delay: 6.2s
}

.csstransforms.csstransforms3d .fade-in-five.ready {
	-webkit-animation-delay: 8.2s;
	animation-delay: 8.2s
}

.csstransforms.csstransforms3d .fade-in-six.ready {
	-webkit-animation-delay: 9.2s;
	animation-delay: 9.2s
}

.csstransforms.csstransforms3d .fade-in-ten.ready {
	-webkit-animation-delay: 15s;
	animation-delay: 15s
}

@-webkit-keyframes fader {
	from {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@keyframes fader {
	from {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

.intro h1,
.intro h2,
.intro h3,
.intro p,
.splash h1,
.splash h2,
.splash h3,
.splash p {
	color: #fff;
	margin: 0
}

.splash.pt2 h2 {
	color: #97c3d5
}

.credits {
	padding: 20px;
	opacity: .4;
	-webkit-transition: all ease-in-out .2s
}

.credits:hover {
	opacity: 1
}

.bgvideodiv video {
	position: relative;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	z-index: -100;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%)
}

.mfp-content .videoContainer,
.video .videoContainer {
	width: 100%;
	position: relative;
	padding-bottom: 56.25%
}

.mfp-content .videoContainer video,
.video .videoContainer video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none
}

.full .content {
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%)
}

.mfp-content .container {
	max-width: 1200px
}

.container video {
	max-width: 100%
}

.video-container {
	width: 100%;
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden
}

.video-container embed,
.video-container iframe,
.video-container object {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}

.written {
	margin: 0 auto
}

.full.multiVid .container {
	border-radius: 2px;
	letter-spacing: -1ch;
	background: #111;
	background: rgba(0, 0, 0, .8);
	float: left;
	top: 10%;
	max-width: 600px;
	padding: 1em;
	margin: 0 0 0 10%;
	width: 40%;
	border: 1px solid #fff;
	text-align: center;
	font-family: monospace
}

.full.multiVid .container p {
	color: #fff;
	letter-spacing: normal;
	font-family: Lora, Georgia, "Times New Roman", Times, serif;
	padding: 0 .5em;
	border: none;
	text-align: left
}

.full.multiVid.bg-right .container {
	float: right;
	margin: 0 10% 0 0
}

.multiVid video {
	width: 100%;
	float: left;
	padding: .5em
}

.multiVid img {
	vertical-align: bottom;
	border: 1px solid #fff;
	margin: 1%;
	width: 31.333%;
	display: inline-block;
	border: 2px solid #000;
	border: 2px solid rgba(255, 255, 255, 0);
	-webkit-transition: 200ms ease-in-out all;
	transition: 200ms ease-in-out all;
}

.multiVid .container.galston img {
	width: 23%;
}

.multiVid .container a:hover img,
.multiVid .container a.current img {
	border: 2px solid #fff;
	border: 2px solid rgba(255, 255, 255, 1);
}

.beforeafter .container,
.slider .container,
.video .container {
	max-width: 900px
}

.dark .container h1,
.dark .container p {
	color: #e3e2dd
}

.full .container p,
.quote p {
	color: #fff
}

.container {
	max-width: 700px;
	width: 90%;
	margin: 0 auto;
	padding: 20px 0;
	position: relative
}

.dark .container {
	padding: 20px;
	background: rgba(0, 0, 0, .8)
}

.written .bx-wrapper {
	width: 50%;
	float: right;
	margin-left: 40px
}

.written.b-lazy .container {
	padding: 2em;
	background: rgba(255, 255, 255, .9)
}

.full .content {
	width: 50%;
	background: rgba(0, 0, 0, .8);
	padding: 15px 30px 10px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	transition: all ease-in-out .2s;
	-webkit-transition: all ease-in-out .2s
}

.full .container {
	width: 100%
}

.map .container,
.map1 .container,
.map2 .container,
.map3 .container {
	max-width: 900px;
	position: relative
}

.map img,
.map1 img,
.map2 img,
.map3 img {
	box-shadow: 0 0 10px #000
}

.side {
	width: 20%;
	float: left;
	padding: 0 20px;
	position: relative
}

ul.img-desc-list li {
	clear: both;
	float: left;
	width: 100%;
}

.img-desc-list a {
	position: relative;
	float: right;
	margin: 0 0 1em 1em;
	max-width: 200px;
}

.progress-wrap,
.quote p {
	position: fixed;
	width: 100%
}

.quote {
	background: #222
}

.quote p {
	font-size: 5em;
	margin: 0;
	padding: 0 5%;
	top: 50%;
	text-align: center;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%)
}

.turn.skrollable-before p {
	display: none
}

.progress-wrap {
	top: 0;
	left: 0;
	z-index: 300;
	background: rgba(0, 0, 0, .5);
	height: 1em
}

.progress-wrap span {
	position: absolute;
	font-size: .7em;
	z-index: 10
}

.progress-wrap .fourteen {
	left: 20%
}

.progress-wrap .twenty {
	left: 40%
}

.progress-wrap .fifty {
	left: 75%
}

.progress {
	border-right: 1px solid #fff;
	position: absolute;
	height: 1em
}

.progress-bar .progress-message {
	z-index: 200;
	top: 10%;
	position: fixed
}

.leechwrap .content {
	float: left;
	width: 80%
}

.leechwrap .leech {
	float: left;
	width: 20%
}

.cut {
	-webkit-transition: .5s linear all;
	transition: .5s linear all;
	z-index: 1000;
	height: 100%;
	overflow: auto;
	position: fixed;
	top: 0;
	-webkit-transform: translateX(100%);
	-ms-transform: translateX(100%);
	transform: translateX(100%);
	width: 100%;
	background: #fff;
}

.cssvhunit .cut {
	height: 100%;
	height: 100vh;
}

.b-lazy.section.parallax,
.bgvideodiv,
.cut-open,
.mfp-bg,
.white-popup {
	overflow: hidden
}

.cut-intro {
	width: 100%;
	/* max-width: 600px; */
	background: rgba(0, 0, 0, .5);
	padding: 2em;
	border: 1px solid;
	color: #fff;
	font-size: .8em;
	margin: 0 0 2em 0;
}

.written .cut-intro p, .cut-intro h2 {
	color: #fff;
}

.section .cut-intro [class*=fa-],
.section .cut-intro [class^=fa-] {
	position: relative;
	right: initial;
	left: initial;
	display: inline-block;
	padding: 0;
	line-height: normal;
	box-shadow: none;
	background: none;
	color: inherit;
	top: 0;
}

.cut-intro a {
	font-size: 2em;
	font-weight: bold;
	color: #fff;
}

.cut-intro a:hover {
	color: #333;
}

.cut-open .cut {
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0)
}

.cut-open {
	margin-right: 15px
}

.cut .section {
	background: #fff
}

.cut-section .container {
	max-width: 900px;
}

.audio-file {
	padding: 1em;
	float: right;
	clear: right;
	width: 100%;
	max-width: 50%;
	border: 1px solid #ccc;
	margin: .5em 0 .5em 1em;
}

.audio-file p {
	margin: 0;
	font-size: .9em;
}

.audio-file audio {
	width: 100%;
}

.cut-image {
	max-width: 50%;
	float: right;
	margin: 2em 0 .5em 1em;
	position: relative;
}

.small-inline-video {
	max-width: 50%;
	float: right;
	margin: .5em 0 .5em 1em;
}

#cut-close {
	z-index: 300;
	position: absolute;
	left: 10px;
	right: initial;
	background: 0 0;
	color: #222;
	box-shadow: none;
	padding: 0;
	font-size: 3em;
	top: 0
}

.cut-head {
	position: relative;
}

.cut-navigation {
	width: 1em;
	font-size: 5em;
	overflow: hidden;
	display: block;
	top: 50%;
	position: absolute;
	margin: 0 10px;
}

.cut-navigation a {
	top: 0;
	/* background: #0078a9; */
	display: block;
	position: absolute;
	left: 0;
	height: 100%;
	width: 100%;
}

#slider-next {
	right: 0;
	text-align: right;
}

.cut-navigation a.disabled {
	background: #fff;
}

.cut h2 {
	font-size: 10em;
	font-family: 'Six Caps', sans-serif;
}

.cut h3 {
	font-family: 'Six Caps', sans-serif;
	position: absolute;
	bottom: 0;
	background: rgba(0, 0, 0, .8);
	width: 100%;
	padding: 0 .5em;
	margin: 0;
	font-size: 4em;
color: #fff;
}

.cut .gallery.inline {
	margin-right: 0;
}

.cut .cut-section i {
	line-height: normal;
	right: 0;
	position: absolute;
	top: 0;
	padding: 5px;
	background: rgba(255, 255, 255, .8);
	color: #333;
}

.cut .bx-wrapper .bx-viewport {
	box-shadow: none;
}

.section [class*=fa-],
.section [class^=fa-] {
	position: absolute;
	right: 10px;
	top: 10px;
	color: #333;
	background: #fff;
	background: rgba(255, 255, 255, .7);
	display: block;
	padding: 10px;
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, .5);
	z-index: 200
}

[class*=fa-]:hover,
[class^=fa-]:hover {
	color: #000
}

.splash [class*=fa-],
.splash [class^=fa-] {
	top: inherit;
	bottom: 10px
}

.section .scroll-down {
	position: absolute;
	font-family: sans-serif;
	bottom: 1em;
	left: 50%;
	top: initial;
	right: inherit;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: 200;
	color: #fff
}

.scroll-down [class*=fa-],
.scroll-down [class^=fa-] {
	vertical-align: text-bottom;
	display: inline;
	position: relative;
	padding: 0;
	font-size: 2em;
	background: 0 0;
	box-shadow: none;
	color: #fff
}

.splash .fa-arrow-circle-down {
	top: 90%;
	right: 49%;
	width: auto;
	box-shadow: none;
	color: #999;
	font-size: 2em;
	background: 0 0
}

.slideshow {
	padding: 2em
}

.gallery a p,
p.caption {
	padding: 10px;
	margin: 0;
	color: #666;
	font-size: .8em;
	text-align: center;
	width: 100%;
	float: left;
	border-bottom: 1px solid #ccc;
	clear: both;
}

.inline.large+p.caption {
	margin-bottom: 1em
}

.gallery img {
	float: left
}

.artifacts a {
	width: 33.333%;
	display: inline-block;
	padding: 3px;
	position: relative
}

.artifacts a:before {
	font-family: entypo, sans-serif;
	speak: none;
	font-style: normal;
	font-weight: 700;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	border-radius: 1em;
	padding: 0 .5em;
	background: rgba(0, 0, 0, .3);
	position: absolute;
	content: "\25b6";
	top: 50%;
	left: 50%;
	font-size: 2em;
	display: inline-block;
	line-height: normal;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	color: #fff;
	border: 1px solid
}

.gallery,
.relative,
.white-popup {
	position: relative
}

.mfp-container:before,
.mfp-figure:after {
	content: ''
}

.artifacts {
	max-width: 900px;
	letter-spacing: -1ch;
	font-family: monospace;
	text-align: center
}

.slide h3 {
	color: #f1f1f1;
	text-transform: capitalize
}

.white-popup {
	background: #111;
	padding: 20px;
	width: auto;
	max-width: 90%;
	margin: 20px auto
}

.white-popup img {
	float: left;
	margin: 0 2% 0 0;
	max-width: 50%
}

.white-popup dl {
	float: left;
	width: 48%
}

.white-popup dt {
	color: #ddd;
	font-size: 1.2em
}

.white-popup dd,
.white-popup p {
	color: #ccc;
	margin-bottom: 10px
}

.white-popup h2 {
	color: #fff;
	margin-bottom: 10px;
	font-size: 1.5em
}

.white-popup p.caption {
	border: none;
	padding: 5px;
	font-size: .7em;
	margin: 0;
	text-align: left
}

.audio img {
	max-width: 100%
}

.audio audio {
	width: 100%;
	margin-top: 1em
}

.white-popup.audio {
	width: 90%;
	max-width: 1000px
}

.newbuildings img {
	max-width: 100%
}

.newbuildings dl {
	width: 100%;
	margin-top: 20px
}

.gallery {
	padding: 0;
	max-width: 800px
}

.beforeafter .gallery {
	max-width: 900px
}

.gallery.inline {
	margin-right: -2em;
	float: right;
	max-width: 50%;
	padding: 0 0 10px 20px
}

.gallery.inline.large {
	margin: 0;
	width: 100%;
	max-width: none;
	padding: 0
}

.gallery a {
	cursor: -webkit-zoom-in;
	cursor: zoom-in
}

h1 {
	font-family: 'Six Caps', sans-serif;
	font-size: 12em;
	line-height: 1em
}

h2 {
	font-family: 'Wire One', sans-serif;
	font-size: 4em
}

.section {
	background: #F2ECE3;
	margin: 0
}

.written p {
	color: #2d1525;
	line-height: 1.8em
}

.written {
	text-align: justify
}

.splash {
	position: absolute;
	width: 100%;
	background: rgba(0, 0, 0, .4)
}

.bgvideodiv {
	background: #000
}

.bgvideodiv.skrollable-before video {
	display: none
}

.b-lazy {
	-webkit-transition: opacity .5s ease-in-out;
	transition: opacity .5s ease-in-out;
	max-width: 100%;
	opacity: 0
}

.b-lazy.b-error,
.b-lazy.b-loaded {
	opacity: 1
}

.b-lazy.section {
	background-size: cover;
	background-position: center center;
	background-attachment: fixed
}

.b-lazy.section.bg-top {
	background-position: top
}

.b-lazy.section.bg-bottom {
	background-position: bottom
}

.b-lazy.section.bg-left {
	background-position: left
}

.b-lazy.section.bg-right {
	background-position: right
}

.b-error {
	background: #111
}

.b-lazy.section.parallax,
.b-lazy.section.parallax div {
	background-attachment: scroll;
	background-size: cover;
	background-repeat: no-repeat
}

.b-lazy.section.parallax div {
	position: absolute;
	background-position: 50% 50%
}

.cut-open .instructions {
	display: none;
}

@media only screen and (max-width:800px) {
	.quote blockquote {
		font-size: 2em
	}
	.gallery.inline {
		max-width: 100%;
		margin-right: 0;
		padding: 0 0 1em
	}
}

@media only screen and (max-width:660px) {
	.img-desc-list a {
		max-width: 50%;
	}
	.splash {
		background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/RIVERS1-OPENING.jpg) center left no-repeat;
		background-size: cover
	}
	.splash.part2 {
		background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/Rivers2-Photo2.jpg) center left no-repeat;
		background-size: cover
	}
	.splash.part3 {
		background: url(https://www.winnipegfreepress.com/wp-content/uploads/sites/2/2023/02/1465426594_4584590010001_20151026-Aerial-Winnipeg-MM-0969.jpg) center left no-repeat;
		background-size: cover
	}
	.intro h1,
	.splash h1 {
		font-size: 7em
	}
	.intro h2,
	.splash h2 {
		font-size: 3em
	}
	h3 {
		font-size: 1.2em
	}
	.b-lazy h3,
	.b-lazy h3.fr {
		position: absolute;
		font-size: .9em;
		padding: 1em .5em;
		max-width: 100%;
		text-align: left;
		float: none;
		transform: none;
		bottom: 0;
		border: none;
		background: rgba(0, 0, 0, .8);
		margin: 0;
		width: 100%;
	}
	.intro p,
	.splash p {
		margin: 0
	}
	.b-lazy.section.mobile-right {
		background-position: center right
	}
	.b-lazy.section.mobile-left {
		background-position: center left
	}
	.written {
		text-align: left;
		font-size: .9em
	}
	.artifacts a {
		width: 50%
	}
	.section+.bgvideodiv {
		position: relative;
		width: 100%;
		padding-bottom: 56.25%;
		height: auto!important
	}
	.section+.bgvideodiv video {
		display: block;
		left: 0;
		-webkit-transform: initial;
		-ms-transform: initial;
		transform: initial;
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0
	}
	.quote blockquote {
		font-size: 1.3em
	}
	.written.b-lazy .container {
		background: #F2ECE3;
		padding: 20px 5%;
		width: 100%
	}
	.skrollr {
		-webkit-transition: .5s linear all;
		transition: .5s linear all
	}
	.full .content {
		background: 0 0;
		width: 100%;
		position: relative;
		padding: 0;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none
	}
	.full .container p {
		color: #555
	}
	.full .container {
		width: 90%;
		padding: 0
	}
	.container {
		padding: 0
	}
	.container.cut-intro {
		padding: 1em;
	}
	.cut-image,
	.audio-file,
	.small-inline-video {
		max-width: 100%;
		margin: .5em 0;
	}
	.cut .bx-wrapper .bx-viewport {
		padding: 20px;
	}
	.cut h2 {
		font-size: 6em;
	}
	.cut h3 {
		font-size: 2em;
		letter-spacing: .1em;
	}
	.cut .bx-wrapper .bx-controls-direction a {
		bottom: -40px;
		top: inherit;
		z-index: 310;
	}
	.turn {
		background: #111
	}
	.full.multiVid .container,
	.full.multiVid.bg-right .container {
		max-width: none;
		border: none;
		transform: none;
		padding: 1%;
		width: 100%;
		margin: 0;
		top: 0;
	}
	.multiVid {
		background: none !important;
		height: inherit !important;
	}
	.multiVid img,
	.multiVid .container.galston img {
		width: 48%;
	}
	.multiVid .magnificimage {
		display: none;
	}
	.quote p {
		position: relative;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}
	.white-popup dl {
		width: 100%;
		font-size: .8em
	}
	.white-popup img {
		max-width: 100%;
		margin: 0 0 20px
	}
	.mobile-hide {
		display: none
	}
	.mobile-show {
		display: block
	}
	.selector h1 {
		font-size: 8em
	}
	.selector h2 {
		font-size: 2.5em
	}
	.selector p {
		font-size: 1em
	}
	.selector li a {
		font-size: 1.25em
	}
	.selector .title {
		height: 300px;
		padding: 0 10px
	}
	.cssvhunit .selector .title {
		height: 40%;
		height: 40vh;
	}
	.selector ul {
		height: 400px;
		border-top: none
	}
	.cssvhunit .selector ul {
		height: 60%;
		height: 60vh;
	}
	.selector li {
		width: 100%;
		height: 25%;
		border-top: 2px solid #fff
	}
	.selector li+li {
		border-left: none
	}
	.selector ul:hover li,
	.selector ul:hover li:hover {
		width: 100%
	}
	.cut-open .instructions {
		display: block;
		height: 100%;
		position: absolute;
		background: rgba(0, 0, 0, .8);
		z-index: 400;
		width: 100%;
		color: #fff;
		text-align: center;
		opacity: 1;
		-webkit-animation: instructions ease-in-out 1;
		animation: instructions ease-in-out 1;
		-webkit-animation-fill-mode: forwards;
		animation-fill-mode: forwards;
		-webkit-animation-duration: 1.2s;
		animation-duration: 1.2s
	}
	.instructions p {
		position: relative;
		top: 50%;
	}
	.cut-navigation {
		display: none;
	}
	.cut-open .instructions {
		-webkit-animation-delay: 2s;
		animation-delay: 2s
	}
	.instructions i {
		font-size: 3em;
		display: block;
	}
	@-webkit-keyframes instructions {
		from {
			opacity: 1;
			z-index: 300;
		}
		to {
			opacity: 0;
			z-index: -1;
		}
	}
	@keyframes instructions {
		from {
			opacity: 1;
			z-index: 300;
		}
		to {
			opacity: 0;
			z-index: -1;
		}
	}
}

.mfp-bg,
.mfp-wrap {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%
}

@media only screen and (max-width:400px) {
	div {
		background-attachment: scroll!important
	}
}

@media only screen and (max-width:540px) {
	.quote blockquote {
		max-width: 100%
	}
}

.mfp-bg {
	height: 100%;
	z-index: 1042;
	background: #0b0b0b;
	opacity: .8;
	filter: alpha(opacity=80)
}

.mfp-wrap {
	height: 100%;
	z-index: 1043;
	outline: 0!important;
	-webkit-backface-visibility: hidden
}

.mfp-container {
	text-align: center;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	padding: 0 8px
}

.mfp-container:before {
	display: inline-block;
	height: 100%
}

.mfp-align-top .mfp-container:before {
	display: none
}

.mfp-content {
	position: relative;
	display: inline-block;
	margin: 0 auto;
	text-align: left;
	z-index: 1045
}

.mfp-ajax-holder .mfp-content,
.mfp-inline-holder .mfp-content {
	width: 100%;
	cursor: auto
}

.mfp-ajax-cur {
	cursor: progress
}

.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
	cursor: -webkit-zoom-out;
	cursor: zoom-out
}

.mfp-zoom {
	cursor: pointer;
	cursor: -webkit-zoom-in;
	cursor: zoom-in
}

.mfp-auto-cursor .mfp-content {
	cursor: auto
}

.mfp-arrow,
.mfp-close,
.mfp-counter,
.mfp-preloader {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none
}

.mfp-loading.mfp-figure {
	display: none
}

.mfp-hide {
	display: none!important
}

.mfp-preloader {
	color: #ccc;
	position: absolute;
	top: 50%;
	width: auto;
	text-align: center;
	margin-top: -.8em;
	left: 8px;
	right: 8px;
	z-index: 1044
}

.mfp-preloader a {
	color: #ccc
}

.mfp-preloader a:hover {
	color: #fff
}

.mfp-s-error .mfp-content,
.mfp-s-ready .mfp-preloader {
	display: none
}

button.mfp-arrow,
button.mfp-close {
	overflow: visible;
	cursor: pointer;
	background: 0 0;
	border: 0;
	-webkit-appearance: none;
	display: block;
	outline: 0;
	padding: 0;
	z-index: 1046;
	box-shadow: none
}

.mfp-figure:after,
.mfp-iframe-scaler iframe {
	box-shadow: 0 0 8px rgba(0, 0, 0, .6);
	position: absolute;
	left: 0
}

button::-moz-focus-inner {
	padding: 0;
	border: 0
}

.mfp-close {
	width: 44px;
	height: 44px;
	line-height: 44px;
	position: absolute;
	right: 0;
	top: 0;
	text-align: center;
	opacity: .65;
	filter: alpha(opacity=65);
	padding: 0 0 18px 10px;
	color: #fff;
	font-style: normal;
	font-size: 28px;
	font-family: Arial, Baskerville, monospace
}

.mfp-close:focus,
.mfp-close:hover {
	opacity: 1;
	filter: alpha(opacity=100)
}

.mfp-close:active {
	top: 1px
}

.mfp-close-btn-in .mfp-close {
	color: #fff;
	/*background: rgba(0, 0, 0, .5)*/
}

.mfp-iframe-holder .mfp-close,
.mfp-image-holder .mfp-close {
	color: #fff;
	right: -6px;
	text-align: right;
	padding-right: 6px;
	width: 100%
}

.mfp-counter {
	position: absolute;
	top: 0;
	right: 0;
	color: #ccc;
	font-size: 12px;
	line-height: 18px
}

.mfp-figure,
img.mfp-img {
	line-height: 0
}

.mfp-arrow {
	position: absolute;
	opacity: .65;
	filter: alpha(opacity=65);
	margin: -55px 0 0;
	top: 50%;
	padding: 0;
	width: 90px;
	height: 110px;
	-webkit-tap-highlight-color: transparent
}

.mfp-arrow:active {
	margin-top: -54px
}

.mfp-arrow:focus,
.mfp-arrow:hover {
	opacity: 1;
	filter: alpha(opacity=100)
}

.mfp-arrow .mfp-a,
.mfp-arrow .mfp-b,
.mfp-arrow:after,
.mfp-arrow:before {
	content: '';
	display: block;
	width: 0;
	height: 0;
	position: absolute;
	left: 0;
	top: 0;
	margin-top: 35px;
	margin-left: 35px;
	border: inset transparent
}

.mfp-arrow .mfp-a,
.mfp-arrow:after {
	border-top-width: 13px;
	border-bottom-width: 13px;
	top: 8px
}

.mfp-arrow .mfp-b,
.mfp-arrow:before {
	border-top-width: 21px;
	border-bottom-width: 21px;
	opacity: .7
}

.twentytwenty-after-label,
.twentytwenty-before-label,
.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-after-label,
.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-before-label,
.twentytwenty-container.active:hover.twentytwenty-overlay .twentytwenty-after-label,
.twentytwenty-container.active:hover.twentytwenty-overlay .twentytwenty-before-label {
	opacity: 0
}

.mfp-arrow-left {
	left: 0
}

.mfp-arrow-left .mfp-a,
.mfp-arrow-left:after {
	border-right: 17px solid #fff;
	margin-left: 31px
}

.mfp-arrow-left .mfp-b,
.mfp-arrow-left:before {
	margin-left: 25px;
	border-right: 27px solid #3f3f3f
}

.mfp-arrow-right {
	right: 0
}

.mfp-arrow-right .mfp-a,
.mfp-arrow-right:after {
	border-left: 17px solid #fff;
	margin-left: 39px
}

.mfp-arrow-right .mfp-b,
.mfp-arrow-right:before {
	border-left: 27px solid #3f3f3f
}

.mfp-iframe-holder {
	padding-top: 40px;
	padding-bottom: 40px
}

.mfp-iframe-holder .mfp-content {
	line-height: 0;
	width: 100%;
	max-width: 900px
}

.mfp-iframe-holder .mfp-close {
	top: -40px
}

.mfp-iframe-scaler {
	width: 100%;
	height: 0;
	overflow: hidden;
	padding-top: 56.25%
}

.mfp-iframe-scaler iframe {
	display: block;
	top: 0;
	width: 100%;
	height: 100%;
	background: #000
}

.mfp-figure:after,
img.mfp-img {
	width: auto;
	height: auto;
	display: block
}

img.mfp-img {
	max-width: 100%;
	padding: 40px 0;
	margin: 0 auto
}

.mfp-figure:after {
	top: 40px;
	bottom: 40px;
	right: 0;
	z-index: -1;
	background: #444
}

.mfp-figure small {
	color: #bdbdbd;
	display: block;
	font-size: 12px;
	line-height: 14px
}

.mfp-figure figure {
	margin: 0
}

.mfp-bottom-bar {
	margin-top: -36px;
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	cursor: auto
}

.mfp-title {
	text-align: left;
	line-height: 18px;
	color: #fff;
	word-wrap: break-word;
	padding-right: 36px;
	font-size: .8em;
	font-weight: 400
}

.mfp-image-holder .mfp-content {
	max-width: 90%
}

.mfp-gallery .mfp-image-holder .mfp-figure {
	cursor: pointer
}

@media screen and (max-width:800px) and (orientation:landscape),
screen and (max-height:300px) {
	.mfp-img-mobile .mfp-image-holder {
		padding-left: 0;
		padding-right: 0
	}
	.mfp-img-mobile img.mfp-img {
		padding: 0
	}
	.mfp-img-mobile .mfp-figure:after {
		top: 0;
		bottom: 0
	}
	.mfp-img-mobile .mfp-figure small {
		display: inline;
		margin-left: 5px
	}
	.mfp-img-mobile .mfp-bottom-bar {
		background: rgba(0, 0, 0, .6);
		bottom: 0;
		margin: 0;
		top: auto;
		padding: 3px 5px;
		position: fixed;
		box-sizing: border-box
	}
	.mfp-img-mobile .mfp-bottom-bar:empty {
		padding: 0
	}
	.mfp-img-mobile .mfp-counter {
		right: 5px;
		top: 3px
	}
	.mfp-img-mobile .mfp-close {
		top: 0;
		right: 0;
		width: 35px;
		height: 35px;
		line-height: 35px;
		background: rgba(0, 0, 0, .6);
		position: fixed;
		text-align: center;
		padding: 0
	}
}

@media all and (max-width:900px) {
	.mfp-arrow {
		-webkit-transform: scale(.75);
		-ms-transform: scale(.75);
		transform: scale(.75)
	}
	.mfp-arrow-left {
		-webkit-transform-origin: 0;
		-ms-transform-origin: 0;
		transform-origin: 0
	}
	.mfp-arrow-right {
		-webkit-transform-origin: 100%;
		-ms-transform-origin: 100%;
		transform-origin: 100%
	}
	.mfp-container {
		padding-left: 6px;
		padding-right: 6px
	}
}

.mfp-ie7 .mfp-img {
	padding: 0
}

.mfp-ie7 .mfp-bottom-bar {
	width: 600px;
	left: 50%;
	margin-left: -300px;
	margin-top: 5px;
	padding-bottom: 5px
}

.mfp-ie7 .mfp-container {
	padding: 0
}

.mfp-ie7 .mfp-content {
	padding-top: 44px
}

.mfp-ie7 .mfp-close {
	top: 0;
	right: 0;
	padding-top: 0
}

.touch div {
	background-attachment: scroll!important
}

.twentytwenty-horizontal .twentytwenty-handle:after,
.twentytwenty-horizontal .twentytwenty-handle:before,
.twentytwenty-vertical .twentytwenty-handle:after,
.twentytwenty-vertical .twentytwenty-handle:before {
	content: " ";
	display: block;
	background: #fff;
	position: absolute;
	z-index: 30
}

.twentytwenty-horizontal .twentytwenty-handle:after,
.twentytwenty-horizontal .twentytwenty-handle:before {
	width: 3px;
	height: 9999px;
	left: 50%;
	margin-left: -1.5px
}

.twentytwenty-vertical .twentytwenty-handle:after,
.twentytwenty-vertical .twentytwenty-handle:before {
	width: 9999px;
	height: 3px;
	top: 50%;
	margin-top: -1.5px
}

.twentytwenty-after-label,
.twentytwenty-before-label,
.twentytwenty-overlay {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	-webkit-transition-duration: .5s;
	transition-duration: .5s
}

.twentytwenty-after-label,
.twentytwenty-before-label {
	-webkit-transition-property: opacity;
	transition-property: opacity
}

.twentytwenty-after-label:before,
.twentytwenty-before-label:before {
	color: #fff;
	font-size: 13px;
	letter-spacing: .1em;
	position: absolute;
	background: rgba(255, 255, 255, .2);
	line-height: 38px;
	padding: 0 20px;
	border-radius: 2px
}

.twentytwenty-horizontal .twentytwenty-after-label:before,
.twentytwenty-horizontal .twentytwenty-before-label:before {
	top: 50%;
	margin-top: -19px
}

.twentytwenty-vertical .twentytwenty-after-label:before,
.twentytwenty-vertical .twentytwenty-before-label:before {
	left: 50%;
	margin-left: -45px;
	text-align: center;
	width: 90px
}

.twentytwenty-down-arrow,
.twentytwenty-left-arrow,
.twentytwenty-right-arrow,
.twentytwenty-up-arrow {
	width: 0;
	height: 0;
	border: 6px inset transparent;
	position: absolute
}

.twentytwenty-left-arrow,
.twentytwenty-right-arrow {
	top: 50%;
	margin-top: -6px
}

.twentytwenty-down-arrow,
.twentytwenty-up-arrow {
	left: 50%;
	margin-left: -6px
}

.twentytwenty-container {
	box-sizing: content-box;
	z-index: 0;
	overflow: hidden;
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none
}

.twentytwenty-container img {
	max-width: 100%;
	position: absolute;
	top: 0;
	display: block
}

.twentytwenty-container.active .twentytwenty-overlay,
.twentytwenty-container.active:hover.twentytwenty-overlay {
	background: 0 0
}

.twentytwenty-container * {
	box-sizing: content-box
}

.twentytwenty-before-label:before {
	content: "Before"
}

.twentytwenty-after-label:before {
	content: "After"
}

.twentytwenty-horizontal .twentytwenty-before-label:before {
	left: 10px
}

.twentytwenty-horizontal .twentytwenty-after-label:before {
	right: 10px
}

.twentytwenty-vertical .twentytwenty-before-label:before {
	top: 10px
}

.twentytwenty-vertical .twentytwenty-after-label:before {
	bottom: 10px
}

.twentytwenty-overlay {
	-webkit-transition-property: background;
	transition-property: background;
	background: 0 0;
	z-index: 25
}

.twentytwenty-overlay:hover {
	background: rgba(0, 0, 0, .5)
}

.twentytwenty-overlay:hover .twentytwenty-after-label,
.twentytwenty-overlay:hover .twentytwenty-before-label {
	opacity: 1
}

.twentytwenty-before {
	z-index: 20
}

.twentytwenty-after {
	z-index: 10
}

.twentytwenty-handle {
	height: 38px;
	width: 38px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -22px;
	margin-top: -22px;
	border: 3px solid #fff;
	border-radius: 1000px;
	box-shadow: 0 0 12px rgba(51, 51, 51, .5);
	z-index: 40;
	cursor: pointer
}

.twentytwenty-horizontal .twentytwenty-handle:before {
	bottom: 50%;
	margin-bottom: 22px;
	box-shadow: 0 3px 0 #fff, 0 0 12px rgba(51, 51, 51, .5)
}

.twentytwenty-horizontal .twentytwenty-handle:after {
	top: 50%;
	margin-top: 22px;
	box-shadow: 0 -3px 0 #fff, 0 0 12px rgba(51, 51, 51, .5)
}

.twentytwenty-vertical .twentytwenty-handle:before {
	left: 50%;
	margin-left: 22px;
	box-shadow: 3px 0 0 #fff, 0 0 12px rgba(51, 51, 51, .5)
}

.twentytwenty-vertical .twentytwenty-handle:after {
	right: 50%;
	margin-right: 22px;
	box-shadow: -3px 0 0 #fff, 0 0 12px rgba(51, 51, 51, .5)
}

.twentytwenty-left-arrow {
	border-right: 6px solid #fff;
	left: 50%;
	margin-left: -17px
}

.twentytwenty-right-arrow {
	border-left: 6px solid #fff;
	right: 50%;
	margin-right: -17px
}

.twentytwenty-up-arrow {
	border-bottom: 6px solid #fff;
	top: 50%;
	margin-top: -17px
}

.twentytwenty-down-arrow {
	border-top: 6px solid #fff;
	bottom: 50%;
	margin-bottom: -17px
}

#preloader {
	margin-top: 0;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #fff;
	z-index: 2222223;
	text-align: center
}

#status {
	width: 200px;
	height: 200px;
	position: absolute;
	left: 50%;
	top: 50%;
	background-repeat: no-repeat;
	background-position: center;
	margin: -100px 0 0 -100px
}

.cssload-whirlpool,
.cssload-whirlpool::after,
.cssload-whirlpool::before {
	position: absolute;
	top: 50%;
	left: 50%;
	border: 1px solid #ccc;
	border-left-color: #0079a9;
	border-radius: 974px;
	-o-border-radius: 974px;
	-ms-border-radius: 974px;
	-webkit-border-radius: 974px;
	-moz-border-radius: 974px
}

.cssload-whirlpool {
	margin: -24px 0 0 -24px;
	height: 49px;
	width: 49px;
	animation: cssload-rotate 1.15s linear infinite;
	-o-animation: cssload-rotate 1.15s linear infinite;
	-ms-animation: cssload-rotate 1.15s linear infinite;
	-webkit-animation: cssload-rotate 1.15s linear infinite;
	-moz-animation: cssload-rotate 1.15s linear infinite
}

.cssload-whirlpool::before {
	content: "";
	margin: -22px 0 0 -22px;
	height: 43px;
	width: 43px;
	animation: cssload-rotate 1.15s linear infinite;
	-o-animation: cssload-rotate 1.15s linear infinite;
	-ms-animation: cssload-rotate 1.15s linear infinite;
	-webkit-animation: cssload-rotate 1.15s linear infinite;
	-moz-animation: cssload-rotate 1.15s linear infinite
}

.cssload-whirlpool::after {
	content: "";
	margin: -28px 0 0 -28px;
	height: 55px;
	width: 55px;
	animation: cssload-rotate 2.3s linear infinite;
	-o-animation: cssload-rotate 2.3s linear infinite;
	-ms-animation: cssload-rotate 2.3s linear infinite;
	-webkit-animation: cssload-rotate 2.3s linear infinite;
	-moz-animation: cssload-rotate 2.3s linear infinite
}

@keyframes cssload-rotate {
	100% {
		transform: rotate(360deg)
	}
}

@-o-keyframes cssload-rotate {
	100% {
		-o-transform: rotate(360deg)
	}
}

@-ms-keyframes cssload-rotate {
	100% {
		-ms-transform: rotate(360deg)
	}
}

@-webkit-keyframes cssload-rotate {
	100% {
		-webkit-transform: rotate(360deg)
	}
}

@-moz-keyframes cssload-rotate {
	100% {
		-moz-transform: rotate(360deg)
	}
}

comment {
	display: none;
	background: salmon;
	color: #fff;
	padding: 1em;
	width: 100%;
	clear: both;
	display: block;
	font-family: monospace;
}