/* Style sheet for Ebenezer Evangelical Church */
h1, h2, h3, h4, h5 { 
	padding: 0.8em 0 0 0; 
	margin: 0 0 0 0;
	font-weight: bold; 
}
h1 { font-size: xx-large; }
h2 { font-size: x-large; }
h3 { font-size: large; padding-top: 0.5em; }
h4 { font-size: medium; padding-top: 0.6em; }
h5 { font-size: small; }
p { 
	margin: 0 0 0 0;
	padding: 0 0 0.4em 0;
}
p.nb {
	font-size: 1.2em;
}
a { 
	color: #b51032; 
	text-decoration: none;  
}
a:hover{
	font-style: italic;
}
ul { 
	margin-top: 0.3em; 
	margin-bottom: 0.3em;
}
body {
	color: #000000;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.95em;
	line-height: 120%;
}
/* Code for desktop and laptop screens */
#wrapper {
	text-align: left;
	margin-top: 15px;
	margin-right: auto;
	margin-left: auto;
	width: 850px;
}
#header { 
	height: 151px; 
	color: #b51032;
	border-top: 2px solid #aaa;
	border-bottom: 3px solid #aaa; 
	text-align: right;
}
#header img {
	border: 2px solid #000;
	float: left;
	height: 145px;
	width: 220px;
	margin: 1px 0 1px 0;
}
#header h1 { 
	font-style: italic;
	padding: 5% 2% 0 0;
} 
#header p {
	font-size: medium;
	font-style: italic;
	line-height: 130%;
	padding: 3% 2% 0 0;
}
#content { 
	margin-right: auto;
	margin-left: auto;
	width: 85%;
	text-align: justify;
	margin-bottom: 1em;
	padding-right: 5px;
}
#links ul {
  line-height: 130%;
	list-style-type: Lower-Greek;
}
#grapevine ul {
	list-style-type: none;
}
.mainmenu{
 	margin: 3% 0 0 0;
 	padding: 0 0 0 3px;
	list-style: none;
	font-size: 105%;
}
.submenu {
	list-style: none;
	font-size: 95%;
	padding: 0 0 0 25px;
	margin: 0 0 2px 0;
	line-height: 95%;
}

.enhance {
	font-style: italic; 
	font-weight: bold;
}
#footer {	
	clear: both; 
	padding: 0.5em 0 0.5em 0; 
	border-top: 1px solid #aaa; 	
	border-bottom: 2px solid #aaa; 
	font-size: 0.8em; 
	text-align: center;
}
table { 
	border-collapse: collapse;
	width: 100%;
	line-height: 130%;
	text-align: left;
}
th { 
	text-align: left; 
	font-weight: bold; 
}
table.meetings th, table.meetings td {
	border-bottom: 1px solid #000;
	line-height: 150%;
}
table.contact th { 
	padding: 0;
	padding-top: 10px; 
	border-bottom: 2px solid #000;
}
table.contact td { 
	border-bottom: 1px solid #000;
}
table.sermons, table.archive {
	border-bottom: 2px solid #000;
}
table.sermons tr, table.archive tr {
	border-bottom: 1px solid #000;
}
table.sermons th, table.archive th {
	border-top: 3px solid #000;
	border-bottom: 2px solid #000;
	padding-top: 0.25em;
}
table.sermons td { 
	font-size: 0.9em;
	letter-spacing: 0.05em;
	padding: 0.1em;
	line-height: 130%;
	text-align: left;
}
table.archive {
	width: 75%; 
}
table.archive td {
	padding: 0.20em 0 0 0;
}
.bocsbach {
	border : red double 2px;
	width: 60%;
  text-align: justify;
	padding : 0 2% 2% 2%;
}
#news { 
	line-height: 120%;
}
#news h3 { 
	line-height: 120%;
}
img { 
	border: 2px solid black; 
}
img.l {
	float: left; 
	margin: 10px 10px 3px 0;
}
img.r {
	float: right; 
	margin: 10px 0 3px 10px; 
}
img.centred {
    display: block;
    margin-left: auto;
    margin-right: auto; 
    margin-top: 5px;
    margin-bottom: 5px;
}
img.inline {
    display: inline;
    margin: 5px;
    border: 2px solid #000;
    width: 210px;
    height: 150px;
}
.clear { 
	clear: both; 
}
.footnote {
	font-size: 90%;
	font-weight: normal;
	font-style: italic;
}
.error {
	color: #FF0000;
	font-size: 0.9em
}

/* code for tablets or similar sized screens */
@media screen and (min-width: 501px) and (max-width: 849px) {
	#wrapper {
		width: 100%;
	}
	#header {
		height: 120px;
	}
	#header p {
 		font-size: 100%;
 		padding: 2% 2% 0 0;
	}	
	#header h1 { 
		font-size: 175%;
		line-height: 125%;
		padding: 3% 2% 0 0;
	} 
	#header img {
		border: 1px solid #000;
		margin-top:0;
		float: left;
		height: 118px;
		width: 180px;
	}
	#navigation {
		width: 15%;
    padding-left: 1%;
	}
	#content {
		width: 80%;
		padding-right: 2%;
	}
	.submenu {
		padding: 0 0 0 15px;
	}
}	 

/* Code for narrow screens e.g phones */
@media screen and (max-width: 500px) {
	#wrapper {
		width: 100%;
		font-size: 100%;
	}	
  #content {
    float: none ;
    width: 100% ;
  }
  #navigation {
    float: none ;
    width: 100% ;
  }
  #navigation ul ul li {
		display: none;
  }
  #navigation ul li {
  	line-height: 150%;
    display: inline-block;
 }
  .mainmenu {
  	font-size: 135%;
	 	padding-left: 5px;	
  }
 	#header { 
		height: 76px; 
	}
	#header h1 { 
		font-size: 130%;
		line-height: 120%;
		padding: 2% 2% 0 0;
	} 
	#header p {
 		visibility: hidden;
 	}
	#header img {
		border: 1px solid #000;
		float: left;
		height: 72px;
		width: 110px;
	}
	p.tel {
		font-size: large;
	}
}