@charset "ISO-8859-1";

/*
    Copyright Jasmin Weiss Interactive Solutions
*/

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

:root {
  	--curtain-color-one: hsl(204,100%,30%);
  	--curtain-color-two: hsl(204, 100%, 50%);
  	--curtain-color-three: hsl(204,100%,70%);    
  	--curtain-display: none;  
  	/*--loungeColor: #00a48a;	
  	--loungeColorTrans: #00a48a42;
  	--loungeColorHover: #00e4b3;*/
  	--loungeColor: #5370cd;	
  	--loungeColorTrans: #5370cd42;
  	--loungeColorHover: #718aeb;
  	--loungeColorText: #000000;
}

html {
	min-height: 100%;
	height: 100%;
	overflow: hidden;
}

body {
	--css-version: 2;
    font-family: 'RobotoLight', sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    width   : 100%;
    min-height  : 100%;
    height: 100%;
    margin  : 0;
    padding : 0;
    z-index: -2;
    min-width: 300px;
    color: #e1e1e1;
    font-size: 20px;
    line-height: 1.4em;    
    background-color: #000;    
    position: absolute;    
}

.webgl
{
    position: absolute;
    top: 0;
    left: 0;
    outline: none;   
    pointer-events: none;
    /*z-index: 25;*/
    max-width: 100%;
    max-height: 100%;
    display: block;
}


.topContentWrapper {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;   
}

.glWrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	flex: 1;
	pointer-events: none;
	max-width: 100%;
	max-height: 100%;
}

.pdfCanvas {
	direction: ltr;
}

.loginPanelProfileImageContainer {
	display: flex;
	padding-bottom: 15px;
	justify-content: center;
}

.loginPanelProfileImageWrapper {
	position: relative;
	display: inline-block;
	margin-bottom: 10px;
}

.loginPanelProfileImage {
	position: relative;
	width: 120px;
	border-radius: 50%;
}

.loginProfileImageButton {
	position: absolute;
	right: 5px;
	bottom: 0px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	background-color: #bfbfbf;
	color: #222;
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .3);
	box-shadow: 2px 2px 12px -1px rgba(0, 0, 0, .3);
	cursor: pointer;
	font-size: 0.7em;
	width: 20px;
	height: 20px;
	line-height: 1.8em;
	text-align: center;
}

.loginProfileImageButton:hover {
	background-color: #ffffff;
}


.loungeLogo {
	width: 240px;
	position: absolute;	
}

.contentWrapper {
	flex: 1;
	position: relative;	
    overflow: auto;    
    pointer-events: auto;
}




.placeholderSectionWrapper {
	padding: 0px 5px 0px 15px;
}

.loadingContent {
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: #000;
	z-index: 2000;
	left: 0;
	top: 0;	
	justify-content: center;
	align-items: center;
}

.loadingContentDiv {	
	display: flex;	
	align-items: center;
	grid-gap: 25px;
	font-size: 1.5em;	
	font-family: "Caveat", cursive;
	color: #c1c1c1;
	flex-direction: column;
}

/**
 * ==============================================
 * Dot Pulse
 * Copyright (c) 2025 by Zongbin (https://codepen.io/nzbin/pen/GGrXbp)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

 
 * ==============================================
 */
.dot-pulse {
  position: relative;
  left: -9999px;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: var(--loungeColor);
  color: var(--loungeColor);
  -webkit-box-shadow: 9999px 0 0 -5px;
  box-shadow: 9999px 0 0 -5px;
  animation: dot-pulse 1.5s infinite linear;
  animation-delay: 0.25s;
}
.dot-pulse::before, .dot-pulse::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: var(--loungeColor);
  color: var(--loungeColor);
}
.dot-pulse::before {
  -webkit-box-shadow: 9984px 0 0 -5px;
  box-shadow: 9984px 0 0 -5px;
  animation: dot-pulse-before 1.5s infinite linear;
  animation-delay: 0s;
}
.dot-pulse::after {
  -webkit-box-shadow: 10014px 0 0 -5px;
  box-shadow: 10014px 0 0 -5px;
  animation: dot-pulse-after 1.5s infinite linear;
  animation-delay: 0.5s;
}

@keyframes dot-pulse-before {
  0% {
    box-shadow: 9984px 0 0 -5px;
  }
  30% {
    box-shadow: 9984px 0 0 2px;
  }
  60%, 100% {
    box-shadow: 9984px 0 0 -5px;
  }
}
@keyframes dot-pulse {
  0% {
    box-shadow: 9999px 0 0 -5px;
  }
  30% {
    box-shadow: 9999px 0 0 2px;
  }
  60%, 100% {
    box-shadow: 9999px 0 0 -5px;
  }
}
@keyframes dot-pulse-after {
  0% {
    box-shadow: 10014px 0 0 -5px;
  }
  30% {
    box-shadow: 10014px 0 0 2px;
  }
  60%, 100% {
    box-shadow: 10014px 0 0 -5px;
  }
}

.lightboxPanelBackdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 50;
  background-color: black;
  opacity: 0.6;
}

.lightboxPanel {
    margin: 25px auto;
    left: 0;
    right: 0;
    position: absolute;
    box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2), 0px 0px 40px 0px rgba(0,0,0,0.19);
    font-size: 18px;
    line-height: 1.2;
    letter-spacing: normal;
    color: #8c8c8c;
    text-align: left;
    text-transform: none;
    background-color: #222;
    width: fit-content;
    max-width: 75%;
    flex-direction: column;
    min-height: 0;
    max-height: calc(100% - 65px);
    z-index: 55;
}

.lightboxPanelContent {
	width: 100%;
	height: 100%;
	overflow: auto;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	position: relative;
}

.lightboxPanelCloseButton {
	position: absolute;
	top: -10px;
	right: -25px;
	font-size: 1.8em;
	/*color: #989898;*/
	color: #454545;
	z-index: 1002;
	cursor: pointer;
	text-shadow: 1px 1px 1px rgba(0,0,0 ,0.3);
}

.lightboxPanelCloseButton:hover {
	color: #ff530f;
}

.lightboxImageWrapper {	
	position: relative;
	overflow: auto;	
	min-height: fit-content;
	line-height: 0;
	z-index: 57;
	display: flex;
	flex-direction: column;
	align-items: center;
}


.lightboxImageWrapper.caption {
	width: min-content;
} 

.lightboxCaptionWrapper {
	display: flex;
	grid-gap: 5px;
	width: 100%;
	padding: 0 5px;	
	line-height: 1.2em;
}

.lightboxCaption {	
	text-align: left;
	flex: 1;
	line-height: 1.2em;
}

.lightboxCaption.download {
	text-align: left;
}

.lightboxImage {
	/*height: 100%;*/
	width: auto;
    max-width: 100%;
    max-height: 90vh;
}

.lightboxImage.audio {	
	max-height: 72vh;
}

.lightboxDownloadLink
 {
	position: absolute;
	bottom: 15px;
	right: 20px;
	font-size: 1.5em;
	border-radius: 50%;
	background-color: #242424;
	width: 2em;
	height: 2em;	
	align-items: center;
	justify-content: center;
	color: #b3b3b3;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	text-decoration: none;
    border: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: none;	
}

.lightboxDownloadLink.caption {
	position: relative;
	right: 0;
	bottom: 2px;
	background-color: #363636;
}


.lightboxDownloadLink:visited   { 
	color: #b3b3b3; 	
}
.lightboxDownloadLink:disabled   { 
	color: #b3b3b3; 	
}
.lightboxDownloadLink:link   { 
	color: #b3b3b3; 	
}
.lightboxDownloadLink:hover   { 
	color: var(--loungeColorHover); 	
}

.placeholderDetailsPdfView {
	max-width: 80vw;
	max-height: 95%;
	overflow: auto;
}

.placeholderDetailsPdfControlBar {
	position: relative;
	display: flex;
	justify-content: center;
	grid-gap: 30px;
	align-items: center;
	padding: 5px;
	font-size: 0.8em;
	background-color: #161616e5;
}

.placeholderDetailsPDFControlSection {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	grid-gap: 15px;
}

.placeholderDetailsPDFPrintIframe {
	display: none;	
}

.placeholderDetailsPDFButton {	
	font-size: 1em;
	border-radius: 50%;
	background-color: #414141;
	width: 2em;
	height: 2em;
	align-items: center;
	justify-content: center;
	color: #b3b3b3;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	text-decoration: none;
	border: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	outline: none;
}

.placeholderDetailsPDFButton:hover {
	color: var(--loungeColorHover); 
	background-color: #494949;
}

.placeholderDetailsPDFButton.disabled {
	background-color: #2b2b2b;
	color: #5d5d5d;
	pointer-events: none;
}

.placeholderDetailsPDFDownloadLink
 {
	font-size: 1em;
	border-radius: 50%;
	background-color: #414141;
	width: 2em;
	height: 2em;
	align-items: center;
	justify-content: center;
	color: #b3b3b3;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	text-decoration: none;
    border: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: none;	
}


.placeholderDetailsPDFDownloadLink:visited   { 
	color: #b3b3b3; 
	background-color: #414141;
}
.placeholderDetailsPDFDownloadLink:disabled   { 
	color: #b3b3b3; 
	background-color: #414141;
}
.placeholderDetailsPDFDownloadLink:link   { 
	color: #b3b3b3; 
	background-color: #414141;
}
.placeholderDetailsPDFDownloadLink:hover   { 
	color: var(--loungeColorHover); 
	background-color: #494949;
}

.numberInput.placeholderDetails {
	font-size: 1em;
	padding: 2px;
}

.placeholderDetailsNumberWrapper {
	display: flex;
	align-items: center;
	font-size: 0.9em;
}

.placeholderVideo {
	width: 100%;
	height: auto;
	background-color: black;
	z-index: 56;
	position: relative;
}

.entryArea {	
    width: 1000px;
    min-width: 1000px;
    pointer-events: none;
}

.stageArea {	
    width: 1000px;
    min-width: 1000px;
    pointer-events: none;
    position: relative;
}

.mediaArea {    
    position: relative;   
    width: 1000px;
    min-width: 1000px;
    pointer-events: none;
}

.statusGallery {    
    width: 1000px;
    min-width: 1000px;
    pointer-events: none;
    position: relative;
}

.contentArea {
	position: relative;
	width: 2000px;
    min-width: 2000px;
    pointer-events: none;
}

.wi_mediaScreen {
	position: absolute;
    top: 0;
	left: 0;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;	
	box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.4), 10px 10px 40px 0px rgba(0,0,0,0.2);
	/*aspect-ratio: 16/9;*/
	height: 337px;
	width: 600px;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 0;
    background-color: #000;
    z-index: 20;
}

.mediaOverviewWrapper {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	overflow: hidden;
	align-content: center;
    position: relative;
}

.mediaOverviewWrapperOne {	
	width: 100%;	
	height: 100%;
	display: flex;	
	overflow: hidden;
	align-content: center;
	position: relative;		
}

.mediaOverviewWrapperTwo {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr;
	overflow: hidden;
	align-content: center;
	position: relative;
	grid-template-rows: 1fr;
}

.mediaOverviewWrapperThree {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	overflow: hidden;
	align-content: center;
	position: relative;
	grid-template-rows: 1fr;
}

.mediaOverviewWrapperFour {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	overflow: hidden;
	align-content: center;
	position: relative;	
	max-height: 100%;
}

.mediaOverviewWrapperSeven {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	overflow: hidden;
	align-content: center;
	position: relative;	
	max-height: 100%;
}

.mediaOverviewWrapperNine {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	overflow: hidden;
	align-content: center;
	position: relative;	
	max-height: 100%;
}

.mediaOverviewWrapperSixteen {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	overflow: hidden;
	align-content: center;
	position: relative;	
	max-height: 100%;
}

.mediaOverviewWrapperNineteen {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
	overflow: hidden;
	align-content: center;
	position: relative;	
	max-height: 100%;
}

.mediaOverviewWrapper29 {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
	overflow: hidden;
	align-content: center;
	position: relative;	
	max-height: 100%;
}

.mediaOverviewWrapper33 {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
	overflow: auto;
	align-content: center;
	position: relative;	
	max-height: 100%;
}

.mediaOverviewImageWrapper {
	cursor: pointer;
	display: flex;
	justify-content: center;
	flex: 1;
	height: 100%;
	width: 100%;
	min-height: 0;
}

.mediaOverviewImageWrapper.active {
	border: 1px solid #70baa6;
}

.mediaOverviewImage {
	width: 100%;
	height: auto;
	min-height: 0;
	object-fit: cover;
	pointer-events: none;
}
	
.mediaOverviewWrapperOne .mediaOverviewImage {
	object-fit: contain;
}


.mediaOverviewInfo {
	position: absolute;	
	width: 620px;	
	background-color: #000;
	justify-content: center;
	align-items: center;
	grid-gap: 20px;
	pointer-events: auto;
	/*aspect-ratio: 16/9;*/
	height: 349px;
	z-index: 30;
}

.mediaOverviewInfoImageWrapper {
	position: relative;
	height: 100%;
	max-width: 55%;
	min-width: 55%;
}

.mediaOverviewVideoError {
	position: absolute;
	bottom: 5px;
	left: 0;
	right: 0;
	margin: auto;
	color: #f700e7;
	font-style: italic;
	text-align: center;
}

.mediaOverviewInfoImage {
	height: 100%;
	max-width: 100%;
	object-fit: contain;
}

.mediaOverviewInfoTitle {
	font-weight: bold;
	padding-bottom: 10px;
}

.mediaOverviewInfoText {
	color: #aaa;
	flex: 45%;
	overflow-y: auto;
	max-height: 100%;
	font-size: 0.9em;
	line-height: 1.2em;
	padding-right: 20px;
	overflow-x: hidden;
	height: 85%;
}

.mediaInfoPlayButton {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: fit-content;
	height: fit-content;
	font-size: 3em;
	text-shadow: 2px 2px 10px rgba(0,0,0,0.3);
	color: #cececee8;
    cursor: pointer;
    z-index: 50;
}

.mediaInfoPlayButton.post {
	font-size: 2.5em;
}

.mediaInfoPlayButton.videopost {
	font-size: 2.5em;
	z-index: 35;
}

.mediaInfoPlayButton:hover {
	color: #ff260fcf;
}

.mediaInfoCloseButton {
    position: absolute;
	top: 0px;
	right: 5px;
	font-size: 24px;
	color: #989898;
	z-index: 20;
	cursor: pointer;
	text-shadow: 1px 1px 1px rgba(0,0,0 ,0.3);
}

.mediaInfoCloseButton:hover {
		color: #ff530f;
}

.mediaGalleryVideo {
	width: auto;
	height: 100%;
	background-color: black;
	z-index: 30;
	/* aspect-ratio: 16/9; */
	max-width: 100%;
}

.mediaGalleryVideoWrapper {
	width: 100%;
	height: 100%;
	background-color: #000;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 30;
	-webkit-box-shadow: 2px 2px 15px 0 rgba(0,0,0,0.3), 2px 2px 30px 0px rgba(0,0,0,0.19);
	box-shadow: 2px 2px 15px 0 rgba(0,0,0,0.3), 2px 2px 30px 0px rgba(0,0,0,0.19);	
}

.mediaGalleryYoutubeVideo {
	width: 100%;
	height: 100%;
	background-color: black;
	z-index: 30;
	pointer-events: all;
	max-width: 100%;
}

.mediaGalleryYoutubeVideoClose {
	position: absolute;
	top: -15px;
	right: -12px;
	font-size: 31px;
	color: #989898;
	z-index: 40;
	cursor: pointer;
	text-shadow: 1px 1px 1px rgba(0,0,0 ,0.3);
	pointer-events: all;
}

.mediaGalleryYoutubeVideoClose:hover {
	color: #ff530f;
}


.mediaGalleryPlayWrapper {
	position: absolute;
	z-index: 35;
	pointer-events: none;
	top: 0;	
	width: 620px;	
	/*aspect-ratio: 16/9;*/
	height: 349px;
	font-size: 0.9em;
}

.mediaGalleryVideoWrapper {
	width: 100%;
	height: 100%;
	background-color: #000;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 30;
	-webkit-box-shadow: 2px 2px 15px 0 rgba(0,0,0,0.3), 2px 2px 30px 0px rgba(0,0,0,0.19);
	box-shadow: 2px 2px 15px 0 rgba(0,0,0,0.3), 2px 2px 30px 0px rgba(0,0,0,0.19);	
}

.mediaScreenControlBar {	
	left: 0;
	right: 0;
	margin: auto;
	background-color: #060606a3;
	border-radius: 10px;
	padding: 3px 0px 8px 0px;
	font-size: 0.9em;
	pointer-events: all;
	box-shadow: 1px 1px 5px 0 rgba(0,0,0,0.3);
	width: 95%;
	margin-bottom: 10px;
	height: 50px;
}

.loungeMediaControlBarContainer {
	position: absolute;
	bottom: 50px;
	margin: auto;
	left: 0;
	right: 0;
	max-width: 50%;
	z-index: 2;
}

.chatPresentationScreenContainer .loungeMediaControlBarContainer {
	bottom: 0;	
}

.ui-widget-header {
	background: var(--loungeColor);	
}

.ui-slider .ui-slider-range {	
	border: 1px solid var(--loungeColor);
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
	background: var(--loungeColor);	
}

.loungeMediaControlBar {
	background-color: #060606a3;
	border-radius: 10px;
	padding: 3px 0px 8px 0px;
	font-size: 0.8em;
	pointer-events: all;
	box-shadow: 1px 1px 5px 0 rgba(0,0,0,0.3);
	width: 100%;
	height: 50px;
	line-height: 1.2em;
}


.mediaControlProgressBarWrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	grid-gap: 10px;
	padding: 0 20px 5px 20px;
}

.loungeMediaControlBar .mediaControlProgressBarWrapper {
	padding: 0 20px 0 20px;
}

.mediaControlButtonBarWrapper {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	grid-gap: 35px;
	padding-left: 20px;
	padding-top: 2px;
}

.mediaControlTitle {
	white-space: nowrap;
	max-width: 40%;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	min-width: 150px;
	height: 1.2em;
	line-height: 1em;
}

.mediaControlButtonMiddleSection {
	display: flex;
	grid-gap: 35px;
	align-items: center;
}

.mediaControlButtonEndSection {
	display: flex;	
	flex: 1;
	justify-content: center;
	padding-right: 40px;
}

.mediaControlSlider {	
	height: 5px;
	margin: 5px;
	flex: 1;
	background-color: rgb(140,140,140);
}

#mediaControlSliderHandle {
    width: 15px;
    height: 15px;
    border-radius: 50%;    
    border: unset;
  }
  
#mediaControlSliderHandle:hover,
#mediaControlSliderHandle:focus,
#mediaControlSliderHandle:active {
	border: unset;
}
  
#mediaGalleryItemDescription {
	line-height: unset;
}

.mediaIconRewind {
	font-size: 1.2em;
}

.mediaControlStartButton {
	font-size: 0.8em;
}

.mediaControlButton {
	position: relative;
	cursor: pointer;
}

.mediaControlButton:hover {
	color: #fff;
}

.mediaControlStopCloseButton {
	cursor: pointer;
	font-size: 1.6em;
	position: absolute;
	right: 25px;
	bottom: 3px;
}

.lightboxPanel .mediaControlStopCloseButton {
	display: none;
}

.mediaControlStopCloseButton:hover {
	color: #ff530f;
}

.mediaControlFFTimeLeft {
	position: absolute;
	font-size: 0.6em;
	line-height: 1em;
	left: -2px;
	right: 0;
	text-align: center;	
}

.mediaControlFFTimeRight {
	position: absolute;
	font-size: 0.6em;
	line-height: 1em;
	left: 2px;
	right: 0;
	text-align: center;
}

.loungeMediaControlBar .mediaControlFFTimeLeft,
.loungeMediaControlBar .mediaControlFFTimeRight {	
	bottom: -5px;
}

.mediaControlAudioOffButton {
	cursor: pointer;
	font-size: 1.1em;
}

.mediaControlAudioOnButton {
	cursor: pointer;
	font-size: 1.1em;
}

.postEmojiPanel {
	position: absolute;
	right: 0px;
	top: -65px;
	padding: 3px;
	background-color: rgba(15,15,15,0.9);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	text-align: center;
	z-index: 52;
	box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.4), 10px 10px 40px 0px rgba(0,0,0,0.2);
	font-size: 1.1em;
	width: 225px;
}

.postEmojiPanel.details {
	font-size: 1.6em;
	top: -98px;	
}

.emojiPanelImageButton {
	white-space: nowrap;
	font-size: 0.8em;
	padding: 0 6px;	
	cursor: pointer;
	border: 1px solid #4a4a4a;
	margin-left: 10px;
	border-radius: 6px;
	margin-bottom: 5px;
}

.emojiPanelHeader {
  position: relative;
  width: 100%;
  height: 30px;
  margin-bottom: 10px;
}

.emojiPanelTab {
  position: relative;
  color: #9b9b9b;
}

.emojiPanelTab.active {
    color: var(--loungeColor);
}

.emojiPanelContent {
  position: relative;
  overflow: hidden;
  height: 100px;
  min-height: 100%;
  max-height: 100%;
  width: 100%;
  color: #efefef;
}

.emojiPanelSection {
  width: 100%;
  display: grid;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  gap: 2px;
  margin-top: 0px;
}

.emojiPanelIcon {
  padding: 5px;
  cursor: pointer;
}

.emojiPanelDivider {
  height: 1px;
  margin: 6px 10px;
  overflow: hidden;
  background-color: #606060;
}

.chatEmojiButton {
	position: absolute;
	right: 10px;
	top: 4px;
	cursor: pointer;
	font-size: 1.2em;
	text-shadow: 1px 1px 1px rgba(0,0,0 ,0.3);
}

.chatEmojiButton.post {
	top: 8px;
	font-size: 1.6em;
}

.galleryWrapper {
	display: flex;
    flex-direction: column;
    align-items: center;
    grid-gap: 20px;
    position: absolute;
    left: 0;
    top: 0;
}

.stageScreenWrapper {
	display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    left: 1209px;
    top: 0;
}

.galleryCarouselWrapper {
    display: flex;
	grid-gap: 15px;
    height: 45vh;
	padding-top: 2vh;
    margin: 0 auto;  
    position: relative;    
}

.newsScreenControlBarAlertButton {
	background-color: var(--loungeColor);
	cursor: pointer;
	align-items: center;
	color: #fff;
	border-radius: 30px;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	width: 40px;
	font-size: 0.7em;
	justify-content: center;
	line-height: 1em;
	height: 22px;
	position: relative;
}

.newsScreenControlBarAddIcon {
	line-height: 2em;
	text-align: center;
	/* right: -35px; */
	/* text-shadow: 1px 1px 5px rgba(0,0,0,0.3); */
	font-size: 1.2em;
	color: rgba(0,0,0,0.6);
	position: relative;
}

.newsScreenControlBarAddIcon.active {
	color: var(--loungeColor);
	text-shadow: 1px 1px 5px rgba(0,0,0,0.3);
}

.newsScreenControlBarPageButton {
	cursor: pointer;
	align-items: center;
	border-radius: 50%;	
	width: 8px;
	height: 8px;
	min-width: 8px;
	display: flex;
	font-size: 0.6em;
	text-align: center;
	align-items: center;
	justify-content: center;
	color: rgba(0,0,0,0.2);
}

.newsScreenControlBarPageButton.active {
	color: rgba(0,0,0,0.6);
}

.newsScreenContent {
	position: relative;	
	width: 248px;
	overflow: hidden;
	cursor: pointer;	
	grid-gap: 5px;
	font-size: 0.9em;
	height: 330px;
    
}

.newsScreenHeadline {
  font-size: 0.9em;
  font-weight: bold;
  color: rgba(0,0,0,0.9);
  text-align: center;
  -moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
  line-height: 0.9em;
  padding: 5px;
  width: 245px;
  margin: 0 auto 5px auto;
  text-transform: uppercase;
  white-space: nowrap;
  border-top: 1px solid rgba(0,0,0,0.9);
  border-bottom: 1px solid rgba(0,0,0,0.9);
}

.newsScreenTopLine {
  display: flex;
  color: rgba(0,0,0,0.9);
  font-size: 0.5em;
  line-height: 1em;
  padding: 3px 5px;
  width: 247px;
  height: 10px;
}

.newsScreenTopLineLeft {
   flex:1;
}

.newsScreenImageContainer {
	max-height: 135px;
	display: flex;
	justify-content: center;
	width: 100%;
	padding: 0 5px;
}

.newsScreenImage {
	height: 100%;
	width: auto;
	max-width: 100%;
	max-height: 100%;
}

