/* top bar nav on top of template good for staic links link sections etc.*/
.topbar{
color:#fff;
background-color:#222;
/*ajust the top bar height*/
height:30px;
text-align:right;
text-decoration:none;
padding-top:5px;
padding-right:5px;
display:block;
white-space:nowrap;
}
.topbar a:link{color:White;}
.topbar a:visited{color:White;}
.topbar a:hover{color:White;}

/* Wrapper Footer Trick */
#Wrapper {
height:auto !important;
/*this works hand in hand with the #FooterWrapper min-height: settings */
min-height:90%;
}

/* Heading Color and Height control*/
#Header {
background-image:url(../images/brb.png);
background-repeat: repeat-x;
}

/*Menu Wrapper to cover the width if needed*/
#MenuWrapper{
	background-color:#333;
	width:100%;
	height:25px;
	white-space:nowrap;
	/*need for  FF div not working right*/
	margin:0 auto;
	padding-top:5px;
	}

/* Main Body Padding */
.MainBody{padding:8px;}
	
/* Start of layout Center Mass */

/* End of layout Center Mass */

/* Centers the footer links etc.*/
.center{margin:0 auto;text-align: center; }
#FooterWrapper{
padding:10px;
clear:both;	
/*this works hand in hand with the #Wrapper min-height: settings */
min-height:10%;
background-color: #222;
}


#dropshadow{
	margin:0 auto;
	max-width:1010px;
	/*background-image:url(../images/dropshadow.png);
	background-repeat:repeat-y;*/
}

#container {
	max-width: 980px;
	margin: 0 auto;
	}

#topnav{
	clear: both;
	/*height:28px;
	padding-left: 130px;*/
	background: #FE6D11;
	border-bottom: 3px solid #95BCDD;
}

#topnav div.moduletable ul {
    margin: 0;
    padding: 0;
	line-height:20px;
}

#masthead{
max-width:980px;
height:150px;
}

#title{
	background-image:url(../images/diviewordmissionaries.jpg);
	background-repeat:no-repeat;
	background-size: contain;
	height:120px;
	width:650px;
	float:left;
}
#quotes{
	width:330px;
	height:120px;
	float:right;
	padding: 10px 0 25px 0;
}

#imagebanner{
	max-width:980px;
	height: 364px;
	background-image:url(../images/svdmission.jpg);
	background-repeat:no-repeat;
	overflow: hidden;
	}

#content{
	padding:20px 27px 0 27px;
	overflow: auto;
}

#wrapevents {
	clear: both;
	width: 97%;
	overflow: auto;
	margin-left: 15px;
	padding: 10px 0;

}

#gridcontainer{
	padding: 0 ;
	/*overflow: auto;*/
	margin-top: 20px;
}

#grid01{
	float:left;
	width: 45%;
	margin-left: 15px;
	margin-right: 10px;
	height:300px;
	background-image:url(../images/latestnews_bg.png);
	background-repeat:no-repeat;
	padding:55px 10px 10px 15px;

}


#grid02{
	float:left;
	width: 45%;
	height:300px;
	margin-right: 15px;
	background-image:url(../images/prayerreflection_bg.png);
	background-repeat:no-repeat;
	padding:55px 15px 10px 15px;
	
}

#grid01 a:link, #grid02 a:link, #grid01 a:visited, #grid02 a:visited {
	color: #fff;
	text-decoration:none;
	}

#grid01 a:hover, #grid02 a:hover {
	color: #E17D11;
	text-decoration:none;
	}

#leftcol {
    float: left;
    max-width: 605px;
}
#leftcol img {
    width: 100%;
}
#leftbtn {
    float: left;
    max-width: 350px;
    padding-right: 15px;
	height: 285px;
}
#rightbtn {
    float: left;
    max-width: 200px;
	font-size: 12px;
	color: #999;
}

#rightcol {
    float: right;
    height: 300px;
    margin-bottom: 20px;
    padding-left: 0px;
    width: 325px;
}

.dp-upcoming {
    float: right;
    font-size: 14px;
    width: 375px;
}

#grid03{
	clear: both;
	float:left;
	margin-left: 15px;
	margin-right: 10px;
	height:250px;
	/*background-image:url(../images/latestnews_bg.png);
	background-repeat:no-repeat;*/
	padding:0;

}

#grid03 img{
	width: 100%;
	height:auto;
}


#grid04{
	float:left;
	width: 46%;
	height:250px;
	background-image:url(../images/intheword_subscribe.jpg);
	background-repeat:no-repeat;
	padding: 5px 10px;
	margin-top: 14px;
	
}


