/* CSS Document */
#loginContent{
	position:absolute;  
	margin-left:30%; 
	margin-top:13%; 
    width:27%; 
	word-spacing:1.2em; 
	letter-spacing:0.8em; 
	word-wrap:break-word; 
	height:40%; 
	border:#000 medium ridge;
	font-size:27px; overflow-style:auto;
	border-radius:20px; 
	-moz-border-radius:20px; 
	-webkit-border-radius:20px; 
	z-index:1;
}	
#input{font-size:20px;}	
#tipMainContent{
	position:relative;
	display:inline-table;
	margin-left:1%; 
	margin-top:8%;
    word-spacing:0.2em; 
	letter-spacing:0.03em; 
	word-wrap:break-word; 
	font-size:17px; 
	overflow-style:auto;
	vertical-align:top;
}
#tipMainContent input[type="button"]{
	width:200px;
	height:32px;
	margin-top:20px;
	margin-left:120px;
}

#workingArea{
	position:relative;
	display:block;
	margin-left:0.4%; 
	margin-top:2vh; 
    width:99%; 
	height:1000px;	
	word-spacing:.2em; 
	letter-spacing:0.09em; 
	word-wrap:break-word; 
	font-size:18px; 
	overflow-style:auto;  
	border-top:hidden; 
	border-bottom:hidden;	
  	background-color:#fff; 
	color:#000;	 
	border-radius:20px; 
	-moz-border-radius:20px; 
	-webkit-border-radius:20px;
}
#allArticles{
	position:relative;
	display:inline-block;
	vertical-align:top;
	float:left; 
	margin-left:0.1%;
	margin-top:0vh; 
	padding:0px;
	width:28vw; 
	color:#000; 
  	border-right:#000 medium double; 
	border-top:#000 medium solid; 
	height:90%;
}

#labelArticles{
	font-family:Arial, Helvetica, sans-serif; 
	font-size:26px; 
	font-weight:400; 
	text-align:center;
}
#editSelector{ 
	position:relative; 
	margin-top:1%; 
	font-family:Arial, Helvetica, sans-serif; 
	margin-left:1%;
}
#editSelector a{
	position:relative;
	display:inline-block;
	height:5vh;
	line-height:2;
	box-shadow:#FDC068 0.2vh 0vh 1vh 0vh;
	color:#FFF;
	font-size:12px;
	text-decoration:none;
	background-color:#000000;
}
	#editSelector a:hover{
		background-color:#06049C !important;
	}
#articleTitlesDisplay{
	position:relative;
	margin-top:2vh; 
	font-family:Arial, Helvetica, sans-serif; 
	margin-left:0%;
    border:#fff medium single; 
	height:90%; 
	width:100%; 
	overflow:auto;
}
#detailArticleEntry{
	position:relative; 
	margin-top:8%; 
	margin-left:14%; 
	width:70%;
}
#detailArticleEntry textArea{
	width:210%;
}
#languageCategory{
	margin-left:13%; 
	width:100%;
}
#englishCategory{ 
	position:relative; 
	margin-top:2%; 
	margin-left:9%; 
	width:100%;
}

#workAreaContent{
	position:relative;
	display:inline-block;
	width:40%;
	margin-left:-4%; 
	margin-top:-5vh; 
    word-spacing:0.6em; 
	letter-spacing:0.3em; 
	word-wrap:break-word; 
	font-size:17px; 
	overflow-style:auto;
}	

.animPicsArea{
	position:relative;
	display:inline-block;
	width:220px;
	height:300px;
	margin-left:300px;
	margin-top:80px;
	vertical-align:top;
	border:#333333 thin solid;	
}
.animPicsArea img{
	width:220px;
	height:280px;
}

#manageRegisteredArea{
	position:relative;
	display:block;
	margin-top:20px;
	width:90%;
	height:500px;
	background-color:#FFFFFF;
}
#showRegisteredResults{
	position:relative;
	display:inline-block;
	width:30%;
	height:500px;
	border-right:#666 thin solid;
	overflow:auto;
}
#selectViews{
	position:relative; 
	margin-top:1%; 
	font-family:Arial, Helvetica, sans-serif; 
	margin-left:1%;
}
#selectViews a{
	position:relative;
	display:inline-block;
	height:5vh;
	line-height:1.5;
	box-shadow:#FDC068 0.2vh 0vh 1vh 0vh;
	text-align:center;
	color:#FFF;
	font-size:20px;
	width:8vw;
	text-decoration:none;
	background-color:#000000;
}
	#selectViews a:hover{
		background-color:#06049C !important;
	}
	.showenList{
		background-color:#5900C9 !important;
	}
	.previousList{
		background-color:#000 !important;
	}
#detailOfRegistration, #detailOfQuestion{
	position:relative;
	display:inline-block;
	width:60%;
	height:400px;
	margin-left:30px;
	vertical-align:top;
}

#detailOfRegistration a{
	position:relative;
	display:inline-block;
	font-size:25px;
	text-decoration:none;
	padding-left:3.5vw;
	padding-right:4vw;
	padding-top:2vh;
	color:#fff;
	background-color:#000;
	min-width:8vw;
	height:5vh;
}

#detailOfRegistration input, #detailOfQuestion input{
	width:210px;
	height:30px;
	font-size:20px;
	margin-top:20px;
}
	.newTeacher{
		display:none;
	}
	.btnEdit{
		display:none;
	}
	
	.teacherSignup{
		display:none;
	}
	
	.newStudent{
		display:none;
	}
	
	.sbtnEdit{
		display:none;
	}
	.studentSignup{
		display:none;
	}
	.newAdmin{
		display:none;
	}

#insertTextInfoArea{
	display:grid;
	grid-column:2;
	grid-template-columns:48% 100%;
	grid-template-rows:auto;
	grid-row-gap:2px;
	grid-column-gap:3px;
	grid-row:auto;
	width:100%;
	margin-left:0%;
}

#insertTextInfoArea ul{
	list-style:none;
	height:auto;
	background-color:#fff;
}
#insertTextInfoArea ul li{
	border:#CCCCCC thin solid;
	width:70%;
	white-space:nowrap;
	overflow:hidden;
}
#insertTextInfoArea ul li img{
	width:20px;
	height:20px;
	margin-top:5px;
	margin-left:60%;
}
#insertTextInfoArea ul li ul{
   position: absolute;
   display: block;
   visibility: hidden;
   opacity: 0;
   transition: all 0.5s ease;
   margin-top: -0.1rem;
}
#insertTextInfoArea ul li:hover{
	cursor:pointer;
}
#insertTextInfoArea ul li:hover> ul,
#insertTextInfoArea ul li:focus-within > ul, 
#insertTextInfoArea ul li ul:hover{
	visibility:visible;
	opacity:1;
}
#insertTextInfoArea ul li ul li{
	transition:all 1s ease;
	text-decoration:none;
	border-bottom:transparent thin solid;
	border-left:none;
	border-right:none;
	border-top:none;
}
#insertTextInfoArea ul li ul li:hover{
	border-bottom:#000000 thin solid;
}
#insertTextInfoArea ul li ul li{
	clear:both;
	width:100%;
}