.newsScreenContentText {
	font-size: 0.75em;
	line-height: 1.2em;
	padding: 0 10px;
	flex: 22%;
	overflow-y: auto;
	margin-bottom: 0px;
	overflow-x: hidden;
	word-wrap: anywhere;
	pointer-events: none;
}

.newsScreenContentTextWrapper {
	position: relative;
	padding-top: 5px;	
	color: rgba(0,0,0,0.8);
	max-height: 110px;
	overflow: hidden;	
}
/*.newsScreenContentText::after {
	content: "...";
	text-align: right;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 34%;
	height: 1.2em;
    font-weight: bold;
}*/

.newsScreenWrapper {
  background-image: url("/lounges/controller/assets/newsScreenBackground.webp");
  background-repeat: no-repeat;
  background-size: cover;
}

.newsScreenContentReactionLine {
	display: flex;
	grid-gap: 5px;
	padding: 0px 5px 0 5px;
	pointer-events: none;
}

.newsScreenContentReactionWrapper {
    display: flex;
}

.newsScreenReactionIcon {
	text-shadow: 1px 1px 5px rgba(0,0,0,0.4);
}

.newsScreenReactionText {
    font-size: 0.6em;
  color: rgba(0,0,0,0.9)
}

.newsScreenReactionText:empty {
    display: none;
}

.newsScreenControlBarButtonWrapperContainer {
	position: relative;	
    flex: 1;
}

.newsScreenControlBarWrapper {
	grid-gap: 25px;
	height: 35px;
	justify-content: center;
	align-items: center;
	padding: 0 10px;	
	display: flex;
	width: 246px;	
  border-top: 1px solid rgba(0,0,0,0.1);
  margin-top: 5px
    
}

.tooltip {
	position: absolute;
	top: -15px;
	right: -10px;
	font-size: 0.4em;
	background-color: #edededd1;
	white-space: nowrap;
	color: #252525;
	padding: 5px;
	line-height: 1em;
	box-shadow: 2px 2px 10px rgba(0,0,0,0.4);
}

.tooltip.post {
	white-space: normal;
 	top: 220px;
  	max-width: 60%;
  	margin: auto;
  	right: 50px;
  	background-color: #e7e7e7;
  	line-height: 1.4em;
  	font-size: 0.5em;
}

.newsScreenControlBarContainerWrapper {
	position: relative;	
	height: 25px;
	overflow: hidden;
	max-width: 246px;
}

.newsScreenControlBar {
	grid-gap: 8px;
	align-items: center;
	display: flex;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	justify-content: center;
	font-size: 0.7em;
	color: rgba(0,0,0,0.6);
}

.newsScreenControlBarCircle {
    font-size: 0.5em;
    color: rgba(0,0,0,0.2);
}

.newsScreenControlBarCircle.active {
   color: rgba(0,0,0,0.6);
}

.newsScreenControlBarButton {
	color: rgba(0, 0, 0,0.2);
	cursor: pointer;
	align-items: center;
}

.newsScreenControlBarButton.active {
	color: rgba(0, 0, 0, 0.8);
}

.newsScreenPostImageWrapper {
	max-height: 190px;	
	display: flex;
	justify-content: center;
	pointer-events: none;
}

.galleryMediaPanelOrHeader {
	font-size: 1.5em;	
	color: #70baa6;
	text-transform: uppercase;
}

.galleryContentPublishDate {
	font-size: 0.6em;
	color: #434343;
	padding: 0 10px;
	text-align: right;
	pointer-events: none;
}

.galleryPostOverlay .galleryContentPublishDate {
	font-size: 0.75em;	
}

.galleryContentReactionLine {
	display: flex;
	grid-gap: 5px;
	padding: 10px 5px 5px 5px;
	pointer-events: none;
}

.galleryContentReactionWrapper {
    display: flex;
}

.galleryPostMessage {
	flex: 1;	
	min-width: 0;	
	word-wrap: anywhere;
}

.galleryPostTitle {
	color: rgba(0,0,0,0.9);
	font-weight: bold;	
	border-bottom: 1px solid rgba(0,0,0,0.6);
	font-size: 1.5em;
	line-height: 1.2em;
}

.galleryPostContentContainer {
	display: flex;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-direction: row;
	grid-gap: 10px;
	height: 100%;
	width: 100%;
}

.galleryContentPlusIconWrapper {	
	display: flex;
	grid-gap: 2px;
	font-size: 0.7em;
	padding-left: 10px;
	color: rgba(0,0,0,0.9);
}

.galleryContentChatIconWrapper {
	display: flex;
	grid-gap: 2px;
	flex: 1;
	justify-content: end;
	padding-right: 5px;
}

.galleryReactionText {
	font-size: 0.6em;
	color: rgba(0,0,0,0.8);
}

.galleryReactionText:empty {
    display: none;
}

.galleryPostOverlay {
	position: absolute;
	top: 2vh;
	right: 365px;
	bottom: 0;
	/* right: 0; */
	/* margin: auto; */
	max-width: 75%;
	/* background-color: #0b0b0bf7; */
	height: 90%;
	z-index: 55;
	box-shadow: 10px 10px 15px rgba(0,0,0,0.3);
	border-radius: 4px;
	pointer-events: auto;
	width: fit-content;
	min-width: 40%;
	margin: 10px auto;
	background-color: rgba(0,0,0,0.9);
}

.galleryPostOverlay.edit {
	overflow: auto;
	flex-direction: column;
	min-height: 0;
	height: fit-content;
	max-height: calc(100% - 10px);
	max-width: 520px;
	left: unset;
	right: 30%;
	background-color: rgba(0,0,0,0.9);
}

.galleryPostContent {
	position: relative;
	display: flex;
	grid-gap: 10px;
	width: 100%;
	height: 100%;
	padding: 5px;
	font-size: 20px;
	background-image: url("/lounges/controller/assets/newsScreenBackgroundDetails.webp");
	background-repeat: no-repeat;
	background-size: cover;
	flex-direction: column;
}

.galleryPostMediaWrapper {
	flex: 1;
	position: relative;
	height: fit-content;	
	aspect-ratio: 16/9;
	display: flex;
  	justify-content: center;
}

.galleryPostMediaWrapper:empty {
	display: none;
}

.galleryPostMediaWrapper .newsScreenImage {
	width: 100%;
	box-shadow: 3px 3px 5px rgba(0,0,0,0.5);
	max-width: fit-content;
}

.galleryPostMediaWrapperClickContainer {
	width: 100%;
	height: 100%;
	pointer-events: all;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}


.galleryPostVideo {
	width: 100%;
	height: 100%;
	background-color: black;
	box-shadow: 2px 2px 10px rgba(0,0,0,0.4);
	min-width: 460px;
}

.newsScreenVideo {
	height: 100%;
	width: auto;	
	max-width: 100%;
}

.galleryPostContentWrapper {
	flex: 1;
	font-size: 0.7em;
	line-height: 1.2em;
	color: rgba(0,0,0,0.8);
	display: flex;
	flex-direction: column;
	padding-top: 15px;	
	min-height: 0;
}

.galleryPostViewCloseButton {
	position: absolute;
	top: 0px;
	right: 4px;
	font-size: 1.4em;
	color: #989898;
	z-index: 1002;
	cursor: pointer;
	text-shadow: 1px 1px 1px rgba(0,0,0 ,0.3);
}

.galleryPostViewCloseButton:hover {
	color: #ff530f;
}

.galleryPostMessageContainer {
	display: flex;
	flex-direction: column;	
	grid-gap: 20px;
	overflow: hidden;	
	flex: 1;
	max-height: 87%;
	position: relative;
}

.galleryPostViewCommentSection {
	margin-left: 10px;
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 0;
}

.galleryPostViewSectionHeader {
	border-bottom: 1px solid #4a4a4a;
	margin-bottom: 10px;
	text-transform: uppercase;
	font-size: 0.8em;
	/* color: #919191; */
}

.galleryPostMessageWrapper {
	display: flex;
	grid-gap: 10px;
	max-height: fit-content;
	margin-bottom: 10px;	
	min-height: fit-content;
}

.galleryPostCommentSectionWrapper {
	display: flex;
	flex-direction: column;
	overflow: auto;
	padding-right: 7px;
}

.galleryPostMessageReactionsLine {
	display: flex;
	padding-top: 5px;
	grid-gap: 10px;
	align-items: center;
	font-size: 1.2em;
	padding-right: 10px;
}

.galleryPostUserImageWrapper {
	flex: 0 42px;
	min-width: 42px;
	max-width: 42px;
}

.galleryPostUserImage {
	border-radius: 50%;
	box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
}

.galleryPostUserName {
	font-weight: 600;
	color: rgba(0,0,0,0.9);
}

.galleryPostViewSubCommentSection {
	margin-left: 60px;
	border-top: 1px solid #4a4a4a;
	padding-top: 5px;
}

.reactionMenuBackdrop {
	position: fixed;
	z-index: 51;
	right: 0;
	top: 0;
	background-color: rgba(0, 0, 0, 0.01);
	width: 100%;
	height: 100%;	
}

.galleryPostReactionContainer {
    display: flex;
    flex-direction: column;
}

.galleryPostReactionLine {
	display: flex;
	grid-gap: 15px;
	line-height: 1em;
	font-size: 1.6em;
	align-items: center;
	padding-right: 10px;
}

.galleryContentReactionChatWrapper {
	display: flex;
	padding-left: 10px;
}

.galleryContentReactionContainer {
	display: flex;
	flex: 1;
	grid-gap: 10px;
	flex-wrap: wrap;
}

.galleryContentReactionChatWrapper {
	display: flex;
	padding-left: 10px;
}

.galleryContentReactionContainer {
	display: flex;
	flex: 1;
	grid-gap: 10px;
	flex-wrap: wrap;
}

.galleryPostOverlayClickableIcon {
	cursor: pointer;
	text-shadow: 2px 2px 5px rgba(0,0,0,0.4);
	color: #3a3a3a;
}

.galleryPostOverlayClickableIcon.chat {
	font-size: 1.4em;
}

.galleryPostOverlayClickableIcon:hover {
	color: #fff;
}

.galleryPostOverlayClickableIcon.delete:hover {
	color: #b900ad;
}

.confirmPanelBackdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1005;
  background-color: black;
  opacity: 0.6;
}

#galleryPostCommentDeleteConfirmPanel {
	z-index: 1006;
}

.newsScreenPostTeaserMediaIcon {
	display: flex;
	justify-content: center;
	font-size: 5em;
	height: 120px;
	align-items: center;
}

.newsScreenPostMediaIcon {
	display: flex;
	justify-content: center;
	font-size: 9em;	
	height: 250px;
	align-items: center;
}

.galleryPostChatLine {
	display: flex;
	height: 60px;
	align-items: center;
	margin-top: 5px;
	border-top: 1px solid #424242;
	line-height: 1.8em;
	flex: 1;
	max-height: 60px;	
}

.galleryPostChatInputContainer {
	position: relative;
	text-align: right;
	display: flex;
	min-height: 0;
	height: 90%;
	min-width: 320px;
	align-self: center;
	width: min(80%,430px);
	max-height: 35px;
	padding-top: 5px;
}

.chatReplyInfoWrapper {
	position: absolute;
	z-index: 0;
	top: -17px;
	left: 0px;
	background-color: #e7e7e7;	
	padding: 0px 15px;
	width: 85%;
	height: 22px;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
	line-height: 1.6em;
}

.chatReplyInfoText {
	display: flex;
	grid-gap: 4px;
}


.chatReplyInfoCloseButton {
    position: absolute;
    top: -3px;
    right: 5px;
    cursor: pointer;
}

.chatReplyInfoCloseButton:hover {
    color: #ff530f;
}

/*.stageScreenShowcaseContent {
	text-align: center;
	width: 100%;
	height: 100%;
	background-color: #000;	
	display: flex;
	justify-content: center;
}*/
.stageScreenShowcaseContent {
	text-align: center;
	width: 100%;	
	background-color: #000;
	display: flex;
	justify-content: center;
	width: 960px;
	aspect-ratio: 16/9;
}

.chatPresentationScreenShowcaseContent {
	text-align: center;
	width: 100%;
	height: 100%;
	background-color: #000;	
	justify-content: center;
}

.wi_stageScreen {
	position: relative;
	min-height: 0;
	background-color: #000;
	aspect-ratio: 16/9;	
	width: 960px;
}


.wi_showcaseStageScreen {	
    justify-content: center;
    background-color: transparent;
    width: 90%;
    height: 100%;
    align-items: center;
    flex-direction: column;
    width: fit-content;
    max-width: 90%;
}

.showcaseMediaContainerWrapper {
	display: flex;
	flex-direction: column;
}

.showcaseMediaContainer {
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: center;
}

.showcaseMediaImage {
	height: auto;
	max-width: 100%;
	background-color: black;	
	object-fit: contain;
}

.ui-slider-handle {
	width: 1em !important;
	height: 1em !important;
}

/*.showcaseMediaYoutubeVideo {
	width: 100%;
	height: 100%;
	background-color: black;
	pointer-events: none;
}*/
.showcaseMediaYoutubeVideo {
	background-color: black;
	pointer-events: none;
}

.fullScreenMediaYoutubeVideo {
	width: 100%;
	height: 100%;
	background-color: black;
	pointer-events: auto;
}

.showcaseMediaVideo {
	width: auto;
	height: 100%;		
	background-color: black;
	/*border-radius: 10px;*/
	/*aspect-ratio: 16/9;*/
	max-width: 100%;
}

.showcaseItemWrapper {
	height: 100%;
	display: flex;
	justify-content: center;
}

.showcaseAudioOffButton {
	cursor: pointer;
	color: #afafb0;;
	font-size: 26px;	
	line-height: 1.4em;	
}

.showcaseAudioOffButton:hover {
	color: #fff;
}

.showcaseAudioOnButton {	
	cursor: pointer;
	color: #afafb0;;
	font-size: 26px;	
	line-height: 1.4em;	
}

.showcaseAudioOnButton:hover {
	color: #fff;
}

.presentationMediaImage {
	width: auto;
	height: 100%;
	max-width: 960px;
}

.chatPresentationScreenContentContainer .presentationMediaImage {
	width: auto;
	height: 100%;
	max-height: calc(100% - 20px);
	max-width: unset;
}

.fullScreenView .presentationMediaImage {
	max-width: 100%;
	width: 100%;
}

.canvasPresentationScreenContent {	
	width: fit-content;
	justify-content: center;
	overflow: hidden;
}

.presentationScreenMedia {
	width: 100%;
	height: auto;
}

.stageScreenContentWrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 100%;
	height: 100%;
}

.toggleFullScreenStage {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto auto 10px auto;	
	font-size: 1.2em;
	cursor: pointer;
	width: fit-content;
	color: #efefef;	
}

.toggleFullScreenPost {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto auto 10px auto;	
	font-size: 1.2em;
	cursor: pointer;
	width: fit-content;
	color: #efefef;	
	z-index: 50;
}

.toggleFullScreenPost.youtube {
    right: 21px;
    margin: unset;
    left: unset;
    bottom: 5px;
}

.fullScreenView .galleryPostMediaWrapper {
	height: 100%;
}

.mediaGalleryYoutubeToggleFullscreenButton {
    position: absolute;
    bottom: 5px;
    right: 22px;
    font-size: 1.2em;
    cursor: pointer;
    width: fit-content;
    color: #efefef;
    z-index: 50;
}

.mediaControlToggleFullscreenButton {
    cursor: pointer;
    font-size: 1.1em;
    padding-left: 25px;
}

.fullScreenStageVideoChatContainer {
	flex: 0 15%;
	max-width: 300px;
	margin: auto 0;	
	align-items: left;
	justify-content: center;
	margin-right: 10px;
	padding-left: 5px;
}



.fullScreenPanel {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	color: #8c8c8c;
	background-color: #020202fa;
	z-index: 58;
}

.fullScreenPanel .loungePanelCloseButton {
	top: 5px;
	right: 10px;
	font-size: 28px;
	z-index: 50;
}

.fullScreenPanelContent {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.fullScreenView .videoChatSpeakerScreen {
	height: 90vh;
	max-height: unset;
	width: unset;	
	max-width: 100%;
}

.fullScreenView .videoChatScreenInfoProfileImage {
	max-width: unset;
	width: 20%;
}

.fullScreenView .videoChatSelfScreen {
	max-height: unset;
	height: 184px;
	max-width: unset;
	width: 245px;
}

/*.fullScreenView .receivedVideoStream {
	max-width: 100%;
}*/

.fullScreenView .fullScreenStageViewStageContainer {
	flex: 1;
	height: 100%;
	width: 100%;
	min-width: 0;
	display: flex;
}

.fullScreenView .showcaseMediaYoutubeVideo {
	width: 100%;
	height: 100%;
}


.fullScreenView .wi_stageScreen {
	width: 100%;
	height: 100%;
	max-width: 100%;
	max-height: 100vh;
	margin: auto;
	border-radius: unset;
}

.fullScreenView .stageScreenShowcaseContent {
	-webkit-border-radius: unset;
	-moz-border-radius: unset;
	-o-border-radius: unset;
	border-radius: unset;
	width: 100%;
	height: 100%;
}

.fullScreenView .showcaseMediaYoutubeVideo,
.fullScreenView .showcaseMediaVideo {	
	border-radius: unset;
}

.fullScreenView .wi_presentationCurtainLeft {
	width: 60%;	
}

.fullScreenView .wi_presentationCurtainRight {
	width: 65%;	
}

.fullScreenView .wi_presentationCurtainUnit {
	width: 11%;
}

.fullScreenView .fullScreenStageVideoChatContainer .videoChatContainerWrapper {
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
	justify-items: flex-end;	
}

.fullScreenView .fullScreenStageVideoChatContainer .videoChatScreenInfoProfileImage {
	max-width: unset;
	width: 30%;
}

.fullScreenView .fullScreenStageVideoChatContainer .videoChatSpeakerScreen {
	height: 24vh;
	max-height: unset;
}

/*.fullScreenView .fullScreenStageVideoChatContainer .videoChatSelfScreen {
	max-height: unset;
	height: 15vh;
	max-width: unset;
}*/

.fullScreenView .fullScreenStageVideoChatContainer .videoChatSelfScreen {
    max-height: unset;
    height: 11vh;
    max-width: unset;
    width: unset;
    aspect-ratio: 4/3;
}




.audioButtonWrapper {
	position: fixed;
	left: 30px;
	bottom: 45px;
}

.audioButtonWrapper.noControlBar {
	bottom: 30px;
}

/* The Presentation Stage Curtain is based on the Codepen by Tim Lamber.
Copyright (c) 2024 by @TimLamber (https://codepen.io/TimLamber/pen/jEmEaP)
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/

.wi_presentationCurtainLeft {
	width: 340px;
	position: absolute;
	top: -1px;
	bottom: -5px;
	left: -13px;
	margin: auto;
	transition: transform 6s ease;
	transform-origin: 120% top;
	display: var(--curtain-display);
	border-radius: 3px;
	opacity: 1;
	z-index: 12;
}

.wi_presentationCurtainRight {
	width: 325px;
	position: absolute;
	top: -1px;
	right: -32px;
	bottom: -5px;
	margin: auto;
	transition: transform 6s ease;
	transform-origin: 120% top;
	display: var(--curtain-display);
	opacity: 1;
	z-index: 12;
}

.wi_presentationCurtainUnit {
    width: 35px;    
    margin-left: -6px;    
    /*background: 
        repeating-linear-gradient(
            to left,
            hsl(var(--curtain-color),52%,50%) 0%, 
            hsl(var(--curtain-color),52%,30%) 50%,
            hsl(var(--curtain-color),52%,70%) 100% );*/
	background: 
        repeating-linear-gradient(
            to left,
            var(--curtain-color-two) 0%, 
            var(--curtain-color-one) 50%,
            var(--curtain-color-three) 100% );        
    
    background-size:  100% 100%; 
    display:inline-block;   
    transform-origin: 0 0%;
    transform: rotate(0.2deg);
    animation: wi_presentationCurtainUnit 3s ease infinite;
    border-radius: 2px;
	outline: 1px solid transparent !important;
	/*-webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.5);
	box-shadow: 5px 5px 10px rgba(0,0,0,0.5);*/
}


@keyframes wi_presentationCurtainUnit {
    50% {
        transform: rotate(-1deg) ;
    }
}

.wi_presentationCurtainUnit:nth-child(1) {
    animation-delay: -0.1s;
    margin-left: 5px;
}
.wi_presentationCurtainUnit:nth-child(2) {
    animation-delay: -0.2s;
}
.wi_presentationCurtainUnit:nth-child(3) {
    animation-delay: -0.3s;
}
.wi_presentationCurtainUnit:nth-child(4) {
    animation-delay: -0.4s;
}
.wi_presentationCurtainUnit:nth-child(5) {
    animation-delay: -0.5s;
}
.wi_presentationCurtainUnit:nth-child(6) {
    animation-delay: -0.6s;
}

.wi_presentationCurtainUnit:nth-child(10) {
    margin-left: -9px;
}

.wi_presentationCurtainRight .wi_presentationCurtainUnit:nth-child(1) {
	/*animation: wi_gameCurtainUnitZZZ 6s ease infinite;
    animation-delay: 0s;*/
    animation-delay: -.7s;    
}
.wi_presentationCurtainRight .wi_presentationCurtainUnit:nth-child(2) {
    animation-delay: -.8s;
}
.wi_presentationCurtainRight .wi_presentationCurtainUnit:nth-child(3) {
    animation-delay: -.9s;
}
.wi_presentationCurtainRight .wi_presentationCurtainUnit:nth-child(4) {
    animation-delay: -1.0s;
}
.wi_presentationCurtainRight .wi_presentationCurtainUnit:nth-child(5) {
    animation-delay: -1.1s;
} 
.wi_presentationCurtainRight .wi_presentationCurtainUnit:nth-child(6) {
    animation-delay: -1.2s;
} 
.wi_presentationCurtainRight .wi_presentationCurtainUnit:nth-child(7) {
    animation-delay: -1.3s;
}

.wi_presentationCurtainRight .wi_presentationCurtainUnit:nth-child(8) {
    margin-left: -9px;
}

.wi_presentationCurtainRight .wi_presentationCurtainUnit:nth-child(10) {
    margin-left: -6px;
}


.wi_openLeftCurtain {
	opacity: 1;
	transform-origin: -120% top;    
    
    -webkit-animation: 3s ease 10ms curtainSlideOutLeft;
  	animation: 3s ease 10ms curtainSlideOutLeft;
}


@keyframes curtainSlideOutLeft {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);    
  }

  to {    
    transform: translate3d(-110%, 0, 0);
    opacity: 0;
  }
}

.curtainSlideOutLeft {
  animation-name: curtainSlideOutLeft;
}

.wi_openLeftCurtain .wi_presentationCurtainUnit,
.wi_openRightCurtain .wi_presentationCurtainUnit,
.wi_closeLeftCurtain .wi_presentationCurtainUnit,
.wi_closeRightCurtain .wi_presentationCurtainUnit {
	animation: none;
}

.wi_openRightCurtain {
	opacity: 1;
	transform-origin: -120% top;
	-webkit-animation: 3s ease 10ms curtainSlideOutRight;
  	animation: 3s ease 10ms curtainSlideOutRight;
}


@keyframes curtainSlideOutRight {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }

  to {
    opacity: 0;    
    transform: translate3d(110%, 0, 0);
  }
}

.curtainSlideOutRight {
  animation-name: curtainSlideOutRight;
}


.wi_closeLeftCurtain {
	transform-origin: -120% top;    
    
    -webkit-animation: curtainSlideInLeft 3s ease;
  	animation: curtainSlideInLeft 3s ease;
}

