/****   File Name:  jello_main.css.php  ************************************************
 *    Description:  This is the primary CSS file for the Intranet.  Colors used are:
 *  color scheme - http://www.steeldolphin.com/color_scheme.html @50% S, 80% B, Complimentary
 *				
 *				#CCAA66
 *				CCBB99
 *				CCC3B2
 *				87785A
 *				433C2D
 *				998C72
 *				B1AA9B
 *				515893
 *				727593
 *				838493
 *				444762
 *				222331
 *				55586E
 *				727380
 *		  Used By:	all non-Intranet files
 *                   
 *        Project:	Sphere Blue - the online avenue for artists and galleries
 *   Date Created:  2004.11.01
 *         Author:  Gene Nagle
 *					jello from: http://positioniseverything.net/easyclearing
 *								http://www.positioniseverything.net/articles/sidepages/jello-piefecta-geckofix.html
 *
 *	Code Copyright © 2005 by Tesla Technologies, All Rights Reserved.
 *
 *     Revision History
 *   Who   		  Date			CodeVersion - Comments
 *
 ***************************************************************************************/

html, body, ol, dl, dt, dd {
	margin: 0; 
	padding: 0;
	border: 0;
	list-style: none;
	font-size: 100.01%; 	/* this body font-size fixes an IE bug and maintains x-browser uniformity */ 
}

body {
	padding: 0 380px; 		/* the critical side padding that sets the natural min-width! */ 
	background: #55586E;
	color: #433C2D; 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	text-align: center; 	/* centers the #sizer element in IE5.x/win */
}

#sizer {
	margin: 0 auto; 		/* centers #sizer in standard browsers */
	padding: 0;
	width: 50%; 			/* this value controls liquidity; 0% = full rigid, 100% = full liquid */
	text-align: left; 		/* resets the default text alignment for the page */
	max-width: 300px;		/* determines how wide the box is on the page */
}

#expander { 				/* Any % height here causes IE to lose the neg right margin */
	margin: 0 -378px; 		/* neg side margin values should be less than or = to side body padding */
	min-width: 670px; 		/* This prevents Safari from losing the negative margins in narrow windows */ 
	position: relative; 	/* makes #expander visible outside #sizer in IEwin */
} 

/*\*/
* html #expander {height: 0;} 
/* #expander must have "height: 0" in IEwin bug fixing */

/* The above is a modified Holly hack for #expander, with zero substituted for the 
usual 1% height value. Any % value on this element causes a horrendous IE bug! */ 


#wrapper1 {
	position: relative;
	background: #CCBB99; 				/* this BG tiles the left column */
	font-size: .9em; 					/* set global font-size here */ 
	border: 2px solid #433C2D;
	
} /* this positioning may be needed for IEwin if page is to contain positioned elements */




/****************** Main Page Structure *****************/

/* To modify the side column widths and the col divider widths, the values that are 
marked "critical" and also refer to the desired mod MUST be changed as a group. */


.outer {
  background: white;						/* this BG tiles the center column */
  border-left: 0px solid #433C2D;			/*** Critical left divider dimension value ***/
  border-right: 2px solid #433C2D;			/*** Critical right divider dimension value ***/
  margin-left: 0px;    						/*** Critical left col width value (if left column used ***/
  margin-right: 280px; 						/*** Critical right col width value ***/
  zoom:1;									/*** IE7 fix ***/
}

.float-wrap {
  float: left;
  width: 100%;
}

.center {
  float: right;
  width: 100%;
}

.left {
  float: left;
  position: relative;		/* Needed for IE/win */
  width: 200px;    			/*** Critical left col width value ***/
  margin-left: -202px;    	/*** Critical left col width value ***/ /*** Critical left divider dimension value ***/
}

.right {
  background: #CCBB99;
  float: right; 
  position: relative; 		/* Needed for IE/win */
  width: 280px;   			/*** Critical right col width value ***/
  margin-right: -282px;		/*** Critical right col width value ***/ /*** Critical right divider dimension value ***/
  margin-left: 2px;   		/*** Critical right divider dimension value ***/
}

.centerbox {
  text-align: justify;
  overflow: visible;
  width: 100%;
}

.container-left {color: green;}

