﻿#main-quick { 
    background:url(../Images/quickmenu_bg.png) no-repeat; 
    background-size:100% 100%; 
    background-position:center; 
    padding:20px 0; 
    padding-top:10px;
    position:relative;
    margin-top:0px;
}
#main-quick > div > div > div { text-align:center; height:80px; }
#main-quick > div > div > div:hover img { opacity:0.6; transition:0.2s all; }
#main-quick > div > div > div a { color:#fff; text-decoration:none; font-size:17px; }
#main-quick > div > div > div p { margin:-10px; }



#main-1 { margin-bottom:50px; }
#main-1 .p0 { padding:0 15px 0 10px; }
#main-1 .sermon { background:url(../Images/sermon2024.png) no-repeat; background-size:100% 100%; background-position:center;  position:relative; height:314px; padding:30px;}
#main-1 .sermon hr { margin:10px 4px 10px;  width:70px;}
#main-1 .sermon .sermon-cont h1 { font-size:22px; display:inline-block; text-align:left; float:left; color:#fff; margin:0; }
#main-1 .sermon .date { color:#fff; font-size:14px; float:right; }
#main-1 .sermon .date2 { color:#fff; font-size:14px; float:right; }
#main-1 .sermon a { text-decoration:none; }
#main-1 .sermon .title { font-size:24px; color:#fff; display:block; clear:both; margin-top:90px; width:235px; white-space: nowrap; text-overflow: ellipsis; overflow:hidden;}
#main-1 .sermon .bible { font-size:22px; color:#fff; margin-top:25px; margin-bottom:0; display:inline-block; width:180px; white-space: nowrap; text-overflow: ellipsis; overflow:hidden;}
#main-1 .sermon .pastor { font-size:22px; color:#fff; margin:0; display:inline-block; }
#main-1 .sermon .sermon-cont img { float:right; margin-top: 40px;}
.sermon-cont { width:240px; margin-top:30px; }

#main-1 .right-1 > div:hover { opacity:0.7; transition:0.2s all; }
#main-1 .box-1 { background:url(../Images/edu1.png) no-repeat; background-size:100% 100%; background-position:center;  position:relative; height:140px;  display:table; width:100%; }
#main-1 .box-2 { background:url(../Images/edu2.png) no-repeat; background-size:100% 100%; background-position:center;  position:relative; height:140px;  display:table; width:100%; }
#main-1 .box-3 { background:url(../Images/edu3.png) no-repeat; background-size:100% 100%; background-position:center;  position:relative; height:140px;  display:table; width:100%; }
#main-1 .box-4 { background:url(../Images/edu4.png) no-repeat; background-size:100% 100%; background-position:center;  position:relative; height:140px;  display:table; width:100%; }
#main-1 .box-1, #main-1 .box-2 {margin-bottom:33px; }
#main-1 .right-1 a { text-decoration:none; }
#main-1 h2 { color:#fff; display:table-cell; vertical-align:middle; width:100%; text-align:center; }
#main-1 .p2, #main-1 .p4 { padding-left:10px; padding-right:0; }
#main-1 .p1, #main-1 .p3 { padding-right:10px; padding-left:0; }
#main-1 .right { padding:0 10px 0 0; }

#gray-bg { background:#EEEEEE; padding:60px 0; }

#three { margin-bottom:50px; }
#three > div > div > div { padding:0 10px; }
#three > div > div > div > div h2 { color:#013365; margin:0;  font-size:22px; display:inline-block; font-weight:bold; }
#three > div > div > div > div h2 span { color:#6E7881; }
#three > div > div > div > div .more { float:right; font-size:35px; color:#636363; position:relative; top:-13px; font-weight:bold; }
#three > div > div > div > div ul {  margin-top:16px; }
#three .three-box > ul {
    text-decoration:underline #000000;
    list-style:square;
    padding-left:15px;
    padding-right:10px;
    }
#three .three-box > ul li {
    border-bottom:1px solid #B4B4B4;
    color:#B4B4B4;    
    padding:14px 0;
    


}
#three > div > div > div > div ul li span { float: right; font-size:18px; color:#333; }
#three > div > div > div > div ul p {
		text-overflow:ellipsis;
		width:185px;
    padding-left:10px;   
    float:left; 
    font-size:19px; 
    color:#333; 
    margin:0;  
    overflow: hidden; 
    white-space: nowrap; 
    word-wrap: normal !important; 
    display: block; 
    }
#three .three-box { background:#fff; padding:30px; height:270px; }


