#section1 {	height: 1000px; padding:1px;border: 0px solid red;width: 660px;margin: 40px auto;}

.image-link {text-decoration: none;display: block;padding:0px;width: 310px;height: 310px;border: 0px solid green;margin: 10px;float: left;}
.image-link i {display: block;opacity: 0;transition: opacity 1s;	-webkit-transition: opacity 1s; /* For Safari 3.1 to 6.0 */
font-size: 64px;color: grey;    text-align: center;margin-top:122px;font-weight: bold;
text-shadow: -2px 0 white, 0 2px white, 2px 0 white, 0 -2px white;
}
.image-link:hover i {opacity: 1.0;transition: opacity 1s;	-webkit-transition: opacity 1s; /* For Safari 3.1 to 6.0 */  }
.image-link div {border:1px solid grey;border-radius:5px;width: 308px;height: 308px;background-size:cover;background-repeat: no-repeat;}

#section2 {	color: #212529;font-size: 18px;line-height:30px;}
#section2 .subleft {width: 644px; margin: 0 auto;border: 0px solid red}
#section2 .subleft  .title {font-size: 32px;line-height:32px;display: block;margin:  40px 0;}
#section2 .subleft  p {font-size: 18px;line-height:30px;display: block;margin-bottom: 16px;}
#section2  ul ,#section2 ul.ol {
	margin-left: 40px;
	list-style-image: inherit ;
	list-style-position: outside;
	list-style-type: disc; 
	display: block;margin-bottom: 16px;
}
#section2 .subleft  ul.ol {list-style-type: decimal;}
#section2 .subleft  b {display: block;margin-bottom: 16px;}

#section2 .subright  {width: 644px; margin: 0 auto;}
#section2 .image {width: 644px; margin: 30px auto;text-align: center;}
#section1 .img2 {margin: 0 auto}

@media screen and (max-width:359px){
	#section1 {	height: 1800px; padding:1px;border: 0px solid red;width: 300px;margin: 40px auto;}
	.image-link {width: 280px;height: 280px;}
	.image-link i {font-size: 50px;margin-top:110px;}
	.image-link div {border-radius:5px;width: 278px;height: 278px;}
	
	#section2 .subleft {width: 300px; margin: 0 auto;border: 0px solid red}
	#section2 .subright  {width: 300px; margin: 0 auto;}
	#section2 .image {width: 300px; margin: 30px 0}
	#section2 .image img {width: 280px;}
	
}
@media screen and (min-width:360px) and (max-width:479px){
	#section1 {	height: 1980px; padding:1px;border: 0px solid red;width: 330px;margin: 40px auto;}
	
	#section2 .subleft {width: 320px; margin: 0 auto;border: 0px solid red}
	#section2 .subright  {width: 320px; margin: 0 auto;}
	#section2 .image {width: 320px; margin: 30px 0}
	#section2 .image img {width: 300px;}
}
@media screen and (min-width:480px) and (max-width:639px){
	#section1 {	height: 660px; padding:1px;border: 0px solid red;width: 440px;margin: 40px auto;}
	.image-link {width: 200px;height: 200px;}
	.image-link i {font-size: 50px;margin-top:70px;}
	.image-link div {border-radius:5px;width: 198px;height: 198px;}
	
	#section2 .subleft {width: 420px; margin: 0 auto;border: 0px solid red}
	#section2 .subright  {width: 420px; margin: 0 auto;}
	#section2 .image {width: 420px; margin: 30px 0}
	#section2 .image img {width: 400px;}


}
@media screen and (min-width:640px) and (max-width:767px){
	#section1 {	height: 880px; padding:1px;border: 0px solid red;width: 560px;margin: 40px auto;}
	.image-link {width: 260px;height: 260px;}
	.image-link i {font-size: 50px;margin-top:100px;}
	.image-link div {border-radius:5px;width: 258px;height: 258px;}
	
	#section2 .subleft {width: 550px; margin: 0 auto;border: 0px solid red}
	#section2 .subright  {width: 550px; margin: 0 auto;}
	#section2 .image {width: 550px; margin: 30px}

}
@media screen and (min-width:768px) and (max-width:1023px){
	
}
@media screen and (min-width:1024px) and (max-width:1279px) {
	#section1 {	height: 670px; padding:1px;border: 0px solid red;width: 990px;margin: 40px auto;}
	
	#section2 {height: 900px;width:990px;}
	#section2 .title {margin-top: 0 !important} 
	#section2 .subleft {width: 600px; margin: 0 auto;border: 0px solid red;float:left;margin-left:10px}
	#section2 .subright  {width: 320px; margin: 0 auto;float:right}
	#section2 .image {width: auto; margin: 30px 0}
	#section2 .image img {width: 300px;}
	
	#section1 .img2 {width: 220px; margin:10px}
}
@media screen and (min-width:1280px) and (max-width:1365px){
	#section1 {	height: 670px; padding:1px;border: 0px solid red;width: 990px;margin: 40px auto;}
	
	#section2 {height: 900px;	width: 990px; margin: 0 auto;}
	#section2 .title {margin-top: 0 !important} 
	#section2 .subleft {width: 580px; margin: 0 auto;border: 0px solid red;float:left;margin-left:10px}
	#section2 .subright  {width: 316px; margin: 0 auto;float:right}
	#section2 .image {width: auto; margin: 30px 0}
	#section2 .image img {width: 300px;}
	
}
@media screen and (min-width:1366px) and (max-width:1919px){
	#section1 {	height: 670px; padding:1px;border: 0px solid red;width: 990px;margin: 40px auto;}
	
	#section2 {height: 900px;	width: 990px; margin: 0 auto;}
	#section2 .title {margin-top: 0 !important} 
	#section2 .subleft {width: 580px; margin: 0 auto;border: 0px solid red;float:left;margin-left:10px}
	#section2 .subright  {width: 316px; margin: 0 auto;float:right}
	#section2 .image {width: auto; margin: 30px 0}
	#section2 .image img {width: 300px;}
}
@media screen and (min-width:1920px){
	#section1 {	height: 670px; padding:1px;border: 0px solid red;width: 990px;margin: 40px auto;}
	
	#section2 {height: 900px;	width: 990px; margin: 0 auto;}
	#section2 .title {margin-top: 0 !important} 
	#section2 .subleft {width: 580px; margin: 0 auto;border: 0px solid red;float:left;margin-left:10px}
	#section2 .subright  {width: 316px; margin: 0 auto;float:right}
	#section2 .image {width: auto; margin: 30px 0}
	#section2 .image img {width: 300px;}
}