.container-right {color: #ccbb99;} 


/*************** Header and Footer elements *****************/

#header2 {  
 	position: relative; 					/* extra insurance against bugs in IEwin */
	background-image: url(/fitted/images/layout//bg_header_stripes.jpg);
	background-repeat: repeat-x; 			/* this BG tiles the right column */ 
}

.logo_top {
	background-image: url(/fitted/images/layout/nagle_logo_top.jpg);
	width: 150px;
	height: 41px;
}

.loggedin {
	color: #433C2D;
	clear: none;
	float: right;
	font-size: .9em;
	margin-right: 1em;
	}

.loggedin a {
	color: #433C2D;
}

.loggedin a:visited{
	color: #433C2D;
}

.loggedin a:hover {
	color: #515893;
}

.loggedin a:active {
	color: #433C2D;
}


.floatholder {
	margin: 0;
	background-image: url(/fitted/images/layout/bg_menu_linear.jpg);
	background-repeat: repeat-x; 
}

.floatholder p {margin: 0;}

.logo_bottom {
	background-image: url(/fitted/images/layout/nagle_logo_bottom.jpg);
	float: left;
	width: 150px;
	height:28px;
}

.logo_bottom p {margin: 0;}

#nav_menu {
	float:left;
	color: #CCBB99;
	padding: .5em;
	font-weight: bold;
	font-size: .9em;
	display: block;	
}

#nav_menu a {
	text-decoration: none;
	color: #CCC3B2;
	padding: .5em;
}

#nav_menu a:hover {
	text-decoration: none;
	color: #ffffff;
	padding: .5em;
	background: url(/fitted/images/layout/bg_menu_hover.jpg);
	background-repeat: repeat-x;
}

.footer {
  width: 100%;  
  clear: both;
  padding: 0 0 15px;
  position: relative;
}

.footer p {
	margin: 0px 0 0 20px;
	font-size: .75em;
	color: #838493;	
	text-align: center;
}

.footer p a {
	color: #CCBB99;
	text-decoration: none;
}

.footer p a:visited {
	color: #CCBB99;
	text-decoration: none;
}

.footer p a:hover {
	color: #efeff1;
	text-decoration: none;
}

.footer p a:active {
	color: #CCBB99;
	text-decoration: none;
}

.footer hr {
  color: #944;
	margin: 0;
	background: #944;
	height: 5px;
}


/************** Spacing Controls for various column contents ***************/

.textpadder {
	padding: 1em;	
}

.textpadder_right {
	padding: 0 8px 8px 8px;
	color: #222331 ;	
}

.textpadder_right a {
	color: #727593;	
}

.textpadder_right a:hover {
	color: #515893;	
}

/************** Generic Rules *************/

a {
	color: #515893;
}

a:hover {
	color: #533967;
}

p {
	margin: .8em 0;
	line-height: 1.5em;	
}



h2 {
	font-size: 1.2em; 
	text-align: left; 
	margin: .3em 0;
}

h3 {
	margin: .3em 0;
}

.small {font-size: .9em;}

.float_right {
	background: yellow;
}

div.float-left {/* header element float */
	float: left;
	width: 270px;
	margin: .3em .3em .3em 0;
}

img.art {
	border: 1px solid #000000;
}



/************** Special Fixes *************/

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}			/*** IE7 fix from - display: inline-table; ***/

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.outer {word-wrap: break-word;}
/* Prevents long urls from breaking layout in IE, must 
be hidden in a conditional comment for CSS to validate */

img {max-width: 100%;} 
/* prevents oversize images from breaking layout in browsers that support max-width */

/* \*/
* html #wrapper1,
* html #header2,
* html .outer a, 
* html .container-left, 
* html .container-right,
* html .outer,
* html h2,
* html .sidenav li a 
{height: 1%;}
/* Holly hack */


/*** Variance fixes for IEwin ***/

/*\*/
* html .outer p {margin-right: -6px;}
/* */


/**************** Utility Rules *******************/

/*\*/ /*/
.sidenav a:hover {position: relative;}
/* this fixes an IEmac hover bug in the left column, hidden from other browsers */


.brclear { /* Use a break with this class to clear float containers */
  clear:both;
  height:0;
  margin:0;
  font-size: 1px;
  line-height: 0;
}

.right_header {
  display: block;
  text-align: center;
  border-top: 1px solid #433C2D;
  border-bottom: 1px solid #433C2D;
  font-size: 1.2em;
  font-weight: bold;
  padding: .4em .2em;
  background: #55586E;
  color: #CCC3B2;
}

