body{
	background: #2ea9e1; /* Old browsers */
	background: -moz-linear-gradient(top,  #2ea9e1 0%, #0370bb 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #2ea9e1 0%,#0370bb 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #2ea9e1 0%,#0370bb 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2ea9e1', endColorstr='#0370bb',GradientType=0 ); /* IE6-9 */
	margin: 0px;
	width: 100vw;
	height: 100vh;
	overflow: hidden;
	min-height: 400px;
}

#schoolLogo{
	height: 30%;
}

#demoPanel{
	width: 300px;
	margin: auto;
}

.DL1div,.DL2div,.DL3div,.DL4div,.DL5div,.DL6div{
	height: 65px;
	width:300px;
	padding-top: 10px;
	background-repeat: no-repeat;
	border-radius: 10px;
	padding-left: 30px;
}

.DL1div > a,.DL2div > a,.DL3div > a,.DL4div > a,.DL5div > a,.DL6div > a{
	color: #000000;
	text-decoration: none;
	font-family: "微軟正黑體";
	font-weight: bold;
	font-size: 32px;
}

.DL1div{
	background-image: url(../images/login/ExtraBGL1.png);
}
.DL2div{
	background-image: url(../images/login/ExtraBGL2.png);
}
.DL3div{
	background-image: url(../images/login/ExtraBGL3.png);
}
.DL4div{
	background-image: url(../images/login/ExtraBGL4.png);
}
.DL5div{
	background-image: url(../images/login/ExtraBGL5.png);
}
.DL6div{
	background-image: url(../images/login/ExtraBGL6.png);
}

/*---- 20240919 add ----*/
#mainDiv
{
	background: linear-gradient(#2ea9e1, #D8EEF8 60%);
}
/* ---- end ----- */
#newsTitle{
	
}

#loginDiv{
	background: url('../Images/Login/MYSMARTABCD_LOGIN_NEWBG-03.png?v=20240807'),url('../Images/Login/MYSMARTABCD_LOGIN_NEWBG-02-03.png?v=20240807');
	background-size: 100%,100%; 
	background-repeat: no-repeat,no-repeat;
	width:100%;
	height:calc(100vh - 50px);
	margin-top:10px;
	/*background-size: 100% 60px; */
	background-position: top+10% left+5%,center;
	/* background-color: #D8EEF8; */ /* 20240919 */
	position: relative;
}

#newsDiv{
	/*
	background: url('../Images/Login/board.jpg');	
	background-repeat: no-repeat;
	background-size: 100% 100%; 
	*/
	width:50vw;
	height:80vh;
	position: absolute;
	top: 45px;
	right:0px;
}

#newsInnerDiv{
	background: url('../Images/Login/boardInner.png?v=20240807');
	background-repeat: no-repeat;
	background-size: 100% 100%; 
	width: calc(90%);
	height: calc(80%);
	margin-top: 50px;
	margin-left: 50px;
}

#booksDiv{ 
	height:35%;
	position: absolute;
	bottom: 1%;
	right: 1%;
}

#ifrLoginKeyCon{
	position:absolute; 
	width:35%;
	bottom:35%;
	left:10%;
}

#ifrLoginKey{
	position:relative; 
	left: 0%;
	width:100%;
}

#ifrNews{
	margin-top:10px;
	margin-left:20px;
	width: calc(100% - 30px);
	height: calc(90% - 30px);
}

.footer{
	font-family: 'Microsoft JhengHei', '微軟正黑體', sans-serif;
	color: #ffffff;
	font-size: 12px;
	padding-left: 3px;
	padding-right: 3px;
	display: inline;
}

.footerR{
	margin: auto;
	float: right;
}

.footerL{
	margin: auto;
	float: left;
}
@media screen and (max-width: 500px), screen and (orientation: portrait) {
	#loginDiv{
		background-size: 80%,100%;
		background-position:center bottom+8%,center;
	}
	#schoolLogo{
		height:10%;
		width: auto;
	}
	#ifrLoginKeyCon{
		width:80%;
		position:absolute; 
		bottom:0%;
		left: 50%;
		max-width: 300px;
	}
	#ifrLoginKey{		
		position:relative; 
		left: -48%;
	}
	#booksDiv{ 
		left: 1%;
		height: 8%;
		bottom: calc(0% + 5px);
	}
	#newsDiv{
		top: calc(10% - 35px);
		width:100%;
		height:calc(85% - 105px);
	}
	
	#newsInnerDiv{
		width: calc(100% - 18px);
		height: calc(100% - 30px);
		margin-top: 15px;
		margin-left: 15px;		
	}
	
	#newsTitle{
		position:absolute;
		top:10px;
		left: 10px;
		width: 60px;		
	}
	
	#ifrNews{
		margin-top:15px;
		margin-left:10px;
		width: calc(100% - 10px);
		height: calc(100% - 20px);
	}

	
	.footerR, .footerL{
		text-align: center;
		width: 100%;
		float: none;
	}
}
@media screen and (max-height: 500px) and (min-width: 500px){
	#schoolLogo{
		height:30%;
		width: auto;
	}
	#loginDiv{
		background-size: 50% 80%,100%;
		height:calc(100vh - 30px);
		background-position:left center,center;
	}
	#ifrLoginKeyCon{
		left:5%;
		position:absolute; 
		bottom:15%;
		width:40%;
	}
	#booksDiv{ 
		left: 5%;
		height:15%;
		bottom: calc(0% + 5px);
	}
	#newsDiv{
		top: 5px;
		height:calc(95%);
	}
	#newsInnerDiv{
		width: calc(100% - 18px);
		height: calc(100% - 30px);
		margin-top: 15px;
		margin-left: 15px;		
	}
	
	#newsTitle{
		width: 60px;		
	}
	
	#ifrNews{
		margin-top:5px;
		margin-left:5px;
		width: calc(100% - 10px);
		height: calc(100% - 40px);
	}
	.footerR, .footerL{
		width: auto;
	}
}

/* Portrait */
/*@media screen and (orientation:portrait) {
	#loginDiv{
			height:800px;
	}
	body{
		overflow: scroll;
	}
	#schoolLogo{
		width:200px;
	}
	#newsDiv{
		height:calc(100% - 350px);
		width:100vw;
	}	
	#newsInnerDiv{
		width: calc(100% - 90px);
		height: calc(100% - 50px);
		margin-top: 30px;
		margin-left: 50px;
		min-width:500px;
	}
	
	#ifrLoginKey{
		top:calc(100% - 285px);
		left:calc(85% - 400px);
		overflow:hidden;
	}
	#booksDiv{ 
		height:150px;
		position: absolute;
		bottom: 10px;
		right:60%;
	}
	#ifrNews{
		width:calc(100% - 80px);
		margin-top:50px;
		margin-left:40px;
		height: calc(100% - 80px);
	}
}
@media screen and (max-height: 600px) {
	#schoolLogo{
		width:180px;
	}
	#ifrLoginKey{
		top:100px;
	}
	#newsDiv{
		top: 10px;
		height:calc(100% - 20px);
	}
	body{
		overflow: scroll;
	}
	#booksDiv{ 
		height:20%;
		position: absolute;
		right:80%;
		bottom: 70px;		
	}
}*/