﻿* { margin: 0; }

html { height: 100%; overflow-y: scroll; }

body 
{
	background: #000000 url(/v7/_images/Backgrounds/Current.jpg) top center no-repeat fixed;
    text-align: center;
    color: rgb(205,205,205);
    padding: 0;
	height: 100%;
}

body.Popup { background-image: none; text-align: left; padding: 20px; }

body, td, textarea { font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; font-size: 14px; }
input, select { font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; font-size: 13px; }

.TextAlignRight { text-align: right; }
.Bold { font-weight: bold; }
.Note { font-size: .8em; color: rgb(100,100,100); }
.FloatLeft { float: left; }
.FloatRight { float: right; }
.Small { font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; font-size: 10px; }
.ClearBoth { clear: both; }
.DisplayNone { display: none; }
.Green { color: Green; }
.Red { color: rgb(200,50,50); }

.HeightAdjust { clear: both; height: 1px; overflow: hidden; }

div.BackgroundTop
{	
    /*background-image: url(/v7/_images/BackgroundTop.jpg);*/
    background-position: center top;
    background-repeat: no-repeat;
    min-height: 800px;
}

textarea { width: 800px; height: 300px; padding: 5px; }

hr { margin: 2em 0 2em 0; border-width: 0; height: 2px; background-color: rgb(255,205,0); }

a { text-decoration: none; color: rgb(87, 160, 217); }
a:hover { text-decoration: underline; }
a img { border-width: 0; }

p, h1, h2, h3, h4, h5 { font-weight: normal; }
p { margin: 1em 0 1em 0; }
h1, h2, h3, h4, h5 { color: rgb(255,178,0); font-family: Georgia, Times, "Times New Roman"; }
h1, h2, h3 { margin: 1.25em 0 .5em 0; } 
h4, h5 { margin: 1.25em 0 0 0; } 

h1 { font-size: 2em; margin: 0 0 .25em 0; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.25em; }
h4 { font-size: 1em; }

h1 { color: White; }
div.WhiteBox h1 { color: rgb(50,50,50); }
div.DarkBox h1 { color: rgb(255,178,0); }

p { line-height: 1.6em; }

ol, ul, li { padding: 0; }
ul { margin: 1em 0 1em 0; }
li { margin: .5em 0 .5em 2em; }

h2 div.Subheader { font-size: .75em; color: rgb(100,100,100); }

h2.Section { margin-top: 1.25em; font-variant: small-caps; border-top: 1px solid rgb(133, 182, 219); padding-top: .25em; }
h1 + .Section { border-width: 0; padding-top: 0; margin-top: 0; }

.H1Icon { float: left; margin: 3px 1em 0 0; }

.BlinderHandle { cursor: pointer; background-position: center right; background-repeat: no-repeat; }
.BlinderOpen { background-image: url(/v7/_images/contract.gif); color: black; }
.BlinderClosed { background-image: url(/v7/_images/expand.gif); color: rgb(100,100,100); }

.RowMargin { margin-bottom: 20px; }
.ColMargin { margin-right: 20px; }
.TriColumn { width: 290px; float: left; }
.DuoColumn { width: 600px; float: left; }

div.SiteWidth { width: 910px; margin: auto; text-align: left; }

div.Background  
{
	background-image: url(/v7/_images/Background.jpg);
    /*background-position: center -30px;*/
    background-repeat: repeat;
	/*background-color: Black;*/
}

div.Header
{	
	height: 58px;
	background: black url(/v7/_images/Header/Flare.png) no-repeat left center;
}
div.Header img.FloatRight  
{
	margin: 0 0 0 40px;
}

div.LoggedOut div.Header { margin: 0 0 20px 0; }

#LoginNav  
{
	margin: 0 0 20px 0;
	background-image: url(/v7/_images/PageBox/Dark/BG.png);
	padding: 5px 0 6px 0;
	font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
	font-size: 11px;
}

#LoginNav a { color: White; }

#LoginNav a.FloatRight 
{
	display: block;
	margin: 0 0 0 40px;
}
	

div.Footer 
{
	color: rgb(150,150,150);
}

/* contact info */
div.ContactInfo { width: 170px; float: left; font-size: 9px; font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; }

div.SubFooter { clear: both; font-size: 9px; font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; text-align: center; }

