﻿.slider .slider-wrapper .slide img { width:100%; }



#main-bg {
	 background:url(../Images/bg.jpg) ;
	 background-size: 100% 100%;			
	 padding-top:70px;
	 margin-top:-70px;
	}

#main-1 { margin:50px 0 20px; }
#main-1 .sermon { background:url(../Images/sermon.png) no-repeat; background-position:center; background-size:100% 100%; height:266px; width:645px; display:inline-block; float:left; margin-right:15px; position:relative; }
#main-1 .sermon .sermon-cont { position:absolute; right:12%; top:15px; white-space:normal;}
#main-1 .sermon .sermon-cont a { text-decoration:none; }	
#main-1 .sermon .sermon-cont h2 { font-size: 21px; color:#000; margin:28px 0; width:220px; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; word-wrap: normal !important; display: block; white-space:nowrap;}  
#main-1 .sermon .sermon-cont p {font-size:15px;}
#main-1 .sermon .sermon-title-top { margin:0; font-size:32px;}
#main-1 .sermon .sermon-title-bottom {color:#A9A9A9; font-size:17px; font-weight:550;}
#main-1 .welcome { display:inline-block; float:left; }

#main-2 { margin-bottom:20px; }
#main-2 .info { float:left; display:inline-block; margin-right:19px; position:relative; }

#main-2 .info-box { position:absolute; bottom:40px; width:100%; text-align:center;  }
#main-2 .info-box ul { display:inline-block; overflow:hidden; }
#main-2 .info-box li { float:left; }

#main-2 .edu { display:inline-block; float:left; width: 550px;}


#main-2 .edu .bottom {margin-top : 20px;}
#main-2 .map { display:inline-block; float:left; margin-left:19px;  }



#main-3 .left { width:53%; display:inline-block; float:left; }
#main-3 .left li { display:inline-block; padding-right:8px; margin-bottom:8px; width: 143px;}
#main-3 .left img { width:135px; height:135px; }
#main-3 .left img:hover { opacity:0.7; transition:0.3s all; }
#main-3 .right { width:45.8%; display:inline-block; float:left; background:#F2F2F2; padding:20px 30px; }
#main-3 .right h2 { color:#545454; margin:0 0 23px; font-size:19px; font-weight:bold; display:inline-block;}
#main-3 .right .plus { float:right; margin:0; font-size:30px; font-weight:bold; color:#545454; text-decoration:none; position:relative; top:-10px;} 
#main-3 .right li { font-size:16px; overflow:hidden; color:#8B8B8B; padding:8px 15px; margin:0; border-top:1px solid #8B8B8B; }
#main-3 .right li:hover { background:#a5e0f9; transition:0.2s all; color:#fff; }
#main-3 .right li p { margin:0; float:left; }
#main-2 .edu img:hover { opacity:0.7; transition:0.2s all; }
#main-1 .welcome img:hover { opacity:0.7; transition:0.2s all; }
#main-2 .map img:hover { opacity:0.7; transition:0.2s all; }
#main-3 .right li span { float:right; }
#main-3 .container .row {margin-top:7px; margin-bottom:15px;}
#album-title {font-size:32px; font-weight:600px;}
#main-3 .photo gallery {display:grid;}




/* news */
#main-news-box { width: 480px;   height: 302px;    background-color: #f3f3f3;    float: left;
    padding: 30px;
    line-height: 2.42857143;
    grid-column : 2/2;
    grid-row : 1;
    line-height:2.4;
    padding-top:0px;
   
}

#main-news-box .news-list{
	line-height: 2.4;
	font-size:17px;	
		
}
ul.news-list span{
	float:right;
	padding-right:10px;
	}

ul.news-list li {
		border-bottom: 1px solid #cecece;
		clear:both;
		
		}

#main-news-box a { 
	text-decoration:none; 
	padding-left:10px;
	color : black;
	}

#news-title {
    font-size: 25px;
    font-weight: 600;
    color: #535353;
    border-bottom:1px solid #cecece; 
    margin:0;
    margin-top:10px;
}

#main-news-box .title, .regdate {
    color: #525252;
    font-size:18px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 275px;
    float: left;
}

#main-news-box .regdate {
    width:105px;
}

#main-news-box > div > div > div > div > table > tbody > tr {border-bottom:1px solid #cecece;}
#main-news-box > div > div > div > div > table > tbody > tr > td { padding:8px; font-size:18px;}
#main-news-box > div > div > div > div > table > tbody > tr > td:nth-child(2n) { text-align:right; }


