/* CSS Document */
@font-face {
    font-family: 'DSN_Newspaper';
    src: url('../fonts/DSNNewspaper.woff2') format('woff2'),
        url('../fonts/DSNNewspaper.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
body, html {
  height: 100%;
}
body{ 
	margin:0; 
	padding:0; 
	background:url(../img/bg.jpg); 
	background-size:cover; 
	background-position: left;
	background-repeat: no-repeat;
	position:relative;
	font-family:DSN_Newspaper;
}
a{ text-decoration:none;}

#logo{position:absolute;right:5%;top:5%;}
#logo .img{max-width:500px;}

.img-cover{max-width:120px;}

#book6{position:absolute;right:45%;top:7%;width:400px; height:220px;} /** No. 3,4 year66*/
#book6 .img{max-width:400px;}

#book5{position:absolute;left:10%;top:7%;width:400px; height:220px;} /** No. 1,2 year66*/
#book5 .img{max-width:400px;}  

#book1{position:absolute;right:3%;bottom:8%;width:400px; height:220px;}/** No.3,4 year64 right*/
#book1 .img{max-width:400px;}

#book4{position:absolute;left:74%;top:35%;width:400px; height:220px;}/** No.1,2 year64 right*/
#book4 .img{max-width:400px;}

#book2{position:absolute;right:25%;top:35%; width:400px; height:220px;}/** No.1,2 year65 right*/
#book2 .img{max-width:400px;}

#book3{position:absolute;right:25%;bottom:8%; width:400px; height:220px;}/** No.3,4 year65 right*/
#book3 .img{max-width:400px;}

#download1{position:absolute; bottom:-25px; left:80px;}
#download1 img{max-width:150px;}

#download2{position:absolute; bottom:-25px; right:85px;}
#download2 img{max-width:130px;}

#download3{position:absolute; bottom:-25px; left:80px;}
#download3 img{max-width:120px;}

#download4{position:absolute; bottom:-25px; right:85px;}
#download4 img{max-width:120px;}

.bookleft{width:42%; z-index:2; position:absolute; left:80px; bottom:25px;}
.bookright{width:42%; z-index:2;position:absolute; right:20px; bottom:25px;}

#bt-toweb{position:absolute; bottom:410px; left:650px;}
#bt-toweb img{ height:33px; width:auto;}

@media only screen and (max-width: 1370px) {
	.img-cover{max-width:110px;}

	#book6{position:absolute;right:8%;top:65%;width:350px; height:180px;} /** No. 3,4 year66*/
	#book6 .img{max-width:350px;}
	
	#book5{position:absolute;left:8%;top:65%;width:350px; height:180px;} /** No. 1,2 year66*/
	#book5 .img{max-width:350px;}
	
	#book1{position:absolute;right:8%;top:13%;width:350px; height:180px;} /** No.3,4 year64 right*/
	#book1 .img{max-width:350px;}
	
	#book4{position:absolute;left:8%;top:13%;width:350px; height:180px;} /** No.1,2 year64 right*/
	#book4 .img{max-width:350px;}
	
	#book2{position:absolute;left:8%;top:40%; width:350px; height:180px;} /** No.1,2 year65 right*/
	#book2 .img{max-width:350px;}
	
	#book3{position:absolute;right:8%;top:40%; width:350px; height:180px;} /** No.3,4 year65 right*/
	#book3 .img{max-width:350px;}
	
	#download1{position:absolute; bottom:-25px; left:50px;}
	#download1 img{max-width:100px;}
	
	#download2{position:absolute; bottom:-25px; right:60px;}
	#download2 img{max-width:100px;}
	
	#download3{position:absolute; bottom:-25px; left:50px;}
	#download3 img{max-width:100px;}
	
	#download4{position:absolute; bottom:-25px; right:60px;}
	#download4 img{max-width:100px;}
	
	.bookleft{width:42%; z-index:2; position:absolute; left:50px; bottom:20px;}
	.bookright{width:42%; z-index:2;position:absolute; right:10px; bottom:20px;}

	#bt-toweb{position:absolute; bottom:37px; left:450px;}
	#bt-toweb img{ height:25px; width:auto;}
}

@media only screen and (max-width: 600px) {
	body,html{min-height:1150px;}
	body{ 
		background:url(../img/bg-mobile.jpg); 
		background-size:cover; 
		background-position: bottom;
		background-repeat: no-repeat;
	}
	
	#logo{right:2%;top:1%; text-align:right;}
	#logo .img{width:75%;}

	#book6{ top:78%; left:20%; text-align:left; right:inherit; width:250px; height:125px;} /** No. 3,4 year66*/
	#book6 .img{width:265px;}

	#book5{ top:65%; left:20%; text-align:left; right:inherit; width:250px; height:125px;} /** No. 1,2 year66*/
	#book5 .img{width:265px;}

	#book4{ top:7%; left:20%; text-align:left; right:inherit; width:250px; height:125px;} /** No.1,2 year64 right*/
	#book4 .img{width:265px;}

	#book1{ top:21%; left:20%; text-align:left; right:inherit; width:250px; height:125px;} /** No.3,4 year64 right*/
	#book1 .img{width:265px;}

	#book2{ top:36%; left:20%; text-align:right; width:250px; height:125px;} /** No.1,2 year65 right*/
	#book2 .img{width:265px;}
	#book2 .bookleft{left:9px;}
	#book2 .bookright{right:29px;}

	#book3{ top:50%; left:20%; text-align:right; width:250px; height:125px;} /** No.3,4 year65 right*/
	#book3 .img{width:265px;}
	#book3 .bookleft{left:9px;}
	#book3 .bookright{right:29px;}
	
	#download1{left:12%; bottom:-25px;}
	#download1 img{max-width:90px;}
	#download1 span{font-size:12px !important; height:20px !important; width:80px !important;}
	
	#download2{right:8%; bottom:-25px;}
	#download2 img{max-width:90px;}
	#download2 span{font-size:12px !important; height:20px !important; width:80px !important;}

	#download3{left:12%; bottom:-25px;}
	#download3 img{max-width:90px;}
	#download3 span{font-size:12px !important; height:20px !important; width:80px !important;}
	
	#download4{right:8%; bottom:-25px;}
	#download4 img{max-width:90px;}
	#download4 span{font-size:12px !important; height:20px !important; width:80px !important;}
	
	.bookleft{left:38px; bottom:15px;}
	.bookright{bottom:15px; right:-2px;}
	.bookleft img{width:75px;}
	.bookright img{width:75px;}

	#bt-toweb{position:absolute; bottom:5%; left:40%;}
	#bt-toweb img{ height:25px; width:auto;}
}