body.flex-page-container .page-container {
	display:flex;
	flex-flow:column;
	height:100%;
}
body.flex-page-container .page-container>.content-body {
	flex:1; /* fill all remaining vertical space since no flex values are set to other children */
}


/* v=1225 .01 */

/* TEMPORARY CORRECTIONS FOR THE PSEUDO-LIVE PLAYER (TO BE RENAMED LATER ON, AND MADE MORE FLEXIBLE LATER ON) */

.player-pseudo-live {
	font-size:20px;
}
@media only screen 
	and (max-width: 720px) {
	.player-pseudo-live {
		font-size:15px;
	}
}

#playOnPage {
	position:fixed;
	z-index:2000;
	overflow:none;
	width:100%;
	height:100%;
	top:0;
	left:0;
	pointer-events:none;
	opacity:0;
	background-color:#000;
}
#playOnPage.loading,#playOnPage.ready {
	opacity:1;
	transition: all 0.6s;
	pointer-events: auto;
}
#playOnPage #btnExitPlayOnPage {
	position:absolute;
	top:20px;
	left:20px;
	background-color:transparent;
	border:none;
	color:#fff;
	opacity:0.6;
	padding:20px;
	z-index:2001;
}
#playOnPage #btnExitPlayOnPage:focus,
#playOnPage #btnExitPlayOnPage:hover {
	opacity:1;
	transition: all 0.3s;
}
#playOnPage.loading #btnExitPlayOnPage,
#playOnPage.ready #btnExitPlayOnPage {
	pointer-events:all;
}
#playOnPage.ready #btnExitPlayOnPage.useBtnExit {
	opacity:0;
}
#playOnPageLoading {
	position:absolute;
	top:50%;
	left:50%;
	width:100px;
	height:100px;
	margin-left:-50px;
	margin-top:-50px;
	color:#fff;
	opacity:0;
	display:flex;
	justify-content: center;
	align-items: center;
	transition: all 0.8s;
}
#playOnPageLoading.active {
	opacity:0.4;
}
#playOnPagePlayer {
	height:100%;
}

/* Override for code below */
html.browser-other .player-pseudo-live .videoWrapper #btnFullscreen {
	pointer-events:auto!important;
}
/* Override for code below */
.player-pseudo-live .start-overlay {
	pointer-events:auto!important;
}
.player-pseudo-live .fa-pause {
	display:none;
}
html.playing .player-pseudo-live .fa-pause {
	display:inline-block;
}
html.playing .player-pseudo-live .fa-play {
	display:none;
}
.player-pseudo-live .fa-compress-arrows-alt {
	display:none;
}
html.fs .player-pseudo-live .fa-compress-arrows-alt {
	display:inline-block;
}
html.fs .player-pseudo-live .fa-expand-arrows {
	display:none;
}
html.fs.browser-edge .player-pseudo-live .videoWrapper,
html.fs.browser-other .player-pseudo-live .videoWrapper {
	padding:0;
	transform:translateY(0);
}
html.fs .player-pseudo-live .videoWrapper .ctl-overlay-top {
	top:0;
}
html.fs .player-pseudo-live .videoWrapper .ctl-overlay-bottom {
	bottom:0;
}


.responsive-embed {
	position: relative;
	padding-bottom: 56.25%;
}
.responsive-embed > iframe,
.responsive-embed > video {
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%;
}


.player-pseudo-live #btnPlayPause {
	display:none;
}
.player-pseudo-live .player-timeline-progress-knob-ctl {
	display:none;
}
.player-pseudo-live.player-allow-pause #btnPlayPause {
	display:block;
}
.player-pseudo-live.player-allow-pause .player-btn-start-playback {
	display:none; /* Hide the initial play button if play/pause control is permitted */
}
.player-pseudo-live.player-allow-seek .player-timeline-progress-knob-ctl {
	display:block;
}
.videoWrapper .ctl-overlay-live {
	display:none;
}
html.playback .videoWrapper .ctl-overlay-live {
	display:block;
}

.simulate-block,
.simulate-inline {
	display:none!important;
}
html.simulate-active .simulate-block {
	display:block!important;
}
html.simulate-active .simulate-inline {
	display:inline!important;
}
html.simulate-active .simulate-hidden {
	display:none!important;
}


/* Make the play/pause button only visible once the playback has started */
/*
.player-pseudo-live .videoWrapper #btnPlayPause {
	display:none;
}
html.playback .player-pseudo-live .videoWrapper #btnPlayPause {
	display:block;
}
*/


/* ------ */


.icon-live {
	text-transform: uppercase;
	font-size:1.4em;
	font-weight: bold;
	background-color:#ff0000;
	border:3px solid #fff;
	padding:0 5px;
}


/* Helper class that tries to make an element and all of its descendants non-interactive.
The video player should remove controls. */
.non-interactive,
.non-interactive > * {
	pointer-events:none!important;
	user-select:none!important;
}


/* Bootstrap 3 to 4 conversions */
.form-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

.badge.fade,
.sign-in-message.fade {
    opacity: 0;
	transition: opacity 0.15s ease-out;
}
.badge.fade.in,
.badge.fade.show,
.sign-in-message.fade.in,
.sign-in-message.fade.show {
    opacity: 1;
}




.space-left {
	margin-left:.25em;
}
.space-right {
	margin-right:.25em;
}


/* Bootstrap 4 additions */
@media (min-width: 2048px) {
	.col-xxl-2 {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 16.6666666667%;
		flex: 0 0 16.6666666667%;
		max-width: 16.6666666667%;
	}
}

/* Theme colors / Bootstrap color overrides */
.dropdown-item:hover, .dropdown-item:focus {
    background-color: var(--theme-color);
}
.btn-primary {
    background-color:var(--theme-color);
    border-color:var(--theme-color);
}
.btn-primary:hover {
    background-color:var(--theme-color-focus1);
    border-color:var(--theme-color-focus1);
}
.btn-primary:focus {
    background-color:var(--theme-color-focus2);
    border-color:var(--theme-color-focus2);
    -webkit-box-shadow: 0 0 0 0.2rem var(--theme-color-translucent40);
    box-shadow: 0 0 0 0.2rem var(--theme-color-translucent40);
}

.btn-primary.disabled, .btn-primary:disabled {
  background-color:var(--theme-color-muted1);
  border-color:var(--theme-color-muted1);
}



/* This makes it easier to use images + wrapping text in the top navbar */
.nav-link {
	display:flex;
	align-items: center;
}



/* Copied from main.css (to avoid including the whole main.css) */


/* Locale-based visibility of content */
.l-block,.l-inline-block,.l-inline,.l-flex {
	display:none!important;
}
html[lang="ar"] .l-block[lang="ar"],
html[lang="bg"] .l-block[lang="bg"],
html[lang="bs"] .l-block[lang="bs"],
html[lang="de"] .l-block[lang="de"],
html[lang="el"] .l-block[lang="el"],
html[lang="en"] .l-block[lang="en"],
html[lang="es"] .l-block[lang="es"],
html[lang="fi"] .l-block[lang="fi"],
html[lang="fr"] .l-block[lang="fr"],
html[lang="he"] .l-block[lang="he"],
html[lang="hr"] .l-block[lang="hr"],
html[lang="it"] .l-block[lang="it"],
html[lang="nl"] .l-block[lang="nl"],
html[lang="no"] .l-block[lang="no"],
html[lang="pl"] .l-block[lang="pl"],
html[lang="pt"] .l-block[lang="pt"],
html[lang="ro"] .l-block[lang="ro"],
html[lang="sl"] .l-block[lang="sl"],
html[lang="sv"] .l-block[lang="sv"],
html[lang="uk"] .l-block[lang="uk"] {
	display:block!important;
}
html[lang="ar"] .l-inline-block[lang="ar"],
html[lang="bg"] .l-inline-block[lang="bg"],
html[lang="bs"] .l-inline-block[lang="bs"],
html[lang="de"] .l-inline-block[lang="de"],
html[lang="el"] .l-inline-block[lang="el"],
html[lang="en"] .l-inline-block[lang="en"],
html[lang="es"] .l-inline-block[lang="es"],
html[lang="fi"] .l-inline-block[lang="fi"],
html[lang="fr"] .l-inline-block[lang="fr"],
html[lang="he"] .l-inline-block[lang="he"],
html[lang="hr"] .l-inline-block[lang="hr"],
html[lang="it"] .l-inline-block[lang="it"],
html[lang="nl"] .l-inline-block[lang="nl"],
html[lang="no"] .l-inline-block[lang="no"],
html[lang="pl"] .l-inline-block[lang="pl"],
html[lang="pt"] .l-inline-block[lang="pt"],
html[lang="ro"] .l-inline-block[lang="ro"],
html[lang="sl"] .l-inline-block[lang="sl"],
html[lang="sv"] .l-inline-block[lang="sv"],
html[lang="uk"] .l-inline-block[lang="uk"] {
	display:inline-block!important;
}
html[lang="ar"] .l-inline[lang="ar"],
html[lang="bg"] .l-inline[lang="bg"],
html[lang="bs"] .l-inline[lang="bs"],
html[lang="de"] .l-inline[lang="de"],
html[lang="el"] .l-inline[lang="el"],
html[lang="en"] .l-inline[lang="en"],
html[lang="es"] .l-inline[lang="es"],
html[lang="fi"] .l-inline[lang="fi"],
html[lang="fr"] .l-inline[lang="fr"],
html[lang="he"] .l-inline[lang="he"],
html[lang="hr"] .l-inline[lang="hr"],
html[lang="it"] .l-inline[lang="it"],
html[lang="nl"] .l-inline[lang="nl"],
html[lang="no"] .l-inline[lang="no"],
html[lang="pl"] .l-inline[lang="pl"],
html[lang="pt"] .l-inline[lang="pt"],
html[lang="ro"] .l-inline[lang="ro"],
html[lang="sl"] .l-inline[lang="sl"],
html[lang="sv"] .l-inline[lang="sv"],
html[lang="uk"] .l-inline[lang="uk"] {
	display:inline!important;
}
html[lang="ar"] .l-flex[lang="ar"],
html[lang="bg"] .l-flex[lang="bg"],
html[lang="bs"] .l-flex[lang="bs"],
html[lang="de"] .l-flex[lang="de"],
html[lang="el"] .l-flex[lang="el"],
html[lang="en"] .l-flex[lang="en"],
html[lang="es"] .l-flex[lang="es"],
html[lang="fi"] .l-flex[lang="fi"],
html[lang="fr"] .l-flex[lang="fr"],
html[lang="he"] .l-flex[lang="he"],
html[lang="hr"] .l-flex[lang="hr"],
html[lang="it"] .l-flex[lang="it"],
html[lang="nl"] .l-flex[lang="nl"],
html[lang="no"] .l-flex[lang="no"],
html[lang="pl"] .l-flex[lang="pl"],
html[lang="pt"] .l-flex[lang="pt"],
html[lang="ro"] .l-flex[lang="ro"],
html[lang="sl"] .l-flex[lang="sl"],
html[lang="sv"] .l-flex[lang="sv"],
html[lang="uk"] .l-flex[lang="uk"] {
	display:flex!important;
}

