html, body
{
	background: transparent;
}

/* Everything will be iframed, so containers will work a bit differently than Bootstrap wants */

.container
{
	max-width: 1170px;
	padding-left: 0;
	padding-right: 0;
	width: auto;
}

/* Language overrides */

span.en
{
	display: inline;
}

span.nl
{
	display: none;
}

html:lang(nl) span.en
{
	display: none;
}

html:lang(nl) span.nl
{
	display: inline;
}

/* Navigation steps */

.wizard-nav
{
	border-color: #CCC;
	border-style: solid;
	border-width: 1px 0;
	display: table;
	line-height: 3em;
	margin-bottom: 1em;
	width: 100%;
}

.wizard-steps
{
	display: table-row;
}

.wizard-step
{
	background: #FFF;
	color: #999;
	display: table-cell;
	text-align: center;
	width: 25%;
}

.wizard-step.available
{
	color: #333;
}

.wizard-step.current
{
	background: #EEE;
	color: #000;
	font-weight: bold;
}

.wizard-step-name
{
	color: inherit;
	display: block;
	position: relative;
	text-decoration: none;
}

.wizard-step.current:nth-child(n+2) .wizard-step-name:before
{
	border-color: transparent #FFF;
	border-style: solid none solid solid;
	border-width: 1.5em 0 1.5em 1em;
	bottom: 0;
	content: '';
	display: block;
	height: 0;
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
}

.wizard-step.current:nth-last-child(n+2) .wizard-step-name:after
{
	border-color: #FFF transparent;
	border-style: solid none solid solid;
	border-width: 1.5em 0 1.5em 1em;
	bottom: 0;
	content: '';
	display: block;
	height: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 0;
}

legend { margin-top: 20px; }

.admin-only { color: orange; font-style: italic; }

/* Overrides */
.control-label.form-control-static { padding-bottom: 10px; padding-top: 10px; }

