/* */

html {
	height: 100%;
	margin: 0;
}

body {
	height: 100%;
	margin: 0;
}

@media screen and (max-width:767px) {
	.desktopOnly {
		display: none;
	}
}

.waitingMask {
	position: fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:9999;
	background-color:rgba(0, 0, 0, 0.5);
	color:#ffffff;
	text-align:center;
}

.waitingIcon {
	width:3rem;
	margin-top:10rem;
}

.DegubMsgBox {
	position: fixed;
	top:10%;
	left:10%;
	width:80%;
	height:80%;
	z-index:99997;
	background-color:rgba(0, 0, 0, 0.8);
	color:#ffffff;
	font-size: 0.5rem;
	overflow: scroll;
}

.DegubButtonShow {
	position: fixed;
	top:10%;
	left:85%;
	width:5%;
	height:5%;
	z-index:99998;
	background-color:rgba(0, 0, 0, 0.5);
	color:#ffffff;
	border: none;
}

.DegubButtonHide {
	position: fixed;
	top:10%;
	left:85%;
	width:5%;
	height:5%;
	z-index:99999;
	background-color:rgba(0, 0, 0, 0.5);
	color:#ffffff;
	border: none;
}

.mirrorImage {
    transform: scale(-1, 1);
}

.OMCBody {
	width: 100%;
	height: 100%;
	overflow: hidden;
	color: #f0f0f0;
	background-color: #8497b0;
}

.OMCHeader {
	height: 2.5rem;
	color: #000000;
	background-color: #8faadc;
}

.OMCHeaderBtn {
	background: transparent;
	border: none;
	height: 100%;
	width: 2.5rem;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	border-radius: 2.5rem;
}

.OMCHeaderBtn:hover {
  background: #9fbaec;
}

.OMCHeaderBtn:active {
  background: #bfdaff;
}

.OMCHeaderBtnRed {
  background: #ff9900;
}

.OMCHeaderBtnRed:hover {
  background: #ffbb00;
}

.OMCHeaderBtnRed:active {
  background: #ffdd00;
}

.OMCHeaderBtnImg {
	width: 1.75rem;
	height: 1.75rem;
}

.OMCPlaceBox {
	width: 100%;
	height: 30rem;
	position: relative;
	color: #f0f0f0;
	background-color: #8497b0;
	overflow: scroll;
}

.OMCUserBox {
	position: absolute;
	width: 30rem;
	height: 30rem;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background-color: #777777;
}

.OMCUserBoxHeader {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 2em;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background-color: #00000077;
}

.OMCUserBoxVideo {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

.OMCUserBoxAltVideoBox {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	text-align: center;
	display: table;
	background-color: #7777cc;
}

.OMCUserBoxAltVideoText {
  display: table-cell;
  vertical-align: middle;
}

.OMCUserBoxVideoImage {
	width: 100%;
	height: 100%;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

.OMCUserBoxFooter {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2em;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background-color: #00000077;
	text-align: center;
}

.OMCChatBox {
	height: 8rem;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	color: #f0f0f0;
	background-color: #8497b0;
}

.OMCChatLog {
	width: 100%;
	height: 8rem;
	overflow-x: hidden;
	overflow-y: scroll;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	color: #f0f0f0;
	background-color: #000000;
}

.OMCChatInputText {
	width: 100%;
	height: 8rem;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	border: none;
	resize: none;
	border: 1px solid #647790;
	border-radius: 4px;
}

.OMCChatBtn {
	width: 3rem;
	border: 1px solid #647790;
	border-radius: 4px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background-color: #ffffff;
}

.OMCChatBtn:hover {
	background-color: #dfdfdf;
}

.OMCChatBtn:active {
	background-color: #afafaf;
}

.OMCChatHideBtn {
	height: 2rem;
}

.OMCChatInputBtn {
	height: 6rem;
}

.OMCChatShowBtn {
	height: 2rem;
	position: absolute;
	right: 1rem;
	bottom: 2rem;
	opacity: 0.5;
}

.OMCChatBtnImg {
	width: 2.5rem;
	height: 2.5rem;
}

.OMCFooter {
	width: 100%;
	height: 1rem;
	font-size: 0.5rem;
	color: #000000;
	background-color: #8faadc;
}

.OMCTestVideoImage {
	width: 16rem;
	height: 16rem;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}