#news-button {
    font-size: 40px;
    float: right;
    font-weight: 600;
    height:20px;
    color: #969696;
    margin-top: -22px;
    margin-right:5px;
}
/* album */
#main-album-box {
	
	grid-row : 1;
    float: left;
    width: 620px;
    height: 286px;
    margin-bottom:40px;
    margin-right:20px;
  
}

#main-album-box .document {
    float: left;
    max-width: 100%;
    max-height: 100%;
    margin-right: 10px;
    margin-bottom:10px;
   
}
#main-album-box .document img {
	max-width : none;
	width:145px;
	height:145px;
}
#main-1 .sermon .sermon-go a { float:right; font-size:30px; font-weight:bold; color:aliceblue; background-color:#1E90FF; width:5%; }




@media (min-width:1200px){
	.container {width:1120px;}
	#footer {margin-top:0px;}
	}

@media (min-width:993px) and (max-width:1199px){
	#main-1 .sermon { width:56%; margin-right:15px;}
	#main-1 .sermon .sermon-cont {right:-10%; top:12px; width:55%;}
	#main-1 .sermon .sermon-go a { width:6%!important; }
	#main-1 .row { position:relative;  }
	#main-1 .row .welcome {position:absolute; width:410px; }
	#main-1 .row .welcome img {height:267px;}
    


	#main-2 .info {margin-right:0px;}
	#main-2 .info > img { height: 330px}
  #main-2 .map { margin-left:0px;}
	#main-2 .map img { height:330px;}
	#main-2 .edu {margin-left:12px; margin-right:10px;width:50%;}
  #main-2 .edu .top { height:150px;}
  #main-2 .edu .bottom {height:175px; margin-top:5px; width:485px;}
   


	#main-album-box .document img {width:120px; height:120px; }
	#main-album-box .document {margin-right:5px; margin-bottom:5px;}
	#main-album-box {width:500px; margin-right:0;}
	#main-news-box { width:440px; height:245px; margin-left:25px;}
	#news-title {font-size:20px; margin-top:0;} 
	#main-news-box .news-list {font-size:14px;}
	#footer {margin-top:0px;}

}

@media (min-width:768px) and (max-width:992px){
    #main-1 .sermon { width:536px; }
  	#main-1 {margin-bottom:0px;}
    #main-1 .welcome { width:40%; margin-bottom:20px;     height: 195px;}
    #main-1 .sermon .sermon-cont h2 { width:190px; }
      
    .welcome img { height:100%; }
    .info { width:23%; }
    .info-box img { max-width:35px; }
    
    
    #main-2 .edu {width:50%; margin-left:0; margin-right:0;}
    #main-2 .map {    width: 22.7%; margin-left:16px; }
    #main-2 .map img { height:245px;}
    #main-2 .top { margin-bottom:5px; }
    #main-2 .info { margin-right:16px; }
	  #main-2 .info > img {height:245px;}
    #main-2 .edu .bottom {height:132px; margin-top:0px; width:375px;}
    #main-2 .info-box {bottom:15px;}
		
				
	  #main-1 .sermon { height:195px; width:58%; margin-bottom:20px; margin-right: 15px;}
	  #main-1 .sermon .sermon-cont {right:-2%; top:20px; width:50%;}
    #main-1 .sermon .sermon-cont MARQUEE { width:80%; }
	  #main-1 .sermon .sermon-cont p {font-size:13px;}
	  #main-1 .sermon .sermon-cont h2 { font-size:18px; white-space:pre; margin-top:20px; margin-bottom:10px; }
	  #main-1 .sermon .sermon-title-top { margin:0; font-size:22px;}
    #main-1 .sermon .sermon-title-bottom {color:#A9A9A9; font-size:12px; font-weight:550;}
    #main-1 .sermon .sermon-go a {font-size:20px;}
   
    #main-news-box > div > div > div > div > table > tbody > tr {border-bottom:1px solid #cecece;}
    #main-news-box > div > div > div > div > table > tbody > tr > td { padding:4px; font-size:14px;}
    #main-news-box > div > div > div > div > table > tbody > tr > td:nth-child(2n) { text-align:right; }
    #main-news-box .title, .regdate{font-size:14px; width:165px;}
    
    
    #main-3 .container .row {margin-top:0px;}
    #main-3 .left { text-align:center; }
    
    #main-3 .left li { width:125px; margin-bottom:15px; }
    #main-3 .right { width:47%; padding: 16px 30px;}
    #main-3 .right li { font-size:14px; }
    #main-3 .right h2 { margin-bottom:15px; padding: 7px 5px;}
    #main-3 .right .plus { font-size:24px; }
    
    
    
    
    
    #main-album-box .document img { width:100px; height:100px;}
    #main-album-box .document {margin-right:5px; margin-bottom:5px;}
    #main-album-box { width:420px; margin-right:0;}
    #main-news-box { padding:15px; width:315px; height:207px; margin-left:15px;}
    #main-news-box .news-list {font-size:12px;}
    #news-title {font-size:18px; margin-top:-5px;}
    #main-news-box .news-list li {line-height:2.4;}
    #news-button {font-size:35px;}
    #dimodePage {margin-bottom:-70px;}
    
#footer {margin-top:0px;}

}

