@charset "utf-8";
/* CSS Document */

@font-face {
    font-family: 'journalregular';
    src: url('/Includes/journal-webfont.eot');
    src: url('/Includes/journal-webfont.eot?#iefix') format('embedded-opentype'),
         url('/Includes/journal-webfont.woff') format('woff'),
         url('/Includes/journal-webfont.ttf') format('truetype'),
         url('/Includes/journal-webfont.svg#journalregular') format('svg');
    font-weight: normal;
    font-style: normal; }

body {
	margin: 0;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	background: #0071a0; }

html {
	margin: 0; }

h1 {
	font-size: 60px;
	font-family: 'journalregular';
	font-weight: normal;
	margin: 20px 0;
 }
	
h2 {
	font-size: 48px;
	font-family: 'journalregular';
	font-weight: normal;
	margin: 15px 0; }
	
h3 {
	font-size: 36px;
	font-family: 'journalregular';
	font-weight:normal;
	margin: 15px 0;
 }

hr {
	border: none;
	height: 1px;
	background: #CCC; }

a, a:visited, a:active {
	color: #0071a0; }

a:hover {
	color: #639; }

#container {
	width: 1030px; }

#header-strip {
	width: 100%;
	background: url(/Images/header.jpg) repeat-x bottom center;
	padding: 1px 0;
	background-size: cover;
	margin: 0 auto;}

#header {
	width: 1100px;
}

#navstrip {
	width: 100%;
	background: url(/Images/NavbarBG.png) repeat-x;
	height: 58px;
}

#navbar {
	width: 1100px;
	height: 58px;
	margin: 0 auto;
}


#title {
	color:#FFF;
	width: 1080px;
	margin: 0 auto;	
	font-size: 18px;
}

#texture {
	width: 100%;
	background: url(/Images/BGTexture.jpg) repeat;
	padding: 10px 0; }

#mainbox {
	width: 1080px;
	margin: 0 auto;	
	padding: 20px 0;
}

.boxlink {
	width: 16%;
	height: 170px;
	margin-right: 2.5%;
	margin-bottom: 20px;
	float: left;
	text-align: center; 
	vertical-align: middle;
	background-size: contain;}
	
.boxlink td {
	padding-bottom: 15px; 
	height: 160px;}
		
.boxlink a {
	font-family: 'journalregular';
	font-weight:normal;
	font-size: 48px;
	line-height: 35px;
	color:#000;
	text-decoration: none;}
	
.boxlink a:hover {
	color:#FFF;
	text-decoration: none;}

.orange {	
	background:url(/Images/orange%20square.png) center no-repeat; }
.green {
	background:url(/Images/green%20square.png) center no-repeat; }
.blue {
	background:url(/Images/blue%20square.png) center no-repeat; : }
.yellow {
	background:url(/Images/yellow%20square.png) center no-repeat; : }

.oneline p {
	margin-top: 50px; }
.twolines p {
	margin-top: 40px; }
.threelines p {
	margin-top: 20px; }

#home-pic {
	width:26%;
	float: right;
	overflow: hidden;
	background: url(/Images/picture.png) center no-repeat;
	height: 360px; }

#footer {
	width: 1090px;
	margin: 0 auto;
	height: auto;
	background: url(/Images/footer.jpg) center repeat-x;
	text-align: left;
	color: #FFF;
	padding: 1px 0;
	height: 194px;}

#footer a, #footer a:visited, #footer a:active {
	color: #FFF; }

#footer a:hover {
	color: #CBE9FB;
	text-decoration: none; }

#footer h3 {
	margin: 20px 0; }

.button {
	color: #0071a0;
	font-family: 'journalregular';
	font-size: 35px;
	border: none;
	padding: 1px 15px 10px 15px;
	background: url(/Images/NavbarBG.png) bottom;
	margin: 3px 0;
	cursor: pointer; }

.input {
	border: 1px solid #CCC;
	padding: 4px;
	width: 170px;
	margin: 3px 0; }

.select {
	border: 1px solid #CCC;
	padding: 4px;
	margin: 3px 0; }

textarea {
	margin: 6px 0;
	font-size: 13px; }

.ribbon {
	display: block;
	width: 50px;
	padding: 5px 15px 13px 10px;
	background: url(/Images/NavbarBG.png) bottom;
	color: #0071a0;
	margin: 10px 0 -10px -10px; }
	
.fakelink {
	cursor: pointer;
	text-decoration: underline; }
	
.red {
	color: #F00; }
	
.breadcrumbs {
	display: block;
	float: left;
	margin: 7px 0 0 0; }
	
.sectionheader {
	font-family: 'journalregular';
	display: block;
	float: left;
	margin-right: 5px;
	line-height: 24px;
	font-size: 30px;}
	
.table td {
	padding: 5px 0; }
	
.sermons td {
	padding: 3px 0;
	border-bottom: 1px solid #CCC; }
	
#leftcol {
	width: 48%;
	float: left; }
#rightcol {
	width: 48%;
	float: right; }
	
@media only screen and (max-width: 1170px) {
	#navbar, #title, #mainbox, #footer{
		width: 96%;
		margin: 0 2%; }
	.hide1 {
		display: none; }
}

@media only screen and (max-width: 1090px) {
	.boxlink {
		height: 160px; 
		background-size: cover;}
		
	#home-pic {
		height: 340px; 
		background-size: cover; }
	.boxlink a {
		font-size: 44px;
		line-height: 30px;	
}

@media only screen and (max-width: 1070px) {
	.hide {
		display: none; }
}

@media only screen and (max-width: 992px) {
	.hide3 {
		display: none; }
}

@media only screen and (max-width: 880px) {
	.boxlink {
		height: 140px; 
		background-size: cover;}
	.boxlink a {
		font-size: 40px;
		line-height: 26px; }
	#home-pic {
		height: 300px; 
		background-size: cover; }
}

@media only screen and (max-width: 780px) {
	.boxlink {
		width: 22.5% }
	#home-pic {
		display: none; }
	#leftcol, #rightcol {
		width: 100%;}
	.hide4 {
		display: none; }
}

@media only screen and (max-width: 690px) {
	.hide1, .hide, .hide3, .hide4 {
		display: inline; }
}

@media only screen and (max-width: 550px) {
	.boxlink {
		width: 47%;
		height: 120px;  }
	.oneline p {
		margin-top: 40px; }
	.twolines p {
		margin-top: 25px; }
	.threelines p {
		margin-top: 15px; }
	#title, #footer{
		width: 94%;
		margin: 0 3%; 
}

@media only screen and (max-width: 530px) {
	.logo {
		width: 100%; }