@keyframes curtainSlideInLeft {
  from {
    opacity: 0;    
    transform: translate3d(-110%, 0, 0);
  }

  to {    
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.curtainSlideInLeft {
  animation-name: curtainSlideInLeft;
}

.wi_closeRightCurtain {
	transform-origin: -120% top;
	-webkit-animation: curtainSlideInRight 3s ease;
  	animation: curtainSlideInRight 3s ease;
}

@keyframes curtainSlideInRight {
  from {
    opacity: 0;    
    transform: translate3d(110%, 0, 0);
  }

  to {    
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.curtainSlideInRight {
  animation-name: curtainSlideInRight;
}

.bodyInvisible {
	opacity: 0;
	visibility: hidden;
}

.bodyVisible {
	visibility: visible;
	opacity: 1;
	-webkit-transition:  visibility 0s, opacity 0.3s ease-in;
       -o-transition:  visibility 0s, opacity 0.3s ease-in;
          transition: visibility 0s, opacity 0.3s ease-in;          
}

.contentInvisible {
	opacity: 0;
	visibility: hidden;
}

.contentVisible {
	visibility: visible;
	opacity: 1;
	-webkit-transition:  visibility 0s, opacity 0.3s ease-in;
       -o-transition:  visibility 0s, opacity 0.3s ease-in;
          transition: visibility 0s, opacity 0.3s ease-in;          
}

@keyframes contentDisappear {
  from {    
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.contentDisappear {
  -webkit-animation-name: contentDisappear;
  animation-name: contentDisappear;
  animation-duration: 0.5s;
}

table {
    border-spacing: 0;
    border-collapse: collapse;
}

td, th {
    padding: 0;
}

img {
    vertical-align: middle;
    border: 0;
}

a {
	background-image: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	outline: none;
	cursor: pointer;
	text-decoration: none;
}

a:active {
	background-color: transparent;
	background-image: none;
}

a:focus {
	background-color: transparent;
	background-image: none;
}

input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

button {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],
html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}
input[type="search"] {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
input[type="radio"],
input[type="checkbox"] {
  margin: 4px 0 0;
  margin-top: 1px \9;
  line-height: normal;
}
input[type="file"] {
  display: none;
}
input[type="range"] {
  display: block;
  width: 100%;
}
select[multiple],
select[size] {
  height: auto;
}
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.radio {
  position: relative;
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
  cursor: pointer;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}

input[type=number] {
	-webkit-appearance: textfield;
    -moz-appearance:textfield;
    appearance: textfield;
}

* {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important;
    -webkit-focus-ring-color: rgba(255, 255, 255, 0) !important;
    outline: none !important;
}

.radio label,
.checkbox label {
  min-height: 20px;
  padding-left: 20px;
  margin-bottom: 0;
  font-weight: normal;
  cursor: pointer;
}
.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
  position: absolute;
  margin-top: 4px \9;
  margin-left: -20px;
  cursor: pointer;
}

::-webkit-scrollbar {
    width: 2px;
    height: 5px;
    background-color: rgba(0,0,0,0);
}

::-webkit-scrollbar-track {
      background-color: rgba(0,0,0,0);
}

::-webkit-scrollbar-thumb {
      background-color: rgba(60, 60, 60, 0.8);
}

@font-face {
  font-family: 'icomoon';
  src:  url('/fonts/icomoon.eot?xm3dcb');
  src:  url('/fonts//icomoon.eot?xm3dcb#iefix') format('embedded-opentype'),
    url('/fonts/icomoon.ttf?xm3dcb') format('truetype'),
    url('/fonts/icomoon.woff?xm3dcb') format('woff'),
    url('/fonts/icomoon.svg?xm3dcb#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-ChatViewIcon:before {
  content: "\e900";
}
.icon-PresentationViewIcon:before {
  content: "\e901";
}
.icon-SpeakerViewIcon:before {
  content: "\e902";
}
.icon-RecordIcon:before {
  content: "\e903";
}
.icon-ReactionsIcon:before {
  content: "\e904";
}
.icon-ClappingIcon:before {
  content: "\e905";
}

.switch {
	position: relative;
	display: inline-block;
	width: 46px;
	height: 26px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 24px;
  width: 24px;
  left: 1px;
  bottom: 1px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #8570ba;
}

input:focus + .slider {
  -webkit-box-shadow: 0 0 1px #8570ba;
  box-shadow: 0 0 1px #8570ba;
}

input:checked + .slider:before {
  -webkit-transform: translateX(20px);
  -ms-transform: translateX(20px);
  transform: translateX(20px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 24px;
}

.slider.round:before {
  border-radius: 50%;
}

.sliderInfoText {
	font-size: 0.8em;	
  	color: #484848;
	line-height: 1.2em;
	vertical-align: top;
	max-width: 600px;
	font-style: italic;
	padding-left: 60px;
	padding-bottom: 20px;	
}

/* remove the hightlight for the current day in date picker */
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
	border: none;
	color: #3ba665;
}


.btn {
  display: inline-block;
  padding: 5px 10px;
  margin-bottom: 0;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}

.btn-medium {
  display: inline-block;
  padding: 4px 8px;
  margin-bottom: 0;
  font-size: 12px;
  font-weight: normal;
  line-height: 1.1;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}

.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus,
.btn-medium:focus,
.btn-medium:active:focus,
.btn-medium.active:focus,
.btn-medium.focus,
.btn-medium:active.focus,
.btn-medium.active.focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}
.btn:hover,
.btn:focus,
.btn.focus,
.btn-medium:hover,
.btn-medium:focus,
.btn-medium.focus {
  color: #e4e8ff;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}
.btn:active,
.btn.active,
.btn-medium:active,
.btn-medium.active {
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
          box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn,
.btn-medium.disabled,
.btn-medium[disabled],
fieldset[disabled] .btn-medium {
  cursor: not-allowed;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
          box-shadow: none;
  opacity: .65;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}
a.btn.disabled,
fieldset[disabled] a.btn,
a.btn-medium.disabled,
fieldset[disabled] a.btn-medium {
  pointer-events: none;
}

.btn-default {
	font-size: 14px;
	font-weight: normal;
	line-height: 1.42857143;
	color: #070707;
	background-color: #9b9b9b;
	border-color: #9b9b9b;
}


.btn:focus.btn-default:focus,
.btn-default.focus {
  color: #070707;
  background-color: #b0b0b0;
  border-color: #b0b0b0;
/*  background-color: #d7d7d7;
  border-color: #d7d7d7;*/
}

.btn:hover.btn-default:hover,
.btn-default:hover {
	color: #070707;
  background-color: #b0b0b0;
  border-color: #b0b0b0;
  /*background-color: #d7d7d7;
  border-color: #d7d7d7;*/
}

.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #070707;
  /*background-color: #808080;
  border-color: #808080;*/
  background-color: #b0b0b0;
  border-color: #b0b0b0;
}
.btn-default:active:hover,
.btn-default.active:hover,
.open > .dropdown-toggle.btn-default:hover,
.btn-default:active:focus,
.btn-default.active:focus,
.open > .dropdown-toggle.btn-default:focus,
.btn-default:active.focus,
.btn-default.active.focus,
.open > .dropdown-toggle.btn-default.focus {
  color: #070707;
  background-color: #b0b0b0;
  border-color: #b0b0b0;
  /*background-color: #d7d7d7;
  border-color: #d7d7d7;*/
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  background-image: none;
}
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus {
  background-color: #b0b0b0;
  border-color: #222;
}
.btn-default .badge {
  color: #fff;
  background-color: #333;
}


.btn-primary {
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857143;
  color: #e4e8ff;
  background-color: #2754aa;
  border-color: #2754aa;
}

.btn-primary-small {
	display: inline-block;
	padding: 5px 10px;
	margin-bottom: 0;
	font-weight: normal;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: none;
	border: none;
	border-radius: 4px;
	-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4);
	box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4);
	color: #e4e8ff;
  	background-color: #2754aa;
  	border-color: #2754aa;
	height: 26px;
}


.btn-primary:focus,
.btn-primary-small:focus,
.btn-primary.focus,
.btn-primary-small.focus {
  color: #e4e8ff;
  background-color: #3a7eff;
  border-color: #3a7eff;
}
.btn-primary:hover,
.btn-primary-small:hover {
  color: #e4e8ff;
  /*background-color: #1d3e7d;
  border-color: #1d3e7d;*/
  background-color: #3a7eff;
  border-color: #3a7eff;
}
.btn-primary:active,
.btn-primary-small:active,
.btn-primary.active,
.btn-primary-small.active,
.open > .dropdown-toggle.btn-primary,
.open > .dropdown-toggle.btn-primary-small {
  color: #e4e8ff;
  /*background-color: #1d3e7d;
  border-color: #1d3e7d;*/
  background-color: #3a7eff;
  border-color: #3a7eff;
}
.btn-primary:active:hover,
.btn-primary-small:active:hover,
.btn-primary.active:hover,
.btn-primary-small.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.open > .dropdown-toggle.btn-primary-small:hover,
.btn-primary:active:focus,
.btn-primary-small:active:focus,
.btn-primary.active:focus,
.btn-primary-small.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.open > .dropdown-toggle.btn-primary-small:focus,
.btn-primary:active.focus,
.btn-primary-small:active.focus,
.btn-primary.active.focus,
.btn-primary-small.active.focus,
.open > .dropdown-toggle.btn-primary.focus,
.open > .dropdown-toggle.btn-primary-small.focus {
  color: #e4e8ff;
  /*background-color: #1d3e7d;
  border-color: #1d3e7d;*/
  background-color: #3a7eff;
  border-color: #3a7eff;
}
.btn-primary:active,
.btn-primary-small:active,
.btn-primary.active,
.btn-primary-small.active,
.open > .dropdown-toggle.btn-primary,
.open > .dropdown-toggle.btn-primary-small {
  background-image: none;
}
.btn-primary.disabled:hover,
.btn-primary-small.disabled:hover,
.btn-primary[disabled]:hover,
.btn-primary-small[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
fieldset[disabled] .btn-primary-small:hover,
.btn-primary.disabled:focus,
.btn-primary-small.disabled:focus,
.btn-primary[disabled]:focus,
.btn-primary-small[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary-small:focus,
.btn-primary.disabled.focus,
.btn-primary-small.disabled.focus,
.btn-primary[disabled].focus,
.btn-primary-small[disabled].focus,
fieldset[disabled] .btn-primary.focus,
fieldset[disabled] .btn-primary-small.focus {
  background-color: #5371aa;
  border-color: #5371aa;
}

.btn-danger {
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857143;
  color: #fff;
  background-color: #ad2c3c;
  border-color: #9e2837;
}
.btn-danger:focus,
.btn-danger.focus {
  color: #fff;
  background-color: #932533;
  border-color: #7d202b;
}
.btn-danger:hover {
  color: #fff;
  background-color: #932533;
  border-color: #7d202b;
}
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  color: #fff;
  background-color: #932533;
  border-color: #7d202b;
}
.btn-danger:active:hover,
.btn-danger.active:hover,
.open > .dropdown-toggle.btn-danger:hover,
.btn-danger:active:focus,
.btn-danger.active:focus,
.open > .dropdown-toggle.btn-danger:focus,
.btn-danger:active.focus,
.btn-danger.active.focus,
.open > .dropdown-toggle.btn-danger.focus {
  color: #fff;
  background-color: #932533;
  border-color: #7d202b;
}
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  background-image: none;
}
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled.focus,
.btn-danger[disabled].focus,
fieldset[disabled] .btn-danger.focus {
  background-color: #932533;
  border-color: #7d202b;
}
.btn-danger .badge {
  color: #ad2c3c;
  background-color: #fff;
}

.btn-alert {
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857143;
  color: #fff;
  background-color: #aa27a8;
  border-color: #891f87;
}
.btn-alert:focus,
.btn-alert.focus {
  color: #fff;
  background-color: #d030ce;
  border-color: #d030ce;
}
.btn-alert:hover {
  color: #fff;
  background-color: #d030ce;
  border-color: #d030ce;
}
.btn-alert:active,
.btn-alert.active,
.open > .dropdown-toggle.btn-alert {
  color: #fff;
  background-color: #d030ce;
  border-color: #d030ce;
}
.btn-alert:active:hover,
.btn-alert.active:hover,
.open > .dropdown-toggle.btn-alert:hover,
.btn-alert:active:focus,
.btn-alert.active:focus,
.open > .dropdown-toggle.btn-alert:focus,
.btn-alert:active.focus,
.btn-alert.active.focus,
.open > .dropdown-toggle.btn-alert.focus {
  color: #fff;
  background-color: #d030ce;
  border-color: #d030ce;
}
.btn-alert:active,
.btn-alert.active,
.open > .dropdown-toggle.btn-alert {
  background-image: none;
}
.btn-alert.disabled:hover,
.btn-alert[disabled]:hover,
fieldset[disabled] .btn-alert:hover,
.btn-alert.disabled:focus,
.btn-alert[disabled]:focus,
fieldset[disabled] .btn-alert:focus,
.btn-alert.disabled.focus,
.btn-alert[disabled].focus,
fieldset[disabled] .btn-alert.focus {
  background-color: #d030ce;
  border-color: #d030ce;
}


.btn-green {
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333;
  background-color: #56d479;
  border-color: #56d479;
}
.btn-green:focus,
.btn-green.focus {
  color: #222;
  background-color: #67ff92;
  border-color: #67ff92;
}
.btn-green:hover {
  color: #222;
  background-color: #67ff92;
  border-color: #67ff92;
}
.btn-green:active,
.btn-green.active,
.open > .dropdown-toggle.btn-default {
  color: #222;
  background-color: #67ff92;
  border-color: #67ff92;
}
.btn-green:active:hover,
.btn-green.active:hover,
.open > .dropdown-toggle.btn-green:hover,
.btn-green:active:focus,
.btn-green.active:focus,
.open > .dropdown-toggle.btn-green:focus,
.btn-green:active.focus,
.btn-green.active.focus,
.open > .dropdown-toggle.btn-green.focus {
  color: #222;
  background-color: #67ff92;
  border-color: #67ff92;
}
.btn-green:active,
.btn-green.active,
.open > .dropdown-toggle.btn-green {
  background-image: none;
}

.buttonShadow {
	-webkit-box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.3);
}

.buttonShadowCompact {
	-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4);
	box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4);
}

.btn-lg {
   	padding: 8px 12px;
  	font-size: 16px;
  	line-height: 1.42857143;
  	-webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
 	border-radius: 4px;
}

.btn-block {
  display: block;
  width: 100%;
}

.checkboxContainer {
	display: block;
	position: relative;
	padding-left: 30px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.checkboxContainer.profileDetails {
    font-size: 1.1em;
    line-height: 1.5em;
}

.profileDetailsPanelProfileImageContainer {
    display: flex;    
    justify-content: center;
}

.profileDetailsPanelProfileImage {
    position: relative;
    width: 100px;
    border-radius: 50%;
}

.profileDetailsPanelInputWrapper {
	display: flex;
	flex-direction: column;
	padding-bottom: 15px;
}

.profileDetailsPanelInputLabel {
    padding-bottom: 3px;
    text-transform: uppercase;
    font-size: 0.7em;
    text-align: left;
    color: #bbb;
    height: 20px;
}

/* Hide the browser's default checkbox */
.checkboxContainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkbox {
	position: absolute;
	top: 0;
	left: 0;
	height: 20px;
	width: 20px;
	background-color: #242424;
	border: 1px solid #777;
	border-radius: 4px;
	margin-top: 2px;
}

/* On mouse-over, add a grey background color */
.checkboxContainer:hover input ~ .checkbox {
  background-color: #3c3c3c;
}

/* When the checkbox is checked, add a green background */
.checkboxContainer input:checked ~ .checkbox {
	background-color: #04c6a1;
	border-color: #00ac8b;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkbox:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.checkboxContainer input:checked ~ .checkbox:after {
  display: block;
}

/* Style the checkmark/indicator */
.checkboxContainer .checkbox::after {
	left: 5px;
	top: 0px;
	width: 8px;
	height: 15px;
	border: solid #262626;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.info_text {
	font-size: 0.8em;
	line-height: 1.2em;
	font-style: italic;
	color: #999;
}

.info_text_small {
	font-size: 0.7em;
	line-height: 1.2em;
	color: #999;
	font-style: italic;
}

.text_link
{
    font-size: 1em;
    color: #3383ff;
    background-color:transparent;
    text-decoration: none;
    border: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: none;
}

.text_link:link    { color: #3383ff; background-color:transparent; text-decoration: none; }
.text_link:visited { color: #3383ff;}
.text_link:hover   { color: #3383ff; background-color:transparent; text-decoration: underline; }
.text_link:disabled { color: #3383ff; background-color:transparent; text-decoration: none;}

.defaultCursor {
	cursor: default;
}

.hidden {
	visibility: hidden;
}

.noDisplay {
	display: none;
}

.contentDisplay {
	display: contents;
}

.flexOne {
	flex: 1;
}

.flexButtonWrapper {
	display: -webkit-box;      
  display: -moz-box; 
  display: -ms-flexbox; 
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
    align-items: center;
    justify-content: end;
}

.flexDisplay {
  display: -webkit-box;      
  display: -moz-box; 
  display: -ms-flexbox; 
  display: -webkit-flex;
  display: flex;  
}

.flexDisplayRow {
  display: -webkit-box;      
  display: -moz-box; 
  display: -ms-flexbox; 
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
}

.flexDisplayRowCentered {
  display: -webkit-box;      
  display: -moz-box; 
  display: -ms-flexbox; 
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.flexDisplayRowCenterAligned {
  display: -webkit-box;      
  display: -moz-box; 
  display: -ms-flexbox; 
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.flexDisplayColumn {
  display: -webkit-box;      
  display: -moz-box; 
  display: -ms-flexbox; 
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
}

.flexDisplayColumnCentered {
  display: -webkit-box;      
  display: -moz-box; 
  display: -ms-flexbox; 
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.flex1 {
	flex: 1;
}

.noFlex {
	flex: unset;
}

.clickable {
	cursor: pointer;
}

.blockDisplay {
	display: block;
}

.inlineDisplay {
	display: inline;
}

.inlineBlockDisplay {
	display: inline-block;
}

.relativePosition {
	position: relative;
}

.padding5 {
	padding: 5px;
}

.padding10 {
	padding: 10px;
}

.padding15 {
	padding: 15px;
}

.padding20 {
	padding: 20px;
}

.padding40 {
	padding: 40px;
}

.paddingLeft5 {
	padding-left: 5px;
}

.paddingLeft10 {
	padding-left: 10px;
}

.paddingLeft15 {
	padding-left: 15px;
}

.paddingLeft20 {
	padding-left: 20px;
}

.paddingLeft30 {
	padding-left: 30px;
}

.paddingLeft35 {
	padding-left: 35px;
}

.paddingLeft40 {
	padding-left: 40px;
}

.paddingLeft60 {
	padding-left: 60px;
}

.paddingLeft80 {
	padding-left: 80px;
}

.paddingRight5 {
	padding-right: 5px;
}

.paddingRight10 {
	padding-right: 10px;
}

.paddingRight20 {
	padding-right: 20px;
}

.paddingRight32 {
	padding-right: 32px;
}

.paddingTop3 {
	padding-top: 3px;
}

.paddingTop4 {
	padding-top: 4px;
}

.paddingTop5 {
	padding-top: 5px;
}

.paddingTop6 {
	padding-top: 6px;
}

.paddingTop8 {
	padding-top: 8px;
}

.paddingTop10 {
	padding-top: 10px;
}

.paddingTop15 {
	padding-top: 15px;
}

.paddingTop20 {
	padding-top: 20px;
}

.paddingTop20M {
	padding-top: 0px;
}

.paddingTop28 {
	padding-top: 28px;
}

.paddingTop30 {
	padding-top: 30px;
}

.paddingTop40 {
	padding-top: 40px;
}

.paddingTop60 {
	padding-top: 60px;
}

.paddingTop120 {
	padding-top: 120px;
}

.paddingBottom5 {
	padding-bottom: 5px;
}

.paddingBottom6 {
	padding-bottom: 6px;
}

.paddingBottom10 {
	padding-bottom: 10px;
}

.paddingBottom15 {
	padding-bottom: 15px;
}

.paddingBottom20 {
	padding-bottom: 20px;
}

.paddingBottom30 {
	padding-bottom: 30px;
}

.paddingBottom40 {
	padding-bottom: 40px;
}

.paddingBottom60 {
	padding-bottom: 60px;
}


.noMargin {
	margin: 0;
}

.marginAuto {
	margin: auto;
}

.marginTop10 {
	margin-top: 10px;
}

.marginTop20 {
	margin-top: 20px;
}

.marginTop25 {
	margin-top: 25px;
}

.marginTop30 {
	margin-top: 30px;
}

.marginBottom10 {
	margin-bottom: 10px;
}

.marginBottom15 {
	margin-bottom: 15px;
}

.marginLeft10 {
	margin-left: 10px;
}

.marginRightMinus6 {
	margin-right: -6px;
}

.marginRight10 {
	margin-right: 10px;
}

.marginRight20 {
	margin-right: 20px;
}

.marginRight40 {
	margin-right: 40px;
}

.marginRight120 {
	margin-right: 0px;
}

.width20 {
	width: 20px;
}

.width60 {
	width: 60px;
}

.width95 {
	width: 95px;
}

.width190 {
	width: 190px;	
}

.width200 {
	width: 200px;
}

.width100 {
	width: 100%;
}

.height100 {
	height: 100%;
}

.maxWidth100 {
	max-width: 100%;
}

.maxWidth120 {
	max-width: 120px;
}

.maxWidth140 {
	max-width: 140px;
}

.maxWidth300 {
	max-width: 300px;
}

.maxWidth350 {
	max-width: 350px;
}

.maxWidth380 {
	max-width: 380px;
}

.maxWidth480 {
	max-width: 480px;
}


.maxWidth500 {
	max-width: 500px;
}

.maxWidth580 {
	max-width: 580px;
}

.maxWidth600 {
	max-width: 600px;
}

.maxWidth750 {
	max-width: 750px;
}

.maxWidth800 {
	max-width: 800px;
}

.minWidth130 {
	min-width: 130px;
}

.minWidth190 {
	min-width: 190px;
}

.minWidth300 {
	min-width: 300px;
}

.fontSize09 {
	font-size: 0.9em;
}

.desktopWidth70 {
	width: 90%;
	margin-left: 60px;
}

.desktopNoWrap {
	white-space: normal;
}

.aboutWrapper {
	width: 60%;
}

.preEntryView {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;	
}

.loungePreEntryPageCookieInfo {
	font-size: 0.7em;
	font-style: italic;
	line-height: 1.2em;
	text-align: center;
	color: #757575;
	max-width: 95%;
}

.loungesPage {
	overflow: auto;
}

.loungePreEntryPageContentWrapper {
	display: flex;
	grid-gap: 20px;
	position: relative;
	flex-direction: column;
	min-height: 0;
	align-items: center;
	justify-content: flex-start;
	flex: 1;
}

.loungePreEntryPageEntryWrapper {
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: flex-start;
	flex-direction: column;
	overflow: auto;
	padding: 40px;
	/* border: 1px solid #0d0d0d; */
	/* box-shadow: 2px 2px 10px rgba(0,0,0,0.4); */
	border-radius: 10px;
	/* background-color: #060606; */
}

.loungesPageTitleWrapper {
	padding-top: 20px;
	padding-bottom: 60px;
}

.loungesPageTitle {
	font-family: "Lane", sans-serif;
	font-size: 3em;
	line-height: 1em;
	display: flex;
	width: 100%;	
	align-items: center;
	justify-content: center;
	position: relative;
	text-align: center;
}

.loungeButtonContainer {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 60px;
	grid-template-rows: auto 1fr;
	max-width: 60%;
	min-height: 0;
	flex: 1;
}

.moreLoungesInfoWrapper {
	display: flex;
	text-align: center;
	align-items: center;
	padding: 40px;
	font-style: italic;
	font-family: "Lane", sans-serif;
	color: #a4a4a4;
}

.mainEnterButton {
	font-family: "Lane", sans-serif;
	font-size: 2em;
	border: 1px solid #c31cff6e;
	color: #f7f7f7;
	padding: 20px;
	border-radius: 4px;
	letter-spacing: 3px;
	cursor: pointer;
	line-height: 1.5em;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 20vh;
}

.mainEnterButton:hover {	
	-webkit-box-shadow: 0 0 15px 2px #c31cff6e;
	box-shadow: 0 0 15px 2px #c31cff6e;
}

.pageContent {
	vertical-align: top;
	overflow: hidden;
	height: 100%;
	min-height: 100%;
	min-width: 720px;
	background-color: #000;
}

.pageErrorContent {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 100;
}

/*.mainContent {
	flex: 1 auto;
	margin: 0px 0px;
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}*/

.mainContent {
	flex: 1 auto;
	/* margin: 0px 0px; */
	position: relative;	
	flex-direction: column;
	/* overflow: hidden; */
	width: 100%;
	/* aspect-ratio: 16/9; */
	/* max-width: 100%; */
	/* height: auto; */
	/* max-height: 100%; */
	/* max-height: calc(100vw/2.22); */
	/* margin: auto; */
	/* background-color: blueviolet; */
	/* max-height: 100vh; */
	overflow: hidden;
}

.preMainContent {
	flex: 1 auto;	
	position: relative;	
	flex-direction: column;
	width: 100%;
	
	overflow: hidden;
}

.portraitErrorView,
.portraitErrorView.active {
	display: none;		
}


.panelBackdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 59;
  background-color: black;
  opacity: 0.6;
}

.debugPanel {
	position: absolute;
	width: 40%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 500;
	pointer-events: none;
}

.mainPanel {
	z-index: 60;
	margin: auto;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    position: absolute;  
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2), 0px 0px 40px 0px rgba(0,0,0,0.19);  
    box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2), 0px 0px 40px 0px rgba(0,0,0,0.19);
    font-size: 18px;
    line-height: 1.2;
    letter-spacing: normal;
    /*color: #111;*/
    /*color: #000;*/
    /*color: #acacac;*/
    color: #8c8c8c;
    text-align: left;
    text-transform: none;
    /*background-color: #222;*/
    background-color: #121212f2;
}

.loginPanel {
	max-width: 380px;
	position: fixed;
	max-height: 80%;
	overflow: auto;
}

.loginPanelSectionHeader {
	font-family: "Lane", sans-serif;
	font-size: 1.4em;	
	color: #939393;	
	margin-top: 0px;	
	padding-bottom: 10px;
}

.form-group {
	clear: both;
	margin-bottom: 15px;
}

.horizontal-form-group {
	position: relative;
	margin-bottom: 15px;
	margin-right: 15px;
	float: left;
}

.panelInputLabel {
	padding-bottom: 3px;
	text-transform: uppercase;
	font-size: 0.7em;
	text-align: left;
	color: #bbb;
	line-height: 0.8em;
}

.panelInputContainer {
	display: flex;
	flex-direction: row;
	grid-gap: 10px;
	position: relative;
}

.panelReadOnlyInputWrapper {
	border-radius: 4px;
	border: 1px solid #464646;
	text-align: left;
	height: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding-left: 5px;
	font-size: 0.8em;
	padding-right: 15px;
	max-width: 65vw;
}

.panelReadOnlyInput {
	color: #efefef;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	width: 100%;
	white-space: nowrap;
	max-width: 270px;
}

.panelReadOnlyInput.editor {
	max-width: 200px;
}

.panelReadOnlyInputDeleteButton {
	position: absolute;
	right: 5px;
	top: 5px;
	font-size: 0.6em;
	color: #efefef;
	cursor: pointer;
}


.readOnlyInputDeleteButton {
	position: absolute;
	top: -3px;
	right: 4px;
	font-size: 0.6em;
	color: #efefef;
	cursor: pointer;
}

.panelReadOnlyInputDeleteButton:hover {
	color: #ff530f;
}

.postContentWrapper {
	position: relative;
	width: 100%;
}

.panelInputEmojiButton {
	cursor: pointer;
	position: absolute;
	top: 9px;
	right: 0;
}

.passwordResetErrorDiv {
	/*color: #f700e7;*/
	color: #f700e7;
	padding-bottom: 5px;
	margin-top: -5px;
	margin-bottom: -20px;
}

.panelCloseButton {
	position: absolute;
	top: 10px;
	right: 15px;
	font-size: 1.8em;
	color: #989898;
	z-index: 1002;
	cursor: pointer;
	text-shadow: 1px 1px 1px rgba(0,0,0 ,0.3);
}

.panelCloseButton:hover {
    color: #ff530f;
}

.form-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  /*color: #bababa;*/
  color: #252525;
  /*background-color: rgba(0,0,0,0.5);*/
  background-color: #e4e4e4;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 1px 3px 0 rgba(0, 0, 0, 0.15), 0 4px 6px 0 rgba(0, 0, 0, 0.15);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 1px 3px 0 rgba(0, 0, 0, 0.15), 0 4px 6px 0 rgba(0, 0, 0, 0.15);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
       -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.form-control.error {
	background-color: #f700e7;
}

.form-control-small {
  display: block;
  width: 100%;
  height: 26px;
  padding: 4px 8px;
  font-size: 14px;
  line-height: 1.1;
  /*color: #2f2e2e;*/
  background-color: #fff;
  /*color: #bababa;*/
  color: #252525;
  /*background-color: rgba(0,0,0,0.5);*/
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 1px 3px 0 rgba(0, 0, 0, 0.15), 0 4px 6px 0 rgba(0, 0, 0, 0.15);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 1px 3px 0 rgba(0, 0, 0, 0.15), 0 4px 6px 0 rgba(0, 0, 0, 0.15);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
       -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.form-control-small:focus,
.form-control:focus,
.numberInput:focus {
  /*border-color: #66afe9;*/
  /*border-color: #3a7eff;*/
  outline: 0;
  border: 1px solid #3a7eff;
  
  /*-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);*/
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(58, 126, 255, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(58, 126, 255, .6);
}

.form-control[readonly]:focus {
	border: 1px solid transparent;
	 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 1px 3px 0 rgba(0, 0, 0, 0.15), 0 4px 6px 0 rgba(0, 0, 0, 0.15);
     box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 1px 3px 0 rgba(0, 0, 0, 0.15), 0 4px 6px 0 rgba(0, 0, 0, 0.15);
}

.form-control-small::-moz-placeholder,
.form-control::-moz-placeholder {
  color: #666;
  opacity: 1;
}

.form-control-small:-ms-input-placeholder,
.form-control:-ms-input-placeholder {
  color: #666;
}

.form-control-small::-webkit-input-placeholder,
.form-control::-webkit-input-placeholder {
  color: #666;
}

.form-control-small::-ms-expand,
.form-control::-ms-expand {
  background-color: transparent;
  border: 0;
}
.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control,
.form-control-small[disabled],
.form-control-small[readonly],
fieldset[disabled] .form-control-small {
  background-color: #eee;
  opacity: 1;
}
.form-control[disabled],
fieldset[disabled] .form-control,
.form-control-small[disabled],
fieldset[disabled] .form-control-small {
  cursor: not-allowed;
}

.form-control.textCursor[disabled] {
	cursor: text;
}

textarea.form-control,
textarea.form-control-small {
  height: auto;
}

.form-control-feedback {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  display: block;
  width: 34px;
  height: 34px;
  line-height: 34px;
  text-align: center;
  pointer-events: none;
}
.input-lg + .form-control-feedback,
.input-group-lg + .form-control-feedback,
.form-group-lg .form-control + .form-control-feedback {
  width: 46px;
  height: 46px;
  line-height: 46px;
}
.input-sm + .form-control-feedback,
.input-group-sm + .form-control-feedback,
.form-group-sm .form-control + .form-control-feedback {
  width: 30px;
  height: 30px;
  line-height: 30px;
}

.postContentTextInput {
	font-size: 1em;
	line-height: 1.2em;
}

.passwordResetPanel {
	position: absolute;
    max-width: 420px;
    width: 95%;
    height: 265px;
    padding-bottom: 15px;
}


.passwordToggle {
	cursor: pointer;
	pointer-events: all;
	color: #757575;
}

.variableHeightPanel {
	position: absolute;
    max-width: 420px;
    width: 95%;   
    overflow: auto;
    flex-direction: column;
	min-height: 0;
	height: fit-content;
	max-height: calc(100% - 10px);
}

.popupPanelHeader, .panelHeader {
	position: relative;
	width: 100%;	
	margin: 0px;
	border-bottom: 1px solid transparent;	
	-webkit-border-radius: 5px 5px 0px 0px;
	-moz-border-radius: 5px 5px 0px 0px;
	-o-border-radius: 5px 5px 0px 0px;
	border-radius: 5px 5px 0px 0px;
	padding: 10px 10px 0px 10px;	
	font-family: "Lane", sans-serif;
	height: 60px;
	flex: 0 60px;
	min-height: 60px;
}
.popupPanelHeaderContent,
.panelHeaderContent {
	position: relative;
	z-index: 2;
	width: 100%;
	padding-left: 5px;
}

.popupPanelContentWrapper {
	flex: 1;
	min-height: 0;
	padding: 20px;
}

#systemMessagePanelContentText {
	padding: 0 20px 20px 20px;
}

.titleBarLogo {
   padding-top: 2px;
   width: 48px;
}

.panelTitle {
	color: #737373;
	font-size: 2.3em;
	display: inline-block;
    padding-left: 20px;
    position: absolute;
    top: 16px;
}

.panelTitlePopup {
    color: #737373;
    font-size: 2.3em;
    display: inline-block;    
    position: absolute;
}

.contactFormHeader {
    display: flex;
    grid-gap: 40px;
    align-items: center;
    font-size: 2em;
    padding: 10px 0 0 10px;
    position: relative;
}

.contactFormLogoWrapper {
    width: 150px;
    flex: 1;
    max-width: 40%;
}

.contactFormContactWrapper {
	font-size: 15px;
}

.contactFormNameWrapper {
    display: flex;
    grid-gap: 20px;
}

.contactFormHeader .panelCloseButton {
    top: -3px;
    right: 3px;
    font-size: 0.9em;
}

.errorMessage {
	display: none;
	color: #f700e7;
	padding-bottom: 10px;
}

.errorMessageDisplay {
	color: #f700e7;
	padding-bottom: 10px;
}

.errorMessagePanel {
	box-sizing: border-box;
	text-align: left;
	padding: 0;
	margin: auto;
	font-family: 'RobotoLight', sans-serif;
	font-size: 18px;
	line-height: 1.2em;
	z-index: 2601;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	position: absolute;
	min-width: 200px;
	color: #8c8c8c;
	-webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2), 0px 0px 40px 0px rgba(0,0,0,0.19);
	box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2), 0px 0px 40px 0px rgba(0,0,0,0.19);
	overflow: hidden;
	clear: both;
	background-color: #f4f4f4;
	-webkit-animation-duration: 0.3s;
	animation-duration: 0.3s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
    max-width: 420px;
    width: 95%;
    height: fit-content;
    border-radius: 6px;
}

.guiPanelContainer {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-direction: column;
	position: relative;
	clear: both;
	overflow: hidden;
	width: 100%;
}

.guiPanelHeader {
	position: relative;
	display: block;
	margin: 0;
	border: 0;
	white-space: nowrap;
	background-color: unset;
	overflow: hidden;
	clear: both;
	padding: 10px 14px 0px 14px;
}

.guiPanelLogoContainer {
	display: inline-block;
	position: relative;
	margin: 0 20px 0px 0px;
	vertical-align: top;
}

.guiPanelTitle {
	display: inline-block;
	color: #a4a4a4;
	font-size: 30px;
	text-align: left;
	vertical-align: middle;
	height: 100%;
	padding-bottom: 2px;
	white-space: nowrap;
	overflow: hidden;
	white-space: nowrap;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	font-family: "Lane", sans-serif;
	line-height: 1.3em;
}

.guiPanelContent {
	position: relative;
	overflow-y: auto;
	color: #383838;
	clear: both;
	background-color: unset;
	padding: 10px 24px 15px 24px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-direction: column;
	height: 100%;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.clientLoadErrorDiv {
	margin: auto;
	font-size: 2em;
	color: #f700e7;
	font-style: italic;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	text-align: center;
	height: fit-content;
	line-height: 1em;
	max-width: 90%;
}

.contentContainer {
	position: relative;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	width: 100%;
	flex-direction: column;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	height: 100%;
	min-height: 0;
}

.loungePanelViewContainer {
	width: 100%;
	background-color: rgba(0,0,0,0.2);
	border-radius: 0px 10px 10px;
	height: 100%;
	overflow: hidden;
}

.loungePanelContentView {
	white-space: nowrap;
	width: 100%;
	vertical-align: top;
	overflow: auto;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.loungePanelInsideContentView {		
	overflow: hidden;
	height: 100%;
}

.loungePanelMenuListPane {
	width: 100%;
	text-align: left;
	overflow: hidden;
	height: 36px;
	display: flex;
}

.loungePanelMobileBackOption {	
	margin: 2px 10px;
	height: 100%;
	padding-bottom: 10px;
	position: relative;
	font-size: 1.5em;
	vertical-align: top;
	cursor: pointer;
}

.loungePanelMobileBackOption:hover {
	color: #efefef;
}

.loungePanelMenuListOption {
	font-size: 0.8em;
	position: relative;
	cursor: pointer;
	color: #7a7a7a;
	padding: 0px 7px 10px 7px;	
	text-overflow: ellipsis;
	overflow: hidden;
	height: 100%;
	max-width: 180px;
	margin-top: 3px;
}

.loungePanelMenuListOption:hover {
	color: #e6e6e6;
}

.loungePanelMenuListOption.active {
	background-color: rgba(0, 0, 0, 0.3);
	border-radius: 10px 10px 0px 0px;
	color: #e6e6e6;
}

.loungePanelMenuTabAlert {
	position: absolute;
	border-radius: 50%;
	width: 8px;
	height: 8px;
	top: 1px;
	right: 3px;
	-webkit-box-shadow: 2px 2px 5px rgba(15,15,15,0.5);
	box-shadow: 2px 2px 5px rgba(15,15,15,0.5);
	background-color: var(--loungeColor);
}

.loungePanelNoContentText {
	text-align: center;	
	padding-top: 60px;
	font-size: 0.8em;
	font-style: italic;
}

.showcaseMediaProgressBarContainer {
	margin-bottom: 20px;
	font-size: 0.9em;
}

.ui-progressbar {
    position: relative;
}
.progress-label {
	position: absolute;	
	top: 4px;	
	margin: auto;
	white-space: nowrap;
	width: 100%;
	text-align: center;
}

.userTeaserContainer {
	position: absolute;
	right: 78px;
	bottom: 47px;
}

.userTeaserWrapper {
	position: relative;	
}

.userTeaserIcon {
	width: 45px;
	position: absolute;
	cursor: pointer;
}

.userTeaserIcon:nth-child(1) {
	left: -70px;
  	z-index: 5;
  	top: -30px;
}

.userTeaserIcon:nth-child(2) {
	left: -42px;
  	top: -30px;
  	z-index: 4;
}

.userTeaserIcon:nth-child(3) {
	left: -51px;
	top: -10px;
	z-index: 4;
}

.userTeaserIcon:nth-child(4) {
	left: -25px;
  	top: -45px;
  	z-index: 2;
}

.userTeaserPlusWrapper {
	position: absolute;
	z-index: 6;
	right: -30px;
	bottom: -18px;
	cursor: pointer;	
	align-items: center;
	background-color: #d7d7d7;
	width: 35px;
	text-align: left;
	padding: 2px;
	border-radius: 50%;
	height: 35px;
	grid-gap: 1px;
	justify-content: center;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	font-size: 0.7em;
	color: #0f0f0f;
}

.userTeaserPlusIcon {	
	font-size: 0.7em;	
}

.userTeaserPlusWrapper:hover {
	background-color: #fff;
}


.userTeaserPlusCount:empty {
	display: none;
}

.userTeaserImage {
	width: 100%;
	border-radius: 50%;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
}

.guestUserEntryWrapper {
	position: relative;
	display: flex;
	/* grid-template-columns: 1fr 1fr; */
	/* grid-gap: 10px; */
	/* grid-template-rows: auto 1fr; */
	flex-direction: column;
	grid-gap: 5px;
}

.guestUserEntryDataWrapper {
	display: flex;
	flex-direction: column;	
	flex: 1;
	min-width: 0;
}

.guestUserEntry {
	display: flex;
	grid-gap: 5px;
	font-size: 0.8em;
	border: 1px solid #404040;
	border-radius: 10px;
	padding: 5px;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
	position: relative;	
	display: flex;
	min-width: 0;
	display: flex;
}

.guestUserEntry.operator {
	border: 1px solid var(--loungeColor);
}

.guestUserEntry.reported {
	border: 1px solid #ff0000;
}

.operatorBadge {
	position: absolute;
	top: 0px;
	font-size: 0.6em;
	margin: auto;
	right: 60px;	
	width: fit-content;
	border: 1px solid var(--loungeColor);
	line-height: 1em;
	border-radius: 0 0 5px 5px;
	padding: 1px 5px;
	background-color: #1e1e1e;
	color: #fff;
	border-top: none;
}

.operatorBadge.sysadmin {
	right: 40px;
	left: unset;
}

.sysAdminBadgeWrapper {
	display: flex;
	align-items: center;
	padding: 2px 0;
	grid-gap: 2px;
}

.sysAdminBadgeLogo {
	width: 15px;
}

.guestUserEntryOperatorIcon {
	position: absolute;
	font-size: 1.2em;
	right: 5px;
	top: 0px;
	text-shadow: 2px 2px 5px rgba(0,0,0,0.4);
	cursor: pointer;
	color: #b3b3b3;
}

.guestUserEntryOperatorIcon.active {
	color: var(--loungeColor);
}

.guestUserEntryOperatorIcon:hover {
	color: var(--loungeColor);
}

.guestUserEntryOperatorIcon.active:hover {
	color: #fff;
}

.guestUserEntryBanIcon {
	position: absolute;
	right: 45px;
	top: -1px;
	font-size: 1.3em;
	text-shadow: 2px 2px 5px rgba(0,0,0,0.4);
	cursor: pointer;
	color: #fd000073;
}

.guestUserEntryBanIcon:hover {
	color: #fd0000;
}


.guestUserEntryBlockIcon {
    position: absolute;
    right: 45px;
    top: -1px;
    font-size: 1.1em;
    text-shadow: 2px 2px 5px rgba(0,0,0,0.4);
    cursor: pointer;
    color: #95959573;
}

.guestUserEntryBlockIcon:hover {
	color: #fd0000;
}

.guestUserEntryUnblockIcon {
	position: absolute;
	right: 45px;
	top: -1px;
	font-size: 1.1em;
	text-shadow: 2px 2px 5px rgba(0,0,0,0.4);
	cursor: pointer;
	color: #fd0000;
}

.guestUserEntryUnblockIcon:hover {
	color: #fd0000;
}

.guestUserEntryChatIcon {
	position: absolute;
	right: 2px;
	top: -2px;
	font-size: 1.3em;
	text-shadow: 2px 2px 5px rgba(0,0,0,0.4);
	cursor: pointer;
	color: #b5b5b5;
}

.guestUserEntryChatIcon.disabled {
	display: none;
}

.guestUserEntryDeleteIcon {
    position: absolute;
    right: 10px; 
    font-size: 1.3em;
    text-shadow: 2px 2px 5px rgba(0,0,0,0.4);
    cursor: pointer;
    color: #b5b5b5;
    bottom: 8px;
}

.guestUserEntryChatIcon:hover {
	color: var(--loungeColor);
}

.guestUserEntryDeleteIcon:hover {
	color: #b900ad;
}

.reportUserImageWrapper {
    display: flex;
    grid-gap: 20px;
    padding-top: 10px;
}

.qaUserEntry {
    display: flex;
    grid-gap: 5px;
    font-size: 0.8em;
    border: 1px solid #404040;
    border-radius: 10px;
    padding: 5px;
    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
    box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
    position: relative;
    display: flex;
    min-width: 0;
    display: flex;
    margin: 5px 0 0 0;
    width: 70%;
    justify-self: center;
}

.guestUserEntryImage {
	border-radius: 50%;
	width: 50px;
	/* box-shadow: 2px 2px 5px rgba(0,0,0,0.4); */
	cursor: pointer;
}

.guestUserEntryDescription {
	white-space: nowrap;
	line-height: 1.3em;
	font-size: 0.8em;
	font-style: italic;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	width: 100%;
	max-width: 100%;
	flex: 1;
}

.guestUserEntryUserName {
    white-space: nowrap;
    -moz-text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;   
    line-height: 1.2em;
    padding-top: 12px;
    width: 100%;
	max-width: 100%;
	flex: 1;
}

.guestUserEntryLocation {
	display: flex;
	grid-gap: 5px;
	font-size: 0.8em;
	line-height: 1em;
	padding-top: 5px;
}

.guestUserProfileDetailsPanel {
	position: fixed;
	background-color: rgba(0,0,0,0.95);
	width: 280px;
	padding: 10px;
	max-height: 340px;
	font-size: 0.9em;
	z-index: 20;
	border-radius: 10px;
	border: 1px solid #272727;
}

.guestUserEntryDetailsLocation {
	display: flex;
	/*margin: auto;*/
	line-height: 1.2em;
	max-width: 90%;	
	width: fit-content;
}

.userProfileIconDiv {
    width: 22px;
}

.guestUserEntryDetailsInfo {
	display: flex;
	/*margin: auto;*/
	line-height: 1.2em;	
	max-width: 90%;	
	width: fit-content;
}

.guestUserProfileDetailsScrollContainer {
	overflow-y: auto;	
	max-height: 120px;
	overflow-x: hidden;
	margin-top: 20px;
}


.guestUserEntryDetailsInfoData {
	white-space: nowrap;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
}

.guestUserEntryDetailsUserName {
	margin: auto;
}

.guestUserEntryLink
{
    font-size: 1em;
    color: unset;
    background-color:transparent;
    text-decoration: underline;
    border: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: none;
}

.guestUserEntryLink:link    { color: unset; background-color:transparent; text-decoration: none; }
.guestUserEntryLink:visited { color: unset;}
.guestUserEntryLink:hover   { color: unset; background-color:transparent; text-decoration: underline; }
.guestUserEntryLink:disabled { color: unset; background-color:transparent; text-decoration: none;}

.guestUserEntryDetailsDescription {
	white-space: normal;
	line-height: 1.2em;	
	padding-top: 20px;
	word-wrap: anywhere;
}
.guestUserEntryDetailsImageWrapper {
	align-self: center;
}

.guestUserEntryDetailsImage {
	border-radius: 50%;
	width: 120px;
	/* box-shadow: 2px 2px 5px rgba(0,0,0,0.4); */
}


.loungeViewWrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
    position: relative;    
}

.loungeViewContainer {
	width: 100%;
	height: 100%;
	z-index: 0;
	/* background-image: url("http://localhost:52817/images/LED-MEssestand.jpg"); */
	/* background-size: 80%; */
	/* background-image: url("http://localhost:52817/images/Library04.png"); */
	display: flex;
	flex-direction: column;
	position: absolute;  	
	pointer-events: none;
	max-width: 100%;
	max-height: 100%;	
}

.panelClickBackdrop {
	position: fixed;
	top: 0px;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1500;
	background-color: rgba(0,0,0,0.6);
	opacity: 0.5;	
}

.sectionDivider {
	height: 1px;
	margin: 0;
	overflow: hidden;
	background-color: var(--mainTextColor);
	width: 100%;
}

.presentationViewPresenterSection {
	font-size: 1em;
	line-height: 1em;
	display: flex;
	grid-gap: 10px;
	padding: 20px 0px 10px 10px;
	justify-content: flex-end;
	align-items: center;
	position: relative;
}

.presentationPresenterLabel {
	color: white;
	font-size: 0.8em;
}

.presentationViewPresenterWrapper {
	display: flex;
	flex: 1;
	grid-gap: 20px;
	text-align: left;
	color: var(--mainTextColor);
	align-items: center;
}

.presentationViewPresenterButtonWrapper {
	display: flex;	
	font-size: 0.75em;
	padding-top: 5px;
	align-items: center;
}

.presentationViewEventButtonWrapper {
	display: flex;
	font-size: 0.75em;
	align-items: center;
	padding-bottom: 20px;
	justify-content: center;
	grid-gap: 40px;
}

.presentationViewPresenterChangeLink {	
	font-size: 0.8em;	
	cursor: pointer;
	margin-left: 40px;
}

.presentationViewInfoText {
	font-size: 0.6em;
	line-height: 1em;
	text-align: left;
	padding-top: 15px;	
	padding-left: 10px;
}

.presentationViewMediaContainer {	
	font-size: 1.15em;
}

.presentationPanelContent {
	position: relative;
	width: 100%;
	height: 100%;	
	min-height: 0;	
}

.presentationViewMediaTabContainer {
	display: flex;
	width: 100%;
	grid-gap: 20px;
	line-height: 1em;
	font-size: 0.7em;
}

.presentationViewMediaTab {
	flex: 1;	
	border-radius: 10px 10px 0px 0px;	
	padding: 2px;
	cursor: pointer;
}

.presentationViewCheckboxLabel {
	padding-top: 6px;	
}

.presentationVideoViewCheckboxLabel {
	width: 73px;
	line-height: 1em;
	font-size: 0.8em;
}

.presentationVideoViewCheckboxLabel .checkbox {
	top: -7px;
}

.checkboxContainer.presentationVideoViewCheckboxLabel {
	padding-left: 23px;
}

.presentationViewMediaTab.active {		
	cursor: default;
}

.presentationViewMediaHeaderTab {
	flex: 1;
	color: var(--mainTextColor);
	padding: 2px 5px;
	cursor: pointer;
}

.presentationViewMediaHeaderTab.hidden {
	visibility: hidden;
}

.presentationViewMediaHeaderTab:hover,
.presentationViewMediaHeaderTab.active {	
	color: #fff;
}

.presentationViewMediaTabContent {
	/*background-color: var(--controlsFooterBackgroundColor);*/
	width: 100%;
}

.presentationViewMediaTabContentWrapper {
	padding: 0px 15px 20px 5px;
}

.presentationViewMediaHeaderTabContainer {
	display: flex;
	grid-gap: 20px;
	font-size: 0.6em;
	align-items: center;
	line-height: 1em;
	padding: 0px 15px 0px 5px;
}

.presentationViewMediaHeaderContainer {
	display: flex;
	grid-gap: 20px;
	font-size: 0.6em;
	align-items: center;
	line-height: 1em;
}

.presentationViewMediaSectionHeading {
	font-size: 1.1em;
	border-bottom: 1px solid #4d4d4d;
	color: #8e8e8e;
	flex: 1;
	text-align: left;
	padding-bottom: 5px;
}

.presentationViewMediaSectionInfo {
	font-size: 12px;
	line-height: 1.2em;
	text-align: left;
	padding-top: 5px;
	word-wrap: normal;
	white-space: normal;
	font-style: italic;
	flex: 1;
}

.presentationViewMediaHeader {
	flex: 1;
	text-align: left;
}

.volumeChangeNotificationPopup {
	background-color: var(--controlsButtonBackgroundColor);
	position: absolute;
	bottom: 80px;
	right: 20px;
	-webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	border-radius: 4px;
	padding: 20px;
	color: var(--controlsButtonTextColor);
	font-size: 0.8em;
	z-index: 20;
}

.presentationViewPresenterPopup {
	background-color: #252525;
	position: absolute;
	top: 20px;
	right: 20px;
	-webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	border-radius: 4px;
	padding: 5px 0px;
	color: #bababa;
	font-size: 0.8em;
	z-index: 20;
}

.presentationViewPresenterPopupContainer {
	display: flex;
	flex-direction: column;
}

.presentationPopupDivider {
	border-top: 1px solid #bababa;
	opacity: 0.2;
}

.presentationViewPresenterEntry {	
	width: 100%;
	padding: 5px 20px;	
	cursor: pointer;
}

.presentationViewPresenterEntryWrapper {
	display: flex;
	align-items: center;
	grid-gap: 5px;
}

.presentationViewPresenterEntryText {
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	width: 100%;
	max-width: 120px;
	text-align: left;
}

.presentationViewPresenterEntry:hover {
	background-color: #3a3a3a;
}

.presentationViewCameraPopup {
	background-color: rgba(25,25,25, 0.8);
	position: fixed;
	bottom: 0px;
	right: 0px;
	left: 0;
	top: 0;
	margin: auto;
	-webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	border-radius: 4px;
	padding: 5px 0px;
	color: #8e8e8e;
	font-size: 1em;
	z-index: 1501;
	width: 260px;
	height: 240px;	
}

.stageViewPromptContainer {
	background-color: rgb(11, 11, 11);
	position: absolute;
	right: 2px;
	top: 355px;
	-webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	border-radius: 4px;
	/* padding: 5px 0px; */
	color: #8e8e8e;
	font-size: 16px;
	z-index: 1501;
	white-space: normal;
	line-height: 1.2em;
	padding: 5px;
	width: 98%;
}

.presentationViewPromptContainer {
	background-color: rgb(11, 11, 11);
	position: absolute;
	right: 2px;
	top: 85px;
	-webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	border-radius: 4px;
	/* padding: 5px 0px; */
	color: #8e8e8e;
	font-size: 16px;
	z-index: 1501;
	white-space: normal;
	line-height: 1.2em;
	padding: 5px;
	width: 98%;
}

.stageViewPromptContentWrapper {
	position: relative;
	padding: 15px;
}

.stageViewAddFileProgressPanel {
	background-color: rgb(11, 11, 11);
	position: absolute;
	right: 15px;
	top: 380px;
	-webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	border-radius: 4px;
	/* padding: 5px 0px; */
	color: #8e8e8e;
	font-size: 16px;
	z-index: 1501;
	white-space: normal;
	line-height: 1.2em;
	padding: 5px;
	width: 90%;
}

.presentationViewCameraPopupContainer {
	display: flex;
	flex-direction: column;
	height: 180px;
	width: 100%;
	margin-top: 10px;
}

.presentationViewCameraPopupEntryWrapper {
	display: flex;
	align-items: baseline;
	padding: 10px 10px 5px 30px;
	line-height: 1em;
	text-align: left;
	grid-gap: 10px;
	width: 100%;
}

.presentationViewCameraPopupPrompt {
	text-align: left;
	line-height: 1em;
	padding: 0px 10px 10px 10px;
}

.presentationViewPopupButtonContainer {
	display: flex;
	grid-gap: 10px;
	padding: 10px;
	justify-content: center;
}

.presentationViewMediaRoundButton {	
	height: 20px;
	text-align: center;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.2em;
	margin-bottom: 2px;
	padding-top: 2px;
	min-width: 20px;
}

.presentationViewMediaRoundButton:hover {	
	color: #fff;
}

.presentationViewMediaRoundButton.hidden {	
	visibility: hidden;
}

.presentationViewMediaRoundButton.disabled {	
	filter: brightness(65%);
	pointer-events: none;
	opacity: 0.8;
}

.presentationViewAddFileProgressPanel {
	background-color: rgb(11, 11, 11);
	position: absolute;
	right: 15px;
	top: 150px;
	-webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
	border-radius: 4px;
	/* padding: 5px 0px; */
	color: #8e8e8e;
	font-size: 16px;
	z-index: 1501;
	white-space: normal;
	line-height: 1.2em;
	padding: 5px;
	width: 90%;
}

.presentationViewMediaListContainer {
	width: 100%;
	height: 150px;
	max-height: 150px;
	border-radius: 4px;
	border: 1px solid #404040;
	overflow: hidden;
}

.presentationViewMediaListWrapper {
	width: 100%;
	height: 150px;
	max-height: 150px;
	overflow: hidden;
}

.presentationListEntry {
	position: relative;
	height: 38px;
	font-size: 0.6em;
	text-align: left;
	flex: 1;
	cursor: pointer;	
	width: 100%;
	margin-bottom: 3px;
}

.presentationListEntry:hover {	
	color: #cdcdcd;
	background: color-mix(in srgb, currentColor 10%, transparent);
}

.presentationListEntry.active {
	color: #cdcdcd;
	background: color-mix(in srgb, currentColor 20%, transparent);
}

.settingsVolumeWrapper {
	width: 100%;
}

.settingsVolumeSliderWrapper {
	padding-top: 10px;
	width: 90%;
	padding-left: 20px;
	display: flex;
	align-items: center;
	color: #fff;
	min-width: 100px;
}

.presentationVolumeSliderWrapper {
	width: 120px;
	display: flex;
	align-items: center;
	color: #fff;
	min-width: 100px;
}

.presentationVolumeSlider {
	-webkit-appearance: none;
	width: 100%;
	height: 5px;
	border-radius: 5px;
	background: #373737;
	outline: none;
	opacity: 0.9;
	-webkit-transition: .2s;
	transition: opacity .2s;
}

.presentationVolumeSlider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 15px;
  height: 15px;
  border-radius: 50%; 
  background: #fff;
  cursor: pointer;
  -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
  box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
  border: 1px solid #fff;
}

.presentationVolumeSlider::-webkit-slider-thumb:hover {
	background: var(--loungeColor);	
}

.presentationVolumeSlider::-moz-range-thumb {
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: #fff;
	cursor: pointer;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
	border: 1px solid #fff;
}

.presentationVolumeSlider::-moz-range-thumb:hover {
	background: var(--loungeColor);	
}

.presentationListEntryContentWrapper {
	display: flex;
	flex-direction: row;
	grid-gap: 5px;
	width: 100%;
	padding: 0px 5px;
	height: 100%;
	align-items: center;
	position: relative;
}

.presentationListEntryDeleteIcon {
	position: absolute;
	right: 5px;
	top: 5px;
	cursor: pointer;	
	font-size: 1.1em;
	text-shadow: 2px 2px 6px rgba(0,0,0,0.5);
}
.presentationListEntryDeleteIcon:hover {
	color: #b900ad;
}

.presentationListEntryImageWrapper {
	display: flex;
}

.presentationListEntryMoveUpIcon {	
	font-size: 1.2em;
	cursor: pointer;
	background: unset;
	border: unset;
	color: rgb(142,142,142);
}

.presentationListEntryMoveDownIcon {	
	font-size: 1.2em;
	cursor: pointer;
	background: unset;
	border: unset;
	color: rgb(142,142,142);
}

.presentationListEntryMoveUpIcon.disabled,
.presentationListEntryMoveDownIcon.disabled {
	color: #4c4c4c;
	cursor: default;
}

.presentationListEntryMoveUpIcon:hover,
.presentationListEntryMoveDownIcon:hover {
	color: #fff;
}

.presentationListEntryMoveUpIcon.disabled:hover,
.presentationListEntryMoveDownIcon.disabled:hover {
	color: #4c4c4c;
	cursor: default;
}

.presentationMediaImageThumb {
	-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4), 0px 0px 20px 0px rgba(0,0,0,0.19);
	box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4), 0px 0px 20px 0px rgba(0,0,0,0.19);
}

.presentationMediaVideoThumb {
	font-size: 2em;	
	align-self: center;
	text-shadow: 2px 2px 5px rgba(0,0,0,0.6);	
	color: #a4a4a4;
}

.presentationMediaAudioThumb {
	font-size: 1.5em;
	align-self: center;
	text-shadow: 2px 2px 5px rgba(0,0,0,0.6);
	color: #a4a4a4;
}

.presentationListEntryTextWrapper {
	display: flex;
	flex-direction: column;
	min-width: 0;
	text-align: left;
	justify-content: center;
	position: relative;
}

.presentationListEntryItemName {
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	max-width: 190px;
}

.presentationViewMediaButtonContainer {
	display: flex;
	grid-gap: 12px;
	font-size: 0.6em;
	padding-top: 5px;
	align-items: center;
	position: relative;
}

.presentationScreenMessage {
	width: 100%;
	height: 100%;
	color: var(--loungeColor);	
	align-items: center;
	justify-content: center;
	font-size: 2em;
	line-height: 1.2em;
}

.presentationStageCamButtonContainer {
	grid-gap: 20px;
	font-size: 0.6em;
	padding-top: 5px;
	align-items: center;
	position: relative;	
}

.presentationViewMediaButtonContainerWrapper {
	display: flex;
	grid-gap: 10px;
}

.presentationViewMediaButton {
	cursor: pointer;
	white-space: nowrap;
	text-align: center;
	cursor: pointer;
	/* box-shadow: 5px 5px 10px 5px rgba(0,0,0,0.4); */
	/* box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4), 2px 2px 10px 0px rgba(0,0,0,0.2); */
	align-items: center;
	justify-content: center;
	padding: 0px 10px;
	height: 28px;
	border-radius: 4px;
	max-width: 65%;
	color: #fff;
	border: 1px solid #fff;
	position: relative;
	line-height: 28px;
}

.presentationViewMediaButton:hover {	
	color: #fff;
	border: 1px solid #70baa6;
}

.presentationViewMediaButton.cam {
	font-size: 1.6em;
}

.presentationViewMediaButton.volume {
	font-size: 1.2em;
}

.presentationViewMediaButton.active {	
	color: #fff;
	border: 1px solid #70baa6;
}

.presentationViewMediaButton.disabled {
	filter: brightness(65%);
	pointer-events: none;
	opacity: 0.8;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
}

.stagePanelPanelHeaderWrapper {
	font-size: 0.8em;
	line-height: 1.2em;
	color: #b0b0b0;	
}

.stagePanelAudienceSizeWrapper {
	display: flex;
	grid-gap: 10px;
	padding-bottom: 10px;
	font-size: 0.95em;	
}

.audienceSizeWarning {
	color: #ff2e2e;
	font-size: 0.75em;
	line-height: 1.2em;
	font-style: italic;
	padding: 0 5px;
	white-space: normal;
}

.audienceSizeGreen {
	color: #96ff96;
}

.audienceSizeRed {
	color: #ff2e2e;
}

.stagePanelViewLiveMediaButtonContainer {
	display: flex;
	grid-gap: 20px;
	font-size: 0.6em;
	padding-top: 5px;
	align-items: center;
	position: relative;
	justify-content: center;
	grid-gap: 40px;
}

.stagePanelViewLiveMediaButton {
	color: #fff;
	font-size: 1.6em;
	cursor: pointer;
	border: 1px solid #fff;
	padding: 5px;
	border-radius: 6px;
	position: relative;
	min-width: 55px;
	text-align: center;
}

.stagePanelViewLiveMediaButton:hover {
	color: #fff;
	border: 1px solid #70baa6;
}

.stagePanelViewLiveMediaButton.active {	
	color: #fff;
	border: 1px solid #70baa6;
}

.stagePanelViewLiveMediaButton.disabled {
	filter: brightness(65%);
	pointer-events: none;
	opacity: 0.8;	
}

.liveMediaButtonExtension {
	position: absolute;	
	top: -5px;
	cursor: pointer;
	font-size: 12px;
	color: #000;
	background-color: #e0e0e0;
	padding: 2px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	width: 22px;
	-webkit-box-shadow: 5px 5px 10px rgba(15,15,15,0.5);
	box-shadow: 5px 5px 10px rgba(15,15,15,0.5);
	height: 20px;
	line-height: 17px;
	text-align: center;
	right: -10px;  	
}

.liveMediaButtonExtension:hover {
	background-color: #5cf774;
}

.liveMediaButtonExtension.chat {
	top: 16px;
}

.presentationVolumeSlider.disabled {
	filter: brightness(50%);
    pointer-events: none;
    opacity: 0.8;
}

.presentationViewAutoPlayContainer {
	font-size: 0.6em;
	line-height: 1em;
	padding-top: 5px;
}

.presentationViewAutoPlayDurationContainer {
	display: flex;
	grid-gap: 5px;
	align-items: center;
	padding-left: 30px;
	padding-top: 5px;
}

.stageLiveUserGrid {
	padding: 5px 0;
	width: 140px;
	justify-content: center;
}

.fullScreenView .stageLiveUserGrid {
	width: 240px;
}

.fullScreenView .stageLiveVideoContainer {
	height: 100%;
	width: 100%;	
	object-fit: cover;
	aspect-ratio: 4/3;
}

.stageLiveVideoContainer {	
	width: 100%;	
}

.formControl {
  display: block;
	position: relative;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
       -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.formControlSmall {
	display: block;
	padding: 2px 4px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #555;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
	-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}


.formControl:focus,
.formControlSmall:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}
.formControl::-moz-placeholder,
.formControlSmall::-moz-placeholder {
  color: #999;
  opacity: 1;
}
.formControl::-ms-input-placeholder,
.formControlSmall::-ms-input-placeholder {
  color: #999;
}
.formControl::-webkit-input-placeholder,
.formControlSmall::-webkit-input-placeholder {
  color: #999;
}

.formControl::-ms-expand,
.formControlSmall::-ms-expand {
  background-color: transparent;
  border: 0;
}
.formControl[disabled],
.formControlSmall[disabled],
.formControl[readonly],
.formControlSmall[readonly],
fieldset[disabled] .formControl,
fieldset[disabled] .formControlSmall {
  background-color: #eee;
  opacity: 1;
}
.formControl[disabled],
.formControlSmall[disabled],
fieldset[disabled] .formControl,
fieldset[disabled] .formControlSmall {
  cursor: not-allowed;
}

textarea.formControl,
textarea.formControlSmall {
  height: auto;
}

.formControl.presentationViewNumberInput {
	max-width: 40px;
	height: unset;
	padding: unset;
	font-size: unset;
	line-height: unset;
	text-align: center;
	height: 25px;
} 

.chatPanelContainer {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	pointer-events: none;
}

.controlBarContainer {
	/*position: fixed;
	bottom: 0;
	left: 0;*/
	width: 100%;
	height: 45px;
	background-color: rgba(7,7,7,0.98);
	z-index: 1;
}

.controlBarIconWrapper {
	display: flex;
	height: 100%;
	align-items: center;
}

.controlBarLeftSection {
	position: relative;	
	text-align: left;
	padding-left: 20px;
}

.controlBarPoweredBy {
	position: relative;
	text-align: left;	
	font-size: 0.8em;
	color: #595959;
}

.poweredByLink {	
	color: #595959;
	background-color: transparent;
	text-decoration: none;
	border: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	outline: none;
}

.poweredByLink:hover {
	color: #ffffff;
}

.noControlBar .poweredByLink {	
	color: #ffffff75;
}

.noControlBar .poweredByLink:hover {	
	color: #ffffff;
}

.controlBarPoweredBy.noControlBar {
	position: absolute;
	left: 20px;
	bottom: 10px;
	text-align: left;
	font-size: 0.8em;
	color: #ffffff75;
	z-index: 20;
}

.loungeInfoIconWrapper {
	position: absolute;
	right: 20px;
	bottom: 13px;
	z-index: 20;
	color: #ffffff75;
	border: 1px solid #ffffff3d;
	width: 30px;
	height: 30px;
	text-align: center;
	border-radius: 50%;
	cursor: pointer;	
	align-items: center;
	justify-content: center;
}

.loungeSettingsIconWrapper {
	position: absolute;
	right: 20px;
	bottom: 13px;
	z-index: 20;
	color: #ffffff75;
	border: 1px solid #ffffff3d;
	width: 30px;
	height: 30px;
	text-align: center;
	border-radius: 50%;
	cursor: pointer;	
	align-items: center;
	justify-content: center;
}

.loungeInfoIconWrapper:hover,
.loungeSettingsIconWrapper:hover {
	color: #ffffff;
}

.loungeInfoIcon {
	text-align: center;
}

.loungeInfoPanel {
	position: absolute;
	right: 19px;
	bottom: 10px;
	width: 350px;
	height: 400px;
	z-index: 20;
	background-color: #000000c2;
	border-radius: 10px;
	max-height: 80%;
}

.loungeInfoPanelCloseButton {
	position: absolute;
	top: -13px;
	right: -7px;
	font-size: 26px;
	color: #989898;
	z-index: 20;
	cursor: pointer;
	text-shadow: 1px 1px 1px rgba(0,0,0 ,0.3);
}

.contactIconWrapper {
    position: absolute;
    right: 21px;
    bottom: 80px;
    z-index: 0;
    color: #ffffff75;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    font-size: 1.8em;
    pointer-events: all;
}

.contactIconWrapper.controlBar {
	bottom: 30px;
}

.loungeChatPrivateInvitationPanel:empty {
	display: none;
}

.loungeChatPrivateInvitationPanel {
	max-width: 340px;
	margin-bottom: 50px;
	z-index: 45;
	pointer-events: all;
}

.loungeChatPrivateInvitationPrompt {
	background-color: #000000c2;
	padding: 5px 10px 5px 15px;
	border-radius: 10px 0px 0px 10px;
}

.operatorChatButtonWrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.operatorChatIconWrapper {
    position: absolute;
    right: 40px;
    bottom: 95px;
    z-index: 15;
    color: #ffffff75;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    font-size: 1.8em;
    color: #b7b7b7;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4);    
}

.contactIconWrapper:hover {
	color: #ffffff;
}

.operatorChatIcon {
    position: absolute;
    right: -22px;
    bottom: 12px;
    font-size: 0.9em;
}

.operatorChatIconPrompt {
    position: absolute;
    top: -21px;
    left: -5px;
    font-size: 0.35em;
    white-space: nowrap;
}

.operatorChatName {
    position: absolute;
    bottom: -15px;
    right: -26px;
    font-size: 0.3em;   
    line-height: 1em;
    width: 95px;    
    text-align: center;
}

.operatorChatIcon,
.contactIconWrapper {
	text-align: center;
}

.operatorChatImage {
    border-radius: 50%;
    width: 45px;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
    cursor: pointer;
}

.operatorChatIcon:hover {
	color: #ffffff;
}

.guestUserImageWrapper {
	position: relative;
}

.loungePanelInfoViewDisplayWrapper {
	padding: 15px;
}

.controlBarCenterSection {
	position: relative;
	flex: 1;
	display: flex;
	justify-content: end;	
	padding: 0 40px;
	height: 100%;
}

.controlBarCenterIconWrapper {
	position: relative;
	height: 100%;
	/*flex: 0 0 38%;*/
	display: flex;
	justify-content: center;
}

.controlBarRightSection {
	position: relative;
	text-align: right;
	margin-right: 20px;
	height: 100%;
	display: flex;
	align-items: center;
}

.controlBarExitIcon {
	font-size: 26px;
	cursor: pointer;
	color: #afafb0;
	line-height: 1.4em;
}

.controlBarExitIcon:hover {
	color: #fff;
}

.controlBarNavIcon {
	font-size: 26px;
	cursor: pointer;
}

.controlBarDirectoryIconImage {
	filter: invert(73%) sepia(0%) saturate(177%) hue-rotate(219deg) brightness(97%) contrast(90%);
	width: auto;
	height: 100%;
}

.controlBarDirectoryIconImage:hover {
	filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(222deg) brightness(118%) contrast(101%);
}

.controlBarDirectoryIcon.active .controlBarDirectoryIconImage:hover {
	filter: invert(73%) sepia(0%) saturate(177%) hue-rotate(219deg) brightness(97%) contrast(90%);
}

.controlBarDirectoryIcon {
	cursor: pointer;
	border-radius: 10px;
	height: 40px;
	border: 1px solid #424242;
	position: relative;
	text-align: center;
	align-self: center;
	padding: 4px;
}

.controlBarDirectoryIcon.activity {
	margin-right: 80px;
	z-index: 6;
	background-color: #070707;
}

.controlBarDirectoryIcon.active {
	border: 1px solid var(--loungeColor);
	cursor: default;
}

.controlBarDirectoryIcon:hover {	
	color: #fff;
	background-color: #222;
}

.controlBarDirectoryIcon.active:hover {	
	color: unset;
	background-color: unset;
}

.controlBarIcon {
	cursor: pointer;
	border: 1px solid transparent;
	border-radius: 6px;
	height: 100%;
}

.controlBarIconImage {
	width: auto;
	height: 100%;
	border-radius: 6px;
}

.controlBarIcon:hover {
	border: 1px solid red;
}

.loungeReactionContainer {
	/*z-index: 30;
	position: absolute;
	left: -70px;
	top: 2px;*/
	font-size: 0.6em;
}

.reactionContainerContents {
  position: relative;
}

.loungeReactionIcon {
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 10px;
	color: #b0b0b0;
	/* background-color: #00ff00; */
	text-align: center;
	/* box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.4), 10px 10px 40px 0px rgba(0,0,0,0.2); */
	/* width: 2em; */
	/* height: 2em; */
	font-size: 26px;
	cursor: pointer;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #424242;
	padding: 6px;
}

.loungeReactionIcon.post {
	font-size: 0.9em;
	color: unset;
}

.loungeReactionIcon:hover {	
	color: #fff;
	background-color: #222;
}

.loungeReactionIcon.active {
	color: #fff;
}

.loungeReactionPanel {
	position: absolute;
	right: -125px;
	top: -60px;
	width: 305px;
	padding: 2px;
	background-color: rgba(15,15,15,0.9);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	text-align: center;
	z-index: 85;
	-webkit-box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.4), 10px 10px 40px 0px rgba(0,0,0,0.2);
	box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.4), 10px 10px 40px 0px rgba(0,0,0,0.2);
	font-size: 0.6rem;	
	-webkit-user-select: none;  
  -moz-user-select: none;    
  -ms-user-select: none;      
  user-select: none;
}

/*.galleryPostOverlay .loungeReactionPanel {
	right: -77px;
	top: -53px;
	left: unset;	
	width: 240px;
}*/
.galleryPostOverlay .loungeReactionPanel {
    right: -32px;
    top: -55px;
    left: unset;
    width: 240px;
    box-shadow: 2px 2px 3px rgba(0,0,0,0.4);
}

.galleryPostOverlay .loungeReactionPanel.main {
	right: 0;
	top: -53px;
	left: unset;	
	width: 240px;
}

.galleryPostOverlay .loungeReactionPanel.sub {
	right: -40px;
	top: -53px;
	left: unset;	
	width: 240px;
}

.reactionsIcon {
	color: #efefef;
	font-size: 2em;
	cursor: pointer;
	text-shadow: 0px 0px 5px rgba(0,0,0,0.9);
	display: inline-block;
	margin: 6px 7px;
  z-index: 53;
  position: relative;
}

.postChatmessageInput {
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	-o-border-radius: 18px;
	border-radius: 18px;
	background-color: #0000001a;
	margin: 0px 6px 0px 6px;
	padding: 4px 35px 2px 10px;
	font-size: 16px;
	font-family: inherit;
	word-break: break-word;
	color: #000000fa;
	text-align: left;
	position: relative;
	cursor: text;
	width: 100%;
	border: 1px solid transparent;
	resize: none;
	overflow: hidden;
	white-space: pre-wrap;
	line-height: 1.3em;
}

reactionParticle {
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 50;
}

loungeChatParticle {
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  z-index: 50;
}

galleryDisplayReactionParticle {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 50;
}

.loungeEntryButtonWrapper {
    padding-top: 40px;
    z-index: 2;
    display: flex;
    grid-gap: 20px;   
    align-items: center;
    justify-content: center;
    position: relative;
}

.loungeEntryButtonWrapper {
    padding-top: 40px;
    z-index: 2;
    display: flex;
    grid-gap: 20px;
    /* width: 100%; */
    align-items: center;
    justify-content: center;
    position: relative;
}

.loungeEntryViewButton {
	font-family: "Lane", sans-serif;
	font-size: 2em;
	border: 1px solid var(--loungeColor);
	color: #f7f7f7;
	padding: 10px;
	border-radius: 4px;
	letter-spacing: 3px;
	cursor: pointer;
	line-height: 1.5em;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	min-width: 200px;
}

.loungeEntryViewButton:hover {
	-webkit-box-shadow: 0 0 15px 2px var(--loungeColorTrans);
	box-shadow: 0 0 15px 2px var(--loungeColorTrans);
}

.loungeEntryCookieInfo {
	font-size: 0.7em;
	font-style: italic;
	padding-top: 40px;
	line-height: 1.2em;
	text-align: center;
	color: #757575;
}

.loungeDescriptionWrapper {
	font-size: 0.8em;
	line-height: 1.2em;
	font-style: italic;
	color: #999;
	/* overflow-y: auto; */
	display: flex;
	align-items: center;
	/* min-height: 80px; */
}

.loungeEntryTitleWrapper {
	font-size: 2em;
	line-height: 1em;
	padding-bottom: 20px;
	text-align: center;	
}

.loungeImageWrapper {
	/* height: 120px; */
	/* width: 120%; */
	display: flex;
	justify-content: center;
	/* flex: 1; */
	min-height: 0;
	/* aspect-ratio: 18/8; */
}

#loungeEntryView .loungeEntryImage {
	border-radius: 4px;
	height: 100%;
	width: auto;
}