/* Session type-based visibility of content */
.d-se-anonymous, .d-se-registered,
.d-flex-se-anonymous, .d-flex-se-registered,
.d-inline-se-anonymous, .d-inline-se-registered,
.d-inline-block-se-anonymous, .d-inline-block-se-registered {
	display:none!important;
}
html.se-anonymous .d-se-anonymous,
html.se-registered .d-se-registered {
	display:block!important;
}
html.se-anonymous .d-flex-se-anonymous,
html.se-registered .d-flex-se-registered {
	display:flex!important;
}
html.se-anonymous .d-inline-se-anonymous,
html.se-registered .d-inline-se-registered {
	display:inline!important;
}
html.se-anonymous .d-inline-block-se-anonymous,
html.se-registered .d-inline-block-se-registered {
	display:inline-block!important;
}



.dropdown .set-locale {
	text-transform: capitalize;
}


/* ========================================================================================
   Content only visible for the system developer (not secure - only for non-sensitive data)
   ======================================================================================== */

.dev-only, .dev-only-block, .dev-only-inline, .dev-only-inline-block {
	display:none;
}
body.dev .dev-only,
body.dev .dev-only-block {
	display:block;
}
body.dev .dev-only-inline {
	display:inline;
}
body.dev .dev-only-inline-block {
	display:inline-block;
}



/* ========================================================================================
   Bootstrap 4 classes for xxl (1900px and wider) and xxxl (3000px and wider) screens
   Based on https://thunderblaster.github.io/bootstrap-xxl/
   ======================================================================================== */