#grid04 img{
	width: 100%;
	height:auto;
}

#footer{
	clear:both;
	color:#5E9ACB;
	font-family: 'Avenir LT W01_55 Roman1475520', Verdana, Geneva, sans-serif;;
	font-size:1em;
	padding:10px 0px;

}

#footer a:link {
	color: #5E9ACB;
	text-decoration:none;
	}
#footer a:visited {
	color: #5E9ACB;
	text-decoration:none;
	}
#footer a:hover {
	color: #FE6D11;
	text-decoration:none;
	}

#footer h3{
	border: none;
    color: #F0CD62;
    font-family: Verdana,Geneva,sans-serif;
    font-size: 1.2em;
    margin: 0;
    padding: 10px 0 5px 0;
}

#footer div.moduletable ul {
	padding:0;
	margin:0;
}

@media only screen and (max-width: 768px) {

body{
background-attachment: fixed !important;
background-position:center;
}
	
#masthead{
max-width:980px;
height:auto;
}
	
#title{
	background-image:url(../images/diviewordmissionaries.jpg);
	background-repeat:no-repeat;
	height:120px;
	width:100%;
	float: left;
	}

#quotes{
	height:auto;
	float:right;
	padding: 25px;
}
	
#topnav{
	clear: both;
	/*height:28px;
	padding-left: 130px;*/
	background: #FE6D11;
	border-bottom: 3px solid #95BCDD;
	
}
	
	
#content{
	padding:20px 30px;
	background:#fff;
		
}

#gridcontainer{
	padding: 0 ;
	/*overflow: auto;*/
	margin-top: 20px;
	width: 92%;
}	
	
#grid01{
	width: 100%;
	height:auto;
	background-color: #95BCDD;
	background-image:url(../images/latestnews_bg.png);
	background-repeat:no-repeat;
	padding:55px 15px 10px 15px;
	margin: 0 0 25px 0;

}


#grid02{
	width: 100%;
	height:300px;
	background-color: #95BCDD;
	background-image:url(../images/prayerreflection_bg.png);
	background-repeat:no-repeat;
	padding:55px 15px 10px 15px;
	margin-bottom: 25px;
}

#wrapevents {
	clear: both;
	width: 100%;
	overflow: hidden;
	margin-left: 15px;
	padding: 10px 0;

}
	
#leftcol {
    float: left;
    max-width: 605px;
}
#leftcol img {
    width: 100%;
}
#leftbtn {
    float: left;
    width: 100%;
    padding-right: 15px;
	height: 285px;
}
#rightbtn {
    float: left;
    width: 100%;
	font-size: 11px;
	color: #999;
	padding: 30px;
}

#rightbtn img {
    width: 100%;
}

#rightcol {
    float: right;
    height: 300px;
    margin-bottom: 20px;
    padding-left: 15px;
    width: 100%;
}

.dp-upcoming {
    float: right;
    font-size: 14px;
    width: 100%;
}

#grid03{
	float:left;
	margin-left: 15px;
	margin-right: 10px;
	margin-bottom: 30px;
		/*background-image:url(../images/latestnews_bg.png);
	background-repeat:no-repeat;*/
	padding:0;
	max-width: 100%;

}
	
#grid03 img{
	max-width: 100%;
	height:auto;
}	
	
#grid04{
	float:left;
	width: 100%;
	height:250px;
	background-image:url(../images/intheword_subscribe.jpg);
	background-repeat:no-repeat;
	background-size: inherit;
	padding: 5px 10px;
	margin: 14px 10px 0 15px;
	
}


#grid04 img{
	width: 100%;
	height:auto;
}

#footer{
	clear:both;
	color:#5E9ACB;
	font-family: 'Avenir LT W01_55 Roman1475520', Verdana, Geneva, sans-serif;;
	font-size:1em;
	padding:10px;

}	
	
}

@media only screen and (max-width: 568px) {
	
#gridcontainer{
	padding: 0 ;
	/*overflow: auto;*/
	margin-top: 20px;
	width: 100%;
}	
#grid03{
	float:left;
	margin: 0;
		/*background-image:url(../images/latestnews_bg.png);
	background-repeat:no-repeat;*/
	padding:0;
	width: 100%;

}
	
#grid03 img{
	width: 100%;
	height:auto;
}	
	
#grid04{
	float:left;
	width: 100%;
	background-image:url(../images/intheword_subscribe.jpg);
	background-repeat:no-repeat;
	background-size: contain;
	padding: 5px 10px;
	margin: 0;
	
}


#grid04 img{
	width: 100%;
	height:auto;
}

}