.loungeEntryImage {
	border-radius: 4px;
	height: auto;
	width: 100%;
}


.loungeEntryContentWrapper {
	display: flex;
	max-width: 50%;
	grid-gap: 20px;
	position: relative;
	flex-direction: column;
	min-height: 0;
	align-items: center;
	justify-content: center;
}

.loungeEntryWrapper {
	display: flex;
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	overflow: auto;
	padding: 40px;
}

.loungePanelMainWrapper {
	display: flex;	
	width: 100%;
	height: 100%;
	justify-content: flex-end;
	grid-gap: 20px;
	flex: 1;
	z-index: 1;
	position: relative;
	/*min-height: 850px;*/
	min-height: max(720px, calc(100vh - 40px));
	max-height: 100%;
}

.loungeChatPanel {
	position: relative;
	/*position: absolute;
	bottom: 8%;
	right: 27%;*/
	/*width: 38%;*/
	height: 100%;
	/*background-color: rgba(255,0,0, 0.5);*/
	flex: 1;
	pointer-events: none;
}

.lounge_chatmessage {
	display: inline-block;
	vertical-align: bottom;
	margin: 10px 0px;
	white-space: nowrap;
	position: relative;
	text-align: right;
	width: 100%;
	padding-right: 20px;
}

.lounge_chatmessage_textbubble {
	-webkit-border-radius: 20px 20px 20px 20px;
	-moz-border-radius: 20px 20px 20px 20px;
	-o-border-radius: 20px 20px 20px 20px;
	border-radius: 20px 20px 20px 20px;
	margin: 5px;
	padding: 0.5rem .875rem;
	color: #000;
	display: inline-block;
	word-wrap: break-word;
	max-width: 300px;
	white-space: normal;
	position: relative;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	font-size: 0.9em;
	text-align: left;
	background-color: #ffffffad;
	line-height: 1em;
	min-width: 90px;
}