.col-xxl-1,.col-xxl-2,.col-xxl-3,.col-xxl-4,.col-xxl-5,.col-xxl-6,.col-xxl-7,.col-xxl-8,.col-xxl-9,.col-xxl-10,.col-xxl-11,.col-xxl-12,.col-xxl,.col-xxl-auto,.col-xxxl-1,.col-xxxl-2,.col-xxxl-3,.col-xxxl-4,.col-xxxl-5,.col-xxxl-6,.col-xxxl-7,.col-xxxl-8,.col-xxxl-9,.col-xxxl-10,.col-xxxl-11,.col-xxxl-12,.col-xxxl,.col-xxxl-auto{position:relative;width:100%;min-height:1px;padding-right:15px;padding-left:15px}@media (min-width:1900px){.col-xxl{-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}.col-xxl-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}.col-xxl-1{-ms-flex:0 0 8.333333%;flex:0 0 8.333333%;max-width:8.333333%}.col-xxl-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}.col-xxl-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}.col-xxl-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}.col-xxl-5{-ms-flex:0 0 41.666667%;flex:0 0 41.666667%;max-width:41.666667%}.col-xxl-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
.col-xxl-7{-ms-flex:0 0 58.333333%;flex:0 0 58.333333%;max-width:58.333333%}.col-xxl-8{-ms-flex:0 0 66.666667%;flex:0 0 66.666667%;max-width:66.666667%}.col-xxl-9{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}.col-xxl-10{-ms-flex:0 0 83.333333%;flex:0 0 83.333333%;max-width:83.333333%}.col-xxl-11{-ms-flex:0 0 91.666667%;flex:0 0 91.666667%;max-width:91.666667%}.col-xxl-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.order-xxl-first{-ms-flex-order:-1;order:-1}.order-xxl-last{-ms-flex-order:13;order:13}.order-xxl-0{-ms-flex-order:0;order:0}.order-xxl-1{-ms-flex-order:1;order:1}.order-xxl-2{-ms-flex-order:2;order:2}.order-xxl-3{-ms-flex-order:3;order:3}.order-xxl-4{-ms-flex-order:4;order:4}.order-xxl-5{-ms-flex-order:5;order:5}.order-xxl-6{-ms-flex-order:6;order:6}.order-xxl-7{-ms-flex-order:7;order:7}.order-xxl-8{-ms-flex-order:8;order:8}.order-xxl-9{-ms-flex-order:9;order:9}.order-xxl-10{-ms-flex-order:10;order:10}.order-xxl-11{-ms-flex-order:11;order:11}.order-xxl-12{-ms-flex-order:12;order:12}
.offset-xxl-0{margin-left:0}.offset-xxl-1{margin-left:8.333333%}.offset-xxl-2{margin-left:16.666667%}.offset-xxl-3{margin-left:25%}.offset-xxl-4{margin-left:33.333333%}.offset-xxl-5{margin-left:41.666667%}.offset-xxl-6{margin-left:50%}.offset-xxl-7{margin-left:58.333333%}.offset-xxl-8{margin-left:66.666667%}.offset-xxl-9{margin-left:75%}.offset-xxl-10{margin-left:83.333333%}.offset-xxl-11{margin-left:91.666667%}}@media (min-width:3000px){.col-xxxl{-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}.col-xxxl-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}.col-xxxl-1{-ms-flex:0 0 8.333333%;flex:0 0 8.333333%;max-width:8.333333%}.col-xxxl-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}.col-xxxl-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}.col-xxxl-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}.col-xxxl-5{-ms-flex:0 0 41.666667%;flex:0 0 41.666667%;max-width:41.666667%}.col-xxxl-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
.col-xxxl-7{-ms-flex:0 0 58.333333%;flex:0 0 58.333333%;max-width:58.333333%}.col-xxxl-8{-ms-flex:0 0 66.666667%;flex:0 0 66.666667%;max-width:66.666667%}.col-xxxl-9{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}.col-xxxl-10{-ms-flex:0 0 83.333333%;flex:0 0 83.333333%;max-width:83.333333%}.col-xxxl-11{-ms-flex:0 0 91.666667%;flex:0 0 91.666667%;max-width:91.666667%}.col-xxxl-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.order-xxxl-first{-ms-flex-order:-1;order:-1}.order-xxxl-last{-ms-flex-order:13;order:13}.order-xxxl-0{-ms-flex-order:0;order:0}.order-xxxl-1{-ms-flex-order:1;order:1}.order-xxxl-2{-ms-flex-order:2;order:2}.order-xxxl-3{-ms-flex-order:3;order:3}.order-xxxl-4{-ms-flex-order:4;order:4}.order-xxxl-5{-ms-flex-order:5;order:5}.order-xxxl-6{-ms-flex-order:6;order:6}.order-xxxl-7{-ms-flex-order:7;order:7}.order-xxxl-8{-ms-flex-order:8;order:8}.order-xxxl-9{-ms-flex-order:9;order:9}.order-xxxl-10{-ms-flex-order:10;order:10}.order-xxxl-11{-ms-flex-order:11;order:11}.order-xxxl-12{-ms-flex-order:12;order:12}
.offset-xxxl-0{margin-left:0}.offset-xxxl-1{margin-left:8.333333%}.offset-xxxl-2{margin-left:16.666667%}.offset-xxxl-3{margin-left:25%}.offset-xxxl-4{margin-left:33.333333%}.offset-xxxl-5{margin-left:41.666667%}.offset-xxxl-6{margin-left:50%}.offset-xxxl-7{margin-left:58.333333%}.offset-xxxl-8{margin-left:66.666667%}.offset-xxxl-9{margin-left:75%}.offset-xxxl-10{margin-left:83.333333%}.offset-xxxl-11{margin-left:91.666667%}}@media (min-width:1900px){.col-xxl{-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}.col-xxl-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}.col-xxl-1{-ms-flex:0 0 8.333333%;flex:0 0 8.333333%;max-width:8.333333%}.col-xxl-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}.col-xxl-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}.col-xxl-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}.col-xxl-5{-ms-flex:0 0 41.666667%;flex:0 0 41.666667%;max-width:41.666667%}.col-xxl-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
.col-xxl-7{-ms-flex:0 0 58.333333%;flex:0 0 58.333333%;max-width:58.333333%}.col-xxl-8{-ms-flex:0 0 66.666667%;flex:0 0 66.666667%;max-width:66.666667%}.col-xxl-9{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}.col-xxl-10{-ms-flex:0 0 83.333333%;flex:0 0 83.333333%;max-width:83.333333%}.col-xxl-11{-ms-flex:0 0 91.666667%;flex:0 0 91.666667%;max-width:91.666667%}.col-xxl-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.order-xxl-first{-ms-flex-order:-1;order:-1}.order-xxl-last{-ms-flex-order:13;order:13}.order-xxl-0{-ms-flex-order:0;order:0}.order-xxl-1{-ms-flex-order:1;order:1}.order-xxl-2{-ms-flex-order:2;order:2}.order-xxl-3{-ms-flex-order:3;order:3}.order-xxl-4{-ms-flex-order:4;order:4}.order-xxl-5{-ms-flex-order:5;order:5}.order-xxl-6{-ms-flex-order:6;order:6}.order-xxl-7{-ms-flex-order:7;order:7}.order-xxl-8{-ms-flex-order:8;order:8}.order-xxl-9{-ms-flex-order:9;order:9}.order-xxl-10{-ms-flex-order:10;order:10}.order-xxl-11{-ms-flex-order:11;order:11}.order-xxl-12{-ms-flex-order:12;order:12}
.offset-xxl-0{margin-left:0}.offset-xxl-1{margin-left:8.333333%}.offset-xxl-2{margin-left:16.666667%}.offset-xxl-3{margin-left:25%}.offset-xxl-4{margin-left:33.333333%}.offset-xxl-5{margin-left:41.666667%}.offset-xxl-6{margin-left:50%}.offset-xxl-7{margin-left:58.333333%}.offset-xxl-8{margin-left:66.666667%}.offset-xxl-9{margin-left:75%}.offset-xxl-10{margin-left:83.333333%}.offset-xxl-11{margin-left:91.666667%}}@media (min-width:3000px){.col-xxxl{-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}.col-xxxl-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}.col-xxxl-1{-ms-flex:0 0 8.333333%;flex:0 0 8.333333%;max-width:8.333333%}.col-xxxl-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}.col-xxxl-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}.col-xxxl-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}.col-xxxl-5{-ms-flex:0 0 41.666667%;flex:0 0 41.666667%;max-width:41.666667%}.col-xxxl-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
.col-xxxl-7{-ms-flex:0 0 58.333333%;flex:0 0 58.333333%;max-width:58.333333%}.col-xxxl-8{-ms-flex:0 0 66.666667%;flex:0 0 66.666667%;max-width:66.666667%}.col-xxxl-9{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}.col-xxxl-10{-ms-flex:0 0 83.333333%;flex:0 0 83.333333%;max-width:83.333333%}.col-xxxl-11{-ms-flex:0 0 91.666667%;flex:0 0 91.666667%;max-width:91.666667%}.col-xxxl-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.order-xxxl-first{-ms-flex-order:-1;order:-1}.order-xxxl-last{-ms-flex-order:13;order:13}.order-xxxl-0{-ms-flex-order:0;order:0}.order-xxxl-1{-ms-flex-order:1;order:1}.order-xxxl-2{-ms-flex-order:2;order:2}.order-xxxl-3{-ms-flex-order:3;order:3}.order-xxxl-4{-ms-flex-order:4;order:4}.order-xxxl-5{-ms-flex-order:5;order:5}.order-xxxl-6{-ms-flex-order:6;order:6}.order-xxxl-7{-ms-flex-order:7;order:7}.order-xxxl-8{-ms-flex-order:8;order:8}.order-xxxl-9{-ms-flex-order:9;order:9}.order-xxxl-10{-ms-flex-order:10;order:10}.order-xxxl-11{-ms-flex-order:11;order:11}.order-xxxl-12{-ms-flex-order:12;order:12}
.offset-xxxl-0{margin-left:0}.offset-xxxl-1{margin-left:8.333333%}.offset-xxxl-2{margin-left:16.666667%}.offset-xxxl-3{margin-left:25%}.offset-xxxl-4{margin-left:33.333333%}.offset-xxxl-5{margin-left:41.666667%}.offset-xxxl-6{margin-left:50%}.offset-xxxl-7{margin-left:58.333333%}.offset-xxxl-8{margin-left:66.666667%}.offset-xxxl-9{margin-left:75%}.offset-xxxl-10{margin-left:83.333333%}.offset-xxxl-11{margin-left:91.666667%}}@media (min-width:1900px){.flex-xxl-row{-ms-flex-direction:row !important;flex-direction:row !important}.flex-xxl-column{-ms-flex-direction:column !important;flex-direction:column !important}.flex-xxl-row-reverse{-ms-flex-direction:row-reverse !important;flex-direction:row-reverse !important}.flex-xxl-column-reverse{-ms-flex-direction:column-reverse !important;flex-direction:column-reverse !important}.flex-xxl-wrap{-ms-flex-wrap:wrap !important;flex-wrap:wrap !important}.flex-xxl-nowrap{-ms-flex-wrap:nowrap !important;flex-wrap:nowrap !important}.flex-xxl-wrap-reverse{-ms-flex-wrap:wrap-reverse !important;flex-wrap:wrap-reverse !important}
.flex-xxl-fill{-ms-flex:1 1 auto !important;flex:1 1 auto !important}.flex-xxl-grow-0{-ms-flex-positive:0 !important;flex-grow:0 !important}.flex-xxl-grow-1{-ms-flex-positive:1 !important;flex-grow:1 !important}.flex-xxl-shrink-0{-ms-flex-negative:0 !important;flex-shrink:0 !important}.flex-xxl-shrink-1{-ms-flex-negative:1 !important;flex-shrink:1 !important}.justify-content-xxl-start{-ms-flex-pack:start !important;justify-content:flex-start !important}.justify-content-xxl-end{-ms-flex-pack:end !important;justify-content:flex-end !important}.justify-content-xxl-center{-ms-flex-pack:center !important;justify-content:center !important}.justify-content-xxl-between{-ms-flex-pack:justify !important;justify-content:space-between !important}.justify-content-xxl-around{-ms-flex-pack:distribute !important;justify-content:space-around !important}.align-items-xxl-start{-ms-flex-align:start !important;align-items:flex-start !important}.align-items-xxl-end{-ms-flex-align:end !important;align-items:flex-end !important}
.align-items-xxl-center{-ms-flex-align:center !important;align-items:center !important}.align-items-xxl-baseline{-ms-flex-align:baseline !important;align-items:baseline !important}.align-items-xxl-stretch{-ms-flex-align:stretch !important;align-items:stretch !important}.align-content-xxl-start{-ms-flex-line-pack:start !important;align-content:flex-start !important}.align-content-xxl-end{-ms-flex-line-pack:end !important;align-content:flex-end !important}.align-content-xxl-center{-ms-flex-line-pack:center !important;align-content:center !important}.align-content-xxl-between{-ms-flex-line-pack:justify !important;align-content:space-between !important}.align-content-xxl-around{-ms-flex-line-pack:distribute !important;align-content:space-around !important}.align-content-xxl-stretch{-ms-flex-line-pack:stretch !important;align-content:stretch !important}.align-self-xxl-auto{-ms-flex-item-align:auto !important;align-self:auto !important}.align-self-xxl-start{-ms-flex-item-align:start !important;align-self:flex-start !important}
.align-self-xxl-end{-ms-flex-item-align:end !important;align-self:flex-end !important}.align-self-xxl-center{-ms-flex-item-align:center !important;align-self:center !important}.align-self-xxl-baseline{-ms-flex-item-align:baseline !important;align-self:baseline !important}.align-self-xxl-stretch{-ms-flex-item-align:stretch !important;align-self:stretch !important}}@media (min-width:3000px){.flex-xxxl-row{-ms-flex-direction:row !important;flex-direction:row !important}.flex-xxxl-column{-ms-flex-direction:column !important;flex-direction:column !important}.flex-xxxl-row-reverse{-ms-flex-direction:row-reverse !important;flex-direction:row-reverse !important}.flex-xxxl-column-reverse{-ms-flex-direction:column-reverse !important;flex-direction:column-reverse !important}.flex-xxxl-wrap{-ms-flex-wrap:wrap !important;flex-wrap:wrap !important}.flex-xxxl-nowrap{-ms-flex-wrap:nowrap !important;flex-wrap:nowrap !important}.flex-xxxl-wrap-reverse{-ms-flex-wrap:wrap-reverse !important;flex-wrap:wrap-reverse !important}
.flex-xxxl-fill{-ms-flex:1 1 auto !important;flex:1 1 auto !important}.flex-xxxl-grow-0{-ms-flex-positive:0 !important;flex-grow:0 !important}.flex-xxxl-grow-1{-ms-flex-positive:1 !important;flex-grow:1 !important}.flex-xxxl-shrink-0{-ms-flex-negative:0 !important;flex-shrink:0 !important}.flex-xxxl-shrink-1{-ms-flex-negative:1 !important;flex-shrink:1 !important}.justify-content-xxxl-start{-ms-flex-pack:start !important;justify-content:flex-start !important}.justify-content-xxxl-end{-ms-flex-pack:end !important;justify-content:flex-end !important}.justify-content-xxxl-center{-ms-flex-pack:center !important;justify-content:center !important}.justify-content-xxxl-between{-ms-flex-pack:justify !important;justify-content:space-between !important}.justify-content-xxxl-around{-ms-flex-pack:distribute !important;justify-content:space-around !important}.align-items-xxxl-start{-ms-flex-align:start !important;align-items:flex-start !important}.align-items-xxxl-end{-ms-flex-align:end !important;align-items:flex-end !important}
.align-items-xxxl-center{-ms-flex-align:center !important;align-items:center !important}.align-items-xxxl-baseline{-ms-flex-align:baseline !important;align-items:baseline !important}.align-items-xxxl-stretch{-ms-flex-align:stretch !important;align-items:stretch !important}.align-content-xxxl-start{-ms-flex-line-pack:start !important;align-content:flex-start !important}.align-content-xxxl-end{-ms-flex-line-pack:end !important;align-content:flex-end !important}.align-content-xxxl-center{-ms-flex-line-pack:center !important;align-content:center !important}.align-content-xxxl-between{-ms-flex-line-pack:justify !important;align-content:space-between !important}.align-content-xxxl-around{-ms-flex-line-pack:distribute !important;align-content:space-around !important}.align-content-xxxl-stretch{-ms-flex-line-pack:stretch !important;align-content:stretch !important}.align-self-xxxl-auto{-ms-flex-item-align:auto !important;align-self:auto !important}.align-self-xxxl-start{-ms-flex-item-align:start !important;align-self:flex-start !important}
.align-self-xxxl-end{-ms-flex-item-align:end !important;align-self:flex-end !important}.align-self-xxxl-center{-ms-flex-item-align:center !important;align-self:center !important}.align-self-xxxl-baseline{-ms-flex-item-align:baseline !important;align-self:baseline !important}.align-self-xxxl-stretch{-ms-flex-item-align:stretch !important;align-self:stretch !important}}

	

