
@media only screen and (min-width:721px){

*{
	box-sizing : border-box ;

	margin : 0 ;
}

body{
	background-color : white ;
}

#level1{
width : 30% ;
float : left ;
clear : left ;
display:inline-block ;
max-height : 720px ;
overflow :auto ;	
}
.evHead{
	font-style:italic;
	font-weight : bold;
	color : gold; 
	text-align : center;
	text-decoration : underline; 
	margin-top : 1.5%; 
	display : block;
	margin-bottom : 1%;
	font-size :3vw;
}

.lev1A{
padding :4%;
background-color : black ;
line-height : 200% ;
text-align :justify ;
font-weight : bolder ;
color : white ;	
}

#level2{
width : 40% ;
float : left ;
display:inline-block ;
max-height : 720px ;
overflow :auto ;	
/*	background-color : rgba(180 , 200, 210, 0.3);		*/	
 	background-color : white;		
}
ul{
	list-style-type : square ;
}
.level2A, .level2B, .level2C, .level2D{
	font-weight : normal ;
	color : red ;
}
.level2A{
	text-align : center ;
	font-size : 2.5vw ;
	text-decoration : underline ;
	padding-top :2%;
}
.level2B{
	text-align : left ;
	font-size : 1.3vw ;
	margin-left : -5%;
	padding-left : 0;
}
.level2C{
	text-align : left ;
	font-size : 1.2vw ;
}
.level2D{
	text-align : center ;
	font-size : 1.4vw ;
	margin-top : 2%;
	text-decoration : underline ;
}
.level2E1{
	color : deeppink ;
}
.level2E2{
	color : purple ;
}
.level2E3{
	color : blue ;
}
.level2E4{
	color : rgba(90 , 80, 120, 0.75) ;
}
.level2E5{
	color : maroon ;
}
.level2E6{
	color : indigo ;
}
.level2F{
	color : blue ;
	text-align : justify ;
		padding : 10px ;
	border-bottom : 2px solid blue ;
}
.level2H{
	text-align : center ;
	text-decoration : underline ;
	font-weight : bold ;
}
.level2I{
	font-size : 40% ;
	font-weight : bold ;

}
.tiko{
	color : rgba(10, 10, 30, 1) ;
	font-weight : bold ;
}
#rodo{
	width : 100% ;
	border : 2px groove red ;
	height : 350px ;
	overflow : scroll ;
	display : inline-block ;	
}
#rodo img{
	height : 350px;
	width : 100%;
	float : left ;
	display : inline-block ;
}
#rodo audio{
	height : 350px;
	width : 100%;
	float : left ;
	background-image : url("earth.jpg");
	background-repeat : no-repeat ;
	background-size : cover ;
	display : inline ;
}


#rodo video{
	height : 350px;
	width : 100%;
	float : left ;
	display : inline ;
}
	.turnOn{
		border : 2px solid red ;
		background-color : yellow;
	}
	.forwia{
		display : none ;
	}
	#formA legend{
		color : crimson ;
		font-weight : bold ;
	}
	.bova1{
		color : darkmagenta ;
		font-size : 70%;
	}
	.bova2, .bova3, .bova4{
		width : 100%;
		display : block ;
		margin-top : 5%;
		line-height : 200%;
	}
	.bova2 label{
		width : 40% ;
		margin-left : 6% ;
		color : darkred;
		font-weight : bold ;
		float : left ;
		clear : left ;
	}
	.bova3 label{
		width : 70% ;
		margin-left : 6% ;
		color : darkred;
		font-weight : bold ;
		float : left ;
		clear : left ;
	}
	.bova3 input{
		float : left ;
		width : 15% ;
		margin-left : 6% ;
	}
	.bova2 select{
		width : 40%;
		margin-left : 1%;
		margin-right : 10%;
		float : left ;
		clear : right ;
	}
	.bova2 textarea{
		width : 50% ;
		float :left ;
	}
	.bova2 button{
		margin-left : 25% ;
		color : darkred ;
		font-weight : bold ;
	}
	.bova2 input{
		width : 50% ;
	}
	.bova4 input{
		margin-left : 30%;
		width : 40%;
		font-weight : bold ;
		color : darkorange ;
		margin-right : 30%;
	}