#two .left { background:url(../Images/board_bg1.png) no-repeat; background-size:100% 100%; background-position:center; position:relative; height:229px;  }
#two .right { background:url(../Images/board_bg2.png) no-repeat; background-size:100% 100%; background-position:center; position:relative; height:229px;  }
#two > div > div > div { padding:0 10px; }
#two > div > div > div > div { padding:40px 30px;}
#two > div > div > div > div h2 { color:#fff; margin:0;  font-size:20px; display:inline-block; }
#two > div > div > div > div .more { float:right; font-size:20px; color:#fff; }
#two > div > div > div > div ul { margin-top:30px; width:62%;}
#two .left ul { margin-top:30px; width:66%;}
#two > div > div > div > div li { overflow:hidden; padding:10px 0; }
#two > div > div > div > div li p { color:#fff; font-size:16px; float:left; margin:0; overflow: hidden; white-space: nowrap; word-wrap: normal!important; display: block; width:240px; }
#two .left li p { color:#fff; font-size:16px; float:left; margin:0; overflow: hidden; white-space: nowrap; word-wrap: normal!important; display: block; width:260px; }
#two > div > div > div > div li span { float:right; font-size:16px; color:#fff; }


.board-theme.gallery .theme-list > .each-document > a.title-image {background-color:white;}

@media (max-width:1499) {
    #gnb {  letter-spacing: -1.5px; }
}
@media (min-width:993px) and (max-width:1199px) {
	#three > div > div > div > div ul p { width:200px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
    #three > div > div > div > div ul span {display:none;}
    #two .left li p, #two > div > div > div > div li p { width:300px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;     }
    #two .left li span, #two > div > div > div > div li span {display:none;}
    #main-1 .sermon .date { float: left; margin-right:70px;} 
    #main-1 .sermon .title {padding-top:20px;}
    #main-1 .sermon .sermon-cont img { float: right; padding-right:35px; margin-top:-150px; }
    #main-1 .sermon-cont{margin-top:0; padding-right:10px;}
}

@media (min-width:768px) and (max-width:992px) {

    #three > div > div > div > div ul p { width:115px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
    #three > div > div > div > div ul span {display:none;}
    #two .left li p, #two > div > div > div > div li p { width:185px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;     }
    #two .left li span, #two > div > div > div > div li span {display:none;}
    
    #three > div > div > div > div h2 { font-size:20px; }
    #three > div > div > div > div .more { display:none;}

    #main-1 h2 { font-size:20px; }
    #main-1 .sermon{padding:20px;}
    #main-1 .sermon .date { float: left; margin-right:90px; font-size: 14px;} 
    #main-1 .sermon .date2 { float: left; margin-right:90px;  font-size: 14px;} 
    #main-1 .sermon .sermon-cont img {display:none;}
    #main-1 .sermon .title {     margin-top: 0; padding-top:30px;  }
    .sermon-cont {margin-top:0; margin-right:50px; }
}

@media (max-width:767px) {
		#two > div > div > div { padding:0 15px; }
		#two .left { margin-bottom:15px; }
		#three { margin-bottom:0; }
    
		#main-1 .right { padding:0 15px; }
		#main-1 { margin-bottom:15px; }
		#main-1 .box-1, #main-1 .box-2 { margin-bottom:15px; }
		#main-1 .sermon { margin-bottom:15px; }
		#main-1 .p0 { padding:0 15px; }
		#three > div > div > div { padding:0 15px; }
        #main-quick > div > div > div { height:100px;}
        #two > div > div > div > div h2 { font-size:17px;}
        #two > div > div > div > div .more { font-size:17px; }
        #two > div > div > div > div ul { width:100%; }
        #two > div > div > div > div li span { font-size:16px; }
        #two > div > div > div > div li p { font-size:16px; }
        #three > div > div > div { margin:0 0 15px; }
        #three > div > div > div > div h2 { font-size:17px;}
        #three > div > div > div > div .more { font-size:30px; }
        #three > div > div > div > div ul p { font-size:16px; }
        #three > div > div > div > div ul li span { font-size:16px; }
        #main-1 h2 {font-size:20px;}
        #main-1 .sermon .sermon-cont h1 {font-size:20px;}
        #main-1 .sermon .date { position: absolute; margin-top: 0px; font-size: 16px;}        
        #main-1 .sermon .date2 { position: absolute; margin-top: 50px; font-size: 16px;}       
        #main-1 .sermon .title {font-size:18px;}
        #main-1 .sermon .bible {font-size:18px; line-height:30px;}
        #main-1 .sermon .sermon-cont img { display:none;}
        
        .widget-login span{display:none;}
        .row > .mobile-top {float:right; right:0px; position:absolute;}

        #three > div > div > div > div ul p { width:145px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
        
        #two .left li p, #two > div > div > div > div li p { width:185px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;     }
        #two .left li span, #two > div > div > div > div li span {display:none;}
        #main-quick > row img { vertical-align:super;}
       .slider .slider-dots {display:none;}
        
}