/* 
This CSS is included for all themes and browser types 

*/

.NavBarItem
{
	text-align:left;
}

.powered_by 
{
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	border-width: 0px;
	border-style: solid;
	border-color: #000088;
}


.LargeChurchFont	
{
	font-size: 16px;
}

.MediumChurchFont
{
	font-size: 12px;
}

.SmallChurchFont
{
	font-size:10px;
}

.FormFieldErrorMessage
{
	font-size:12px;
	font-weight: normal;
	color: #AA0000;
	margin: 10px 0 0 0;
}

.HelpLink
{
	font-size:12px;
	font-weight: normal;
	color: #008800;
}

.AdminEdit
{
	font-size:10px;
	font-weight: normal;
	color: #880000;
}

.SiteCreationCell
{
    text-align:left;
    vertical-align:top;
}

/* ---- GENERAL STYLES ---- */
/* These apply to the elements that have the same name as the style */

BODY
{
	font-family: Verdana, Arial, Helvetica, sans-seri;
	font-size: 12px;
	color: #000077;
	background-color: #FFFFDD;
}

FONT
{ /* Override Colors Pasted in from other websites */
	color: #000077;
	background-color: Transparent;
}


A {
	color: #000055;
}
A:visited {
/*	color: #000077; */
}
A:active {
/*	color: #00FF00;*/
}
A:link {
/*	color: #000077; */
}
A:hover {
	color: #2222ff;
}