/******** tables do NOT inherit from main!!!***********/
/****       which is one GOOD reason not to use them **/
table { 
	margin: 1em 0;
	background: #eeeeee;
	color: #433C2D;
	font-size: 1em;
	border: 2px solid #55586E;
	border-collapse: collapse;
	width: 90%;
	}
	
table#navbar  { 
	background: none;
	border: 0px;
}
	
table.plain {
	clear:both;
	background: #efeff1;
	border: 0;
	text-align:center;
}

table.plain_white {
	clear:both;
	background: #fff;
	border: 0;
	text-align:center;
}

table#2col { 
	width: 90%;
	/* <![CDATA[ */ 
    	width:expression(document.body.clientWidth < 775 ?  380 : document.body.clientWidth - 370 );
	/* ]]> */ 
	}	

table th {
	padding: .2em;
	background: #55586E;
  	color: #CCC3B2;
}

table th a {
	color: #eeeeee;
}

table th a:hover {
	color: #ffffff;
}
	
table td {
	padding: .2em .4em .4em .2em;
	vertical-align: top;
	line-height: 1.5em;
}

table td.label {
	background: #838493;
  	color: #efeff1;
	text-align: right;
	line-height: 1.5em;
}

table tr.topborder {
	border-top: 1px solid #55586E;
}

table td.navbar_left {
	text-align: left;
	align: left;
	padding: 0;
	border-top: 0px;
	border-right: 0px;
	border-bottom: 1px solid #000000;
	border-left: 0px;
}

table td.navbar_right {
	text-align: right;
	align: right;
	padding: 0;
	border-top: 0px;
	border-right: 0px;
	border-bottom: 1px solid #000000;
	border-left: 0px;
}

table td a {
	color: #433C2D;
}

table td a:visited {
	color: #433C2D;
}

table td a:hover {
	color: #999933;
}

table td a:active {
	color: #433C2D;
}


td.highlighted {
	background: #efeff1;
	color: #433C2D;
}

div.image_container {
	background: #eeeeee;
	border: 1px solid #433C2D;
}

div.image_container_header {
	margin: 1em 0 0 0;
	padding: .3em .8em;
	border: 1px solid #433C2D;
	border-bottom: 0px;
	background: #55586E;
  	color: #CCC3B2;
}

div.image_container_header a {
	color: #EFFAFF;
}

div.image_container_header a:hover {
	color: #99BDCC;
}

div.spacer {
	clear: both;
}

div.float_thumb_mini {
	float: left;
	width: 90px;
	padding: 5px; 
}

div.float_thumb_mini p {
	text-align: center;
	margin: 0;
}

div.float_thumb_small {
	float: left;
	width: 130px;
	padding: 5px; 
}

div.float_thumb_small p {
	text-align: center;
	font-size: .8em;
	margin: 0;
}

div.float_thumb {
	float: left;
	width: 166px;
	padding: 8px; 
}

div.float_thumb p {
	text-align: center;
	margin: 0;
}

div.float_thumb_large {
	float: left;
	width: 266px;
	padding: 8px; 
}

div.float_thumb_large p {
	text-align: center;
	margin: 0;
}

div.float_thumb_max {
	float: left;
	width: 470px;
	padding: 10px; 
}

div.float_thumb_max p {
	text-align: center;
	margin: 0;
}

/*************BEGIN FORM SECTION**************/

input, select, textarea {
	margin-left: .5em;
}

fieldset {
	margin: 0;
	padding: 0;
	width: auto;
	border: 1px solid #433C2D;
}

fieldset br {
	display: none;
}

fieldset div {
	clear: both;
	margin: .2em 0;
	position: relative;
}

	
legend {
	color: #efeff1;
	margin: 1em;
	padding: .3em .4em;
	border: 1px solid #433C2D;
	background: #55586E;
  	color: #CCC3B2;
}

label, fieldset div.cr p {
	margin-bottom: 1em;
	display: block;
	width: 11em;
	text-align: right;
	float: left;
}

fieldset div.cr label {
	text-align: left;
	margin-left: 11em;
	width: auto;
	float: none;
}

.removed {
	display: none !important;
}

label.required {
	color:#FF0000;
	}
	
.invalid {
  background-color: yellow;
  }
  
/************* END FORMS SECTIONS ***********************/

/***************** EVENT SECTION ************************/
#event h3 {
	margin:15px 0 2px 0;
}

#event h6 {
	margin: 0;
	color:#8F836B;
}

#event span {
	padding-bottom: 15px;
}