/*CSS FOR COOL ORANGE Template by PerreLink 2004*/
/* not to be copied or distributed */

body {
padding: 0;
margin: -10px 0 0 -10px;
/*/*/margin: 0 0 0 0; /* */ 
background:    url("../images/pageback.gif") repeat-y;
background-color: White;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #666666;
}
/* set the position of the nav bar table from the top */
/* if you change this you will need to adjust the flyout div positions to correspond */
.navtable {
	margin-top: 20px;
}

/* this sets the right hand side table shadow as the cell background image */
.maintdbg {
background-image:   url("../images/tableback.jpg");
background-repeat: repeat-y;
}
/* style for the main table content area - gives the left and bottom border effect */
.maintable{
background: white;
color: #666666;
border-bottom: 1px solid #663300;
border-left: 1px solid #663300;
}

/* a class for the header table, so that we can add a left border to match the main table */
.headertable {
	border-left: 1px solid #663300;
}
/* This is used to apply the watermark for the content area - 
the background image and position can be removed safely if needed or changed,
 if you want to use one of your own images */
.maintd {
	padding: 0px 10px 10px 20px;

}
/*style for the left side bar area behind the menu buttons*/
.sidebar {
border-right: 20px;
width: 145px;
padding-left: 5px;
background-color: #ECD375;
}

/* gives the left sidebar a background color */
.sidebar td {
	background-color: #ECD375;
}
 /* standard link styles */
a:link a:active {
color: #CC6600;
font: 12px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: none;
}
 a:visited {
color: #CC6600;
font: 12px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: underline;
}

a:hover {
color: #E1A537;
font: 12px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: underline;
}

/* styles the main table links */
.maintable a:link {
color: #576B77;
font: 11px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: none;
}
.maintable a:visited {
color: #576B77;
font: 11px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: underline;
}
.maintable a:hover {
color: #990000;
font: 11px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: underline;
}
.maintable a:active {
color: #576B77;
font: 11px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: underline;
}
/*standard heading tags*/
h1 {	
font-size: 16px;
color: #996600;	
}
h2 {
	font-size:13px;
	color: #996633;
	text-decoration: underline;
}
h3 {	
font-size: 12px;
color: #CC9933;
}
/*styles for the contact form*/
form { margin: 0;} /*declaring a margin of 0 will not give you unwanted white space underneath the end of the form*/


label,span.spacer {width:120px;}

/*styles the form fields*/
label{
font-weight:bold;
color : #663300;
/*font-weight: bold;*/
}
fieldset{
padding:10px;
border : 1px solid #663300;
margin-bottom : 15px;
}

/* class for the login form on entry page
we have named it form2 so it doesn't clash with the styles of the contact form */
.form2{
padding:6px;
margin-bottom : 10px;
}

/*styles the 'contact form' text at top of contact form*/
legend {
color: #663300;
font-weight: bold;
font: 14px Arial, Verdana, Geneva, Helvetica, sans-serif;
padding: 10px;  /*gives a bit of padding between the border and the text*/
}
/*styles the comments box*/
textarea{
background-image:   url("../images/shadeform.jpg");
}

/*styles the input fields*/
input{
background-image:   url("../images/shadeform.jpg");
}

/*wrapper div wraps the total web page*/
/* Use the 1000 pixel height to force the web browser scroll bars to show up.  This
keeps the pages uniform when the user switches between short pages (where they may
not neet a scroll bar) and the the long pages.*/
#wrapper {
	position: relative;
	margin:auto;
	width:750px;
	text-align: left;
	height: 1000px;
}

/*The following are the flyout layers.  I preface the names with "dd" to indicate that
they are "drop-downs."  Inside each layer, in the HTML file, you place a table with cells
that link to different webpages.*/

/*flyout 1 div change the co ordinates for left and top if you need to move the flyout*/

#ddchurch {
position:absolute; 
left:142px; 
top:275px; 
width:153px; 
height:95px; 
z-index:5; 
visibility: hidden;}

/*flyout 2 div change the co ordinates for left and top if you need to move the flyout*/
#ddnazarenes {
position:absolute;
left:142px;
top:308px;
width:153px;
height:95px;
z-index:5;
visibility: hidden;
}
/*flyout 3 div change the co ordinates for left and top if you need to move the flyout*/
#ddministries {
position:absolute;
left:142px;
top:340px;
width:153px;
height:95px; 
z-index:5;
visibility: hidden;
}
/*flyout 4 div change the co ordinates for left and top if you need to move the flyout*/
#ddfamily {
position:absolute;
left:142px;
top:372px;
width:153px;
height:95px;
z-index:5;
visibility: hidden;
}
/*flyout 5 div change the co ordinates for left and top if you need to move the flyout*/
#ddwritings {
position:absolute;
left:142px;
top:404px;
width:153px;
height:95px;
z-index:5;
visibility: hidden;
}
/*this is the closer div -this is needed so that on mouseout the dropdowns close*/
#closer {
left:142px; 
position:absolute; 
margin-top:200px;
visibility:hidden;
width:500px;	
z-index:1;
}

/* styles the menu table inside the flyout div*/
.menu{
border: 1px solid #663300;
font: 11px Verdana, Geneva, Arial, Helvetica, sans-serif;
width: 150px;
background-color: #E1A638;
}

.menu a{
background: #E1A638;
display: block;       /*needed so that the whole cell is highlighted on mouseover*/
text-decoration: none;
width: 100%;
}

.menu a:link{
background: #E1A638;
border-right:1px solid #663300;
border-bottom:1px solid #663300;
border-left:1px solid #663300;
color: White;
padding: 2px 2px 2px 2px;
}

.menu a:visited,.menu a:active{
background:#E1A638;
border-right:1px solid #663300;
border-bottom:1px solid #663300;
border-left:1px solid #663300;
color: White;
padding: 2px 2px 2px 2px;

}

.menu a:hover{
/*background-image: url(file:///D|/2_elegante/sitefiles/graphics/menubackover.jpg);*/
background-repeat: repeat-x;
background: #ECD375;
border-right:#663300 1px solid;
border-bottom:#663300 1px solid;
border-left: #663300 1px solid;
color: #666666;
padding: 2px 2px 2px 2px;
}

/* Use the following character style to emphasize body text selections.*/
.emphasis {
	font-family: Arial;
	font-size: 12px;
	font-style: italic;
	color: #CC9933;
	font-weight: bold;
}