html {
	scroll-behavior:smooth;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	line-height:1.33333;
}
html, body {
	margin:0;
	padding:0;
	height:100%;
}

/* Responsive images by default */
img {
	max-width: 100%;
}

a {
	text-decoration: underline;
}
a:active,
a:focus,
a:hover {
	text-decoration: underline;
}
nav a,
a.btn,
a:active.btn,
a:focus.btn,
a:hover.btn,
h1 a,
h1 a:active,
h1 a:focus,
h1 a:hover,
h2 a,
h2 a:active,
h2 a:focus,
h2 a:hover,
h3 a,
h3 a:active,
h3 a:focus,
h3 a:hover,
h4 a,
h4 a:active,
h4 a:focus,
h4 a:hover,
.card>a,
.card>a:active,
.card>a:focus,
.card>a:hover,
a.label,
a.label:active,
a.label:focus,
a.label:hover,
a.card-title,
.card-title>a {
	text-decoration: none;
}


::-webkit-scrollbar {
	background:transparent;
}
::-webkit-scrollbar-thumb {
	background:#3F474E !important; 
}
::-webkit-scrollbar-thumb:hover {
	background:#485159 !important; 
}


.btn:disabled {
	cursor:auto;
}

/* Utilty classes */

.center-block {
    width: 100%;
    max-width: 560px;
    padding: 15px;
    margin: auto;
}

.text-transform-none {
	text-transform: none;
}

.truncate-text {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	line-height: 1.4em;
}
.truncate-text[data-lines="2"] {
	line-clamp: 2;
	-webkit-line-clamp: 2;
	max-height: 2.8em;
}
.truncate-text[data-lines="3"] {
	-webkit-line-clamp: 3;
	line-clamp: 3;
	max-height: 4.2em;
}
.truncate-text[data-lines="4"] {
	-webkit-line-clamp: 4;
	line-clamp: 4;
	max-height: 5.6em;
}
.truncate-text[data-lines="5"] {
	-webkit-line-clamp: 5;
	line-clamp: 5;
	max-height: 7.0em;
}
.truncate-text[data-lines="6"] {
	-webkit-line-clamp: 6;
	line-clamp: 6;
	max-height: 8.4em;
}
.truncate-text[data-lines="7"] {
	-webkit-line-clamp: 7;
	line-clamp: 7;
	max-height: 9.8em;
}
.truncate-text[data-lines="8"] {
	-webkit-line-clamp: 8;
	line-clamp: 8;
	max-height: 11.2em;
}
.truncate-text[data-lines="9"] {
	-webkit-line-clamp: 9;
	line-clamp: 9;
	max-height: 12.6em;
}
.truncate-text[data-lines="10"] {
	-webkit-line-clamp: 10;
	line-clamp: 10;
	max-height: 14.0em;
}

.img-overlay-wrapper {
	position:relative;
}
.img-overlay {
	position:absolute;
	z-index:1;
	width:100%;
	height:100%;
	top:0;
	left:0;
}






.navbar-nav > .nav-item > a {
	position:relative;
}
.navbar-nav > .nav-item > a > .badge {
    position: absolute;
    right: 0px;
    top: 4px;
    z-index: 1;
}


h1 {
	font-size:84px;
}

body {
	overflow-x:hidden;
	overflow-y:auto;
}

/*
html.it-carousels>body {
	display: flex;
	flex-flow: column;
	align-items: stretch;
}
*/
html.it-carousels>body {
	overflow-x:hidden;
	overflow-y:scroll;
	-webkit-overflow-scrolling: touch;
}
html.hub_play,
html.hub_play>body {
	background-color:#000; /* important to have this set on the <html> element for Safari in full-screen mode on non 16:9 displays */
	width:100vw!important;
	overflow:hidden;
}
html.play-on-page-loading > body,
html.play-on-page-ready > body {
	overflow-y:hidden;
}


/* Old: before Kinescope */
/*
html.hub_play .outerWrapper {
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	position: relative;
	top:50%; 
	margin-top:-28.125%;
}
*/

/* New: since Kinescope */
.outerWrapper {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}


/* Live stream player with live chat should get full view height */
html.hub_play .video-chat-wrapper {
	min-height: 100vh;
}


@media (min-aspect-ratio: 16/9) {
	html.hub_play .outerWrapper {
		top: 0;
		margin-top: 0;
		max-width: 177.78vh;
		left: 50%;
		margin-left: -88.9vh;
	}
	#playOnPage .outerWrapper {
		max-width: 177.78vh;
		margin:0 auto;
	}
}

.videoWrapper {
	position: relative;
}

/* Standard responsive behaviour */
.videoWrapper.videoWrapper-responsive {
	padding-bottom: 56.25%; 
	height: 0; 
	max-width: 100%; 
	overflow: hidden;
}
.videoWrapper.videoWrapper-responsive > iframe[data-vsp] {
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%;
}


/* Typical for embedded looped muted auto-play videos */
.videoWrapper.videoWrapper-cover {
	position: relative; 
    overflow: hidden;
    padding: 0;
	height: 100%;
}

.videoWrapper.videoWrapper-cover > iframe[data-vsp] {
	box-sizing: border-box;
	top:-16.6667%;
	/*
    left: 50%;
    min-height: 100%;
    min-width: 100%;
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
	*/
	
	/* Default, also for .videoWrapper.videoWrapper-cover.aspect-tall */
/*    height: 100%; 
	width: 177.777778%; */
}
/*
.videoWrapper.videoWrapper-cover.aspect-wide > iframe {
	width: 100%;
	height: 177.777778%; 
}
*/
.videoWrapper.videoWrapper-cover.aspect-tall > iframe[data-vsp] {
	top:0%;
	left:-39%; /* why 39% ? No idea, but it works for Kaboom */
	height:100%;
	width:177.777778%; 
}

/* New: before Kinescope */
/*
html.hub_play .videoWrapper {
	position: relative;
	padding-bottom: 200%;
	transform: translateY(-35.95%);
}
*/
/* New: since Kinescope */
html.hub_play .videoWrapper,
#playOnPagePlayer .videoWrapper {
	transform:none;
	padding-bottom: 56.25%; 
	height: 0;
}

html.hub_play .videoWrapper.videoWrapper-youtube {
	position:static;
	padding-bottom: 0;
	transform: none;
}

/* Maximize the size of the video player iframe on the hub/play page and on the playOnPage overlay */
html.hub_play iframe[data-vsp],
#playOnPagePlayer iframe[data-vsp] {
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%;
}




/* An overlay to catch pointer events that would otherwise be uncatchable (used in the background player) */
.ctl-overlay-pointer-events {
	position:absolute;
	z-index:200;
	width:100%;
	height:100%
}

/* Positioning of iframe-overlaying player controls: */
.ctl-overlay {
	background-color:transparent;
	border:none;
	outline:none;
	color:#fff;
	position:absolute;
	z-index:200;
	opacity:0;
	transition: opacity 0.3s ease-out;
}
.ctl-overlay-shadow {
	text-shadow: 1px 1px 2px black, 0 0 30px black;
}
.ctl-overlay-button {
	opacity:0;
}
.ctl-overlay-button:hover {
	opacity:0.75;
	text-shadow: 1px 1px 2px black, 0 0 30px black, 0 0 6px white;
}



.ctl-overlay-top {
	top:0%;
}
.videoWrapper-youtube .ctl-overlay-top {
	top:4.5%; /* 0% would be the actual top, but we leave some space for YouTube's title bar / share buttons that cannot be hidden */
}

.videoWrapper-youtube .ctl-overlay-youtube-cover-title-link {
	top:0%;
	height:100px;
	width:90%;
}

.ctl-overlay-middle {
	top:50%;
}
.ctl-overlay-bottom {
	bottom:35.95%;
}
.videoWrapper-youtube .ctl-overlay-bottom {
	bottom:0%;
}