/* browsers */
div.Browsers a { display: block; margin: 0 0 10px 0; }


div.AccountPanel { float: right; width: 475px; color: White; } 
div.AccountPanel * { float: right; }
div.AccountPanel img { cursor: pointer; }
div.AccountPanel div { padding: 7px 10px 0 0; }

div.BigPicture { border: 10px solid white; }

div.BottomBuffer 
{
	clear: both;
	height: 1px;
}

#SubNav { float: right; }
#SubNav h3 { margin: 1.25em 0 0 0; color: White; }
#SubNav h3 a { }

div.ContentColumn
{
    margin: 0 0 0 230px;
}

div.ContentColumn p 
{
	width: 420px;
}

div.ContentWidth  
{
	width: 420px;
}

div.ContentColumn p.RightColumn { float: right; width: 180px; font-size: .75em; clear: right; margin-top: 1.5em; }
div.ContentColumn p.RightColumn:first-child { margin-top: 0; }
div.ContentColumn p.RightReference { margin-top: 0; font-weight: bold; text-align: right; }
div.CenterColumn .BlinderHandle { width: 420px; }

div.WideContentColumn   
{
    margin: 0 0 0 230px;
}

div.PhotoFrame { width: 630px; float: left; }

div.Debug  
{	
	clear: both;
    margin: 3em 0 1em 0;
}

#Debug 
{
	clear: both;
    color: White;
    line-height: 1.5em;
    margin: 3em 0 1em 0;
}

div.Scroll 
{
	overflow: scroll;
}

/* Form Styles */
.Form { margin-left: 220px; }
p.Form { width: 410px; }
div.Form { margin: 0 0 0 0; }
div.Form div.Label { font-size: 11px; font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; margin: 1em 0 5px 220px; }
div.Form div.Input { margin: 0 0 1em 220px; }
div.Form div.Help { display: none; float: right; width: 175px; /*background-image: url(/v7/_images/FormHelpBG.jpg);*/ background-repeat: no-repeat; background-position: center top; font-size: .85em; /*padding: 10px 5px 0 20px;*/ }
div.Form span.FieldMessage { text-align: right; float: left; width: 195px; color: Red; font-size: .8em; }
div.Form span.Error { color: Red; }
div.Form span.Success { color: Green; }
div.Form span.Message { font-size: 1em; display: block; float: none; margin: 1em 0 1em 220px; text-align: left; width: auto; }
div.Form p { margin: 1em 0 1em 220px; width: 410px; line-height: 1.6em; }
input.Text { width: 410px; padding: 5px; }
textarea.Text { width: 410px; padding: 5px; line-height: 1.5em; height: 250px; }
a.BackLink { float: left; clear: left; }
a.ForwardLink { float: right; clear: right; }

/* roster search */
div.RosterSearch { }
div.RosterSearch div.Item { }
div.RosterSearch div.Item div.Picture { float: left; }
div.RosterSearch div.Item div.Info { margin: 0 0 0 220px; } 
div.RosterSearch div.Item div.Info div { padding: 0 0 0 22px; margin: 0 0 10px 0; background-repeat: no-repeat; background-position: left center; }
div.RosterSearch div.Item div.Info div.Name { font-size: 1.5em; }
div.RosterSearch div.Item div.Info div.Boy { background-image: url(/v7/_images/Icons/boy.png); }
div.RosterSearch div.Item div.Info div.Girl { background-image: url(/v7/_images/Icons/girl.png); }
div.RosterSearch div.Item div.Info div.CellPhone { background-image: url(/v7/_images/Icons/mobile.png); }
div.RosterSearch div.Item div.Info div.Email { background-image: url(/v7/_images/Icons/mail.png); }
div.RosterSearch div.Item div.Info div.AIM { background-image: url(/v7/_images/Icons/aim.png); }
div.RosterSearch div.Item div.Info div.Birthday { background-image: url(/v7/_images/Icons/cake.gif); }
div.RosterSearch div.Item div.Status { font-size: 1.5em; color: rgb(125,125,125); float: right; text-align: right; margin: 0 0 0 0; }
div.RosterSearch div.Item div.Misc { margin: 10px 0 0 0; float: right; clear: right; width: 325px; } 
div.RosterSearch div.Item div.Misc div { margin: 0 0 10px 0; }
div.RosterSearch div.Item div.Address { clear: right; margin: 1.5em 0 0 220px; }
div.RosterSearch div.Item div.Address div.Item { margin: 0 20px 0 0; width: 190px; float: left; line-height: 1.5em; clear: right; padding: 0 0 0 22px; margin: 0 0 10px 0; background-repeat: no-repeat; background-position: left 3px; } 
div.RosterSearch div.Item div.Address div.Item div { margin: 0 0 1px 0; }
div.RosterSearch div.Item div.Address div.School { background-image: url(/v7/_images/Icons/UCLA.gif); } 
div.RosterSearch div.Item div.Address div.Home { background-image: url(/v7/_images/Icons/home.png); } 
div.RosterSearch div.Item div.Address div.Work { background-image: url(/v7/_images/Icons/business.png); } 
div.RosterSearch div.Item div.Options { clear: right; float: right; margin: 1em 0 0 0; }

