#logue
{
	width: 100%;
	height: 100%;
    display: none;
}

#logueTopMargin
{
	width: 100%;
	height: 20%;
	top: 0%;
	background: var(--margin-top-border-gradient);
}

#logueBottomMargin
{
	width: 100%;
	height: 40%;
	top: 60%;
	background: var(--margin-bottom-border-gradient);
}

#logueText0 {
	width: 30%;
	height: 100%;
	left: 35%;
	top: 0%;
	overflow: hidden;
}

#logueTextArea0 {
	width: 108%;
	height: 25%;
	top: 65%;
	left: 0%;
	font-size: var(--text-font-size);
    line-height: 160%;
	overflow-y: scroll;
	padding: 2% 8% 2% 2%;
}

#logueTextSymbol0_0, #logueTextSymbol0_1, #logueTextSymbol0_2
{
	width: 4%;
	height: 2%;
	left: 95%;
	top: 95%;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	color: var(--text-light-color);
	animation: logueTextSymbolFlash 2s linear infinite;
}

@keyframes logueTextSymbolFlash 
{
	0%,100% 
	{
		opacity: 0;
	}
	50%
	{
		opacity: 1;
	}
}

#logueTextSymbol0_0
{
	display: inline;
	background-image: url(../resources/image/textSymbol00.png);
}

#logueTextSymbol0_1
{
	display: none;
	background-image: url(../resources/image/textSymbol01.png);
}

#logueTextSymbol0_2
{
	display: none;
	background-image: url(../resources/image/textSymbol02.png);
}

#logueTextAuto
{
	width: 5%;
	height: 5%;
	left: 70%;
	top: 93%;
	font-size: var(--text-font-size);
}