.ctl-overlay-h-center {
	left:50%;
}
.ctl-passive {
	pointer-events:none;
}
.ctl-overlay-g1x1 {
	height:100px;
	width:100px;
}
.ctl-overlay-gl1 {
	left:100px;
}
.ctl-overlay-gr0 {
	right:0;
}

.ctl-overlay-g1x1.ctl-overlay-middle {
	margin-top:-50px;
}
.ctl-overlay-g1x1.ctl-overlay-h-center {
	margin-left:-50px;
}


/* Portrait */
@media only screen 
  and (max-device-width: 812px) 
  and (orientation: portrait) { 

	#btnSkipToPrevious,
	#btnSkipToNext {
		top:45%;
	}
	  
	.ctl-overlay-g1x1 {
		height:60px;
		width:60px;
	}
	.ctl-overlay-gl1 {
		left:60px;
	}

	.ctl-overlay-g1x1.ctl-overlay-middle {
		margin-top:-30px;
	}
	.ctl-overlay-g1x1.ctl-overlay-h-center {
		margin-left:-30px;
	}	  
	  
}

/* Landscape */
@media only screen 
  and (max-device-width: 812px) 
  and (orientation: landscape) { 
	  
	.ctl-overlay-g1x1 {
		height:60px;
		width:60px;
	}
	.ctl-overlay-gl1 {
		left:60px;
	}

	.ctl-overlay-g1x1.ctl-overlay-middle {
		margin-top:-30px;
	}
	.ctl-overlay-g1x1.ctl-overlay-h-center {
		margin-left:-30px;
	}

}


.videoWrapper #btnExit {
	left:0;
}
.videoWrapper #btnFullscreen {
	right:0;
}
.videoWrapper #btnSkipToPrevious {
	left:0;
	top:47.5%;
}
.videoWrapper #btnSkipToNext {
	right:0;
	top:47.5%;
}

/* Do not display previous/next buttons if the 'playlist' consists of a single film */
html.playlist-singular #btnSkipToPrevious,
html.playlist-singular #btnSkipToNext {
	display:none;
}

.videoWrapper .player-timeline {
	height:100px;
	width:calc(100% - 200px);
	left:100px;
}
.videoWrapper .player-timeline-gutter-ctl {
	position:absolute;
	top:50%;
	height:16px;
	margin-top:-8px;
	width:100%;
	/* background-color:rgba(0,255,255,0.5); uncomment to find interactive area */
}
.player-pseudo-live.player-allow-seek .player-timeline-gutter-ctl {
	cursor:pointer;
}

.videoWrapper .player-timeline-gutter {
	position:absolute;
	top:50%;
	height:4px;
	margin-top:-2px;
	width:100%;
	background-color:rgba(0.4,0.4,0.4,0.4);
}
.videoWrapper .player-timeline-progress {
	position:absolute;
	height:100%;
	background-color:#ff0000;
/*	transition:width 0.24s; */
}
.videoWrapper .player-timeline-progress-knob-ctl {
	position:absolute;
	right:-16px;
	top:2px;
	height:40px;
	width:32px;
	margin-top:-20px;
	/* background-color:rgba(255,0,255,0.5); uncomment to find interactive area */
}
.player-pseudo-live.player-allow-seek .player-timeline-progress-knob-ctl {
	cursor:pointer;
}
.videoWrapper .player-timeline-progress-knob-ctl:hover .player-timeline-progress-knob {
	-webkit-box-shadow: rgba(255,255,255,0.8) 0px 0 6px;
	-moz-box-shadow: rgba(255,255,255,0.8) 0px 0 6px;
	box-shadow: rgba(255,255,255,0.8) 0px 0 6px;
}

.videoWrapper .player-timeline-progress-knob {
	position:absolute;
	left:50%;
	top:50%;
	height:16px;
	width:16px;
	margin-left:-8px;
	margin-top:-8px;
	background-color:#fff;
	border-radius:8px;
	pointer-events:none;
}
/* mmr = mouse movement registered (controlled by hub.js) */
html.mmr .ctl-overlay {
	opacity:1;
}

/* OLD: before Kinescope:
html.playback .outerWrapper {
	padding-bottom: 0;
	height: 100%;
	overflow: hidden;
	position: relative;
}
*/
/* New: since Kinescope */
html .outerWrapper {
	padding-bottom: 0;
	height: 100%;
	overflow: hidden;
	position: relative;
}


html.playback .videoWrapper {
	position: relative;
	padding-bottom: 56.25%;
	transform: translateY(0);
}




html.playback iframe[data-vsp] {
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%;
	/* pointer-events:none; this trick used to work, but it doesn't work well with touch devices so we're dropping it */
}
/* mmr = mouse movement registered (controlled by hub.js) */
html.playback.mmr iframe[data-vsp] {
	pointer-events:all;
}
html.playback .ctl-overlay-top {
	top:0;
}
html.playback .ctl-overlay-bottom {
	bottom:0;
}

.videoWrapper .start-overlay {
	position:absolute;
	z-index:100;
	height:100%;
	width:100%;
	display:flex;
	align-items:center;
	justify-content: center;
	cursor:pointer;
	background-color:rgba(0,0,0,0.3);
	color:#fff;
}
html.browser-other .videoWrapper #btnFullscreen {
	cursor:pointer;
	pointer-events:none;
}
html.browser-other.playback .videoWrapper #btnFullscreen {
	pointer-events:all; /* once the player has started playing, the fullscreen button is permitted to receive clicks to re-enable fullscreen mode later on */
}
	

@media (display-mode: fullscreen) {
	.start-overlay {
		display:none;
	}
	.player-browser #btnFullscreen {
		opacity:0;
	}
}


html.browser-other .videoWrapper .start-overlay {
	pointer-events:none; 
}
html.browser-safari .videoWrapper .start-overlay {
	pointer-events:all;
}
/* This was added on 19-10-2020 due to reports that the player would not start. If this fix causes other problems, look for this date: 19-10-2020 in hub.js and hub.css */
html.browser-other.paused .player-browser .videoWrapper .start-overlay {
	pointer-events:all; 
}

/* The Vimeo player for Safari has its own full screen button, so hide ours: */
html.browser-safari .player-browser .videoWrapper #btnFullscreen {
	display:none!important;
}



/* Make the background player iframe receive no pointer events, to avoid showing controls on the YouTube player */
.videoWrapper-youtube iframe.player-background {
	pointer-events:none!important;
}

/* Preview on hover */
.fc-preview-on-hover-target .not-ready {
	opacity:0.001;
	position:absolute;
}




nav.navbar-main {
	flex: 0 1 auto;
}


.page-content {
	padding:20px 50px;
	position:relative;
}

/*
html.it-carousels .page-content {
	flex: 1 1 auto; 
	padding:0;
}
*/

.btn-blank {
	border:none;
	background:none;
	outline:none;
}
.btn-back {
	padding:30px;
	margin-left:-30px;
	font-size:22px;
	color:#888;
}
.btn-back>i {
	margin-right:10px;
}
.btn-back .hover-text {
	display:inline-block;
	vertical-align: middle;
	margin-top:-1em;
	transition: opacity 0.15s ease-out;
	opacity:0;
}
.btn-back:hover .hover-text {
	opacity:1;
}

/* Page content loading animation */

.page-loading {
	display:flex;
	align-items:center;
	height:100%;
}

.spinner {
  margin: 100px auto 0;
  width: 70px;
  text-align: center;
}

.spinner > div {
  width: 18px;
  height: 18px;
  background-color: #333;

  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}


.fit-w-100-wrapper {
	font-size:5vw;
}
.fit-wm-80,
.fit-w-100 {
	white-space:nowrap;
}



.browse-group {
	margin:0 -50px;
/*	max-width:100%; */
	padding-top:30px;
	position:relative;
}

button:focus {
	outline:0 !important;
}

.browse-left {
	left:0;
}

.browse-right {
	right:0;
}

button.browse-lr {
	border:none;
	outline:none;
}
.browse-lr {
	display:flex;
	align-items: center;
	position:absolute;
	top:0;
	width:50px;
	height:100%;
	cursor:pointer;
	opacity:0;
	font-size:35px;
	z-index:140;
	text-align:center;
	webkit-justify-content: center;
	justify-content:center;
	display:webkit box;
	display:webkit flex;
	display:moz box;
	display:ms flexbox;
	display:flex;
	color:#fff;

	transition: opacity 0.15s ease-out;
	pointer-events:none;
}
.browse-lr.active {
	pointer-events:all;
}
.browse-lr.active:hover {
	opacity:1;
}

.group-title {
	margin:0.75em 0;
}
.browse-group .group-title {
	padding:0 50px;
}
h2.group-title .group-subtitle {
	font-size: 1.2rem;
}
blockquote,.primary-description {
	font-size:1.25rem;
}
.primary-description {
	margin:0.75em 0 0 0;
	text-align:justify;
	max-width:1200px;
}
html.it-carousels .catalog-wrapper .primary-description {
	padding:0 50px;
}
.primary-actions {
	font-size:2.25rem;
}
.primary-actions .label {
	border-width:2px;
	text-transform:none;
}

.label {
	border-width:1px;
	border-style:solid;
	border-radius:3px;
	text-transform: uppercase;
	padding:0px 6px;
	margin:0px 3px;
	font-size:80%;
	white-space: nowrap;
}

.label-sm {
	font-size:60%;
}

.label-modest {
	border-color:#666;
	color:#666;
}