/* Messages */
.message { border-style: solid; border-width: 1px; box-shadow: inset 4px 0 0 0; padding: 16px 16px 16px 20px; margin-bottom: 20px; margin-top: 10px; }
.message-danger { background-color: #F2DEDE; border-color: #EBCCD1; color: #A94442; }
.message-info { background-color: #D9EDF7; border-color: #BCE8F1; color: #31708F; }
.message-success { background-color: #DFF0D8; border-color: #D6E9C6; color: #3C763D; }
.message-warning { background-color: #FCF8E3; border-color: #FAEBCC; color: #8A6D3B; }
.message a[href] { text-decoration: underline; }

/* Conference selection */
#arr-conf ~ .help-block { display: none; }
#field-conferences { margin-top: -10px; padding-left: 20px; }

/* Livestream selection */
#stream ~ .help-block { display: none; }
#field-streams { margin-top: -10px; padding-left: 20px; }

/* Attendee data input */
#fs-attendee-info { display: none; }
.att-info .input-group { width: 100%; }
.input-group .form-control.att-gender { width: 14%; }
.input-group .form-control.att-fname { width: 43%; }
.input-group .form-control.att-lname { width: 43%; }

/* Payment fields */
#fs-payment-data { display: none; }
#field-total label { display: block; }
#field-noshow { display: none; }

#field-submit { text-align: center; }

/* On-site registration */
#page-osr > .container { margin-top: 4em; max-width: 640px; }

/* Exhibitors */

#page-exhibitors { background: transparent; }

/* Overview */
.overview .att-personal { display: inline-block; overflow: hidden; vertical-align: top; }
.overview .att-selection-heading { font-weight: 600; margin-top: 1ex; }
.overview .att-selection { list-style-type: disc; margin-left: 0.5ex; padding-left: 1em; }

.overview #list-attendees { counter-reset: att; margin-left: 0; padding-left: 0; }
.overview #list-attendees > li { border-top: 2px solid #CCC; list-style: none; margin: 0 0 6px 2em; padding: 4px 8px; position: relative; }
.overview #list-attendees > li::before { background: #CCC; content: counter(att); counter-increment: att; font-weight: bold; left: -2em; padding: 4px; position: absolute; text-align: center; top: -2px; width: 2em; }
.overview #list-attendees > li:nth-child(1n+2) { margin-top: 1em; }

.overview dd dl dt:first-child { clear: none; }

#page-overview #field-submit { float: right; }

/* Collapsible fieldset */
fieldset.collapsible > .fs-content { display: none; }
fieldset.collapsible > legend { cursor: pointer; }
fieldset.collapsible > legend::after { bottom: -3px; content: '\f078'; display: inline-block; float: right; font: 14px/1 FontAwesome; position: relative; }
fieldset.collapsible.open > .fs-content { display: block; }
fieldset.collapsible.open > legend::after { content: '\f077'; }

/* Flag include */
.flag-de:before { content: '🇩🇪'; }
.flag-en:before { content: '🇬🇧'; }
.flag-fr:before { content: '🇫🇷'; }
.flag-nl:before { content: '🇳🇱'; }

/* Tooltips */
[data-tooltip]::after,
[data-tooltip]::before { bottom: 110%; clip: rect(0,0,0,0); color: #FFF; left: 50%; opacity: 0; position: absolute; text-align: center; transition: margin-bottom 0.25s, opacity 0.25s; }
[data-tooltip]::after { background: #333; border-radius: 3px; content: attr(data-tooltip); font-size: 10px; line-height: 1.2; margin-bottom: 9px; max-width: 120px; padding: 1ex; transform: translateX(-50%); white-space: normal; }
[data-tooltip]::before { border-color: #333 transparent transparent; border-style: solid; border-width: 10px 10px 0; box-sizing: content-box; content: ''; height: 0; margin-bottom: 10px; transform: translate(-50%, 10px); width: 0; }
[data-tooltip]:hover::after { clip: auto; display: block; margin-bottom: 0; opacity: 1; z-index: 2; }
[data-tooltip]:hover::before { clip: auto; display: block; margin-bottom: 1px; opacity: 1; z-index: 1; }

/* List of speakers */
.event-speakers-blocks { display: flex; flex-direction: column; gap: 1.6rem; }
.event-speakers-blocks .event-speaker { border: 1px solid #CCC; border-left-width: 1ex; display: flex; flex-direction: row; gap: 2rem; padding: 1.6rem; }
.event-speakers-blocks .speaker-container { flex: 0 0 144px; }
.event-speakers-blocks .speaker-image { background-color: #DDD; background-position: center; background-size: cover; border: 1px solid #CCC; border-radius: 50%; padding-top: 100%; width: 100%; }
.event-speakers-blocks .speaker-info { display: flex; flex-direction: column; flex: 1 1 auto; gap: 0.8rem; }
.event-speakers-blocks .speaker-name { font-size: 150%; font-weight: bold; }
.event-speakers-blocks .speaker-credentials { font-weight: bold; text-transform: uppercase; }
.event-speakers-circles { overflow-x: hidden; padding-top: 65px; }
.event-speakers-circles .event-speakers-scroll { display: flex; flex-direction: row; gap: 1.25rem; }
.event-speakers-circles .event-speaker { background: #CCC; display: inline-block; border: 4px solid #CCC; border-radius: 50%; flex: 0 0 auto; position: relative; }
.event-speakers-circles .speaker-container { background-size: cover; border-radius: 50%; box-sizing: border-box; height: 0; padding-bottom: 100%; position: relative; width: 100%; }
.event-speakers [data-tooltip]::after { margin-bottom: 0; min-width: 120px; max-width: 200px; }
.event-speakers [data-tooltip]::before { margin-bottom: 1px; }
.event-speakers [data-tooltip]:hover::after { margin-bottom: -16px; }
.event-speakers [data-tooltip]:hover::before { margin-bottom: -15px; }

/* List of exhibitors */
.exh-booth { background: #333; color: #FFF; padding: 1ex 1em; }
.exh-name { font-size: 150%; font-weight: bold; }
.exh-description { margin: 1em 0 0; padding: 0 1em; overflow: hidden; }
.exh-website { margin-top: 1em; }
.exh-logo-container { display: block; }
.exh-logo { background-position: center; background-repeat: no-repeat; background-size: contain; height: 120px; margin: 0 auto; width: 120px; }

.exhs-list { border-color: #CCC; border-style: none solid solid; border-width: 0 1px 1px; }
.exhs-list .exh { border-top-color: inherit; border-top-style: solid; border-top-width: 1px; margin-top: 1em; overflow: hidden; padding: 1ex 1em; }
.exhs-list .exh-logo-container { clear: left; float: left; margin-top: 1em; max-height: 128px; min-height: 1px; width: 144px; }
.exhs-list .exh-logo { background-position: center; background-repeat: no-repeat; background-size: contain; height: 120px; margin: 0 auto; width: 120px; }

.exhs-grid { display: flex; flex-flow: row wrap; justify-content: space-around; padding-top: 55px; position: relative; top: -12.5px; }
.exhs-grid .filler { flex: 0 1 auto; height: 0; margin: 0 12.5px; width: 142px; }
.exhs-grid .exh { border: 1px solid #CCC; flex: 0 1 auto; margin: 12.5px; position: relative; text-align: center; transition: box-shadow 0.5s; }
.exhs-grid .exh:hover { box-shadow: 0 0 10px 2px #CCC; }
.exhs-grid .exh-logo-container { padding: 10px; }
.exhs-grid .exh-logo { height: 60px; }
.exhs-grid .exh-booth, .exhs-grid .exh-name, .exhs-grid .exh-description, .exhs-grid .exh-website { display: none; }
.exhs-grid .exh-active { flex-basis: 100%; padding: 1ex 1em; text-align: left; }
.exhs-grid .exh-active .exh-logo-container { clear: left; float: left; margin-top: 1em; max-height: 128px; min-height: 1px; padding: 0; width: 144px; }
.exhs-grid .exh-active .exh-logo { height: 120px; }
.exhs-grid .exh-active .exh-booth, .exhs-grid .exh-active .exh-name, .exhs-grid .exh-active .exh-description, .exhs-grid .exh-active .exh-website { display: block; }
.exhs-grid .exh-active:hover::after, .exhs-grid .exh-active:hover::before { display: none; }
@media screen and (max-width: 480px)
{
	.exh-list .exh-logo-container { width: 106px; }
	.exh-list .exh-logo { height: 96px; width: 96px; }
}

.exhs-carousel { overflow-x: hidden; padding-top: 65px; }
.exhs-carousel-scroll { white-space: nowrap; }
.exhs-carousel .exh { display: inline-block; margin-right: 20px; position: relative; }
.exhs-carousel .exh-logo-container { position: relative; }
.exhs-carousel .exh-logo { height: 60px; width: 120px; }
.exhs-carousel [data-tooltip]::after { margin-bottom: 0; min-width: 120px; max-width: 200px; }
.exhs-carousel [data-tooltip]::before { margin-bottom: 1px; }
.exhs-carousel [data-tooltip]:hover::after { margin-bottom: -2px; }
.exhs-carousel [data-tooltip]:hover::before { margin-bottom: -1px; }


/* Workshop selection */
.ws-overview { margin-top: 20px; }
.ws-overview legend { border: 0 none; display: block; font-size: 14px; height: 1px; line-height: 54px; margin: 0 0 -1px 0; overflow: visible; padding: 0; position: sticky; top: 20px; width: auto; } 
.ws-overview time { display: inline-block; font-weight: bold; line-height: 1; text-transform: uppercase; vertical-align: middle; }
.ws-overview .wday { display: block; font-size: 150%; line-height: 1; }
.ws-filters { margin-bottom: 2em; }
.ws-filter { border-bottom: 1px solid #CCC; padding-bottom: 10px; transition-duration: 0.25s; transition-property: padding-bottom; }
.ws-filter-collapsible .ws-filter-body { height: auto; max-height: 500px; overflow: hidden; transition-duration: 0.25s; transition-property: max-height; }
.ws-filter-collapsible.ws-filter-collapsed .ws-filter-body { max-height: 0; }
.ws-filter-collapsed { padding-bottom: 0; }
.ws-filter-collapsible .ws-filter-heading { cursor: pointer; }
.ws-filter-collapsible .ws-filter-heading::before { bottom: -3px; content: '\f077'; display: inline-block; float: right; font: 14px/1 FontAwesome; position: relative; }
.ws-filter-collapsible.ws-filter-collapsed .ws-filter-heading::before { content: '\f078'; }
.ws-filter-days input { display: none; }
.ws-filter-days label { cursor: pointer; display: inline-block; font-size: 11px; height: 52px; line-height: 19px; text-align: center; text-transform: uppercase; vertical-align: top; width: 52px; }
.ws-filter-day { border: 1px solid #CCC; border-radius: 3px; display: block; height: 100%; padding: 4px; text-align: center; transition-duration: 0.25s; transition-property: background-color, border-color, color; width: 100%; }
.ws-filter-days input:checked + .ws-filter-day { background-color: #337AB7; border-color: #337AB7; color: #FFF; }
.ws-filter-day span { line-height: 15px; }
.ws-filter-day .wday { line-height: 25px; }
.ws-filter-days .ws-filter-day-all { display: block; height: auto; width: auto; }
.ws-list-date legend > span { background: #333; color: #FFF; display: inline-block; float: left; height: 72px; margin: 0 0 1ex -80px; padding: 1ex; text-align: center; width: 72px; }
.ws-list-date { padding-left: 80px; }
@media (max-width: 768px)
{
	.ws-list-date legend { height: auto; line-height: 1; margin-bottom: 0; margin-left: -15px; margin-right: -15px; top: 0; width: calc(100% + 30px); }
	.ws-list-date legend > span { display: block; float: none; height: auto; margin-left: 0; width: 100%; }
	.ws-list-date .wday { display: inline; font-size: 100%; }
	.ws-list-date { padding-left: 0; }
}
.ws-list-item { border-color: #CCC; border-style: solid; border-width: 1px 1px 1px 1ex; margin: 0 0 1em; padding: 1em; }
.ws-list-item.active .ws-description { margin: 1em 0; }
.ws-list-item.active .ws-image-container { max-height: 256px; }
.ws-image-container { float: left; margin-right: 1.6rem; min-height: 1px; width: 128px; }
.ws-logo { display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 120px; width: 100%; }
.ws-image { background-position: center; background-repeat: no-repeat; margin-left: auto; margin-right: auto; }
.ws-image-logo .ws-image { background-size: contain; height: 120px; width: 120px; }
.ws-image-portrait .ws-image, .ws-image-none .ws-image { background-color: #CCC; background-size: cover; border: 1px solid rgba(192,192,192,0.5); border-radius: 50%; height: 128px; width: 128px; }
.ws-image-default .ws-image { background-size: cover; height: 128px; width: 128px; }
.ws-image-portrait .ws-logo { margin-top: 1em; }
.ws-image-container + .ws-info { overflow: hidden; }
@media (max-width: 768px)
{
	.ws-image-container { display: block; float: none; height: auto; margin-bottom: 1em; margin-right: 0; overflow: hidden; text-align: center; width: auto; }
	.ws-image { float: left; }
	.ws-image-logo .ws-image { height: 60px; }
	.ws-image-default, .ws-image-none { display: none; }
	.ws-logo { float: right; }
	.ws-image-portrait .ws-logo { margin-top: 0; }
}
.ws-title { font-size: 150%; font-weight: bold; }
.ws-title + .ws-speaker { margin-top: 1ex; }
.ws-speaker-name { font-weight: bold; text-transform: uppercase; }
.ws-speaker-name + .ws-speaker-credentials::before { content: ' - '; }
.ws-speaker + .ws-meta { margin-top: 1ex; }
.ws-meta { color: #666; font-weight: bold; }
.ws-meta .ws-start-time { margin-right: 1em; text-transform: uppercase; vertical-align: baseline; }
.ws-meta .ws-location { margin-right: 1em; }
.ws-meta .ws-lang { margin-right: 1em; }
.ws-meta .ws-webinar { margin-right: 1em; }
.ws-remove, .ws-overlap { display: none; }
.ws-selected { border-color: #337AB7; }
.ws-selected .ws-remove { display: inline-block; }
.ws-selected .ws-add, .ws-selected .ws-full { display: none; }
.ws-overlapped .ws-add, .ws-overlapped .ws-full, .ws-overlapped .ws-remove { display: none; }
.ws-overlapped .ws-overlap { display: inline-block; }
.ws-conflict { border-color: #A94442; }
.ws-admin-only { border-color: orange; }
.ws-count { background-color: orange; color: #FFF; font-weight: normal; padding-left: 1ex; padding-right: 1ex; }
.ws-no-results { display: none; }

.video-list { display: flex; flex-wrap: wrap; }
.video-list .video-container { padding: 10px; width: 50%; }
.video-list .video-date { width: 100%; }
.video-frame { background-position: center; background-repeat: no-repeat; background-size: cover; cursor: pointer; height: 0; padding-bottom: 56.25%; position: relative; width: 100%; }
.video-frame iframe { border: none; bottom: 0; height: 100%; left: 0; position: absolute; right: 0; top: 0; width: 100%; z-index: 2; }
.video-frame::before { background: #000; border: 7px solid #FFF; border-radius: 50%; content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAeCAMAAADn2eWTAAAAQlBMVEUAAAD///3///3///3///////3///7//vz///z//Pz/////+/f///3///3///////z///r//Pr///z///////////+Ao6hbAAAAFXRSTlMAg93VvqtrRTAtJiChl4l+dGheUiRqVa0fAAAAcUlEQVQoz53T3QqAIAyGYU1NrezPdv+3WgTR4NOBvqfPibhNKb8fs6p10pOuuaM354tKX0so6V9CJ952SUqDnkDBmaJzxcwICs4UPXPF1igp2cgVuV9t7HyVyQ2/AdY2BZwgWN/mpCBtrLTt7ZciX9kNNrMpQ0KZ3ZcAAAAASUVORK5CYII=); display: inline-block; left: 50%; height: 84px; opacity: 0.5; padding: 20px 16px 20px 24px; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%); width: 84px; }
.video-frame:hover::before { opacity: 0.75; }
.video-frame .video-title { background: #CCC; background: rgba(0,0,0,0.5); bottom: 0; color: #FFF; font-size: 18px; font-weight: bold; left: 0; min-height: 3em; padding: 1ex 1em; position: absolute; right: 0; text-shadow: 1px 1px 2px rgba(0,0,0,0.5); width: 100%; z-index: 1; }
@media (max-width: 640px)
{
	.video-list .video-container { width: 100%; }
	.video-list .video-frame .video-title { font-size: 12px; }
}