.lounge_chatmessage_text {
  width: 100%;
  padding-top: 5px;
}

.lounge_chatmessage_info {
	position: absolute;
	color: #939393;
	font-size: 0.6em;
	line-height: 0.8em;
	font-style: italic;
	top: -10px;
	left: 10px;
	white-space: nowrap;
	display: flex;
	flex-direction: row;
}

.lounge_chatmessage_user {
	display: flex;
	vertical-align: bottom;
	margin-right: 10px;
	margin-bottom: 3px;
	align-items: flex-start;
	justify-content: flex-start;
	position: absolute;
	left: -18px;
	top: -22px;
}

.lounge_chatmessage_user_img {
	width: 35px;
	height: 35px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -o-border-radius: 50%;
	border-radius: 50%;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
  box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
}

.lounge_chatmessage_user_name {
	font-size: 0.6em;
	line-height: 1em;
	align-self: flex-end;
	white-space: nowrap;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	width: 60%;	
}

.loungePanelRightWrapper {
	/* position: absolute; */
	/* right: 20px; */
	/* bottom: 8%; */
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: flex-end;
	grid-gap: 0;
	z-index: 60;
	pointer-events: none;
}

.loungeOperatorsPanel {
    /* height: 25%; */
    max-width: 300px;
    margin-bottom: 55px;
    z-index: 10;
    pointer-events: all;
}