.label-danger {
	border-color:#d32f2f;
	color:#d32f2f;
}
.label-info {
	border-color:#0097A7;
	color:#0097A7;
}
.label-success {
	border-color:#388E3C;
	color:#388E3C;
}
.label-live-now {
	background-color:#d00000;
	border-color:#e4e4e4;
	color:#e4e4e4;
}
.label-live-soon {
	background-color:#500000;
	border-color:#dadada;
	color:#dadada;
}
.label-vote-now {
	background-color:#DF5019;
	border-color:#DF5019;
	border-radius:12px;
	color:#fff;
	padding:3px 6px;
	font-weight: bold;
}


.geoblocked {
	color:#d32f2f;
	font-size:80%;
	font-weight: bold;
}

.films-to-be-revealed {
	margin-top:30px;
	margin-bottom:30px;
	display:flex;
}
.films-to-be-revealed>span {
	padding:10px 15px;
	white-space: normal;
	text-align:justify;
}

.module-section {
	max-width: 100%;
	overflow: hidden;
	position:static;
}
.module-section>.rgrad {
	position:absolute;
	height:100%;
	z-index:50;
	top:0;
	right:0;
	width:160px;
	pointer-events:none;
}

.browse-group ul.browse-group-content {
    position: relative;
    width: 100%;
    overflow-x: scroll;
    overflow-y: visible;
	-webkit-overflow-scrolling: touch;
    white-space: nowrap;
	list-style-type:none;
	margin:0 0 -50px 0; /* negative bottom margin needed to smuggle away the horizontal scrollbar */
	padding:30px 50px 80px 50px; /* top/bottom padding space needed for the card hover scale transform, additional bottom padding to compensate for the negative bottom margin, left/right padding matches the page margins */
}
.browse-group ul>li {
    display: inline-block;
    vertical-align: top;
    transition: background .4s;
    color: #000;
	font-size: 12px;
	white-space: normal;
}


.browse-group .card {
	overflow:hidden;
	width:350px;
	height:308px;
	margin-right:7px;
	cursor:pointer;
	transform: scale(1);
	visibility:visible;
	-moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.5);
	border:none;
	font-size:14px;
}

.browse-group .card-body {
	padding:0.25rem;
}
.browse-group .card-title-tags {
	font-size:1.33rem;
}
.browse-group .card-title,
.browse-group .card-subtitle {
	margin:0;
}
.browse-group .card-subtitle {
	font-size:95%;
}
@media (hover: hover) {
	.browse-group .card:hover{
		cursor:pointer;
		transform: scale(1);
		visibility:visible;
		transition: all .2s ease-in-out;
		transform: scale(1.1); 
		z-index:100;
		transition-timing-function:cubic-bezier(0.5, 0, 0.1, 1);
		transition-duration:400ms;

		-moz-box-shadow: 0px 3px 18px 0px rgba(0,0,0,0.5);
		-webkit-box-shadow: 0px 3px 18px 0px rgba(0,0,0,0.5);
		box-shadow: 0px 3px 18px 0px rgba(0,0,0,0.5);
	}
}
.browse-group .card>a {
	width:100%;
	height:100%;
	display:block;
	position:relative;
}

.inside-details {
	width:100%;
	height:60px;
	position:absolute;
	top:268px;
	padding:0 4px;
	left:0;
	z-index:100;
	color:#dadada;
	white-space:normal;
	text-align:left;
}


/* Appearance of typed content */
.a-pl-title {
	position:inline-block;
	border-width:1px;
	border-style:solid;
	border-radius:3px;
	text-transform: uppercase;
	padding:0px 6px;
	margin:0px 3px;
	font-size:80%;
	white-space: nowrap;
	border-color:#666;
	color:#666;
}

/* Wrappers around typed content */
.it-carousels .w-pl-title {
	font-size:1.2rem;
}

.w-pl-title .fa {
	color: #666;
	font-size:70%;
}


/* Various reasons to hide content */
.d-group-all-items-hidden,
.d-geoblocked,
.d-live, /* only visible if the playback mode (hubLiveMode) of a viewing is 'live' (live program) */
.d-live-inline, /* only visible if the playback mode (hubLiveMode) of a viewing is 'live' (live program) */
.d-live-inline-block, /* only visible if the playback mode (hubLiveMode) of a viewing is 'live' (live program) */
.d-on-demand, /* only visible if the playback mode (hubLiveMode) of a viewing is 'on-demand' (VOD program) */
.d-on-demand-inline, /* only visible if the playback mode (hubLiveMode) of a viewing is 'on-demand' (VOD program) */
.d-on-demand-inline-block, /* only visible if the playback mode (hubLiveMode) of a viewing is 'on-demand' (VOD program) */
.d-collection, /* only visible if the playback mode (hubLiveMode) of a viewing is 'collection' (VOD film collection) */
.d-collection-inline, /* only visible if the playback mode (hubLiveMode) of a viewing is 'collection' (VOD film collection) */
.d-collection-inline-block, /* only visible if the playback mode (hubLiveMode) of a viewing is 'collection' (VOD film collection) */
.d-pass-needed, /* only visible if a higher element has [data-show-pass-needed="true"] */
.d-film-all-viewings-closed, /* hides the play button for an individual film if all its viewings are currently closed (or unlisted) */
.d-item-not-highlighted, /* hides an item in a 'Highlights' section if it is currently not highlighted */
.d-cart-empty /* hides the shopping cart icon if the cart is empty */
{
	display:none;
}
.d-viewing-closed, /* hides content if the related viewing is not available */
.d-on-demand-blocked, /* hides the play button for an individual film if the viewer is not allowed to watch individual films */
.d-viewing-unlisted, /* hides a viewing based on its state and the applicable stateSettings */
[data-state-type="browseAccessDenied"] /* hide any content to which the user has no browse access (and should not have been built in the first place!) */
{
	display:none!important;
}

/* Data attribute based visibility of the PLAY button for viewings */
[data-live-mode="collection"] .btn-viewing-play, /* a VOD film collection is not intended to be played in its entirety */ 
[data-show-btn-play="false"] .btn-viewing-play {
	display:none;
}

[data-show-pass-needed="true"] .d-pass-needed {
	display:block;
}

[data-live-mode="live"] .d-live {
	display:block;
}
[data-live-mode="live"] .d-live-inline {
	display:inline;
}
[data-live-mode="live"] .d-live-inline-block {
	display:inline-block;
}
[data-live-mode="on-demand"] .d-on-demand {
	display:block;
}
[data-live-mode="on-demand"] .d-on-demand-inline {
	display:inline;
}
[data-live-mode="on-demand"] .d-on-demand-inline-block {
	display:inline-block;
}
[data-live-mode="collection"] .d-collection {
	display:block;
}
[data-live-mode="collection"] .d-collection-inline {
	display:inline;
}
[data-live-mode="collection"] .d-collection-inline-block {
	display:inline-block;
}

/* Elements with a 'live-info' class get dynamically rendered live information about a viewing's current/soon availability.
   If the element is empty, it should not be displayed. This may seem redundant, but in a flex box, the empty 'live-info' element
   will still affect the way the other children of the flex box are shown. */
.live-info {
    margin-bottom:1rem;
}
.live-info:empty {
	display:none;
}



html.hub_film-details .btn-viewing-play {
	font-size:1.5rem;
}
html.hub_film-details .btn-film-play {
	font-size:1.0rem;
}



/* For viewing items (i.e. films), the card footer is only used for verical alignment, no need to give it an accent color */
.viewing-items .card>.card-footer {
	background-color:transparent;
	border-top:none;
}



/* Spotlight */
.spotlight-container {
	position:relative;
	min-height:42.7vw;
	margin-bottom:50px;
}
.spotlight-container:empty {
	display:none;
}
.spotlight-container .spotlight-bg-vis {
	position:absolute;
	top:0;
	z-index:-2;
	width:100%;
	height:42.7vw;
	overflow:hidden;
}
.spotlight-container .spotlight-bg-vis>img {
	width:100%;
	margin-top:-5%;
	max-width: inherit; /* allow oversizing the image */
}
.spotlight-container .spotlight-bg-vis>iframe {
	width:131.7073%; /* = 100 * (16/9) / (1920/820) */
	height:74.085vw;
	margin-top:-16%;
}
.spotlight-container .spotlight-bg-vis>iframe.not-ready {
	opacity:0.01;
	margin-top:1000px;
}
.spotlight-container .spotlight-bg-grad {
	position:absolute;
	top:0;
	z-index:-1;
	width:100%;
	height:42.7vw;
}
.spotlight-container .spotlight-overlay {
	position:relative;
	padding:21.35vw 50px 0 50px;
}
.spotlight-container .spotlight-actions {
	font-size:1.5em;
}
.spotlight-container .spotlight-subtitle {
	margin-top:-0.333em;
}
.spotlight-container .spotlight-description {
	margin:0.75em 0 0 0;
	color:#e4e4e4;
	text-align:justify;
	font-size:1.3rem;
	width:66.667%;
	min-width:640px;
}




.viewing-subtitle {
	margin-top:-0.333em;
}