div.FormNav { margin: 2em 0 1em 0; border-bottom: 5px solid rgb(255,178,0); padding: 0 0 5px 210px; }
div.FormNav a, div.FormNav span { margin: 0 5px 0 0; padding: 10px 10px 5px 10px; }
div.FormNav a { background-color: rgb(230,230,230); }
div.FormNav span { background-color: rgb(255,178,0); color: Black; }

/* gracevine */
div.ManageGroups { margin: 1em 0 0 0; }
div.ConvoGroup { margin: 0 0 1px 0; }
div.ConvoGroup:hover { cursor: pointer; background-color: rgb(25,25,25); }
div.ConvoGroup div.Title { font-size: 1.5em; padding: 5px; }

div.ConvoGroupList { width: 400px; margin: 1em 0 0 0; }
div.ConvoGroupList h2 { margin-bottom: 1em; }
div.ConvoGroupList div.NonMembers h2 { text-align: left; margin: 0 0 1em 0; }
div.ConvoGroupList a { display: block; padding: 5px; color: black; background-color: rgb(230,230,230); margin: 0 0 1px 0; }
div.ConvoGroupList a:hover { background-color: rgb(204, 224, 240); text-decoration: none; }
div.ConvoGroupList div { padding: 5px; }

div.NonMembers { float: left; text-align: left; }
div.NonMembers a { }
div.NonMembers a:hover { text-align: right; }

div.Members { float: right; text-align: right; }
div.Members a { }
div.Members a:hover { text-align: left; }

div.Convo { }
div.Convo div.PageBox { margin-bottom: 10px; }
div.Convo div.Read { }
/*div.Convo div.Message { margin: 1em 0 0 0; background-color: rgb(235, 235, 235); border-top: 1px solid white; border-bottom: 1px solid rgb(220,220,220); color: rgb(25,25,25); padding: 15px; }*/
div.Convo div.Left { text-align: left; }
div.Convo div.Right { text-align: right; }
div.Convo div.Left div { margin: 0 0 10px 220px; }
div.Convo div.Right div { margin: 0 220px 10px 0; }
div.Convo div.Left div.Date { float: right; }
div.Convo div.Right div.Date { float: left; }
div.Convo div.Message a.Anchor { float: left; }
div.Convo div.Message div.Name { font-size: 1.5em; }
div.Convo div.Message div.Name span { color: rgb(150,150,150); }
div.Convo div.Message div.HTML { line-height: 1.3em; }
div.Convo div.Message div.HTML p { margin: 0 0 1em 0; text-indent: 0; }
div.Convo div.Message div.HTML img { max-width: 610px; max-height: 610px; }
div.Convo div.Message div.HTML img.FloatLeft { margin: 0 1em 1em 0; } 
div.Convo div.Message div.Options { clear: both; }
div.Convo div.Message div.Picture { width: 200px; height: 200px; overflow: hidden; /*background-color: rgb(240,240,240);*/ margin: 0; }
div.Convo div.Left div.Picture { float: left; }
div.Convo div.Right div.Picture { float: right; }
div.Convo div.More { display: none; text-align: center; color: rgb(150,150,150); }
div.Convo div.Read { cursor: pointer; }
div.Convo div.Read div { margin: 0; }
div.Convo div.Read div.Name { float: left; font-size: 1.25em; }
div.Convo div.Read div.Picture { display: none; }
div.Convo div.Read div.HTML { height: 1.35em; overflow: hidden; } 
div.Convo div.Read div.HTML p { line-height: 1.5em; }
div.Convo div.Read div.Options { display: none; }
div.Convo div.Read div.More { display: block; clear: left; }
div.Convo div.Read .HeightAdjust { display: none; }