#level3{
width : 30% ;
float : left ;
display:inline-block ;
max-height : 720px ;
overflow :auto ;
color : blue ;	
}
	.nius{
	text-align : center ;
	}
	#newsTv{
	width : 100% ;
	height : 1900px; 
	overflow : auto ;
	border : 2px solid grey ;
	text-align : center ;
}
	.newsTvA{
		border-bottom : 2px solid grey;
		height : 370px ;
		overflow : auto ;
	}
	.newsTvAI{
		font-weight : bold ;
		font-size : 90%;
		display : block ;
		text-align : center ;
	}
	#newsTvB{
		height : 250px ;
		overflow : auto ;
	}
	.newsTvC{
		font-size: 90% ;
		text-align : justify ;
	}
	.newsTvD{
		margin-top : 0 ;
		display : block ;
		float : right ;
		font-size : 80% ;
	}
	.newsTvE{
		width : 100%;
		margin-left : 0;
		margin-right : 0;
		height : 230px ;
	}
	#moreNews{
		text-decoration : none ;
		font-style : italic ;
		font-weight : bold ;
	}
	/*	code for fulltalk script	*/
	.fulltalk{
		width : 50%;
		font-size : 120%;
		padding : 4% 0 5% 0 ;
		margin-left : auto ;
		margin-right : auto ;
	}
	
	#newsTag:visited{
	color : blue ;
}
#newsTag:hover{
	font-weight : bold ;
	color : brown ;
}
#newsTag{
	text-decoration : none ;
}

}

@media only screen and (min-width : 401px) and (max-width : 720.9px){
	*{
		box-sizing : border-box ;
	}
		
	body{
	background-color : white ;
	}
	.lonto{
		border : 2px solid gold ;
		background-color : brown ;
		margin-right : 7%;
		padding : 1px;
		color : pink ;
		margin-left : 7%;
	}
	
#level1{
width : 100% ;
float : left ;
clear : left ;
display:none ;
max-height : 720px ;
overflow :auto ;	
}
.lev1A{
padding :4%;
background-color : black ;
line-height : 200% ;
text-align :justify ;
font-weight : bolder ;
color : white ;	
}

#level2{
width : 100% ;
float : left ;
display: block ;
max-height : 720px ;
overflow :auto ;	
/*	background-color : rgba(180 , 200, 210, 0.3);	*/
 	background-color : rgba(255 , 255, 255, 1);		
}


ul{
	list-style-type : square ;
}
.level2A, .level2B, .level2C, .level2D{
	font-weight : normal ;
	color : red ;
}
.level2A{
	text-align : center ;
	font-size : 4vw ;
	text-decoration : underline ;
	padding-top :2%;
}
.level2B{
	text-align : left ;
	font-size : 3vw ;
	margin-left : -5%;
	padding-left : 0;
}
.level2C{
	text-align : left ;
	font-size : 3vw ;
}
.level2D{
	text-align : center ;
	font-size : 3vw ;
	margin-top : 2%;
	text-decoration : underline ;
}
.level2E1{
	color : deeppink ;
}
.level2E2{
	color : purple ;
}
.level2E3{
	color : orange ;
}
.level2E4{
	color : green ;
}
.level2E5{
	color : maroon ;
}
.level2E6{
	color : indigo ;
}
.level2F{
	color : blue ;
	text-align : justify ;
	padding : 10px ;
	border-bottom : 2px solid blue ; 
}

.level2H{
	text-align : center ;
	text-decoration : underline ;
	font-weight : bold ;
}
.level2I{
	font-size : 40% ;
	font-weight : bold ;

}

.tiko{
	color : rgba(10, 10, 30, 1) ;
	font-weight : bold ;
}
#rodo{
	width : 100% ;
	border : 2px groove red ;
	height : 350px ;
	overflow : scroll ;
	display : inline-block ;	
}
#rodo img{
	height : 350px;
	width : 100%;
	float : left ;
	display : inline-block ;
}
#rodo audio{
	height : 350px;
	width : 100%;
	float : left ;
	background-image : url("earth.jpg");
	background-repeat : no-repeat ;
	background-size : cover ;
	display : inline ;
}


#rodo video{
	height : 350px;
	width : 100%;
	float : left ;
	display : inline ;
}
	.turnOn{
		border : 2px solid red ;
		background-color : yellow;
	}
	.forwia{
		display : none ;
	}
	#formA legend{
		color : crimson ;
		font-weight : bold ;
	}
	.bova1{
		color : darkmagenta ;
		font-size : 70%;
	}
	.bova2, .bova3, .bova4{
		width : 100%;
		display : block ;
		margin-top : 5%;
		line-height : 200%;
	}
	.bova2 label{
		width : 40% ;
		margin-left : 6% ;
		color : darkred;
		font-weight : bold ;
		float : left ;
		clear : left ;
	}
	.bova3 label{
		width : 70% ;
		margin-left : 6% ;
		color : darkred;
		font-weight : bold ;
		float : left ;
		clear : left ;
	}
	.bova3 input{
		float : left ;
		width : 15% ;
		margin-left : 6% ;
	}
	.bova2 select{
		width : 40%;
		margin-left : 1%;
		margin-right : 10%;
		float : left ;
		clear : right ;
	}
	.bova2 textarea{
		width : 50% ;
		float :left ;
	}
	.bova2 button{
		margin-left : 25% ;
		color : darkred ;
		font-weight : bold ;
	}
	.bova2 input{
		width : 50% ;
	}
	.bova4 input{
		margin-left : 30%;
		width : 40%;
		font-weight : bold ;
		color : darkorange ;
		margin-right : 30%;
	}

#level3{
width : 100% ;
float : left ;
display: none ;
max-height : 720px ;
overflow :auto ;
color : blue ;	
}

.nius{
	text-align : center ;
	}
	#newsTv{
	width : 100% ;
	height : 2250px; 
	overflow : auto ;
	border : 2px solid grey ;
	text-align : center ;
}
	.newsTvA{
		border-bottom : 2px solid grey;
		height : 450px ;
		overflow : auto ;
	}
	.newsTvAI{
		font-weight : bold ;
		font-size : 3.5vw;
		display : block ;
		text-align : center ;
	}
	#newsTvB{
		height : 260px ;
		overflow : auto ;
	}
	.newsTvC{
		
	}
	.newsTvD{
		display : block ;
		float : right ;
	}
	.newsTvE{
		width : 96%;
		margin-left : 2%;
		margin-right : 2%;
		height : 240px ;
	}
	#moreNews{
		text-decoration : none ;
		font-style : italic ;
		font-weight : bold ;
	}
	/*	code for fulltalk script	*/
	.fulltalk{
		width : 50%;
		font-size : 120%;
		padding : 4% 0 5% 0 ;
		margin-left : auto ;
		margin-right : auto ;
	}
	
	#newsTag:visited{
	color : blue ;
}
#newsTag:hover{
	font-weight : bold ;
	color : brown ;
}
#newsTag{
	text-decoration : none ;
}

}
@media only screen and (min-width : 10px) and (max-width : 400.9px){
	*{
		box-sizing : border-box ;
	}
		
	body{
	background-color : white ;
	}
	.lonto{
		border : 2px solid gold ;
		background-color : brown ;
		margin-right : 1%;
		padding : 1px;
		color : pink ;
		margin-left : 3%;
		font-size : 90% ;
	}
	
#level1{
width : 100% ;
float : left ;
clear : left ;
display:none ;
max-height : 720px ;
overflow :auto ;	
}
.lev1A{
padding :4%;
background-color : black ;
line-height : 200% ;
text-align :justify ;
font-weight : bolder ;
color : white ;	
}

#level2{
width : 100% ;
float : left ;
display: block ;
max-height : 720px ;
overflow :auto ;	
/*	background-color : rgba(180 , 200, 210, 0.3);	*/
 	background-color : rgba(255 , 255, 255, 1);		
}