/* Portrait */
@media only screen 
	and (min-device-width: 375px) 
	and (max-device-width: 812px) 
	and (orientation: portrait) {
}

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

	html .page-content {
		padding:20px 3vw;
	}
	.browse-group {
		margin:0 -3vw;
	}
	.browse-group .group-title {
		padding:0 3vw;
	}
	
	html.it-carousels .catalog-wrapper .primary-description {
		padding:0 3vw;
	}
	/* Left/right padding matches the page margins: */
	.browse-group ul.browse-group-content {
		padding-left:3vw;
		padding-right:3vw;
	}
	.browse-group .card {
		max-width:350px;
		width:36vw;
		margin-right:8px;
	}
		
	h1 {
		font-size:48px;
	}
		
	.module-section {
		position:relative; /* LR buttons get only the heaight of the horizontal scrolling block */
	}
		
	blockquote,.primary-description {
		font-size:1.1rem;
	}
	.primary-description {
		width:100%;
		min-width:inherit;
	}
		
	.spotlight-container .spotlight-description {
		width:75%;
		min-width:inherit;
		font-size:1.2rem;
	}
		
}

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

	.navbar {
		padding: 2vw 2vw;
	}
		
	.browse-group {
		margin:0 -2vw;
		padding-top:0px;
	}
	.browse-group .group-title {
		padding:0 2vw;
	}
	h2.group-title {
		font-size: 2.0rem;
	}		
	.primary-description {
		width:100%;
		min-width:inherit;
		font-size:1.0rem;
	}
	/* Left/right padding matches the page margins: */
	.browse-group ul.browse-group-content {
		padding-left:2vw;
		padding-right:2vw;
	}
	.browse-group .card {
		width:42vw; /* was 48vw to nicely place the first two films of a program in the center, but it made people lose the cue to scroll horizontally */
		margin-right:2vw;
	}
		
	.module-section>.rgrad {
		width:80px;
	}
	
	.spotlight-container {
		min-height:56.25vw; /* Switch to 16:9 background player on portrait phone/tablet */
	}
	.spotlight-container .spotlight-bg-grad,
	.spotlight-container .spotlight-bg-vis {
		height:56.25vw; /* Switch to 16:9 background player on portrait phone/tablet */
	}
		
	.spotlight-container .spotlight-bg-vis>img {
		margin-top:0;
	}
	.spotlight-container .spotlight-bg-vis>iframe {
		margin-top:0;
	}

	.spotlight-container .spotlight-overlay {
		padding:25vw 2vw 0vw 2vw;
	}
		
	.spotlight-container .spotlight-description {
		width:100%;
		min-width:inherit;
		font-size:1.1rem;
	}
		
}


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

	.navbar {
		padding: 2vw 2vw;
	}
		
	.browse-group {
		margin:0 -2vw;
		padding-top:0px;
	}

	h2.group-title {
		font-size: 1.75rem;
	}		
	.primary-description {
		width:100%;
		min-width:inherit;
	}
	/* Left/right padding matches the page margins: */
	.browse-group ul.browse-group-content {
		padding-left:2vw;
		padding-right:2vw;
	}
	.browse-group .card {
		width:84vw; /* was 96vw to nicely place the first film of a program in the center, but it made people lose the cue to scroll horizontally */
		margin-right:4vw;
	}
		
	.browse-lr {
		width:16vw;
	}
		
		
	.spotlight-container .spotlight-overlay {
		padding:10vw 2vw 0vw 2vw;
	}
}


/* ==========================================================================
   Filmchief cookie banner overlay
   ========================================================================== */
#cookiesBanner {
	position:fixed;
	display:flex;
	align-items: center;
	justify-content: center;
	left:15px;
	right:15px;
	bottom:15px;
	background-color:rgba(0,0,0,0.8);
	z-index:999999;
	color:#fff;
	gap:5px;
}
@media only screen and (max-width: 575px) {
	#cookiesBanner {
		flex-direction:column;
	}
	#cookiesBanner button {
		margin:15px 0 0 0;
	}	
}
#cookiesBanner a {
	color:#fff;
	text-decoration:underline;
}
#cookiesBanner p {
	margin:0 15px 0 0;
}

/* ==========================================================================
   Filmchief Synchronized Session Sign In Overlay
   ========================================================================== */
#fcSsoSignInOverlay {
	position:fixed;
	display:flex;
	align-items: center;
	justify-content: center;
	top:0;
	left:0;
	width:100vw;
	height:100vh;
	background-color:rgba(0,0,0,0.8);
	z-index:100000;
}
#fcSsoSignInOverlay>h3 {
	color:#eeeeee;
}


/* ==========================================================================
   Voting
   ========================================================================== */

.voting-indicator {
	position:absolute;
	top:30px;
	right:30px;
}
.animate-ripple {
    animation: at-ripple 0.6s linear infinite;
}

@-webkit-keyframes at-ripple {
  0% {
    box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 0 rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1);
  }
  100% {
    box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1), 0 0 0 20px rgba(102, 102, 102, 0);
  }
}
@keyframes at-ripple {
  0% {
    box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 0 rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1);
  }
  100% {
    box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1), 0 0 0 20px rgba(102, 102, 102, 0);
  }
}

.ballot-film {
	margin: 10px 0;
}

.ballot-film-thumb {
	margin-right:8px;
	float:left;
	max-width:75px;
}

.ballot-film .form-check-inline .form-check-input {
    margin-right: 0;
	cursor: pointer;
}
.ballot-film .form-check-inline .form-check-label {
    padding-left: .3125rem; /* left padding on the label instead of right margin on the input to make the radio easier to click on */
}
/* Voting for individual films */

.vt-film-control[data-state="vt-not-applicable"] {
	display:none;
}


/* Auto read more */
.fc-auto-read-more {
	overflow:hidden;
	position:relative;
	max-height:15px;
}
.fc-arm-control {
	position:absolute;
	bottom:0;
	width:100%;
	height:75px;
	padding-top:5px;
	text-align:center;
	display:none;
}
.fc-auto-read-more.fc-arm-active .fc-arm-control {
	display:block;
	pointer-events:none;
}
.fc-arm-gradient {
	height:50px;
	pointer-events:none;
	
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+100 */
	background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.fc-auto-read-more.fc-arm-expanded .fc-arm-gradient {
	visibility:hidden;
}
.fc-arm-expand {
	background-color:#fff;
	display:block;
	height:25px;
	pointer-events:all;
}


/* ==========================================================================
   Saved films (My films)
   ========================================================================== */
.btn-saved-films-toggle .unset-saved,
.btn-saved-films-toggle.saved .set-saved {
	display:none;
}
.btn-saved-films-toggle .set-saved,
.btn-saved-films-toggle.saved .unset-saved {
	display:inline;
}

/* ==========================================================================
   Search and filters
   ========================================================================== */

#searchInput::placeholder {
	font-size:1.1rem;
}
label {
	cursor:pointer;
}


.search-results>.card {
	-webkit-box-flex: 0;
	margin-bottom:1em;
	margin-left:1%;
	margin-right:1%;
}
	
@media (min-width: 34em) {
	.search-results>.card {
		-ms-flex: 0 0 98%;
		flex: 0 0 98%;
		max-width: 98%;
	}
}

@media (min-width: 40em) {
	.search-results>.card {
		-ms-flex: 0 0 48%;
		flex: 0 0 48%;
		max-width: 48%;
	}
}

@media (min-width: 48em) {
	.search-results>.card {
		-ms-flex: 0 0 48%;
		flex: 0 0 48%;
		max-width: 48%;
	}
}

@media (min-width: 62em) {
	.search-results>.card {
		-ms-flex: 0 0 31.3333333%;
		flex: 0 0 31.3333333%;
		max-width: 31.3333333%;
	}
}

@media (min-width: 75em) {
	.search-results>.card {
		-ms-flex: 0 0 23%;
		flex: 0 0 23%;
		max-width: 23%;
	}
}

@media (min-width: 88em) {
	.search-results>.card {
		-ms-flex: 0 0 18%;
		flex: 0 0 18%;
		max-width: 18%;
	}
}
.filters-clear-button {
	display:none;
}
.filters-panel.active .filters-clear-button {
	display:block;
}
.filters-panel-control {
	display:flex;
	gap:20px;
}
.filters-panel-control a,
.filters-panel-control a:active,
.filters-panel-control a:focus,
.filters-panel-control a:hover {
	text-decoration:none;
}
.filters-panel-toggle > .filters-panel-hide,
.filters-panel-toggle.collapsed > .filters-panel-show {
	display:inline;
}
.filters-panel-toggle > .filters-panel-show,
.filters-panel-toggle.collapsed > .filters-panel-hide {
	display:none;
}
.filter-input-wrapper {
	margin-bottom:15px;
}
.filter-input,
.filter-input:active,
.filter-input:focus,
.filter-input:hover {
	text-decoration:none;
}

/* ==========================================================================
   Industry Marketplace
   ========================================================================== */

.im-banner {
	margin-bottom:20px;
}
.im-categories {
	margin-bottom:30px;
	font-size:1.2rem;
}

/* ==========================================================================
   Handlebars templates
   ========================================================================== */

/* Template html that is intended for compilation by Handlebars.js is not supposed to be shown: */
.handlebars-templates,
.handlebars-template {
	display:none;
}




/* ==========================================================================
   Comments
   ========================================================================== */

.cm-item {
	margin-top:0.6em;
}
.cm-avatar {
	max-width:40px;
	margin-right:0.5em;
}
.cm-avatar>img {
	border-radius:50%;
}
.cm-msg>*:first-child {
	margin-top:0;
}
.cm-msg>*:last-child {
	margin-bottom:0;
}
.cm-actions {
	display:none;
}
.cm-add.active .cm-actions {
	display:block;
}
div.form-control.cm-editor {
	height:auto!important;
	max-height:24em!important;
	overflow-y:auto;
}
.cm-editor[placeholder]:empty::before {
    content: attr(placeholder);
    color: rgba(128, 128, 128, 0.5); 
}
.cm-editor[placeholder]:empty:focus::before {
    content: "";
}
.cm-dn {
	font-size:0.9em;
	font-weight:bold;
}
.cm-ctl {
	opacity:0.6;
	font-size:0.8em;
	margin-bottom:0.3em;
}
.cm-msg {
	font-size:0.9em;
	margin-bottom:0.6em;
}
a.cm-btn-delete {
	display:inline-block;
    color: rgba(128, 128, 128, 0.75);
	margin-left:0.2em;
}