.loungeChatPromptPanel {      
    max-width: 300px;
    margin-bottom: 10px;
    z-index: 45;
    pointer-events: all;
}

.chatTeaserContainer {
    background-color: rgba(25,25,25, 0.8);
    border-radius: 10px;
    position: absolute;
    right: 10px;
    bottom: 25px;
    padding: 5px 5px 5px 0;
    max-width: 300px;
    cursor: pointer;
}

.chatTeaserContainer .private_chatmessage_text {
	line-height: 1.1em;
}

.loungeUsersPanel {
	/* position: absolute; */
	/* right: 20px; */
	/* bottom: 8%; */	
	/* height: 60%; */
	background-color: rgba(25,25,25, 0.8);
	min-width: 300px;
	max-width: 360px;
	margin-bottom: 8px;
	flex: 1;
	max-height: 60%;
	border-radius: 10px;
	width: 360px;
	pointer-events: all;
}

.loungeUsersPanel.stage {
	width: 360px;
}

#loungeUsersPanelOperatorContainer {
	pointer-events: all;
}

/*.loungeUsersPanel.minimized {
	height: 34px;
} */

.loungePanelView {
	width: 100%;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	/* display: -webkit-box; */
	/* display: -moz-box; */
	/* display: -ms-flexbox; */
	/* display: -webkit-flex; */
	display: flex;
	overflow: hidden;
	border: 1px solid #161616;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	background-color: rgba(0,0,0,0.8);
}

.loungePanelContainer {
	display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
	display: flex;
	flex-direction: column;
	position: relative;
	clear: both;
	overflow: hidden;
	width: 100%;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;	
}

.loungePanelHeader {
	position: relative;
	display: flex;
	margin: 0;
	border: 0;
	white-space: nowrap;
	width: 100%;
	overflow: hidden;
	clear: both;
	padding: 0px 5px 0px 5px;
	text-align: left;
	grid-gap: 10px;
}

.loungePanelCloseButton {
	position: absolute;
	top: -3px;
	right: 5px;
	font-size: 16px;
	color: #989898;
	z-index: 20;
	cursor: pointer;
	text-shadow: 1px 1px 1px rgba(0,0,0 ,0.3);
}

.loungePanelCloseButton.qaProfilePanel {
	top: 1px;
}

.loungePanelCloseButton:hover {
		color: #ff530f;
}

.loungePanelTitle {
	display: inline-block;
	color: #4d4d4d;
	font-size: 11px;
	text-align: left;
	vertical-align: middle;
	height: 100%;
	padding-bottom: 2px;
	white-space: nowrap;
	overflow: hidden;
	white-space: nowrap;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	font-family: 'Roboto', sans-serif;	
	text-transform: uppercase;
	letter-spacing: 1px;
	position: relative;
	padding-right: 15px;
}

.loungePanelHeaderAlert {
	position: absolute;
	border-radius: 50%;
	width: 12px;
	height: 12px;
	top: -2px;
	right: -5px;
	-webkit-box-shadow: 2px 2px 5px rgba(15,15,15,0.5);
	box-shadow: 2px 2px 5px rgba(15,15,15,0.5);
	background-color: var(--loungeColor);
}

.loungePanelContent {
	position: relative;
	width: 100%;
	overflow-y: auto;
	color: #5e5e5e;
	clear: both;
	/*background-color: rgba(0,0,0,0.6);*/
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-direction: column;
	height: 100%;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.loungePanelContentWrapper {
	position: relative;
	width: 100%;
	overflow-y: auto;
	color: #5e5e5e;
	clear: both;
	/*background-color: rgba(0,0,0,0.6);*/
	height: 100%;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.loungePanelSubHeader {
		font-size: 0.8em;
		line-height: 1.2em;
		color: #b0b0b0;
		border-radius: 0px 10px 0px 0px;
	}
	
	.loungePanelScrollContainer {
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		overflow: hidden;	
		min-height: 0;
		flex: 1;
	}
	
	.loungePanelViewResultWrapper {
		flex: 1;
		display: flex;
		flex-direction: column;
		overflow: hidden;
		padding-bottom: 5px;
	}
	
	.loungePanelHeaderLine {
		background-color: rgba(0,0,0,0.1);
		padding: 5px;
		border-radius: 0px 10px 0px 0px;
		display: flex;
	}
	
	.loungePanelViewResult {
	padding: 10px 0px 0px 10px;
	width: 100%;
	 -webkit-box-flex: 1 0 0;
	 -moz-box-flex: 1 0 0;
	 -webkit-flex: 1 0 0;
	 -ms-flex: 1 0 0;
	flex: 1 0 0;	
	overflow: hidden;
}

.loungePanelStageViewResult {
	padding: 10px 0px 0px 10px;
	width: 100%;
	 -webkit-box-flex: 1 0 0;
	 -moz-box-flex: 1 0 0;
	 -webkit-flex: 1 0 0;
	 -ms-flex: 1 0 0;
	flex: 1 0 0;	
	overflow-y: auto;
}

.infoPanelProfileText {
	font-size: 0.8em;
	color: #949494;
	line-height: 1.2em;
	display: flex;
}

.infoPanelProfileTop {
	white-space: normal;
	line-height: 1em;
	padding-bottom: 20px;
	font-size: 0.8em;
}

.infoPanelLegalLinkWrapper {
	cursor: pointer;
	width: 260px;
	overflow-x: hidden;
	white-space: nowrap;	
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
}

.lightboxIframe {
	border: none;
	width: 800px;
	height: 600px;
	max-width: 90vw;
	max-height: 90vh;
}

.infoPanelProfileHeading {
	font-size: 0.9em;
	color: #fff;
}

.infoPanelProfileDescription {
	max-width: 95%;
	white-space: normal;
	font-size: 0.8em;
  	line-height: 1.2em;
  	font-style: italic;
  	color: #999;
}

.infoPanelProfileImageDiv {
	width: 50%;
	margin: auto;
}

.customLinkContainer {
	display: flex;
    grid-gap: 5px;
}

.socialLink {
	color: inherit;
	background-color:transparent;
    text-decoration: none;
    border: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: none;
}

.socialLinkIcon {
	display: flex;
	align-items: center;
	width: 2.5rem;
	height: 2.5rem;
	background-color: white;
	padding: 10px;
	border-radius: 50%;
	cursor: pointer;
	-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.2), 0px 0px 40px 0px rgba(0,0,0,0.19);
	box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.2), 0px 0px 40px 0px rgba(0,0,0,0.19);
	line-height: 1rem;
}

.socialLinkIcon.facebook {
    padding: 0px;
    background-color: unset;
}

.businessProfileSocialLinksWrapper {
	display: flex;
	grid-gap: 15px;
}

/*.stageScreenPresentationContent {
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 100%;
	height: 100%;
}*/

.stageScreenPresentationContent {
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 960px;	
	aspect-ratio: 16/9;
}

.fullScreenView .stageScreenPresentationContent {	
	width: 100%;	
	height: 100%;
}

.chatPresentationScreenContentWrapper {
	width: 100%;
	height: 100%;
	flex-direction: column;
}

.chatPresentationScreenContentContainer {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 100%;
	height: 100%;
}

.chatPresentationScreenTitle {
	text-align: center;
	font-size: 0.9em;
	color: #616161;
}

.presentationScreenContent {
    height: 100%;
    width: fit-content;    
    justify-content: center;
    overflow: hidden;
}

.stageScreenPresenterUserImage {
	width: 280px;
	border-radius: 50%;
}

.stageScreenUserName {
	white-space: nowrap;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	line-height: 1.2em;
	width: 100%;
	max-width: 100%;
	flex: 1;
	padding-bottom: 7px;
	font-size: 1.2em;
	text-align: center;
}

.stageScreenUserMic {
	position: absolute;
	right: 0;
	font-size: 2.5em;
   bottom: 50px;
	color: #5cf774;
}

.loungePanelStageViewEventDisplayWrapper {
    width: 100%;
    padding: 5px 30px 30px 30px;
    display: flex;
    flex-direction: column;
    grid-gap: 5px;
    font-size: 0.8em;
    line-height: 1em;
}

.loungePanelStageViewEventHeader {
    font-size: 0.9em;
    border-bottom: 1px solid #232323;
    margin: 0 10px;
}

.loungePanelStageViewEventDisplayPoster {
    /* width: 80%; */
    align-self: center;
}

.loungePanelStageViewEventDisplayTitle {
    color: #d5d3d3;
    font-weight: bolder;
}

.loungePanelStageViewEventDisplayDateWrapper {
    display: flex;
    grid-gap: 10px;
}

.loungePanelStageViewEventDisplayDate {
    color: #acacac;
}

.loungePanelStageViewEventDisplayDescription {
    white-space: normal;
}

.loungeStagePanelViewScrollContainer {
	height: 100%;
	margin-right: 10px;
}

.loungeQAPanelHostButtonWrapper {
	display: flex;
	grid-gap: 20px;
	padding-bottom: 40px;
	flex-direction: column;
}

.stageQAPanelContainer {
	background-color: rgba(0,0,0,0.85);
	padding: 5px;
	border-radius: 10px;
	position: absolute;
	bottom: 120px;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 6;
	max-width: min(35%, 620px);
	box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
}

.stageQAPanelContentWrapper {
	display: flex;
	grid-gap: 10px;
}

.stageQAPanelInfoWrapper {
	display: flex;
	grid-gap: 10px;
}

.stageQAPanelUserWrapper {	
	grid-gap: 5px;
	padding-top: 10px;
	position: relative;
}

.stageLiveUserGridUserWrapper {
	grid-gap: 1px;
	padding-top: 5px;
	position: relative;
}

.stageLiveUserGridUserImage {
	width: 54px;
	border-radius: 50%;
}

.stageLiveUserGridUserName {
	white-space: nowrap;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	line-height: 1.2em;
	width: 100%;
	max-width: 100%;
	flex: 1;
	padding-bottom: 7px;
	font-size: 0.5em;
	text-align: center;
}

.stageLiveUserGridPanelMic {
	position: absolute;
	right: 0;
	bottom: 14px;
	color: #5cf774;
}

.stageQAPanelUserImage {
	width: 65px;
	border-radius: 50%;
}

.stageQAPanelMic {
    position: absolute;
    right: 0;
    bottom: 22px;
    color: #5cf774;
}

.stageQAPanelMic.off {
    position: absolute;
    right: 0;
    bottom: 22px;
    color: #7c7c7c;
}

.stageQAPanelUserName {
	white-space: nowrap;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	line-height: 1.2em;
	width: 100%;
	max-width: 100%;
	flex: 1;
	padding-bottom: 7px;
	font-size: 0.6em;
	text-align: center;
}

.stageQAPanelUserName.video {
	position: absolute;
	bottom: -12px;
	left: 0;	
}

.stageQAPanelUserVideoWrapper {
	width: 140px;
	padding-top: 10px;
	position: relative;
}

.private_chatmessage_me_qa {
    vertical-align: bottom;
    white-space: nowrap;
    position: relative;
    text-align: right;
    width: 100%;    
    margin: 10px 0px;
}

.private_chatmessage_other_qa {
	vertical-align: bottom;	
	white-space: nowrap;
	position: relative;
	text-align: left;
	width: 100%;	
}

.private_chatmessage_user_name_me_qa {
    position: absolute;
    color: #939393;
    font-size: 0.45em;
    line-height: 1.2em;
    right: 0;
    text-align: center;
    min-width: 55px;
}

.private_chatmessage_textbubble_me_qa {
	-webkit-border-radius: 20px 20px 0px 20px;
	-moz-border-radius: 20px 20px 0px 20px;
	-o-border-radius: 20px 20px 0px 20px;
	border-radius: 20px 20px 0px 20px;
	margin: 5px;
	padding: 5px 10px 5px 12px;
	color: var(--loungeColorText);
	display: inline-block;
	word-wrap: break-word;
	max-width: 85%;
	white-space: normal;
	position: relative;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	font-size: 0.8em;
	text-align: left;
	background-color: var(--loungeColor);
}

.stageQAPanelChatContainer {
	height: 120px;
	flex: 1;
}

.stageQAPanelLabel {
	font-size: 1.3em;
	padding: 5px;
	color: rgba(255,255,255,0.1);
	font-weight: bold;	
}

.loungePanelQAViewDisplayWrapper {
	width: 100%;
	padding: 0 25px 30px 10px;
	display: flex;
	flex-direction: column;
	grid-gap: 5px;
	font-size: 0.8em;
	line-height: 1em;
}

.loungePanelQAViewCurrentSpeakerWrapper {
	display: flex;
	grid-gap: 10px;
	padding: 20px 20px 40px 20px;
}

.loungePanelQAViewActiveSpeakerWrapper {
	display: flex;
	grid-gap: 10px;
	padding: 20px 0 10px 0;
}

.loungePanelQAViewActiveSpeakerEntryUserName {
	white-space: nowrap;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	line-height: 1.2em;	
	width: 100%;
	max-width: 100%;
	flex: 1;
	padding-bottom: 7px;
}

.loungePanelQAViewActiveSpeakerButtonWrapper {
	display: flex;
	grid-gap: 20px;
	font-size: 1.3em;
}

.loungePanelQAViewSpeakerButton {	
	text-align: center;
	cursor: pointer;	
	align-self: center;
}

.loungePanelQAViewSpeakerButton:hover {
	color: #fff;
}

.loungePanelQAViewSpeakerButton.active,
.loungePanelQAViewSpeakerButton.active:hover {
	color: #5cf774;
}

.disabled {
	pointer-events: none;
}

.controlButtonExtension {
	position: absolute;
	left: -10px;
	top: -5px;
	cursor: pointer;
	font-size: 0.8rem;
	color: #000;
	background-color: #7d7d7d;
	padding: 2px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	width: 22px;
	-webkit-box-shadow: 5px 5px 10px rgba(15,15,15,0.5);
	box-shadow: 5px 5px 10px rgba(15,15,15,0.5);
	height: 20px;
	line-height: 20px;
	text-align: center;
}

.controlButtonExtension.active {
	background-color: var(--loungeColor);
}

.controlButtonExtension.disabled {
	filter: brightness(50%);
	pointer-events: none;
}

.controlButtonExtension.second {    
    right: -10px;   
    left: unset;
}

.guestUserEntryWrapper.queue {
	border: 1px solid #333;
	border-radius: 1px;
	margin-bottom: 20px;
	min-height: 280px;
}

.loungeInfoText {
	padding-left: 50px;
	font-size: 18px;
	font-family: "Caveat", sans-serif;	
	color: var(--loungeColor);
}

.liveNowSignDiv {
	flex: 1;
	text-align: center;
	font-family: "Caveat", cursive;
	/*color: #ff1f1f;*/
	color: var(--loungeColor);
	/*text-shadow: 2px 2px 5px rgba(255,0,0,0.5);*/
	white-space: nowrap;
}

.panelTitleBarLogo {	
	width: 24px;
	margin-top: -5px;
}
	
	.panelInfoTextSmall {
		font-size: 0.75em;
		color: #7b7b7b;
		line-height: 1.2em;
		font-style: italic;
	}
	
	.panelErrorText {
		font-size: 13px;
		color: #e1193e;
		line-height: 1.2em;
	}
	
	.loungePanelInfoText {
		font-size: 13px;
		color: #b3b3b3;
		line-height: 1.2em;
		white-space: normal;
	}

.chatEmojiPanel {
	position: absolute;
	right: 10px;
	bottom: 32px;
	padding: 3px;
	background-color: rgba(15,15,15,0.9);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	text-align: center;
	z-index: 52;
	-webkit-box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.4), 10px 10px 40px 0px rgba(0,0,0,0.2);
	box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.4), 10px 10px 40px 0px rgba(0,0,0,0.2);
	font-size: 1.2em;
  width: 200px;
}

.emojiPanelHeader {
  position: relative;
  width: 100%;
  height: 30px;
  margin-bottom: 10px;
}

.emojiPanelTab {
  position: relative;
  color: #9b9b9b;
}

.emojiPanelTab.active {
    color: var(--loungeColor);
}

.emojiPanelContent {
  position: relative;
  overflow: hidden;
  height: 100px;
  min-height: 100%;
  max-height: 100%;
  width: 100%;
  color: #efefef;
}

.emojiPanelSection {
  width: 100%;
  display: grid;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  gap: 2px;
  margin-top: 0px;
}

.emojiPanelIcon {
  padding: 5px;
  cursor: pointer;
}

.emojiPanelDivider {
  height: 1px;
  margin: 6px 10px;
  overflow: hidden;
  background-color: #606060;
}

.chatEmojiButton {
	position: absolute;
	right: 10px;
	top: 4px;
	cursor: pointer;
	font-size: 1.2em;
	text-shadow: 1px 1px 1px rgba(0,0,0 ,0.3);
}

.chatEmojiButton.private {
	top: 2px;
}

.loungeChatControls {	
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	z-index: 3;	
	height: 100%;
	position: relative;	
	align-items: center;	
	align-self: center;
	flex: 1;
	max-width: 75%;
}

.loungeChatControlsContainer {
	display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex: 1;
    width: 100%;
    height: 100%;
}

.chatInputContainer {
	position: relative;
	text-align: right;
	display: flex;
	min-height: 0;
	height: 90%;
	min-width: 320px;
	align-self: center;
	width: max(60%,320px);
	max-height: 35px;
	max-width: 460px;
}

.chatmessage_input,
.chatmessage_fileTransfer_input {
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	-o-border-radius: 18px;
	border-radius: 18px;
	background-color: #242424e0;
	margin: 0px 6px 0px 6px;
	padding: 2px 35px 2px 10px;
	font-size: 16px;
	font-family: inherit;
	word-break: break-word;
	color: #d0d0d0;	
	text-align: left;
	position: relative;
	cursor: text;
	width: 100%;
	border: 1px solid transparent;
	resize: none;
	overflow: hidden;
	white-space: pre-wrap;	
}

.chatmessage_input.private, .chatmessage_fileTransfer_input.private {
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	-o-border-radius: 18px;
	border-radius: 18px;
	background-color: #242424e0;
	margin: 0px 6px 0px 6px;
	padding: 5px 35px 2px 10px;
	font-size: 16px;
	font-family: inherit;
	word-break: break-word;
	color: #d0d0d0;
	text-align: left;
	position: relative;
	cursor: text;
	width: 100%;
	border: 1px solid transparent;
	resize: none;
	overflow: hidden;
	white-space: pre-wrap;
	line-height: 18px;
	height: 30px;
}


.chatmessage_input_fileTransferName {
	overflow: hidden;
	white-space: nowrap;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	max-width: 80%;
	flex-grow: 1;
	width: 0;
}

.chatSendFileCancelButton {
	position: absolute;
	right: 19px;
	top: 4px;
	cursor: pointer;
	font-size: 0.9em;
	text-shadow: 1px 1px 1px rgba(0,0,0 ,0.4);
	color: var(--controlsButtonBackgroundColor);
}

.chatSendFileCancelButton:hover {
	color: var(--controlsButtonActiveColor);
}

.chatmessage_input.emoji {	
	padding: 2px 40px 2px 10px;	
}

.chatmessage_input::-webkit-scrollbar,
.chatmessage_input::-moz-scrollbar {
   display: none;
 }
 

.chatmessage_input[placeholder]:empty:not(:focus):before {
    content: attr(placeholder);
}

.chatmessage_input[placeholder]:empty:focus::before {
    content: "";
}

.chatmessage_input:focus {
  border: 1px solid var(--loungeColor);
	-webkit-box-shadow: inset 0 3px 5px var(--loungeColorTrans);
				 box-shadow: inset 0 3px 5px var(--loungeColorTrans);
}

