/* -------- 
Our outer box is (visually) 740 px but we need a little extra room in case options are too big for their box
so we set the tricky container system below to a width of 770.
This throws of our centering slightly so I've put a 1% left margin on which compensates pretty well
 -------- */
body {
	margin-top: 0;  /* does KF want that? */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align:center;
}
table {	/* need this or tables embedded in our content may try to clear the sidebar */
	clear:none;
}
/* This idea from www.cssplay.co.uk/boxes/width3.html */
/* for all browsers that understand min-width */
.width {width:50%; min-width:770px; padding:0 0 0 1%; margin:0 auto;}

/* the bodge for IE6 browsers */
* html .minwidth {border-left:770px solid #fff; position:relative; float:left; z-index:1;}
* html .widthcontainer {margin-left:-770px; position:relative; float:left; z-index:2; text-align:left;}


/* First some styles for the major pieces of the page layout */
#container {
/*	margin: 0;
	margin-right: auto;
	margin-left: auto; */
	text-align:left;
}
//to center the container set margin-left: auto intead of 0; 
/* Removing width so we can overflow. Must not rely on floating against right edge though
	width: 740px;
	\width: 760px;
	w\idth: 740px;
*/

#banner {
	margin: 0;
	background-color: #0099CC;
}

#titlebox{
	width:580px;
	margin-left: 150px;
}
/*  \*/
* html #titlebox {
	margin: 0;
	width:575px;
}
/* The chunk above is seen by IE */

#sidebar {
	float: left;
	width: 150px;
	\width: 160px;
	w\idth: 150px;
	background-color: #FFCC00;
	padding: 20px 0px 0px 0px;
	text-align:left;
}

/* use this in conjunction with sidebar */
#content {					/* setting a width will cause IE to want to clear this to below the sidebar */
	padding: 5px;
	padding-right: 0;
	margin-left: 150px;
	text-align:left;
}

.floatholder {					
	padding:0;
	margin:0;
	text-align:left;
}
/* Hides from IE-mac \*/
* html .floatholder {height: 1%;}
/* End hide from IE-mac */


/* use this if not using a sidebar */
#widecontent {
	width: 655px;
	padding: 5px 0 5px 0;
	margin-left: 40px;
	text-align:left;
}

#footer {
	clear: both;
	padding: 5px;
	margin-top: 0;
}


/* This fixes an IE bug where float and clear in our item layout made our sidebar collapse */
/* Contain the floats using the :after method */
#IEfloatfix:after {
	content: ".";  
	display: block; 
	height: 0; 
	clear: both; 
	visibility:hidden;
}

/*  \*/
* html #IEfloatfix {
	height: 1%;
}
/*  */
/* End float containing rules */


/* from /Templates/general.css */
p {  font-family: Arial, Helvetica, sans-serif; font-size: small; font-style: normal}
h1.hdg {  font-family: Arial, Helvetica, sans-serif; font-size: large; font-style: #000000}
h2 {  font-family: Arial, Helvetica, sans-serif; font-size: large; font-style: italic; color: #000000}
h2.hdg {  font-family: Arial, Helvetica, sans-serif; font-size: medium; font-style: normal}
h3 {  font-family: Arial, Helvetica, sans-serif; font-size: small; font-style: normal; color: #000000}
ul {  font-family: Arial, Helvetica, sans-serif; font-size: small; font-style: normal}
ol {  font-family: Arial, Helvetica, sans-serif; font-size: small; font-style: normal}


/* for ei transitioning to xf */

form {
	margin:0;
}
/* In-your-face type for shouting */
.loud{
	font-size: 16px;
}
.louder{
	font-size: 18px;
	font-weight: bold;
}

/* Two varieties of the cyan bar */
td.bar {
	background-color: #0099cc;
	color: White;
	font-weight: bold;
	width: 600px;
}
div.bar {
	background-color: #0099cc;
	color: White;
	font-weight: bold;
}
/* Used in sidebar to set off a block of text */
div.cushion {
	padding: 20px 6px 20px 6px;
	font-weight: normal;
	font-size: 12px;
	line-height: 17px;
}
div.cushionLite {
	padding: 10px 6px 10px 6px;
	font-weight: normal;
	font-size: 12px;
	line-height: 17px;
}

/* Various styles used in checkout forms */
/* the gold bar */
div.altbar {
	background-color: #FFCC66;
	font-size: 16px;
	color: Black;
	font-weight: bold;
	clear: both;
}
/* used to indent blocks of stuff in checkout forms */
div.chkoutblk {
	margin-left: 100px;
	padding: 10px 0 10px 0;
}
/* sometimes set to left of the above for a radio button */
div.chkoutleft{
	float: left;
	padding: 10px 0 10px 80px;
}
/* like the pair above but with a wider left side where we put prompts */
div.chkoutblkA {
	margin-left: 200px;
	padding: 5px 0 5px 0;
}
div.chkoutleftA{
	float: left;
	clear: left;
	width: 195px;
	text-align: right;
	padding: 5px 0 5px 0;
	font-size: 16px;
	font-weight: bold;
}


.prompt {
	font-size: 16px;
	color: Black;
	font-weight: bold;
}
.small {
	font-size: 12px;
	color: Black;
}

.bigbutton {
	width: 100px;
}

ul.bold{
	font-weight: bold;
	font-family: Arial;
}
li{
	margin: 3px;
}
.hidden{
	display: none;
}
sup {
	font-size:55%;
}

/* A few styles used by SB3D utilities and the like */
.technote {
	background-color:#ffff99;
	border: thin solid #ffcc66;
	font-size: 75%;
	color: #404040;
	margin:0;
	padding:5px;
}
.tech {
	color: #AE7600;
	font-size: 85%;
	margin:0;
}