A.HOME_LOGIN  { color: #ffff66; } /* Make login link invisible on the main purple grapes site. */
/*
A.HOME_LOGIN:visited  { color: #ffc73f; }
A.HOME_LOGIN:active   { color: #ffc73f; }
A.HOME_LOGIN:link     {	color: #ffc73f; }
A.HOME_LOGIN:hover    {	color: #000000; }
*/

H1
{
	font-size: 28px;
	font-weight: bold;
}

H2
{
	font-size: 28px;
	font-weight: normal;
}
H3
{
	font-size: 20px;
	font-weight: bold;
}
H4
{
	font-size: 20px;
	font-weight: normal;
}
H5
{
	font-size: 16px;
	font-weight: bold;
}
H6
{
	font-size: 16px;
	font-weight: normal;
}



INPUT
{
	color: black;
	font-size: 12px;
}

SELECT
{
	background-color: #FFFFFF;
	color: black;
	font-size: 12px;
}

TEXTAREA
{
	background-color: #FFFFFF;
	color: black;
	font-size: 12px;
}

/* vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv
* Set <p>, <ul> and <li> so that a huge gap doesn't 
* appear before each bullet list.
*
* Also make it so that there is a smaller gap between each paragraph.
*/
p 
{ 
	margin: 0em; 
	padding: 0em 0em 0.5em 0em; 
}
ul
{
	padding: 0px;
	boarder: 0px;
	margin: 0px 0px 0px 40px;
}
li
{
	margin-top: 0px;
	margin-bottom: 0px;
}
/* ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */

form
{
	margin-top: 0px;
	margin-bottom: 0px;
}



/* vvvvvvvvvvvvvvvvvvvvvvvv EditContent Page vvvvvvvvvvvvvvvvvvvv */
.EditorTip
{
	text-align:left;
	font-size:12px;
	padding:0px 20px 10px 20px;
}
/* ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */


/* vvvvvvvvvvvvvvvvvvvvvvvv Create a New Website Page vvvvvvvvvvvvvvvvvvvv */
.CreateSiteInstructionColumn
{
	font-size:10px;
	font-family: Verdana, Arial, Helvetica, sans-seri;
	text-align:left;
	padding: 100px;
	margin: 100px;
	border: 100px;
}
/* ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */


/* vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv Settings Page vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv 
* NOTE: The widths of the 3 columns must fit in the width of the main cell minus the margin.
* If your columns start wrapping then reduce the widths.
*/

.SettingsNameCol
{
	width: 100px;
	font-weight:bold;
	float:left;
	text-align:left;
	margin: 5px;
}

.SettingsValueCol
{
	width: 260px;
	float:left;
	margin: 5px;
}

.SettingsInstructionsCol
{
	width:180px;
	float:left;
	margin: 5px;
}

.SettingsHR
{
	clear:left; /* Start a new line, don't line up nect to the name column */
	/*padding: 20px;*/
}

/* ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Settings Page ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */


/* vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv Photo Albums/Album Page vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv */

#CreateNewPhotoAlbum
{
	margin: 20px;
	padding: 10px;
	border-width: 1px;
	border-style: solid;
	border-color: #000000;
}
.PhotoAlbumListLink /* List of links to the photo albums */
{
	font-size: 14px;
	padding: 5px;
}

#album_body
{
	background-color: #e8eef7;
}

.album_upload_photo
{
	text-align:center;
	padding:0px 0px 15px 0px;
}


#UploadPhoto
{
	margin: 20px;
	padding: 10px;
	border-width: 1px;
	border-style: solid;
	border-color: #000000;
}

.photo_album_picture_layout /* around all the pictures in the whole album */
{
	width:100%;
}

.photo_album_item /* Around the picture and the caption */
{
	float:left;
	margin: 20px;
	padding: 10px;
	border-width: 1px;
	border-style: solid;
	border-color: #000000;
	background-color: #c3d9ff;
}

#album_body
{
	background-color: #e8eef7;
}

.photo_album_picture /* Around the picture only */
{
	text-align:center;
}

.photo_album_caption /* Around the caption only */
{
	text-align:center;
	font-size: 18px;
	padding:8px 0px 0px 0px;
}

/* ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Photo Albums/Album Page ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */

/* ================================================================================= */
/* ================================================================================= */
/* ===                                                                           === */
/* ===                               Theme Styles                                === */
/* ===                                                                           === */
/* ================================================================================= */
/* ================================================================================= */


body
{
	margin:5px;
	padding:0;
}


.PAGE_TITLE
{
	text-align:center;
	font-size: 28px;
	padding: 15px;
}


.MY_TINY_MCE_TEXT_EDIT
{
	width: 100%;
	height:410px; /* Any taller and won't fit in 1024x768 Screen */
}

/* 
Containing block for other cells.  
Other cells are absolutly positioned inside this one. 
*/
#WHOLE_PAGE_CELL 
{
	padding: 0em 0em 0em 0em; /* These set the margins around the WHOLE_PAGE_CELL */
	position: relative; /* This is the containing block for the other elements so it must be position relative */
	/* border: 1px solid red;  */
}

/* Transparent edit link boxes */
#EDIT_LOGO_DIV, #EDIT_BANNER_DIV, #UPLOAD_BANNER_DIV, #EDIT_MINI_SLIDESHOW_DIV
{
	background-color: #ffffff;
	position:absolute;
	left:20px;
	top:40px;
	padding:5px;
	border: solid 2px black;
	z-index:3;
	filter:alpha(opacity=80); /* IE Opacity */
	opacity: 0.80; /* Safari */
	-moz-opacity: 0.80; /* Firefox */
	-khtml-opacity: 0.80 /*Konqueror */
}
#EDIT_LOGO_DIV
{
	left:20px;
	top:30px;
}
#EDIT_MINI_SLIDESHOW_DIV
{
	left:27px;
	top:70px;
}
#EDIT_BANNER_DIV
{
	left:100px;
	top:20px;
}
#UPLOAD_BANNER_DIV
{
	left:350px;
	top:20px;
}

#LOGO_CELL
{
	background-color: Transparent;
	width: 150px;
	height: 120px;
	position:absolute;
	left:0px;
	top:0px;
}
#LOGO_FRAME
{
	background: url(/Styles/images/Default_Logo_Frame.png) no-repeat;
	position:absolute;
	left:0px;
	top:0px;
	width: 150px;
	height: 120px;
	z-index:1;
}

.LOGO_IMAGE 
{
	position:absolute;
	left:0px;
	top:0px;
}

#BANNER_CELL
{
	background-color: Transparent;
	position:absolute;
	left:155px;
	top:0px;
	height: 120px;
	width: 600px;
}
#BANNER_BACKGROUND
{
	/* 
	Note: This is the background color if the banner has an invisible background color 
	If no banner is selected then the default banner is used, not this background color.
	*/
	background-color: #c3d9ff;
}
#BANNER_FRAME
{
	background: url(/Styles/images/Default_Banner_Center.png) no-repeat;
	position:absolute;
	left:0px;
	top:0px;
	height: 120px;
	width: 600px;
	z-index:1;
}
#BANNER_TEXT_DIV
{
	position:absolute;
	text-align:center;
	border:solid 0px black;
	left:0px;
	top:30px;
	height: 120px;
	width: 600px;
	z-index:2;
}

/* vvvvvvvvvvvv MAIN CELL vvvvvvvvvvvvv */
#MAIN_CELL
{
	background: url(/Styles/images/Default_Main_Center.png) repeat-y;
	position:absolute;
	left:155px;
	top:120px;
	width: 600px;
/*	text-align:center; DON'T FORCE CENTERING*/
}
#MAIN_CELL_TOP
{
	background: url(/Styles/images/Default_Main_Top.png) no-repeat;
	height:1px;
	width: 600px;
}

/* ^^^^^^^^^^^^ MAIN CELL ^^^^^^^^^^^^^ */



/* vvvvvvvvvvvv FOOTER CELL vvvvvvvvvvvvv */
#FOOTER_CELL
{
	background: url(/Styles/images/Default_Footer_Center.png) repeat-y;
	text-align:center;
	width: 600px;
}
#FOOTER_CELL_TOP
{
	background: url(/Styles/images/Default_Footer_Top.png) no-repeat;
	height:1px;
	width: 600px;
}
#FOOTER_CELL_CONTENT
{
	margin: 10px;
}
#FOOTER_CELL_BOTTOM
{
	background: url(/Styles/images/Default_Footer_Bottom.png) no-repeat;
	height:14px;
	width: 600px;
}

/* ^^^^^^^^^^^^ FOOTER CELL ^^^^^^^^^^^^^ */



/* vvvvvvvvvvvv NAV CELL vvvvvvvvvvvvv */
#NAV_CELL
{
/*	border: 0px solid red;  */
	background: url(/Styles/images/Default_Nav_Center.png) repeat-y;
	position:absolute;
	left:0px;
	top:125px;
	width: 150px;
}
#NAV_CELL_TOP
{
	background: url(/Styles/images/Default_Nav_Top.png) no-repeat;
	height:14px;
	width: 150px;
}
#NAV_CELL_BOTTOM
{
	background: url(/Styles/images/Default_Nav_Bottom.png) no-repeat;
	height:14px;
	width: 150px;
}
/* ^^^^^^^^^^^^ NAV CELL ^^^^^^^^^^^^^ */


/* vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv Weekly Schedule Page vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv */
.DAY_OF_WEEK
{
	margin: 20px;
	padding: 0px 0px 10px 0px;
	border-width: 1px;
	border-style: solid;
	border-color: #0f0fbf;
	background-color: #c3d9ff;
}
/* ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Weekly Schedule Page ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */

/* vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv Visitor Comments vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv */
.COMMENTS_ON_OFF
{
	margin: 10px;
	border-width: 1px;
	border-style: solid;
	border-color: #000000;
	background-color: #c3d9ff;
	text-align: center;
	font-size: 10px;
	font-weight: bold;

}

.COMMENT_SETTINGS_SECTIONS
{
	margin: 10px;
	border-width: 1px;
	border-style: solid;
	border-color: #000000;
	background-color: #c3d9ff;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
}


.COMMENT_RADIO_BUTTON_GROUP
{
	margin: 10px;
    padding: 10px;
	border-width: 1px;
	border-style: solid;
	border-color: #000000;
	text-align: left;
	font-size: 10px;
	font-weight: bold;
}

.COMMENT_SECTION
{
	margin: 10px;
	padding: 0px;
	border-width: 1px;
	border-style: solid;
	border-color: #000000;
	background-color: #e8eef7; 
/*	background-color: #c3d9ff; */

}


.COMMENT_HEADER
{
	margin: 0px;
	padding: 2px 10px 2px 10px;
	border-width: 0px 0px 1px 0px;
	border-style: solid;
	border-color: #000000;
/*	background-color: #c3d9ff; */
	background-color: #e8eef7;
	text-align: center;

}
.COMMENT_SMALL_PRINT
{
	font-size:10px;
	font-weight: normal;
}

.COMMENT_ITEM_WIDTH  /* This is only used in the big list of all comments, not in the normal comment pages on websites. */
{
	width: 730px;
}

.COMMENT_LIST_ITEM
{
	margin: 10px;
	padding: 10px;
	border-width: 1px;
	border-style: solid;
	border-color: #000000;
	background-color: #c3d9ff;
}

.COMMENT_LIST_ITEM_HEADER
{
	font-size:10px;
	font-weight: bold;
	padding: 0px 0px 4px 0px;
}
.COMMENT_LIST_ITEM_BODY
{
	font-size:11px;
}

.COMMENT_INPUT_AREA
{
	margin: 10px;
	padding: 0px;
	text-align: center;
}

.COMMENT_WARN /* Tells admin if a comment is hidden from visitors */
{
	font-size:10px;
	font-weight: bold;
	color: #FF0000;
}

/* ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Visitor Comments ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */

/* vvvvvvvvvvvvvvvvvvvvvvvvvvvvv MODAL DIALOG STYLES vvvvvvvvvvvvvvvvvvvvvvvvvvvvvv */    
.MODAL_DIALOG h1
{
    font-size: 14pt;
    font-weight: bold;
    color: #4e9ebc;
    margin: 0px 0px 10px 0px;
    clear: both;
}

.MODAL_DIALOG
{
    font-size: 11pt;
    left:-1000px; /* Start off screen */
    width: 600px; /* All modal dialogs must be 600px wide because when centered a margin of -300px is used */
/*
    margin-left:-300px;
    margin-top:-50px;
    top: 50%;
    left: 50%;
*/
    background: #ece9d8;
    border: 2px solid #4e9ebc;
    position: absolute;
    padding: 10px;
}

/* ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ MODAL DIALOG STYLES ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */