@font-face {
    font-family: 'SCDream';
    src: url('webfont/SCDream/SCDream4.otf') format('opentype');
     
}

p{font-family: 'SCDream';}

.body-content {
    background: url("/UserData/moohak/Layouts/moohak_layout/Images/Intro/main_bg.jpg") no-repeat #9dd5f4 center center;
    background-repeat: no-repeat;
    /*background-position:center;*/
    background-size: cover;
    width: 100%;
}
.container {     padding:5% 10%;     max-width: 700px;}
.top-wrap.text-center {
    margin: 10% 0 0;
	width:100%;
    display:inline-block;
}
.top-wrap.text-center >img:nth-of-type(1) {
    padding-right: 10%;
    max-width: 60%;
}
.top-wrap.text-center >a>img  { 
    max-width: 30%;
    padding-top: 9%;
}

.row {    margin: 4% 0% 3%; } 
.row1{    padding:0;}
.row1 > div {
    text-align: center;
    padding: 25% 6% 123%;
    margin-top: 3px;
    transform: translateX(-3px);
}
.row1>div >a>img{
    width:66%;
}
td {
    padding: 2.5vw 1.3vw;
    /*height:160px;*/
}
table{
    border:none;
    width:100%;
}
.row2{
    padding:8% 0px;

}
.row2.col-md-3 {
    padding-right: 0px;
}
.row2.col-md-6 {
    padding-left: 0px;
}
    .row2 > table > tbody > tr > td > div {
        height: 100%;
        text-align: center;
        padding: 20% 0;
        box-shadow: 3px 3px 5px grey;
    }

.row2 >table> tbody >tr:nth-of-type(1) >td >div{
   padding: 5% ;
    
}

#c4{
    display:block;
    width:100%;
     
}
 



.bottom-wrap{
    margin:6%;
}
.bottom-wrap > h4 {
    /*font-weight: bold;*/
    color: black;
    font-size:20px;
}
.bottom-wrap > h4 > a {
    text-decoration:none;
    color:black;
}




/*new*/

a, a:focus,   a:hover,  a:active{text-decoration:none;}
.imainTop, .imainBottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.imainTop-left>div{box-shadow: 3px 3px 5px grey;     height: calc(46vw + 10px);     max-height: 300px;}
.imainTop-right  >div >div{
	height: 100%;
	text-align: center;
	padding: 23% 0;
	box-shadow: 3px 3px 5px grey;
	height: 23vw;
	max-height: 145px;
}
.imainTop-right {
    display: flex;
    flex-direction: column;  
    justify-content: space-between;
    height: calc(46vw + 10px);
	max-height: 300px;
}
.imainTop-right p{ color: white;    font-weight: 700;    font-size: calc(13px + 0.5vw);     margin: 0;}


.imainBottom > div , .imainTop > div{width: calc(50% - 10px);    margin: 5px;}
.imainBottom > div > div   {
	height: 100%;
	text-align: center;
	padding: 20% 0;
	box-shadow: 3px 3px 5px grey;
}
.imainTop-left img {padding:7px;}
.imainTop-left p {
	padding: 10px 7px 15px;
    text-align: center;
    color: black;
    font-weight: bold;
    font-size: calc(14px + 0.5vw);
	text-decoration: none;
}

.imainBottom p{color: white;  font-weight: 700;    font-size: calc(15px + 0.5vw);  margin: 0;}
 
 

.livesermon{margin:10px 0;}
.livesermon i{color:red;}
.livesermon p{margin:0; color:black;}
.livesermon >a {
    display: flex;
    align-items: center;
    flex-direction: row;    justify-content: flex-end;
}


@media (max-width:769px) {
 .bottom-wrap > h4 { font-size:3.5vw;}
}