table.GraceVine { width: 100%; }
table.GraceVine th, table.GraceVine td { padding: 7px; text-align: left; font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; font-size: 11px; }
table.GraceVine tr td { background-color: rgb(235, 235, 235); border-top: 1px solid white; border-bottom: 1px solid rgb(220,220,220); color: rgb(50,50,50); }
table.GraceVine tr.Unread td { background-color: rgb(204, 224, 240); color: Black; }
table.GraceVine tr.Unread td.Subject { }
table.GraceVine tr .Subject { padding: 7px 7px 7px 22px; }
table.GraceVine tr td.Subject { font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; font-size: 14px; }
table.GraceVine tr td.Sticky { background-image: url(/v7/_images/icons/goldstar.png); background-position: left center; background-repeat: no-repeat; }
table.GraceVine tr:hover td { background-color: rgb(255,178,0); cursor: pointer; }
table.GraceVine tr .Date { text-align: right; }

.CheckBoxList { }
.CheckBoxList input { float: left; margin: 2px 0 0 0; }
.CheckBoxList label { margin: 0 0 0 5px; }

.RadioButtonList { }
.RadioButtonList input { float: left; margin: 2px 0 0 0; }
.RadioButtonList label { margin: 0 0 0 5px; }

#StalkerMenu { position: relative; top: 0; margin-bottom: 1em; overflow: hidden; }
div.StalkerMenu { background-image: url(/v7/_images/Stalker/2.png); height: 31px; padding: 3px 0 0 0; margin: 0 12px 0 12px; overflow: hidden; width: 886px; }
#StalkerMenu div.ExtraPadding { padding: 4px 0 0 0; height: 30px; }

/* security display */
.ReqLoggedIn { display: none; }
.ReqLoggedOut { display: none; }

.ReqIsAdmin { display: none; }

.ReqUL2 { display: none; }
.ReqUL3 { display: none; }
.ReqUL4 { display: none; }
.ReqUL5 { display: none; }
.ReqUL6 { display: none; }
.ReqUL7 { display: none; }
.ReqUL8 { display: none; }
.ReqUL9 { display: none; }
.ReqUL10 { display: none; }

div.LoggedIn .ReqLoggedIn { display: block; }
div.LoggedOut .ReqLoggedOut { display: block; }

div.IsAdmin .ReqIsAdmin { display: block; }

div.UL2 .ReqUL2 { display: block; }
div.UL3 .ReqUL3 { display: block; }
div.UL4 .ReqUL4 { display: block; }
div.UL5 .ReqUL5 { display: block; }
div.UL6 .ReqUL6 { display: block; }
div.UL7 .ReqUL7 { display: block; }
div.UL8 .ReqUL8 { display: block; }
div.UL9 .ReqUL9 { display: block; }
div.UL10 .ReqUL10 { display: block; }


/* rides */
table.Rides { width: 100%; }
table.Rides th, table.Rides td { padding: 7px; text-align: left; }
table.Rides tr td { background-color: rgb(235, 235, 235); border-top: 1px solid white; border-bottom: 1px solid rgb(220,220,220); color: rgb(75,75,75); }
table.Rides tr .Title { padding: 7px 7px 7px 22px; }
table.Rides tr:hover td { background-color: rgb(245,245,245); cursor: pointer; }
table.Rides tr .Date { text-align: right; }
table.Rides tr td div.Options { visibility: hidden; }
table.Rides tr:hover td div.Options { visibility: visible; }