@supports (scrollbar-width: none) {
  .chatmessage_input {
  	overflow: auto;
  }
}

.chatmessage_send_button {
	color: var(--loungeColor);
	text-shadow: 1px 1px 5px rgba(0,0,0 ,0.6);
	cursor: pointer;
	text-align: center;
	font-size: 24px;
	display: inline-block;
	vertical-align: middle;
	position: relative;
	padding-right: 3px;
	border-radius: 0px 10px 10px 0px;
	width: 26px;
}

.chatmessage_send_button.private {
	color: #cecece
}

.chatmessage_send_button_status {
    position: absolute;
    bottom: 11px;
    right: 34px;
    border-radius: 50%;
    width: 10px;
    height: 10px;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
}

.chatmessage_send_button_status.available {
	background-color: #4eff00;
}

.chatmessage_send_button_status.busy {
	background-color: #ff8b23;
}

.chatmessage_send_button_disabled {
	color: #6f6f6f;
	text-shadow: 1px 1px 5px rgba(0,0,0 ,0.6);
	text-align: center;
	font-size: 24px;
	display: inline-block;
	vertical-align: middle;
	position: relative;
	-webkit-box-flex: 0 0 40px;
	-moz-box-flex: 0 0 40px;
	-webkit-flex: 0 0 40px;
	-ms-flex: 0 0 40px;
	flex: 0 0 40px;
	padding-right: 3px;
	background-color: #0f0f0f70;
	border-radius: 0px 10px 10px 0px;
	width: 40px;
	height: 48px;
	line-height: 2.2em;
}

.sendMessageButtonContainer {
  display: inline-block;
  position: relative;
}


.chatmessage_send_button:hover {
	color: var(--loungeColorHover);
}

.chatmessage_send_button.private:hover {
	color: #fff;
}

.conversationsEntryImageWrapper {
	align-self: center;
	padding-left: 5px;
	position: relative;
}

.conversationsEntryImage {
	width: 40px;
	border-radius: 50%;
}

.conversationsEntry {
	position: relative;
	font-size: 0.8em;
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .3);
	box-shadow: 0 2px 6px rgba(0, 0, 0, .3);
	margin-bottom: 10px;
	/*background-color: #0606068a;*/
	background-color: #f4f4f417;
	white-space: nowrap;
	display: flex;
	height: 45px;
	border-radius: 6px;
	color: #efefef;
	cursor: pointer;
	max-width: 96%;
}

.conversationsEntry.operator {
	background-color: var(--loungeColorTrans);
}

.conversationsEntry.operator.presentation {
	background-color: var(--loungeColorTrans);
	border: 1px solid var(--loungeColor);
}

.conversationsEntryUserData {
	line-height: 1.2em;
	text-align: left;
	padding-left: 10px;
	padding-top: 3px;
}

.conversationsEntryUserName {
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	max-width: 160px;
	overflow: hidden;
}

.conversationsEntryInfoData {
	color: #979797;
	font-size: 0.75em;
	line-height: 1.1em;
	-moz-text-overflow: ellipsis;
	-ms-text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis;
	text-overflow: ellipsis;
	max-width: 330px;
	overflow: hidden;
	padding-top: 3px;
}

.conversationsEntryAlertBadge {
	position: absolute;
	min-width: 6px;
	padding: 2px 4px;
	font-size: 0.6em;
	line-height: 0.9em;
	color: black;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	background-color: #df02ff;
	border-radius: 10px;
	top: 1px;
	left: 1px;
	-webkit-box-shadow: 2px 2px 5px rgba(15,15,15,0.5);
	box-shadow: 2px 2px 5px rgba(15,15,15,0.5);
}

.conversationsEntryAlertBadge:empty {
	display: none;
}

.conversationsEntryPresentationBadge {
	position: absolute;
	min-width: 6px;
	padding: 4px 4px;
	font-size: 1em;
	line-height: 0.9em;
	color: var(--loungeColor);
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;	
	border-radius: 10px;
	top: 1px;
	right: 1px;	
}

.panelNavBackWrapper {
	display: flex;
	align-items: center;
	margin-right: 5px;
}

.navBack {
	font-size: 1.2em;
	font-style: normal;
	cursor: pointer;
}

.navBack:hover {
	color: #fff;
}

.loungePanelPrivateChatViewResult {
	width: 100%;
	-webkit-box-flex: 1 0 0;
	-moz-box-flex: 1 0 0;
	-webkit-flex: 1 0 0;
	-ms-flex: 1 0 0;
	flex: 1 0 0;
	overflow: hidden;
}

.privateChatPanelContentWrapper {
	position: relative;
	width: 100%;
	height: 100%;
	flex-direction: column;
	min-height: 0;
	background-color: rgba(0, 0, 0, 0.4);
}

.privateChatPanelContent {
	position: relative;
	width: 100%;
	height: 100%;	
	min-height: 0;
}

.privateChatPanelSubHeader {	
	font-size: 0.8em;
	justify-content: flex-end;	
	line-height: 1.2em;
	margin-top: -20px;
	position: absolute;
	right: 90px;
}

.privateChatPanelSubHeaderTab {	
	padding: 0px 15px;	
	color: rgb(94, 94, 94);
	cursor: pointer;	
	position: relative;
}

.privateChatPanelSubHeaderTab.active {	
	padding: 0px 15px;	
	background-color: rgba(0, 0, 0, 0.4);
	border-radius: 10px 10px 0px 0px;
	color: #e6e6e6;
	cursor: default;
}

.privateChatPanelSubHeaderTab:hover {	
	color: #fff;	
}

.privateChatPanelSubHeaderTab.active:hover {	
	color: #e6e6e6;	
}

.privateChatMessageContainer {
	position: relative;
	height: 100%;
	overflow: hidden;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	padding-top: 2px;
	min-height: 0;
	max-height: 100%;	
	width: 100%;
	font-size: 0.9em;
}

.presentationPanelContentContainer {
	position: relative;
	height: 100%;
	overflow: hidden;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	min-height: 0;
	max-height: 100%;	
	width: 100%;
	padding: 20px;
}

.private_chatmessage_me {	
	vertical-align: bottom;
	margin: 10px 0px;
	white-space: nowrap;
	position: relative;
	text-align: right;
  width: 100%;
}

.private_chatmessage_other {	
	vertical-align: bottom;
	/*margin: 10px 0px;*/
	white-space: nowrap;
	position: relative;
	text-align: left;
  width: 100%;
  padding: 10px 0 10px 15px;
}

.private_chatmessage_user_me {
    display: inline-block;
    vertical-align: bottom;
    margin-right: 10px;
    margin-bottom: 3px;
}

.private_chatmessage_user_other {
  display: inline-block;
  vertical-align: bottom;
  margin-bottom: 3px;
}


.private_chatmessage_user_img {
	width: 35px;
	height: 35px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -o-border-radius: 50%;
	border-radius: 50%;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
  box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
}

.private_chatmessage_user_name_me {
	position: absolute;
	color: #939393;
	font-size: 0.6em;
	line-height: 1.2em;
	right: 40px;
}

.private_chatmessage_user_name_other {
  position: absolute;
  color: #939393;
  font-size: 0.6em;
  line-height: 1.2em;
}

.private_chatmessage_info_me {
	position: absolute;
	color: #939393;
	font-size: 0.6em;
	line-height: 0.8em;
	font-style: italic;
	top: -10px;
	left: 10px;
	white-space: nowrap;
	display: flex;
	flex-direction: row;
}
.private_chatmessage_info_other {
	position: absolute;
	color: #939393;
	font-size: 0.6em;
	line-height: 0.8em;
	font-style: italic;
	top: -10px;
	right: 10px;
	white-space: nowrap;
	display: flex;
	flex-direction: row;
}

.actionCompletedTime {
	color: #939393;
	margin-left: 3px;
	margin-top: -1px;
}

.private_chatmessage_text {
  width: 100%;
  line-height: 1.3em;
}

.private_chatmessage_status_wrapper {
	text-align: left;
	display: flex;
	align-items: baseline;
}

.private_chatmessage_status_label {
	text-transform: uppercase;
	font-size: 0.75em;
	padding-right: 10px;
}

.private_chatmessage_status_info {
	font-size: 0.8em;
	line-height: 1em;
	font-style: italic;
}

/*.privateChatMessageContainer .viewport {	
	max-height: 100%;
}*/

.operatorChatPrompt {
	background-color: #000000c2;
	padding: 5px 5px 5px 20px;
	border-radius: 10px 0px 0px 10px;
	border: 2px solid var(--loungeColor);
	border-right: none;
}

.chatmessage_prompt {
    vertical-align: bottom;
    margin: 10px 0px;
    white-space: nowrap;
    position: relative;
    text-align: left;
    width: 100%;
}

.chatmessage_prompt_user {
    display: inline-block;
    vertical-align: bottom;
    margin-bottom: 3px;
}

.chatmessage_user_img {
    width: 35px;
    height: 35px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
}

.chatmessage_prompt_name {
    position: absolute;
    color: #939393;
    font-size: 0.6em;
    line-height: 0.9em;
}

.chatmessage_prompt_textbubble {
    -webkit-border-radius: 20px 20px 20px 0px;
    -moz-border-radius: 20px 20px 20px 0px;
    -o-border-radius: 20px 20px 20px 0px;
    border-radius: 20px 20px 20px 0px;
    margin: 5px;
    padding: 5px 12px 5px 10px;
    color: #000;
    display: inline-block;
    word-wrap: break-word;
    max-width: 75%;
    white-space: normal;
    position: relative;
    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
    font-size: 0.8em;
    text-align: left;
    background-color: #e8e8e8d1;
}

.chatmessage_prompt_info {
    position: absolute;
    color: #939393;
    font-size: 0.6em;
    line-height: 0.8em;
    font-style: italic;
    top: -10px;
    right: 10px;
    white-space: nowrap;
    display: flex;
    flex-direction: row;
}

.operatorChatPromptButtonContainer {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-direction: row;
    text-align: end;   
    align-items: center;
    justify-content: end;
    grid-gap: 20px;
    font-size: 0.8em;
    padding-top: 10px;
    white-space: nowrap;
}

.operatorChatPromptOKButton {
    background-color: var(--loungeColorTrans);
    padding: 1px 5px;
    border-radius: 4px;
    -webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
    box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
    cursor: pointer;
    color: #cbcbcb;
    border: 1px solid var(--loungeColorTrans);
}

.operatorChatPromptOKButton:hover {
	background-color: var(--loungeColor);
	color: var(--loungeColorText);	
}

.operatorChatPromptCancelButton {   
    border-radius: 4px;
    -webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
    box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
    cursor: pointer;
    color: #a7a7a7;
    padding: 1px 5px;
    border: 1px solid #535353;
}

.operatorChatPromptCancelButton:hover {
	background-color: #ffffff30;	
}

.privateChatPromptBlockButton {   
    border-radius: 4px;
    -webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
    box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
    cursor: pointer;
    color: #a7a7a7;
    padding: 1px 5px;
    border: 1px solid #ff0000b5;
}

.privateChatPromptBlockButton:hover {
	background-color: #ff000030;	
}

.privateChatMessageContainer .viewport .overview {
	display: flex;
  	flex-direction: column;
}

@keyframes slideInRight {
  from {
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
  animation-duration: 1.5s;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  animation-name: fadeIn;
  -webkit-animation: fadeIn .2s ease-out;
  animation: fadeIn .2s ease-out;
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  animation-name: fadeOut;
   -webkit-animation: fadeOut .2s ease-out;
  animation: fadeOut .2s ease-out;
}


.panelSlideInRight {
	-webkit-animation: slideIn .8s ease-out;
    animation: slideIn .8s ease-out;
}

@-webkit-keyframes slideIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.panelSlideOutRight {
	-webkit-animation: slideOut .8s ease-in;
    animation: slideOut .8s ease-in;
}

@-webkit-keyframes slideOut {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOut {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}




.chatmessage:last-child {
	padding-bottom: 20px;
}

.private_chatmessage_textbubble_me {
	-webkit-border-radius: 20px 20px 0px 20px;
	-moz-border-radius: 20px 20px 0px 20px;
	-o-border-radius: 20px 20px 0px 20px;
	border-radius: 20px 20px 0px 20px;
	margin: 5px;
	padding: 5px 10px 5px 12px;
	color: var(--loungeColorText);
	display: inline-block;
	word-wrap: break-word;
	max-width: 85%;
	white-space: normal;
	position: relative;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	font-size: 0.8em;
	text-align: left;
	/*background-color: #c6ffb1d1;*/
	background-color: var(--loungeColor);
}

.private_chatmessage_textbubble_other {
	-webkit-border-radius: 20px 20px 20px 0px;
	-moz-border-radius: 20px 20px 20px 0px;
	-o-border-radius: 20px 20px 20px 0px;
	border-radius: 20px 20px 20px 0px;
	margin: 5px;
	padding: 5px 12px 5px 10px;
	color: #000;
	display: inline-block;
	word-wrap: break-word;
	max-width: 85%;
	white-space: normal;
	position: relative;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	font-size: 0.8em;
	text-align: left;	
	background-color: #e8e8e8d1;
}

.private_chatmessage_filetransfer_line {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	justify-content: center;
	grid-gap: 20px;
	padding-top: 10px;
	line-height: 1em;
	align-items: first baseline;
}

.private_chatmessage_fileDenyButton {
    background-color: #cdcdcd;
    color: #000;
    padding: 5px;
    border-radius: 4px;
    -webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
    box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
    cursor: pointer;
}

.private_chatmessage_status_info .private_chatmessage_fileDenyButton {	
	margin-left: 10px;
} 

.private_chatmessage_fileDenyButton:hover {
	filter: brightness(125%);
}

.private_chatmessage_fileAcceptButton {
    background-color: #8dabd9;
    color: #000;
    padding: 5px;
    border-radius: 4px;
    -webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
    box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
    cursor: pointer;
}

.private_chatmessage_fileAcceptButton:hover {
	filter: brightness(125%);
}

.private_chatmessage_filebubble_me {
	-webkit-border-radius: 20px 20px 0px 20px;
	-moz-border-radius: 20px 20px 0px 20px;
	-o-border-radius: 20px 20px 0px 20px;
	border-radius: 20px 20px 0px 20px;
	margin: 5px;
	padding: 0.5rem .875rem;
	color: #000;
	display: inline-block;
	word-wrap: break-word;
	max-width: 85%;
	white-space: normal;
	position: relative;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	font-size: 0.8em;
	text-align: left;	
	background-color: #ffefd5d1;
}

.private_chatmessage_filebubble_other {
	-webkit-border-radius: 20px 20px 20px 0px;
	-moz-border-radius: 20px 20px 20px 0px;
	-o-border-radius: 20px 20px 20px 0px;
	border-radius: 20px 20px 20px 0px;
	margin: 5px;
	padding: 0.5rem .875rem;
	color: #000;
	display: inline-block;
	word-wrap: break-word;
	max-width: 85%;
	white-space: normal;
	position: relative;
	-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	font-size: 0.8em;
	text-align: left;
	background-color: #ffefd5d1;
	bottom: 5px;
}


.privateChatControls {
	width: 100%;
	z-index: 3;
	-webkit-box-flex: 0 0 48px;
	-moz-box-flex: 0 0 48px;	
	position: relative;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	align-items: center;	
	border-top: 1px solid #25252545;
	margin-top: 2px;
	flex-direction: column;
	padding: 0 5px;
	flex: 1;
}

.privateChatMyProfileEditPanel {
	position: fixed;
    background-color: rgba(0, 0, 0, 0.95);
    width: 300px;
    padding: 10px;
    max-height: 375px;
    font-size: 0.9em;
    z-index: 20;
    border-radius: 10px;
    border: 1px solid #272727;
    bottom: 12px;
    right: 160px;
    flex-direction: column;
}

.privateChatMyProfileEditPanel.controlBar {
	bottom: 50px;
}

.privateChatMyUserImage {
    border-radius: 50%;
    width: 30px;    
    cursor: pointer;
}

.privateChatRememberMeText {
	font-size: 0.6em;
	white-space: normal;
	line-height: 1.2em;
	color: #999;
    font-style: italic;
}

.chatControlsMenuButtonContainer {
	position: relative;  
}

.settingsPanelCheckboxContainer {
	padding-top: 10px;
	font-size: 0.75em;
	color: #b3b3b3;
	white-space: normal;
	line-height: 1em;
}

.sendFileMenuButton {	
	text-shadow: 2px 2px 5px rgba(0,0,0,0.6);
	font-size: 1.2em;	
	text-align: center;
	cursor: pointer;	
	padding: 0 5px;
}

.sendFileMenuButton:hover {
	color: #fff;
}

.chatControlsMenuButton {
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	background-color: var(--controlsButtonBackgroundColor);
	color: var(--controlsButtonTextColor);
	-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4);
	box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4);
	font-size: 1.2em;
	width: 30px;
	height: 30px;
	line-height: 1.7em;
	text-align: center;
	cursor: pointer;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}

.chatControlsMenuButton.open {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

.chatControlsMenuButton:hover,
.chatControlsMediaButton:hover {
  color: #fff;
}

.chatControlsMediaButton {	
	line-height: 1.3em;
	font-size: 1.3em;	
	text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4);
	text-align: center;
	cursor: pointer;	
	margin: 0px 5px 0px 10px;
	align-self: center;
	position: relative;
}

.chatControlsMediaButton.disabled {
	color: #4f4f4f;
}

.chatControlsMediaButton.active {
	color: #5cf774;
}

.chatControlsMediaButton.active:hover {
	color: #5cf774;	
}

.chatControlsMediaButtonExtension {
	position: absolute;
	left: -10px;
	top: -10px;
	cursor: pointer;
	font-size: 0.8em;
	color: #000;
	background-color: #7d7d7d;
	padding: 2px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	width: 20px;
    height: 20px;
    -webkit-box-shadow: 5px 5px 10px rgba(15,15,15,0.5);
	box-shadow: 5px 5px 10px rgba(15,15,15,0.5);
	line-height: 1.5em;
}


.chatControlsMediaButtonExtensionActive {
    position: absolute;
    left: -10px;
    top: -10px;
    cursor: pointer;
    font-size: 0.8em;
    color: #000;
    background-color: var(--controlsButtonActiveColor);
    padding: 2px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    -webkit-box-shadow: 5px 5px 10px rgba(15,15,15,0.5);
    box-shadow: 5px 5px 10px rgba(15,15,15,0.5);
    line-height: 1.5em;
}


.videoChatContainer {
	justify-content: center;
	padding-bottom: 10px;
	position: relative;
	z-index: 1;
	pointer-events: all;
}

.videoChatContainerEndButton {
	position: absolute;
	right: 6px;
	top: 0;
	border-radius: 10px;
	border: 1px solid #121212;	
	padding: 5px 10px;
	line-height: 1em;
	cursor: pointer;
	background-color: #000000db;
}

.videoChatContainerEndButton:hover {    
    color: #f42c2c;
}

.videoChatContainerEndButton.mini {
	top: -35px;
}

.videoChatContainerMessageButton {
	position: absolute;
	right: 78px;
	top: 0;
	border-radius: 10px;
	border: 1px solid #121212;
	font-size: 1em;
	padding: 5px 10px;
	line-height: 1em;
	cursor: pointer;
	background-color: #000000db;
	color: #d9d9d9;
}
.videoChatContainerMessageButton:hover {
    color: #fff;
}

.videoChatContainerMessageButton.mini {
	top: -35px;
}

.fullScreenView .videoChatContainerEndButton,
.fullScreenView .videoChatContainerMessageButton {
	display: none;
}

.videoChatContainerWrapper {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto 1fr;
    grid-gap: 5px;
    margin-right: 5px;
    justify-items: center;
    justify-content: center;
    max-width: 100%;
}

/*.fullScreenView .videoChatContainerWrapper {
	display: flex;
}*/

.videoChatContainerWrapper.mini {
	display: flex;
    justify-content: end;
    margin-bottom: 5px;
}


.videoChatScreenWrapper {
    position: relative;
    height: 100%;
    padding: 0;
    border-radius: 10px;
    width: fit-content;
    align-items: center;
    min-width: 0;
}

.fullScreenView .videoChatScreenWrapper {
	max-width: 85%;
}

#videoChatSelfStreamContainer {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-end;
}

.fullScreenView #videoChatSelfStreamContainer {
	flex: 1;	
}

.videoChatSpeakerScreen {
	background-color: #000000;
    border-radius: 10px;
    height: 135px;
    max-height: 135px;
    /*aspect-ratio: 4/3;*/
    -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.2), 2px 2px 20px 0px rgba(0,0,0,0.1);
    box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.2), 2px 2px 20px 0px rgba(0,0,0,0.1);
    position: relative;
    min-height: 0;
    width: 180px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    min-width: 180px;
}

.videoChatSelfScreen {
	background-color: #000000;
	border-radius: 10px;
	height: 90px;
	/* aspect-ratio: 4/3; */
	-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.2), 2px 2px 20px 0px rgba(0,0,0,0.1);
	box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.2), 2px 2px 20px 0px rgba(0,0,0,0.1);
	position: relative;
	min-height: 0;
	width: 120px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	max-width: 120px;
}

.videoChatScreenSpeakerName {  
    line-height: 1.1em;
    text-align: left;
    width: 80px;
    flex: 1;
    overflow: hidden;
    white-space: nowrap;
    -moz-text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

.videoChatScreenInfoProfileContainer {
	justify-content: center;
}

.videoChatScreenInfoProfileImage {
	border-radius: 50%;
	width: 65px;
	max-width: 65px;
}

.videoChatSpeakerInfoBarImageContainer .videoChatScreenInfoProfileImage {
	width: 35px;
}

.videoChatSpeakerInfoBar {
	display: flex;
	grid-gap: 10px;
	position: relative;
	bottom: 0;
	font-size: 0.6em;
	line-height: 1em;
	background-color: #000000db;
	padding: 2px 10px;
	width: 100%;
	/* justify-content: center; */
	border-radius: 5px;
	margin-top: 1px;
}

.videoChatSelfInfoBar {
	display: flex;
	grid-gap: 15px;
	position: relative;
	bottom: 0;
	font-size: 0.9em;
	line-height: 1em;
	background-color: #000000db;
	padding: 2px 10px;
	width: 100%;
	border-radius: 5px;
	margin-top: 1px;
	justify-content: center;
	align-items: center;
}

.videoChatScreenSpeakerInfoBarIcon {
	color: #d9d9d9;
	text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4);
	text-align: center;
}

.videoChatScreenSpeakerInfoBarIcon.active {
	color: #5cf774;
}

.mini .videoChatScreenSpeakerInfoBarIcon {
	font-size: 1.2em;
}

.mini .videoChatScreenMyInfoBarIcon {
	font-size: 1.2em;
	margin-left: 5px;
}

.videoChatScreenMyInfoBarIcon {
	color: #d9d9d9;
	text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4);
	text-align: center;
	cursor: pointer;
	/*margin-left: 10px;
	font-size: 1.5em;*/
}

.videoChatScreenMyInfoBarIcon:hover,
.videoChatScreenMyInfoBarToggleIcon:hover {
	color: #fff;	
}

.videoChatScreenMyInfoBarIcon.active,
.videoChatScreenMyInfoBarToggleIcon.active {
	color: #5cf774;
}

.videoChatScreenMyInfoBarIcon.active:hover,
.videoChatScreenMyInfoBarToggleIcon.active:hover {
	color: #5cf774;
}

.videoChatScreenMyInfoBarToggleIcon {
	color: #d9d9d9;
	text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4);
	text-align: center;
	cursor: pointer;
}

.videoChatSpeakerInfoBar.mini {
	border-radius: 10px;
	padding: 2px 10px 2px 2px;
	align-items: center;
	grid-gap: 5px;
	position: relative;
	bottom: 0;
	background-color: rgba(25, 25, 25, 0.93);
}

.videoChatSpeakerInfoBarImageContainer {
	width: 35px;
}

.chatPresentationScreenContainer {
	right: 360px;
	bottom: 8px;
	position: absolute;
	box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2), 0px 0px 40px 0px rgba(0,0,0,0.19);
	font-size: 18px;
	line-height: 1.2;
	letter-spacing: normal;
	color: #8c8c8c;
	text-align: left;
	text-transform: none;
	background-color: rgba(0, 0, 0, 0.75);
	width: min(75%,calc(100vw - 365px));
	flex-direction: column;
	min-height: 0;
	height: 95%;
	z-index: 50;
	border-radius: 10px;
	pointer-events: all;
}

.receivedVideoStream {
	height: 100% !important;
	min-height: 100% !important;
	width: auto !important;
	object-fit: contain;	
	-webkit-user-select: none;  
  -moz-user-select: none;    
  -ms-user-select: none;      
  user-select: none;  
}