/* ==========================================================================
   Hub / Online resource editor
   ========================================================================== */

.hub-edit-navbar {
	display:none;
	position:fixed;
	z-index:1000000;
	left: 50%;
	top:0;
	transform: translateX(-50%);
	background-color:rgba(255,255,255,0.95);
	border-left:1px solid #cacaca;
	border-right:1px solid #cacaca;
	border-bottom:1px solid #cacaca;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	padding:1px 5px;
}
html.has-onrs .hub-edit-navbar,
.hub-edit-navbar-visible {
	display:block;
		
}
.hub-edit-link {
	display:none;
}

.hub-edit-navbar > a {
	border-right: 1px solid rgba(128,128,128,0.5);
	padding:0 5px;
}
.hub-edit-navbar > a:last-child {
	border-right:none;
}

html.has-onrs .hub-edit-link {
	display:inline;
}

/* Neutralize the appearance of the Edit link */
a.onrs-edit,
.hub-edit-navbar a {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	color:rgba(72,134,243,1);
	text-decoration:none;
	text-transform:none;
	line-height: 1.428571429;
	font-size:13px;
	font-weight:normal;
}
a.onrs-edit:focus,
a.onrs-edit:hover,
.hub-edit-navbar a:focus,
.hub-edit-navbar a:hover {
	color:rgba(72,134,243,0.75);
	text-decoration:none;
}
.onrs-edit+.onrs-edit-wrapper {
	-webkit-transition: color 2s, outline-color .15s ease-out, background-color .15s ease-out;
    -moz-transition: color 2s, outline-color .15s ease-out, background-color .15s ease-out;
    -o-transition: color 2s, outline-color .15s ease-out, background-color .15s ease-out;
    transition: color 2s, outline-color .15s ease-out, background-color .15s ease-out;
	background-color:rgba(72,134,243,0);
	outline:4px solid rgba(72,134,243,0);
}
.onrs-edit:hover+.onrs-edit-wrapper {
	background-color:rgba(72,134,243,0.2);
	outline-color:rgba(72,134,243,0.4);
}

.ticketing-info {
	font-size: 1.25rem;
}

.group-title>.ticketing-info {
	margin-top:0.25em;
}

/* ==========================================================================
   Filmchief snackbar
   ========================================================================== */
/* use the 'show-fc-snackbar' class to transform any element to a snackbar that is shown immediately */
.show-fc-snackbar {
	display:none;
}
.fc-snackbar {
	position:fixed; 
	z-index:99999; 
	min-width:50px;
	max-width:600px;

	/* Inactive: */	
	opacity:0;
	
    -webkit-transition-property: margin, opacity, top, bottom; /* Safari */
    transition-property: margin, opacity, top, bottom;
    -webkit-transition-duration: 0.3s; /* Safari */
    transition-duration: 0.3s;	
}
.fc-snackbar.fc-snackbar-left-top,
.fc-snackbar.fc-snackbar-left-middle,
.fc-snackbar.fc-snackbar-left-bottom {
	left:15px; 
}
.fc-snackbar.fc-snackbar-center-top,
.fc-snackbar.fc-snackbar-center-middle,
.fc-snackbar.fc-snackbar-center-bottom {
	left:50%; 
}
.fc-snackbar.fc-snackbar-right-top,
.fc-snackbar.fc-snackbar-right-middle,
.fc-snackbar.fc-snackbar-right-bottom {
	right:15px; 
}
.fc-snackbar.fc-snackbar-left-top,
.fc-snackbar.fc-snackbar-center-top,
.fc-snackbar.fc-snackbar-right-top {
	margin-top:-50px;
}
.fc-snackbar.fc-snackbar-left-bottom,
.fc-snackbar.fc-snackbar-center-bottom,
.fc-snackbar.fc-snackbar-right-bottom {
	margin-bottom:-50px;
}

.fc-snackbar-body {
	position:relative; 
	padding:10px 15px;
	border-style:solid;
	border-width:2px;
	border-radius:20px;
	-webkit-box-shadow: 0 3px 9px rgba(0,0,0,.5);
	box-shadow: 0 3px 9px rgba(0,0,0,.5);
}

.fc-snackbar.fc-snackbar-center-top>.fc-snackbar-body,
.fc-snackbar.fc-snackbar-center-middle>.fc-snackbar-body,
.fc-snackbar.fc-snackbar-center-bottom>.fc-snackbar-body {
	left:-50%;
}

.fc-snackbar-default>.fc-snackbar-body {
    background-color: #455A64;
    border-color: #607D8B;
	color:#E0E0E0;
}	
.fc-snackbar-danger>.fc-snackbar-body {
	background-color:#F44336;
	border-color: #D32F2F;
	color:#fff;
}
.fc-snackbar-success>.fc-snackbar-body {
	background-color:#4CAF50; /* Google Material Design Green 500 */
	border-color: #2E7D32;
	color:#fff;
}
.fc-snackbar-info>.fc-snackbar-body {
	background-color:#00ACC1;
	border-color: #00838F;
	color:#fff;
}
.fc-snackbar-filmchief>.fc-snackbar-body {
	background-color:#546E7A;
	border-color: #37474F;
	color:#fff;
}

.fc-snackbar-body>:first-child {
	margin-top:0;
}
.fc-snackbar-body .close {
	font-size:14px;
}
.fc-snackbar-body h2 {
	font-weight:300;
	font-size:22px;
	margin:15px 0;
}
.fc-snackbar-body h3 {
	font-weight:300;
	font-size:19px;
	margin:15px 0;
}
.fc-snackbar-body h4 {
	font-weight:700;
	font-size:16px;
	margin:15px 0 5px 0;
}
.fc-snackbar-body h5 {
	font-weight:700;
	font-size:14px;
	margin:10px 0 0 0;
}
.fc-snackbar-danger h2,
.fc-snackbar-danger h3,
.fc-snackbar-danger h4,
.fc-snackbar-danger h5,
.fc-snackbar-success h2,
.fc-snackbar-success h3,
.fc-snackbar-success h4,
.fc-snackbar-success h5,
.fc-snackbar-info h2,
.fc-snackbar-info h3,
.fc-snackbar-info h4,
.fc-snackbar-info h5,
.fc-snackbar-filmchief h2,
.fc-snackbar-filmchief h3,
.fc-snackbar-filmchief h4,
.fc-snackbar-filmchief h5 {
	color:#fff;
}

.fc-snackbar.active {
	margin:0px;
	opacity:1;
}
.fc-snackbar.fc-snackbar-left-bottom,
.fc-snackbar.fc-snackbar-center-bottom,
.fc-snackbar.fc-snackbar-right-bottom {
}
.fc-snackbar-body>:last-child {
	margin-bottom:0;
}
.fc-snackbar-body a,
.fc-snackbar-body a:focus,
.fc-snackbar-body a:hover {
	color:inherit;
	text-decoration:underline;
}
.fc-snackbar-body a.close,
.fc-snackbar-body a.close:focus,
.fc-snackbar-body a.close:hover {
	text-decoration:none;
}.fc-snackbar-body a.close {
	opacity:0.3;
	padding:3px 6px 3px 12px;
}
.fc-snackbar-body a.close:focus,
.fc-snackbar-body a.close:hover {
	opacity:0.6;
}


/* Voting per film */
.vt-grade-stars {
	white-space:nowrap;
	font-size:1.5rem;
	line-height:1;
	color:#e0e0e0;
}
.vt-film-control[data-state="vt-open"] .vt-grade-stars>i,
.vt-film-control.vt-allow-change-vote[data-state="vt-voted"] .vt-grade-stars>i {
	cursor:pointer;
}
.vt-film-control[data-state="vt-open"] .vt-grade-stars>i.hovered,
.vt-film-control[data-state="vt-voting-locked"] .vt-grade-stars>i.set,
.vt-film-control[data-state="vt-voted"] .vt-grade-stars>i.set,
.cm-item span.vt-grade-stars>i.set {
	color:#FF0519;
}
.vt-film-control.vt-allow-change-vote[data-state="vt-voted"] .vt-grade-stars>i.hovered {
	color:#D40010; /* star color when hovering to change a vote */
}

@media only screen and (max-width: 1600px) {
	.vt-grade-stars {
		font-size:1.1rem;
	}
}

/* Display voted grade in comment */
.cm-item span.vt-grade-stars {
	display:inline-block;
	margin-left:0.2em;
	font-size:0.85rem
}

/* 
Covering background video 
See https://stackoverflow.com/questions/10797632/simulate-background-sizecover-on-video-or-img
*/
.bg-video-wrapper {
    overflow: hidden;
	position: relative; /* or absolute or fixed */
}
.bg-video-wrapper-fixed {
    overflow: hidden;
	position: fixed;
	height:100%;
	width:100%;
	top:0;
	left:0;
	z-index:-1;
}
video.bg-video {
    height: 100%;
    width: 177.77777778vh; /* 100 * 16 / 9 */
    min-width: 100%;
    min-height: 56.25vw; /* 100 * 9 / 16 */
	
	position: absolute;
    left: 50%; /* % of surrounding element */
    top: 50%;
    transform: translate(-50%, -50%); /* % of current element */
}