/* resource library */
div.ResourceList { }
div.ResourceList div.Item { }
div.ResourceList div.Item div.Dt, div.ResourceList div.Item div.Author, div.ResourceList div.Item div.Reference { }
div.ResourceList div.Item div.Dt { float: left; }
div.ResourceList div.Item div.RightDetails { float: right; width: 200px; margin: 0 20px 0 0; }
div.ResourceList div.Item div.Author { margin: 0 0 .5em 0; }
div.ResourceList div.Item div.Reference { color: rgb(100,100,100); }
div.ResourceList div.Details { margin: 0 220px 0 120px; }
div.ResourceList div.Item div.Title { font-size: 1.5em; }
div.ResourceList div.Item div.File { margin: 1em 0 1em 0; padding: 0 0 0 23px; background-image: url(/v7/_images/icons/download.png); background-repeat: no-repeat; background-position: left 1px; }
div.ResourceList div.Item div.Description { font-size: 1em; }
div.ResourceList div.Item div.Options { margin: 1em 0 0 0; }

div.Pager { float: right; font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; font-size: 11px; }
div.Pager .PageLink, div.Pager .ActivePageLink { padding: 5px 7px 5px 7px; }
div.Pager .PageLink { background-color: rgb(87, 160, 217); color: Black; }
div.Pager .PageLink:hover { background-color: White; text-decoration: none; }
div.Pager .ActivePageLink { background-color: White; color: Black; }

/* page box */
div.PageBox { background: url(/v7/_images/PageBox/Flare.png) no-repeat left top; }
div.PageBox div.Top, div.PageBox div.Bottom { height: 6px; margin: 0 6px 0 6px; }
div.PageBox div.PageBoxCenter { padding: 10px 20px 10px 20px; }
div.PageBox div.PageBoxCenter *:first-child { margin-top: 0; }
div.PageBox div.PageBoxCenter *:last-child { margin-bottom: 0; }
div.PageBox div.C1, div.PageBox div.C3, div.PageBox div.C7, div.PageBox div.C9 { height: 6px; width: 6px; } 
div.PageBox div.C1, div.PageBox div.C7 { float: left; }
div.PageBox div.C3, div.PageBox div.C9 { float: right; }

div.DarkBox div.Top, div.DarkBox div.PageBoxCenter, div.DarkBox div.Bottom { background-image: url(/v7/_images/PageBox/Dark/BG.png); }
div.DarkBox div.C1 { background-image: url(/v7/_images/PageBox/Dark/1.png); }
div.DarkBox div.C3 { background-image: url(/v7/_images/PageBox/Dark/3.png); }
div.DarkBox div.C7 { background-image: url(/v7/_images/PageBox/Dark/7.png); }
div.DarkBox div.C9 { background-image: url(/v7/_images/PageBox/Dark/9.png); }

div.WhiteBox, div.WhiteBox h1, div.WhiteBox h2, div.WhiteBox h3, div.WhiteBox h4, div.WhiteBox h5 { color: rgb(50,50,50); }
div.WhiteBox div.Top, div.WhiteBox div.PageBoxCenter, div.WhiteBox div.Bottom { background-image: url(/v7/_images/PageBox/White/BG.png); }
div.WhiteBox div.C1 { background-image: url(/v7/_images/PageBox/White/1.png); }
div.WhiteBox div.C3 { background-image: url(/v7/_images/PageBox/White/3.png); }
div.WhiteBox div.C7 { background-image: url(/v7/_images/PageBox/White/7.png); }
div.WhiteBox div.C9 { background-image: url(/v7/_images/PageBox/White/9.png); }

/* picture frame */

div.PictureFrame { background-image: url(/v7/_images/PageBox/Dark/BG.png); padding: 5px; }
div.DarkBox div.PictureFrame { background: rgb(240,240,240); }

/* sermon highlight */
div.SermonHighlight { margin-bottom: 1em; }
div.SermonHighlight div.Date { color: rgb(150,150,150); }
div.SermonHighlight div.Title { font-size: 1.25em; }

div.ClassList div.Options { margin-top: 1em; }

div.InstanceList { }
div.InstanceList div.Instructor { float: right; text-align: right; }
div.InstanceList div.Title { font-size: 1.5em; }
div.InstanceList div.MeetingTime { margin: 1em 0 0 0; }
div.InstanceList div.Description { margin: 1em 0 1em 0;  }
div.InstanceList div.Location { margin: 0 0 1em 0; }
div.InstanceList div.EnrollmentWindow { float: right; }
div.InstanceList div.Enrollment { margin: 0 0 1em 0; }
div.InstanceList div.Enrolled { color: Green; margin: 1em 0 1em; font-weight: bold; }
div.InstanceList div.Options { float: right; }
div.InstanceList div.Actions { height: 25px; }