.chatControlsPanel {
	position: absolute;
	left: 5px;
	top: -30px;
	padding: 2px;
	background-color: var(--controlsButtonBackgroundColor);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
	text-align: center;
	z-index: 52;
	-webkit-box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.4), 10px 10px 40px 0px rgba(0,0,0,0.2);
	box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.4), 10px 10px 40px 0px rgba(0,0,0,0.2);
	font-size: 1.2em;
	padding: 10px;
}

.privateChatInputContainer {
	position: relative;
	text-align: right;
	display: flex;
	min-height: 0;
	/*height: 90%;*/
	align-self: center;
	/* width: max(60%,320px); */
	max-height: 35px;
	flex: 1;
}

.privateChatInputContainer.qaPanel {
	line-height: 1.5em;
}

.typingIndicator {
    position: absolute;
    left: 7px;
    bottom: -3px;
}

.typingIndicatorContainer {
    align-items: center;
    display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
    height: 18px;
}

.typingIndicatorDot {
    -webkit-animation: typingIndicatorAnimation 1.5s infinite ease-in-out;
    animation: typingIndicatorAnimation 1.5s infinite ease-in-out;
    border-radius: 50%;
    width: 5px;
    height: 5px;
    display: inline-block;
    margin-right: 2px;
    background-color: #90949c;
}

@-webkit-keyframes typingIndicatorAnimation{
	0%{
	  -webkit-transform:translateY(0px)
	}
	30%{
	  -webkit-transform:translateY(-5px)
	}
	50%{
	  -webkit-transform:translateY(0px)
	}
}

@keyframes typingIndicatorAnimation{
	0%{
	  -webkit-transform:translateY(0px)
	}
	30%{
	  -webkit-transform:translateY(-5px)
	}
	50%{
	  -webkit-transform:translateY(0px)
	}
}

.typingIndicatorDot:nth-child(1){
	-webkit-animation-delay:200ms;
	animation-delay:200ms;
}
.typingIndicatorDot:nth-child(2){
	-webkit-animation-delay:300ms;
	animation-delay:300ms;
}
.typingIndicatorDot:nth-child(3){
	-webkit-animation-delay:400ms;
	animation-delay:400ms;
}

.btn {
  display: inline-block;
  padding: 5px 10px;
  margin-bottom: 0;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}

.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}
.btn:hover,
.btn:focus,
.btn.focus {
  color: #e4e8ff;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}
.btn:active,
.btn.active {
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
          box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
  cursor: not-allowed;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
          box-shadow: none;
  opacity: .65;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}
a.btn.disabled,
fieldset[disabled] a.btn {
  pointer-events: none;
}

.btn_default {
	display: inline-block;
	padding: 5px 10px;
	margin-bottom: 0;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.4;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: none;
	border: 1px solid #666;
	border-radius: 4px;
	color: #ccc;
	background-color: #fff0;
	height: 36px;
	min-width: 64px;
}

.btn_default:focus,
.btn_default:active:focus,
.btn_default.active:focus,
.btn_default.focus,
.btn_default:active.focus,
.btn_default.active.focus,
.btn_default:active:hover,
.btn_default.active:hover,
.btn_default:focus:hover,
.btn_default.focus:hover {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
  text-decoration: none;
  color: #cecece;
  -webkit-box-shadow: inset 0 0 0 99999px rgba(25,25,25,0.2), inset 0 3px 5px rgba(0, 0, 0, .125);
  		  box-shadow: inset 0 0 0 99999px rgba(25,25,25,0.2), inset 0 3px 5px rgba(0, 0, 0, .125);
}

.btn_default:active,
.btn_default.active {
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 0 0 99999px rgba(25,25,25,0.2), inset 0 3px 5px rgba(0, 0, 0, .125);
          box-shadow: inset 0 0 0 99999px rgba(25,25,25,0.2), inset 0 3px 5px rgba(0, 0, 0, .125);
}

.btn_default:hover,
.btn_default.hover {
  text-decoration: none;
  color: #fff;
  -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4), inset 0 0 0 99999px rgba(25,25,25,0.2);
  box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4), inset 0 0 0 99999px rgba(25,25,25,0.2);
  background-color: #2f2f2f;
}

.btn-lg {
   	padding: 8px 12px;
  	font-size: 16px;
  	line-height: 1.42857143;
  	-webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
 	border-radius: 4px;
}

.btn-block {
  display: block;
  width: 100%;
}

.buttonShadow {
	-webkit-box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.3);
}

.buttonShadowCompact {
	-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4);
	box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.4);
}

.loading {
  z-index: 1000;
  margin: auto;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  position: fixed;

  height: 4em;
  width: 4em;
  -webkit-animation: rotation 1s infinite linear;
          animation: rotation 1s infinite linear;
  border: 6px solid rgba(0, 0, 0, 0.2);

  border-top-color: #00ffcf;
  border-left-color: #00ffcf;
  border-radius: 50%;
}

.clickLoading {
    z-index: 3000;
    position: fixed;
    height: 1.3em;
    width: 1.3em;
    -webkit-animation: rotation 1s infinite linear;
    animation: rotation 1s infinite linear;
    border: 2px solid rgba(0, 0, 0, 0.2);
    border-top-color: #00ffcf;
    border-left-color: #00ffcf;
    border-radius: 50%;
}

@-webkit-keyframes rotation {
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes rotation {
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

.noWrap {
	white-space: nowrap;
}

.normalWrap {
	white-space: normal;
}

.anywhereWrap {
	word-wrap: anywhere;
}

.absolutePositioned {
	position: absolute;
}

.rightFloated {
	float: right;
}

.leftFloated {
	float: left;
}

.top-aligned {
	vertical-align: top;
}

.middle-aligned {
	vertical-align: middle;
}

.right-aligned {
	text-align: right;
}

.left-aligned {
	text-align: left;
}

.bottom-aligned {
	vertical-align: bottom;
}

.center-aligned {
	text-align: center;
}

.self-center-aligned {
	align-self: center;
}

.center-justified {
	justify-content: center;
}

.clearBoth {
	clear: both;
}

@media screen and (orientation: portrait) {
	
	.comingSoonDiv {
		margin-top: 60px;
	}
	
	html {
		overflow: auto;
	}
	
	.preEntryView {	
		height: 100%;
		overflow: auto;
	}
		
	
	.pageContent {	
		min-width: unset;
	}
	.mainContent {
		display: none;
	}
	
	.preEntryView .mainContent {
		display: flex;
	}
	
	.loungeEntryContentWrapper {
	    display: flex;
	    max-width: 75%;
	    grid-gap: 20px;
	    align-items: center;
	    flex-direction: column;
	}
	
	.loungeEntryImage {
		height: 100%;
		width: auto;
	}
	
	.loungesPageTitle {	
		font-size: 2em;	
	}
	
	.loungesPageTitleWrapper {
		padding-bottom: 0;
	}	
	
	.loungePreEntryPageEntryWrapper {
		padding: 10px;
	}
	
	.portraitErrorView.active {
		display: flex;
		position: fixed;
		align-content: center;
		height: 100vh;
		white-space: normal;
		width: 100vw;
		text-align: center;
		padding: 10%;
		color: #f700e7;
		left: 0;
		top: 0;
		z-index: 1000;
		background: black;
		align-items: center;
		justify-content: center;
	}
	
	.controlBarContainer {
		display: none;	
	}
}

@media screen and (orientation: portrait) and (max-width: 480px) {
	.loungeEntryWrapper {
		padding: 10px;
	}
	
	.loungeEntryViewButton {	
		font-size: 1.4em;
	}
	
	.loungeEntryTitleWrapper {
		font-size: 1.6em;
		max-width: 90%;
		line-height: 1.2em;
	}
	
	.loungeEntryContentWrapper {	    
	    max-width: 95%;	    
	}
	
	.loungeButtonContainer {
		display: grid;
		grid-template-columns: 1fr;
		grid-gap: 60px;
		grid-template-rows: auto 1fr;
		max-width: unset;
		padding: 40px 10px;
	}
	
	.loungeEntryImage {
		height: auto;
		width: 100%;
	}
	
}

/*@media screen and (orientation: landscape) and (max-height: 1080px) {	
	.videoChatSpeakerScreen {	
		max-height: 13vh;	
	}
}*/

@media screen and (orientation: landscape) and (min-height: 1081px) {
	.loungePanelMainWrapper {
		min-height: unset;
		max-height: 850px;
	}
	
	.fullScreenView .fullScreenStageVideoChatContainer .videoChatSpeakerScreen {
		height: 15vh;
		max-height: unset;
	}
	
	.fullScreenView .fullScreenStageVideoChatContainer .videoChatSelfScreen {
		max-height: unset;
		height: 9vh;
		max-width: unset;
	}
	
	#fullScreenStageViewContent {
		flex-direction: column;
	}
	
	.fullScreenView .fullScreenStageVideoChatContainer .videoChatContainerWrapper {
		grid-template-columns: 1fr auto;
		grid-template-rows: auto 1fr;		
		justify-items: center;
	}
}

/* Ipad Pro */
@media screen and (orientation: landscape) and (min-width: 1194px) and (max-width: 1366px) and (hover: none) {
	.controlBarContainer {
		margin-bottom: 10px;
	}
	
	.galleryPostOverlay {
		height: 75%;	
	}
	
	.fullScreenView .videoChatSpeakerScreen {
		height: 800px;
		max-height: unset;
		width: 1067px;
	}
	
	#fullScreenStageViewContent {
		flex-direction: column;
	}
	
	.fullScreenView .fullScreenStageVideoChatContainer .videoChatContainerWrapper {
		grid-template-columns: 1fr auto;
		grid-template-rows: auto 1fr;		
		justify-items: center;
	}
	
	.fullScreenView .fullScreenStageVideoChatContainer .videoChatSpeakerScreen {
		height: 154px;
		max-height: unset;
		width: 205px;
	}
	
	.fullScreenView .fullScreenStageVideoChatContainer .videoChatSelfScreen {
		max-height: unset;
		height: 92px;
		max-width: unset;
		width: 123px;
	}
	
	.audioButtonWrapper {	
		bottom: 55px;
	}
	
	.loungePanelMainWrapper {
		min-height: unset;
		/*max-height: 850px;*/
	}
	
}

@media screen and (max-width: 850px) {
	.loginPanel {
		max-width: 320px;
	}
}

@media screen and (orientation: landscape) and (max-height: 720px) {
	.loungePanelMainWrapper {	
		min-height: 100%;
		right: 0;
		grid-gap: 5px;	
		max-height: 100%;
		height: 100%;	
	}
	
	.pageContent {	
		min-width: unset;
	}
}

@media screen and (orientation: landscape) and (max-height: 480px) {
	
	body {
		font-size: 16px;
	}
	
	.controlBarPoweredBy {	
		font-size: 0.7em;	
		word-wrap: normal;
		width: 100px;
		line-height: 1em;
	}
	
	.controlBarContainer {
		height: 35px;	
	}
	
	.loungeEntryCookieInfo {	
		padding-top: 16px;		
	}
	
	.loungeInfoText {
		padding-left: 25px;
		font-size: 13px;	
		line-height: 1em;
		width: 160px;
	}
	
	.preEntryView {	
		height: unset;
	}
	
	.loungeEntryImage {
		width: 60%;
	}
	
	.loungeImageWrapper {
		padding-bottom: 20px
	}
		
	.newsScreenWrapper {
		font-size: 2em;    
	}
	
	.newsScreenTopLine {
		font-size: 0.45em;
		height: 18px;
	}
	
	.newsScreenHeadline {	
		font-size: 0.8em;
		padding: 2px 5px;
		margin: 0;	
	}
	
	.newsScreenContentText {
		line-height: 1em;	
	}
	
	/*.loungeImageWrapper {	
		height: 130%;	
	}*/
	
	.loungePanelMainWrapper {	
		min-height: unset;
		right: 0;
		grid-gap: 5px;	
		max-height: unset;
		height: unset;		
	}
	
	.loungeInfoIconWrapper {	
		bottom: 5px;	
	}
	
	.controlBarPoweredBy.noControlBar {	
		bottom: 3px;	
	}
	
	.infoPanelProfileImageDiv {
		width: 30%;	
	}
	
	.pageContent {	
		min-width: unset;
	}
	
	.loungeEntryTitleWrapper {
		font-size: 1.5em;
		padding-top: 10px;
	}
	
	.loungeEntryContentWrapper {
		max-width: 90%;
		flex-direction: row;
		min-height: 65%;
	}
	
	.loungeEntryButtonWrapper {
		padding-top: 5px;
	}
	
	.loungeEntryViewButton {	
		padding: 5px;	
		font-size: 1.4em;
	}
	
	.loungeButtonContainer {		
		grid-gap: 40px;
		max-width: unset;
		padding: 0 40px;
	}
	
	.lightboxCaption {	
		font-size: 0.7em;
	}
	
	/*.controlBarContainer {	
		height: 10%;	
	}*/
	
	/*.loungeLogo {
		width: 90px;	
		top: 8px;
		left: 15px;
	}*/
	
	.audioButtonWrapper {
		bottom: 35px;
	}
	
	.audioButtonWrapper.noControlBar {
		bottom: 20px;
	}
	
	.chatInputContainer {	
		min-width: unset;	
		width: max(60%,400px);
	}	
	
	.chatmessage_input, .chatmessage_fileTransfer_input {
		padding: 7px 30px 2px 10px;
		font-size: 14px;
		line-height: 16px;
	}
	
	.loungeChatControls {
		max-width: 100%;
	}
	
	.loungePanelPrivateChatViewResult {
		display: flex;
  		flex-direction: column;
	}
	
	.privateChatPanelSubHeader {	
		margin-top: unset;
		position: relative;
	}
	
	.lounge_chatmessage_textbubble {
		padding: 0.4rem 0.75rem;
	}
	
	.loungeReactionIcon {	
		font-size: 20px;
		padding: 4px;
	}
	
	.controlBarExitIcon {
		font-size: 20px;	
	}
	
	.controlBarDirectoryIcon {	
		height: 30px;	
		padding: 4px;
	}
	
	.controlBarDirectoryIcon.activity {
		margin-right: 40px;	
	}
	
	.userTeaserContainer {	
		right: 38px;
	}
	
	.lightboxPanel {
		/* bottom: 15px; */
		margin: 5px auto;
		max-height: calc(100% - 25px);
	}
	
	.presentationViewCameraPopup {
		font-size: 0.8em;	
	}
	
	
	/*.loungePanelRightWrapper {
		grid-gap: 0;
		flex-direction: row-reverse;
	}*/
	
	.loungePanelViewResult {
		padding: 10px 5px 0px 5px;	
	}
	
	.videoChatContainer {	
		width: unset;
		margin-left: 5px;
		padding-bottom: 0px;
	}
	
	/*.videoChatContainerWrapper {
		grid-gap: 5px 0;
		align-self: center;
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		justify-items: end;		
	}*/
	
	.fullScreenView .videoChatContainerWrapper {
		grid-template-columns: 1fr auto;
  		grid-template-rows: auto 1fr;
  		grid-gap: 5px;
  		justify-items: center;
	}
	
	.fullScreenView .videoChatSpeakerScreen {
		height: 325px;
		max-height: unset;
		width: 433px;
	}
	
	.fullScreenView .fullScreenStageVideoChatContainer .videoChatSpeakerScreen {
		height: 180px;
		max-height: unset;
		width: 240px;
	}
	
	.fullScreenView .videoChatSelfScreen {
		max-height: unset;
		height: 105px;
		max-width: unset;
		width: 140px;
	}
	
	.fullScreenView .fullScreenStageVideoChatContainer .videoChatSelfScreen {
		max-height: unset;
		height: 72px;
		max-width: unset;
		width: 96px;
	}
	
	.videoChatSpeakerScreen {
	    max-height: unset;
	    height: 72px;
	    min-width: 96px;
	    width: 96px;
	}
	
	.videoChatSelfScreen {
		height: 42px;
		width: 56px;
	}
	
	.videoChatScreenInfoProfileImage {	
		width: 60%;
	}
	
	.videoChatContainerEndButton {
		/*right: 8px;
		top: 0px;
		padding: 5px 7px;
		font-size: 0.8em;*/
		display: none;
	}
	
	.videoChatContainerMessageButton {	
		right: 5px;	
	}
	
	.liveMediaButtonExtension.chat {
		top: 10px;
		font-size: 0.5em;
		height: 16px;
		width: 16px;
		line-height: 12px;
		left: 9px;
	}
	
	.loungePanelHeader {
		height: 0px;
		overflow: unset;
	}
	
	.panelTitleBarLogo {
		display: none;
	}
	
	.loungePanelTitle {
		display: none;
	}
	
	.chatPresentationScreenContainer {
		right: 260px;	
		width: 66%;
	}
	
	.privateChatControls {
		flex: 1;
		max-height: 32px;
	}
	
	.loungePanelPrivateChatViewResult {
		display: flex;
		flex-direction: column;
	}
	
	.privateChatPanelContentWrapper {
		justify-content: flex-end;
		max-height: 100%;
		flex: 1;
	}
	
	.chatmessage_input.private, .chatmessage_fileTransfer_input.private {
		font-size: 14px;
	}
	
	/*.videoChatScreenWrapper {	
		min-width: unset;	
	}*/
	
	.videoChatSpeakerInfoBar {	
		/*grid-gap: 5px;	
		padding: 2px 5px;*/
		display: none;	
	}
	
	.videoChatScreenSpeakerName {	
		width: 40px;	
	}
	
	.videoChatSelfInfoBar {	
		/*grid-gap: 15px;
		padding: unset;		
		font-size: 0.8em;*/
		display: none;
	}
	
	.presentationViewPresenterPopup {
		top: -5px;	
	}
	
	.chatPresentationScreenContentContainer {
		justify-content: flex-start;	
	}
	
	.presentationScreenMedia {
		border-radius: 0px 0px 10px 10px;
	}
	
	.videoChatSelfInfoBar .videoChatScreenSpeakerName {
		display: none;
	}
	
	/*.videoChatScreenMyInfoBarToggleIcon {
		position: absolute;
		left: -18px;
		top: -25px;
	}
	*/
	/*.loungeOperatorsPanel {	
		width: 200px;
		height: 16%;
	}*/
	
	.loungeUsersPanel {
		height: 100%;
		min-width: unset;
		max-height: unset;
		margin-bottom: unset;
		width: 260px;
		border-radius: unset;
	}
	
	.loungeUsersPanel.stage {
		width: 260px;
	}
	
	.loungePanelView {
		border-radius: unset;
	}
	
	.loungePanelViewContainer {			
		border-radius: unset;	
	}
	
	.loungePanelContainer {
		border-radius: unset;	
	}
	
	.infoPanelProfileHeading {
		font-size: 0.8em;
	}
	
	.infoPanelProfileDescription {
		font-size: 0.7em;	
	}
	
	.infoPanelProfileText {
		font-size: 0.7em;
		line-height: 1.5em;
	}
	
	.socialLinkIcon {	
		width: 2rem;
		height: 2rem;	
	}
	
	.galleryCarouselWrapper {
		height: 100vh;
		padding-top: 0;	
	}
	
	.postChatmessageInput {
		font-size: 12px;
		line-height: unset;
		padding: 4px 5px 2px 5px;
	}
	
	.galleryWrapper {	
		grid-gap: 5px;
		font-size: 22px;
	}

	
	.loungeReactionPanel {	
		left: -45px;
	}
	
	.galleryPostReactionLine .loungeReactionPanel {
		right: -9px;
		left: unset;
		width: 215px;
	}
	
	.galleryPostMessageWrapper {	
		margin-bottom: 0;
	}
	
	.galleryPostMessageContainer {
		grid-gap: 5px;
		overflow: unset;
		max-height: unset;
	}
	
	.galleryContentPublishDate {		
		line-height: unset;
	}
	
	.controlBarCenterSection {	
		flex-direction: row-reverse;
	}
	
	.guestUserEntry {	
		font-size: 0.6em;
	}
	
	.loungeChatPanel {	
		width: unset;
		flex: 1;
	}
	
	.entryArea {	
	    width: 500px;
	    min-width: 500px;	    
	}
	
	.stageArea {	
	    width: 500px;
	    min-width: 500px;	    
	}
	
	.mediaArea {    
	    width: 500px;
	    min-width: 500px;	    
	}
	
	.statusGallery {    
	    width: 500px;
	    min-width: 500px;	    
	}	
	
	.contentArea {
		width: 1000px;
	    min-width: 1000px;
	    pointer-events: none;
	}
	
	.galleryPostOverlay {
		max-width: 65%;
		right: 261px;
		top: 0;
		margin: 5px auto;
	}

	.galleryPostContent {
		font-size: 15px;
	}
	
	.galleryPostOverlay.edit {
		width: 80%;
	  	right: 10%;
	}
	
	.galleryPostVideo {	
		min-width: unset;
	}

	.galleryPostContentWrapper {
		max-width: 45%;
		overflow: auto;
		max-height: 234px;
	}
	
	.galleryPostChatInputContainer {
		min-width: unset;
		max-height: 35px;
		padding-top: 5px;
	}
	
	.chatmessage_send_button {	
		font-size: 20px;	
	}
	
	.galleryPostUserImageWrapper {
		flex: 0 35px;
		min-width: 35px;
	}
	
	.galleryPostChatLine {
		height: 45px;
		position: absolute;
		bottom: 0;
		right: 0;		
		width: 230px;
	}
	
	
	/*.mediaOverviewInfo {	
		width: 65vw;
		right: 0;
		margin: auto;
		z-index: 20;
		left: calc(65vw/-3.5);
		height: 65vh;
		font-size: 0.9em;
	}*/
	
	/*.mediaGalleryVideoWrapper {
		width: 65vw;
		right: 0;
		margin: auto;
		z-index: 20;
		left: calc(65vw/-3.5);
		height: 65vh;
	}*/
	
	/*.mediaGalleryPlayWrapper {
		width: 65vw;
		right: 0;
		margin: auto;
		z-index: 20;
		left: calc(65vw/-3.5);
		height: 65vh;
	}*/
	
	.mediaGalleryYoutubeToggleFullscreenButton {	   
	    bottom: 93px;
	    right: 23px;
	    font-size: 1.8em;	   
	}
	
	.mediaGalleryVideo {	
		position: absolute;
		left: 0;
		right: 0;
		margin: auto;
	}
	
	.toggleFullScreenPost.youtube {
		right: 160px;
		bottom: -35px;
	}
	
	.fullScreenView .toggleFullScreenPost.youtube {
		right: 25px;
		bottom: 160px;
	}
	
	.mediaScreenControlBar {
		bottom: -58px;
		height: 50px;
		z-index: 90;
		font-size: 0.8em;
	}
	
	.mediaControlButtonBarWrapper {
		grid-gap: 0px;	
	}
	
	.mediaControlProgressBarWrapper {
		grid-gap: 5px;
		padding: 2px 10px;
	}
	
	.loungeMediaControlBarContainer {
		bottom: 45px;
		left: -170px;
		max-width: 55%;
	}
	
	.loungeMediaControlBar {	
		height: 43px;
	}
	
	/*.mediaScreenControlBar {
		position: absolute;
		bottom: -58px;
		left: 0;
		z-index: 32;
		width: 55vw;
		right: 0;
		margin: auto;
		border-radius: 20px;
	}*/
	
	.mediaControlTitle {	
		max-width: 150px;	
		min-width: 130px;
	}
	
	
	.userTeaserIcon {
		width: 35px;	
	}
	
	.userTeaserIcon:nth-child(1) {	
		top: -15px;
	}
	
	.userTeaserIcon:nth-child(2) {	
  		top: -15px;  	
	}

	.userTeaserIcon:nth-child(3) {
		left: -51px;
		top: -10px;
		z-index: 4;
	}

	.userTeaserIcon:nth-child(4) {
  		top: -30px;
	}
	
	.guestUserEntryImage {	
		width: 35px;
	}
	
	.guestUserEntryChatIcon {	
		font-size: 1.6em;
	}
	
	.loungeUsersPanel .loungePanelCloseButton {	
		top: 1px;
		right: 15px;
	}
	
	.conversationsEntryImage {
		width: 35px;	
	}
}



@font-face {
  font-family: 'Lane';
  font-style: normal;
  font-weight: 400;
  src: local('Lane Regular'), local('Lane-Regular'), url('/fonts/LANENAR_.ttf');
}

@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 400;
  src: local('Caveat Regular'), local('Caveat-Regular'), url('/fonts/Caveat-Regular.ttf');
}

@font-face {
  font-family: 'RobotoLight';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Light'), local('Roboto-Light'), url('/fonts/Roboto-Light.ttf');
}