@media (max-width:767px) {
	
    #main-1 { padding:0 15px; margin:20px 0 0;  }
    #main-1 .welcome { grid-row:2; width:100%; margin-bottom:10px; }
    #main-1 .welcome img { width:100%; max-width:none; height:auto;}
    
    #main-1 .sermon { grid-row: 1; height:164px; width:100%;  margin-bottom:5px; }
    #main-1 .sermon .sermon-cont h2 {font-size:15px; margin:0; margin-top:10px; margin-bottom:10px; white-space:pre; width:150px;}    
    #main-1 .sermon .sermon-cont { padding-top:10px; left:52%; top:2px; }
    #main-1 .sermon .sermon-title-top {font-size:1.5em;}
    #main-1 .sermon .sermon-title-bottom {font-size:15px; color:#A9A9A9; font-weight:550;}
    #main-1 .sermon .sermon-cont p { font-size:0.9em; letter-spacing: 0.5px; margin-top:0px; width: 150px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
    #main-1 .sermon .sermon-go a {font-size: 1em; width: 1em; }
    #main-1 .sermon .sermon-title {padding-left:5px; }
   
    
    #main-1 .row {display:grid; grid-templet-row: 1fr;grid-templet-row:1fr 1fr;}
    
    
    
    #main-2 { text-align:center; padding:0 15px; }
    #main-2 .row { display:grid; grid-template-columns:1fr 1fr; grid-gap:10px; }
    #main-2 .info { grid-column:1; grid-row:1; width:100%; float:none; margin-right:0;  }
    #main-2 .info-box {bottom:20px; width:100%;}
    #main-2 .info > img { width:100%; height:auto;}
    #main-2 .info-box > ul > li { width: 25%; }    
    #main-2 .map { grid-column:2; grid-row:1; float:none; width:100%; margin-left:0; }
    #main-2 .map img {height : auto; width:100%;}
    #main-2 .edu { grid-column:1/3; margin:0;  width:100%; }
    #main-2 .edu .bottom { height : auto; margin-top:3px; width:100%;}
    #main-2 .edu .top {height: auto; width:100%;}
       
    
    
    #main-3 .left { width:100%; padding:0 15px;  }  
    #main-3 .left li { width:49%; padding:0 15px; }
    #main-3 .right { width:100%; }
    #main-news-box { grid-column:1; grid-row:2; margin-bottom:20px; }

    #main-3 .photo-gallery { grid-column:1; grid-row:1; margin: 0 auto; text-align:center;}

    
    
    #main-album-box { width:100%; height:auto; margin-bottom:10px; margin-right:0px;}
    #main-album-box .document { margin-right:2%; margin-bottom:10px; float:unset;}
    #main-album-box .document img { width:145px; height:145px; }
 
    #main-album-box .document:nth-child(2) { margin-right:0px; }
    #main-album-box .document:nth-child(4) { margin-right:0px; }
    #main-album-box .document:nth-child(6) { margin-right:0px; }
    
    
    #main-album-box .document:nth-child(n+7) { display: none; }
    #main-news-box { margin-top:0px; width:100%; height:270px; padding:15px;}
	  #footer p { line-height:15px;}
    #news-title { font-size: 20px; }
    #main-news-box .news-list { font-size: 14px; }
    #main-3 .container .row { display:grid; grid-template-rows: 1fr auto; grid-template-columns:1fr; margin:0;}
    .widget-login { padding-top:0; }
    #main-news-box > div > div > div > div > table > tbody > tr > td { padding:8px; font-size:14px; }
    #main-news-box .title, .regdate{width:180px; font-size:15px;}
     
    
		#footer {margin-top:0px;}



}