ul{
	list-style-type : square ;
}
.level2A, .level2B, .level2C, .level2D{
	font-weight : normal ;
	color : red ;
}
.level2A{
	text-align : center ;
	font-size : 4vw ;
	text-decoration : underline ;
	padding-top :2%;
}
.level2B{
	text-align : left ;
	font-size : 3vw ;
	margin-left : -5%;
	padding-left : 0;
}
.level2C{
	text-align : left ;
	font-size : 3vw ;
}
.level2D{
	text-align : center ;
	font-size : 3vw ;
	margin-top : 2%;
	text-decoration : underline ;
}
.level2E1{
	color : deeppink ;
}
.level2E2{
	color : purple ;
}
.level2E3{
	color : orange ;
}
.level2E4{
	color : green ;
}
.level2E5{
	color : maroon ;
}
.level2E6{
	color : indigo ;
}
.level2F{
	color : blue ;
	text-align : justify ;
		padding : 10px ;
	border-bottom : 2px solid blue ;
}

.level2H{
	text-align : center ;
	text-decoration : underline ;
	font-weight : bold ;
}
.level2I{
	font-size : 40% ;
	font-weight : bold ;

}

.tiko{
	color : rgba(10, 10, 30, 1) ;
	font-weight : bold ;
}
#rodo{
	width : 100% ;
	border : 2px groove red ;
	height : 350px ;
	overflow : scroll ;
	display : inline-block ;	
}
#rodo img{
	height : 350px;
	width : 100%;
	float : left ;
	display : inline-block ;
}
#rodo audio{
	height : 350px;
	width : 100%;
	float : left ;
	background-image : url("earth.jpg");
	background-repeat : no-repeat ;
	background-size : cover ;
	display : inline ;
}


#rodo video{
	height : 350px;
	width : 100%;
	float : left ;
	display : inline ;
}
	.turnOn{
		border : 2px solid red ;
		background-color : yellow;
	}
	.forwia{
		display : none ;
	}
	#formA legend{
		color : crimson ;
		font-weight : bold ;
	}
	.bova1{
		color : darkmagenta ;
		font-size : 70%;
	}
	.bova2, .bova3, .bova4{
		width : 100%;
		display : block ;
		margin-top : 5%;
		line-height : 200%;
	}
	.bova2 label{
		width : 40% ;
		margin-left : 6% ;
		color : darkred;
		font-weight : bold ;
		float : left ;
		clear : left ;
	}
	.bova3 label{
		width : 70% ;
		margin-left : 6% ;
		color : darkred;
		font-weight : bold ;
		float : left ;
		clear : left ;
	}
	.bova3 input{
		float : left ;
		width : 15% ;
		margin-left : 6% ;
	}
	.bova2 select{
		width : 40%;
		margin-left : 1%;
		margin-right : 10%;
		float : left ;
		clear : right ;
	}
	.bova2 textarea{
		width : 50% ;
		float :left ;
	}
	.bova2 button{
		margin-left : 25% ;
		color : darkred ;
		font-weight : bold ;
	}
	.bova2 input{
		width : 50% ;
	}
	.bova4 input{
		margin-left : 30%;
		width : 40%;
		font-weight : bold ;
		color : darkorange ;
		margin-right : 30%;
	}

#level3{
width : 100% ;
float : left ;
display: none ;
max-height : 720px ;
overflow :auto ;
color : blue ;	
}

.nius{
	text-align : center ;
	}
	#newsTv{
	width : 100% ;
	height : 2250px; 
	overflow : auto ;
	border : 2px solid grey ;
	text-align : center ;
}
	.newsTvA{
		border-bottom : 2px solid grey;
		height : 450px ;
		overflow : auto ;
	}
	.newsTvAI{
		font-weight : bold ;
		font-size : 4.5vw;
		display : block ;
		text-align : center ;
	}
	#newsTvB{
		height : 250px ;
		overflow : auto ;
	}
	.newsTvC{
		
	}
	.newsTvD{
		display : block ;
		float : right ;
	}
	.newsTvE{
		width : 98%;
		margin-left : 1%;
		margin-right : 1%;
		height : 220px ;
	}
	#moreNews{
		text-decoration : none ;
		font-style : italic ;
		font-weight : bold ;
	}
	/*	code for fulltalk script	*/
	.fulltalk{
		width : 50%;
		font-size : 120%;
		padding : 4% 0 5% 0 ;
		margin-left : auto ;
		margin-right : auto ;
	}

#newsTag:visited{
	color : blue ;
}
#newsTag:hover{
	font-weight : bold ;
	color : brown ;
}
#newsTag{
	text-decoration : none ;
}

}