/* $Header: /var/www/www.cpcaustin.org/RCS/cpc-css.php,v 1.5 2008/01/23 15:56:11 whb Exp whb $ */

html, body { margin: 0; padding: 0; border: 0; }
/*XX Hmm... (iframe gets this pseudo-border) */
html { background: #653; }

body {
  color: #000;
  margin: 4px;
  background: white;
  font-family: Arial, Helvetica, sans-serif;
}

img {border: 0;}

h1 { text-align: center; font-size: 1.6em;
  font-family: tahoma, arial, sans-serif; color: #653;
  margin-top: 0.5ex; margin-bottom: 0.5ex; }

h2 {font-size: 1.2em; font-family: verdana, sans-serif; margin-bottom: 0.75ex; }

input, textarea { border: 1px solid #653; background: #fed; }
input[type="radio"] { border: none; }
input[type="submit"] { background: #653; color: #fed; }
/* #963; */

/* We'll make this the default, to allow for anyone's oversight */
table { empty-cells: show; }

div.content {
  padding-left: .5em; padding-right: .5em;
  margin-bottom: 1.2ex;
}
/* same as above, but stays to the right of the Navigation section */
div.content-slim {
  padding-left: .5em; padding-right: .5em;
  margin-bottom: 1.2ex;
  margin-left: 9em;
}

/* "Generic" centered box */
.box80 { width: 80%; margin-left: 10%;
	margin-bottom: 1ex; padding: 0.2em;
	border: 1px solid #421;
	background: #fdc;
}

/* "Even More Generic" box */
.bg2vd {
	border: 1px solid #421;
	background: #fdc;
}

/* Some are box-only, some are td-only, some are shared */
.bbox { margin: 0.5ex auto; }
.bbox td { margin: 8px 0 0 0; }
.bbox th { margin: 8px 0 0 0; background: #fdc; }
.bbox, .bbox td ,.bbox th {
	border: 1px solid #421; border-collapse: collapse;
	font-family: Verdana,Arial,Helvetica; vertical-align: top;
	padding: 2px 4px;
}

/* Used in "sunday.phpi" for preacher/sermon/scripture box */
.sundaybox {
	float: right; margin-left: 0.2em; padding: 0.3ex 1em;
	border: 1px solid black; background: #fdc;
}

/* Used in "hotNews.htm" for alternating news items (should be used elsewhere) */
td.tan { background: #fed; }
td.pink { background: #fdc; }

/* Hold-overs from prev. site design: header mainText */
.header {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: bold;
	/* text-transform: capitalize; */
	color: #421;
}
.mainText {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	color: #333333;
}

/*** START: Items relating to fly-out menus ***/

.float-holder-right ul,
.float-holder-left ul { /* needs the Holly hack to avoid IE bugs */
  margin: 0; padding: 0; border: 0;
  border-top: 1px solid #000;
}

.nav li {
  margin: 0; padding: 0; border: 0;
  list-style: none; /* kills the list item "bullet" markers */
  border-bottom: 1px solid #000; /* Makes side borders on flyouts */
  position: relative;
  vertical-align: bottom; /* for IE5/win */
  font-weight: bold;
  font-family: arial, sans-serif;
  font-size: 8pt;
}

.nav a {
  display: block;
  vertical-align: bottom; /* needed for IE5/win */
  color: #653;
  text-decoration: none;
  padding: 5px 10px;
  border: 1px solid #000;
  border-width: 0 1px; /* Makes side borders on flyouts */
}

.nav a:hover {text-decoration: underline;} /* color: #c44; */

.nav a:focus, .nav a.sffocus { /* enhances the focus styling for keyboard tabbing */
  background-color: #00c !important;
  color: white;
}

.float-holder-top {	/* whb addition */
  height: 100%;			/* ensure that picture remains enclosed */
  border: 1px solid #000;
  margin: 0 -1px -1px 0;	/* picky pixels */
  padding: 6px;
  color: #fed;
  background: #653 url("/cgi-bin/banner");
  text-decoration: none;
  font: inherit;		/* picky IE */
  display: block;		/* because it's an Anchor, not a Div */
}
.float-holder-top:after { content: ""; display: block; height: 0; clear: both; }

.float-holder-left {
  /* 9em seems a good fit for widest menu item, "Life of the Church" */
  width: 9em;
  float: left;
  margin: 0 10px 0 0;
}

.float-holder-right {
  /* We'll give this one a bit more width than -left */
  width: 12em;
  float: right;
  margin: 0 0 0 10px;
}

.nav div {
  width: 150px;
  position: absolute;
  left: -3000px;
}

/* \*/
.nav div {
  width: 220px;
  wid\th: 150px;
}
/* Box model fix for IE5.x Win */

.float-holder-left div {
  padding: 30px 60px 30px 10px;
}

.float-holder-right div {
  padding: 30px 10px 30px 60px;
}

.float-holder-left div.leftbox,
.float-holder-right div.leftbox {
  padding: 30px 10px 30px 60px;
}

.float-holder-left div.rightbox,
.float-holder-right div.rightbox {
  padding: 30px 60px 30px 10px;
}

.float-holder-left .nav div.zone,
.float-holder-right .nav div.zone {
  padding: 0;
  /* width: 150px; */
  height: 10px;
  left: -3000px;
  top: auto;
  bottom: -10px;
  font-size: 1px;
}

.float-holder-left .nav li:hover div.zone,
.float-holder-right .nav li:hover div.zone {
  left: 0;
}

.float-holder-left li:hover div div,
.float-holder-left div li:hover div div,
.float-holder-right li:hover div div,
.float-holder-right div li:hover div div {
  left: -3000px;
}

.float-holder-left li:hover div,
.float-holder-left div li:hover div,
.float-holder-left div div li:hover div.rightbox,
.float-holder-right div div li:hover div.rightbox {
  left: 8.9em;
  top: -28px;
}

.float-holder-left div div li:hover div.leftbox,
.float-holder-right li:hover div,
.float-holder-right div li:hover div,
.float-holder-right div div li:hover div.leftbox {
  left: auto;
  right: 8.9em;
  top: -28px;
}

.li1 {z-index: 10; background: #fed;}
.li1 li {background-color: #fdc;}
.li1 li li {background-color: #ecb;}

.li2 {z-index: 9; background: #fed;}
.li2 li {background-color: #fdc;}
.li2 li li {background-color: #ecb;}

.li3 {z-index: 8; background: #fed;}
.li3 li {background-color: #fdc;}
.li3 li li {background-color: #ecb;}

.li4 {z-index: 7; background: #fed;}
.li4 li {background-color: #fdc;}
.li4 li li {background-color: #ecb;}

.li5 {z-index: 6; background: #fed;}
.li5 li {background-color: #fdc;}

.li6 {z-index: 5; background: #fed;}
.li6 li {background-color: #fdc;}

.li7 {z-index: 4; background: #fed;}
.li7 li {background-color: #fdc;}

.li8 {z-index: 3; background: #fed;}
.li8 li {background-color: #fdc;}

.li9 {z-index: 2; background: #fed;}
.li9 li {background-color: #fdc;}

.liA {z-index: 1; background: #fed;}
.liA li {background-color: #fdc;}

.nav ul a {color: #653;}
.nav li li li li a { color: #000; }

.float-holder-left .arrow {
  background: url(images/arrow-right.gif) no-repeat 100% 50%;
}

.float-holder-right .arrow {
  background: url(images/arrow-left.gif) no-repeat 0 50%;
}

.arrow-double {
  background: url(images/arrow-double.gif) no-repeat 0 50%;
}

.in-arrow-right {
  background: url(images/arrow-right.gif) 0 .4em no-repeat;
}

.in-arrow-left {
  background: url(images/arrow-left.gif) 100% .4em no-repeat;
}

/* \*/ /*/

.nav div, .nav ul ul .leftbox, .nav ul ul .rightbox {
  position: relative;
  left: 5px;
  padding: 0;
}

.nav .arrow, .nav .arrow-double {border-bottom: 1px solid #000;}

.zone {display: none;}

.classW {font-size: .6em !important;}

.classW div,
.classW ul ul .leftbox,
.classW ul ul .rightbox,
.classW li:hover div,
.classW ul li:hover div .leftbox,
.classW ul ul .rightbox {
  position: relative !important;
  left: 5px !important;
  top: 0 !important;
  padding: 0 !important;
}

.classW .arrow,
.classW .arrow-double,
.classW .in-arrow-right,
.classW .in-arrow-left {
  border-bottom: 1px solid #000;
  background-image: none  !important;
}

.classW .zone {display: none;}