/* CSS Document ----- jasonohler.com
Fehringer Studios - Seattle WA USA*/


body {
	background-color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-image: url(../imageSite/jo-bkgrnd1.gif);
	background-repeat: repeat;
	}
	
/* =========================================== MASTER GRID ================================================/* ==

/*--- centers all content --- */
#centerPage {
	position: absolute;
	left: 50%;
	top: 20px;
	width: 760px;
	height: auto;
	margin-top: 0px;
	margin-left: -380px;
	overflow: visible;
	
	}

#Quicklinks-splash-adjustment {
	position: relative;
	left: 10px;
	}
/*--- adds border along page borders --- */
#header,
/* --- #navGlobal,--- */
#breadBar,
#dspBody {
	border-left-style: solid;
	border-left-color: #CCCCCC;
	border-left-width: 1px;
	border-right-color: #CCCCCC;
	border-right-style: solid;
	border-right-width: 1px;
	border-top-color: #CCCCCC;
	border-top-style: solid;
	border-top-width: 1px;
	border-bottom-color: #CCCCCC;
	border-bottom-style: solid;
	border-bottom-width: 1px;

	}
#header {
	position: absolute;
	width: 760px;
	height: 100px;
	left: 0px;
	top: 0px;
	background-color: #FFFFFF;
	clear: both;
	}

#dspBody {
	position: absolute;
	width: 100%;
	left: 0px;
	top: 100px;
	background-color: #FFFFFF;
	padding-top: 30px;
	
	}
	
#dspBodySplash {
	position: absolute;
	width: 100%;
	left: 0px;
	top: 100px;
	background-color: #FFFFFF;
	padding-top: 30px;
	border-left-style: solid;
	border-left-color: #CCCCCC;
	border-left-width: 1px;
	border-right-color: #CCCCCC;
	border-right-style: solid;
	border-right-width: 1px;
	
	border-bottom-color: #CCCCCC;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	}

#dspBodySplashCenter {
	position: absolute;
	left: 200px;
	width: 500px;
	}
	
#nav {
	position: absolute;
	width: 100%;
	height: 20px;
	top: 80px;
	background-color: #FF9933;
	z-index: 1;
	}
	
#navGlobal {
	position: absolute;
	width: 100%;
	height: 20px;
	padding-left: 100px;
	font-size: 12px;
	font-weight: bold;
	z-index: 0;
	margin-left: -1px;
	margin-bottom: 0px;
	margin-top: 0px;
	/*line-height: 1.7em;*/
	}
#breadcrumbs {
	position: absolute;
	width: 500px;
	height: 10px;
	left: 150px;
	top: 110px;
	z-index: 100;
	border-bottom: solid 1px #666;
	}


/* ========================= FONTS ===========================*/
h1 {
	font-size: 13px;
	color: #666666;
	font-weight: bold;
	}
h1 span {
	font-size: 13px;
	font-weight: normal;	
	}
h2 {
	font-size: 11px;
	font-weight: normal;	
	}
h2 span {
	font-weight: bold;	
	}
h3 {
	font-family: "Times New Roman", Times, serif;
	font-size: 16px;
	font-weight: bold;
	color: #999999;
	}
h3 span {
	font-weight: normal;
	}
h4 {
	font-size: 14px;
	font-weight: normal;
	
	}
h4 span {
	font-weight: bold;
	}
h5 {
	font-weight: normal;
	font-size: 11px;
	}
h5 span{
	color: #666666;
	font-weight: bold;
	}
h6 {
	font-size:9px;
	line-height: 1px;
	color: #333333;
	font-weight: normal;
	margin: 0;
	}

h8 {
	font-size: 9px;
	line-height: 3px;
	color: #993300;
	font-weight: normal;
	font-style: italic;
	}
/*-------- >> h7 is "u-r-here" tage for non-list items << -------- */
h7 {
    color: #FF9933;
	font-weight: bold;
}
    
p {
	font-size: 11px;
	color: #333333;
	line-height: 14px;
	}
		
p span {
	font-weight: bold;
	}


/*--- for the storytelling page  ---*/

#quicklinks {
	
	padding: 5px;
	border: solid 2px;
	margin-left: 25px;
	}
	
#quicklinkstitle {
	font-size: 12px;
	font-weight: bold;
	
	}
	
#insetbox {
	vertical-align: bottom;
	padding-right: 8px;
	padding-left: 10px;
	padding-top: 2px;
	padding-bottom: 5px;
	text-align: right;
	border: solid 2px;
	border-color:#996600;
	margin-left: 25px;
	margin-bottom: 6px;
	width: 150px;
	float: right;
	font-size: 11px;
	color: #663300;
	}

#insetmenu {
	vertical-align: bottom;
	border: solid 2px;
	border-color:#FF9900;
	margin-left: 25px;
	margin-bottom: 15px;
	padding: 10px;
	width: 150px;
	float: right;
	}

#insetmenuLarge {
	vertical-align: bottom;
	border: solid 2px;
	border-color:#FF9900;
	margin-left: 25px;
	margin-bottom: 15px;
	padding: 10px;
	width: 150px;
	float: right;
	}
	
li .storylist {
	font-size: 10px;
	margin: 0px 0px 0px -15px;
	}

li .storylistfirst {
	font-size: 10px;
	margin: 0px -10px 0px -15px;
	}

/* end of storytelling page divs */
	
p.quote {
	padding-left: 20px;
	font-style: italic;
	}

p.dentleft10 {
	margin-left: 20px; 
	text-indent: -10px; 
	}

p.lists {
	margin-left: 25px; 
	text-indent: -16px; 
	margin-top: 10px; 
	margin-bottom: 0px;
	}

p.listsdashes {
	margin-left: 35px; 
	text-indent: -10px; 
	margin-top: 6px; 
	margin-bottom: 0px;
	}
	
p.listssmall {
	margin-left: 25px; 
	text-indent: -16px; 
	margin-top: 10px; 
	margin-bottom: 0px;
	}
	
p.lists-numbered {
	margin-left: 15px; 
	text-indent: -28px; 
	margin-top: 10px; 
	margin-bottom: 0px;
	}
	
p.lists-SiteIndex-Body {
	margin-left: 10px; 
	margin-top: 10px; 
	margin-bottom: -5px;
	}
	
p.lists-SiteIndex-TopLine {
	margin-left: 10px; 
	margin-top: 5px; 
	margin-bottom: -5px;
	}
	
#footer p {
	color: #666666;
	font-size: 8px;
	}
	
#photos {
	border: 1px;
	border-color: #000000;
	border-style: solid;
	margin: 5px 10px 0px 0px;
	}
	
#listItems {
	margin-top: 5px; 
	margin-bottom: -5px; 
	margin-left: 10px;
	font-size: 11px;
	color: #333333;
	line-height: 14px;
	}

/*	--- from teach it on the web */
#col3L {
	position: absolute;
	margin-left: 0px;
	margin-top: 0px;
	padding-left: 0px;
	padding-top: 0px;
	width: 150px;
	height: 1500px;
	background-color: #ff9933;
	}
	
	

/*--- trying to have text accompanying pictures on page "At work" vertical align to the bottom
#conference-photos-text {
	align-vertical: bottom;
	}
end of trying to have text accompanying pictures on page "At work" vertical align to the bottom */

/* ===================================== >> CLASSES << ====================================
   ======================================================================================== */
	
/*-------- >> defines HEADERS << -------- */
.pgHead {
	font-size: 16px;
	color: #FF9933;
	font-weight: bold;
	line-height: 16px;
	margin-top: 0px;
	}
.pgSubhead {
	font-size: 12px;
	font-weight: bold;
	color: #999999;
	margin-top: -5px;
	}
.head-sidebar {
	font-size: 12px;	
	color: #CC9966;
	font-weight: bold;
	border-bottom: 1px solid #DDDDDD;
	height: 24px;
	margin-bottom: 10px;
	margin-top: 10px;
	}

/*--- The below controls just the Quick links list on the splash page */

.head-sidebar-splash-quicklinks {
	font-size: 12px;	
	color: #CC9966;
	font-weight: bold;
	
	height: 12px;
	margin-bottom: 10px;
	margin-top: 10px;
	}
/*--- The above controls just the Quick links list on the splash page */
	
.title {
	font-size: 12px;
	color: #333333;
	font-weight: bold;	
	margin-top: 10px;
	margin-bottom: -5px;
	}

.title-siteindex {
	font-size: 12px;
	color: #333333;
	font-weight: bold;	
	margin-top: 20px;
	margin-bottom: 0px;
	}
	
/*--- may not need this any more for wisdom lists

.titlewisdomlists {
	font-size: 12px;
	color: #333333;
	font-weight: bold;	
	}
*/
	
.subtitle {
	font-size: 9px;
	color: #333333;
	font-weight: lighter;
	line-height: 11px;
	margin-top: 8px;
	
	}
	
.subtitle-quotes {
	font-size: 9px;
	font-family: Arial;
	color: #333333;
	font-weight: lighter;
	line-height: 11px;
	margin-top: 10px;
	margin-left: 25px;
	margin-bottom: 20px;
	}
	
.subtitle-noitalics {
	font-size: 9px;
	color: #333333;
	font-weight: lighter;
	line-height: 11px;
	margin-top: 8px;
	}
	
.comment {
	font-size: 9px;
	color: #333333;
	font-weight: normal;
	line-height: 11px;
	padding-right: 10px;
	}

	
	
/* -------- >> define TABLES << --------- */

.tbl-body {
	width: 710px;
	margin-left: 20px;
	top: 20px;
	border: 0;	
	}
.tbl-body tr {
	border: 0;	
	}

.tbl-body-splash {
	width: 710px;
	margin-left: 20px;
	top: 20px;
	border: 0;	
	}
.tbl-body-splash tr {
	border: 0;
	vertical-align: bottom;	
	}

.tbl-body-splash td {
	border: 1;	
	}

.tbl-col1,
.tbl-col2,
.tbl-col3 {
	vertical-align: top;
	border: 0;
	}

.tbl-col1-splash,
.tbl-col2-splash,
.tbl-col3-splash {
	vertical-align: bottom;
	border: 0;
	}
.tbl-col1 {
	width: 130px;
	text-align: right;
	color: #CC6633;		
	}

.tbl-col1-leftjust {
	width: 130px;
	text-align: left;
	color: #CC6633;		
	}

.tbl-col1 p {
	padding-right: 10px;
	}

#col1txt {
	font-weight: bold;
	padding-right: 10px;
	font-size: 10px;
	}
	
.tbl-col2 {
	width: 400px;
    }
	
.tbl-col1-splash {
	width: 200px;
	margin-left: 10px;
	font-size: 12px;
    }

 .tbl-col1-splashv2 {
	width: 160px;
	margin-left: 10px;
	font-size: 12px;
	vertical-align: bottom;
	border: 0;
    }
	

.tbl-col2-splash {
	width: 450px;
    }
	
.tbl-col2-lists p {
	font-size: 11px;
	color: #333333;
	line-height: 14px;
	}
	
.tbl-col3-splash {
	padding-left: 20px;
	 }
	
.tbl-footer {
	text-align: center;	
	padding-top: 40px;
	border: 0;
	
	}

#test {
	position:relative;
	left:40px;
	}

/* ------- begin - wisdom list pages ---- */

#wisdom1
{font-size: 11px;
	line-height: 14px;
	color: #333333;
	vertical-align: top;
	}
#wisdom1.TD 
{font-size: 11px;
	color: #333333;
	text-valign: top;
	text-align: top;
	td-valign: top;
	
	}
/* ------- end - wisdom list pages ---- */
	
/* -------- >> define table for other column 1 
#wisdom1.TR 
{}
<< --------- */
	
/* -------- >> define table for other column 1 << --------- */
.tbl-workshops-col1 {
   vertical-align: top;
   padding top: 40 px;
   text-align: right;
	border: 0;
	}
	


/* -------- >> define misc OBJECTS << --------- */

.img-book {
	margin-top: 35px;
	padding-right: 10px;
	}

.img-book-workshops {
	margin-top: 100px;
	padding-right: 10px;
	}
	
.img-line {
	margin-top: 20px;
	}

.img-line-divider {
	margin-top: 15px; 
	margin-bottom: 10px;
	}
	
.sidebar-r {		
	margin-top: -5px;
	margin-left: 20px;
	}

/* ====================================== LISTS ========================================*/	

ul, ol, li {
	font-size: 11px;
	color: #333333;
	line-height: 14px;
	}

ul.black-bracket-bold {
	list-style-image: url(../imageLib/indent-bracket-bold2-black.gif);
	}

ul.indent-bracket-gif {
	list-style-image: url(../imageSite/brownArrow2Narrow2.gif);
	line-height: 16px;
	margin-left: -20px;
	}

ul.black-bracket-bold-leftjust {
	list-style-image: url(../imageLib/indent-bracket-bold2-black.gif);
	/* margin: 0px 0px 0px 0px; */
	}

ul.dash {
	list-style-image: url(../imageLib/dash.gif);
	}

ul.bracket-bold2-sublist {
	list-style-image: url(../imageSite/indent-bracket-bold2-sublist.gif);
	margin-left: -25px;
	line-height: 20px;
	}

/* --- 
ul.black-bracket-bold-testimonials {
	margin-left : 25px; 
	text-indent : -16px; 
	margin-top: 10px; 
	margin-bottom: -5px;
	list-style-image: url(../imageLib/indent-bracket-bold2-black.gif);
	}
*/

/* for splash page */
li.leftjust {
	margin: 12px 0px 0px -20px;
	}
	
li.leftjust.nomePictText {
	margin: 12px 20px 0px -20px;
	font-size: 10px;
	}

li.leftjust-testimonials {
	margin: 5px 0px 0px -20px;
	list-style-image: url(../imageLib/indent-bracket-bold2-black.gif);
	}
	
li.right-indent1 {
	margin: -10px 0px -15px +16px;
	list-style-image: url(../imageLib/indent-bracket.gif);
	}

li.right-indent1-only {
	margin: -10px 0px -5px +16px;
	list-style-image: url(../imageLib/indent-bracket.gif);
	}

li.right-indent2 {
	margin: 5px -15px -5px +22px;
	list-style-image: url(../imageLib/indent-bracket-double.gif);
	}

li.right-indent1 {
	margin: 0px 0px px 0px;
	}
	


dt {
	color: #666666;
	font-size: 14px;
	font-weight: bold;
	padding-top: 10px;
	line-height: 12px;
	}
dt span{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #999999;
	font-size: 8px;
	font-weight: lighter;
	}

dd {
	font-size: 11px;
	color: #999999;
	line-height: 14px;
	}

#navGlobal ul, #navGlobal li {
	display: block;
	float: left;
	margin: 0;
	padding: 0;
	}
#navGlobal li {
	height: 20px;
	text-align: center;
	border-left: 1px solid #FFF;
	}
	
.sidebar-r ul , 
.sidebar-r li {
	list-style-type: square;
	color: #CC9966;
	line-height: 14px;
	padding-bottom: 10px;`
	padding-left: -20px;
	}

.sidebar-r-splash ul , 
.sidebar-r-splash li {
	list-style-type: square;
	color: #CC9966;
	line-height: 14px;
	
	padding-bottom: 0px;
	padding-left: -20px;
	}
	
/* ------------- >> design details << -----------------*/	

#topLine { /* ---places line above the block --*/	
	border-top: 1px solid #CCCCCC;
	height: 24px;
	padding-top: 8px;
}
	
#bottomLine { /* ---places line below the block --*/	
	border-bottom: 1px solid #DDDDDD;
	height: 24px;
	}
	
#topAndBottomLine { /* ---places line above and below the block --*/	
	border-top: 1px solid #CCCCCC;
	height: 24px;
	padding-top: 8px;
	border-top: 1px solid #CCCCCC;
	padding-top: 8px;
	}

/* --------------------- >> links << -------------------------- */

 a,
 a:visited {  
 	text-decoration: none; 
	color: #333333;
	}
a:hover {
	color: #CC9966;
	text-decoration: underline;
	}
a.dsplink:link,
a.dsplink:visited {
   color: #CC6633;
   text-decoration: underline;
   }
a.dsplink:hover {
	color: #993300;
	text-decoration: underline;
	}

/* storytelling menu links */


a.dsplink-story:link,
a.dsplink-story:visited {
   color: #CC6633;
   font-size: 10px;
   margin-bottom: -5px;
   margin-top: -5px;
   }
   
a.dsplink-story:hover {
	color: #993300;
	font-size: 10px;
	margin-bottom: -5px;
    margin-top: -5px;
	}

	
a.dsplink-plain:link,
a.dsplink-plain:visited {
   color: #CC6633;
   }
a.dsplink-plain:hover {
	color: #993300;
	}
	
a.dsplink-handouts:link,
a.dsplink-handouts:visited {
   color: #CC6633;
  
   font-weight: bold;
   }
a.dsplink-handouts:hover {
	color: #993300;
	text-decoration: underline;
	font-weight: bold;
	}

/* ---- column 1 links - because I can now (1/4/2005) use the dsplink attributes, I don't need this
.tbl-col1 a,
.tbl-col1 a:visited {  
 	text-decoration: none; 
	color: #CC9966;
	}
.tbl-col1 a:hover {
	color: #CC9966;
	text-decoration: underline;
	}
--- */

/* ---- footer 1 links ----- */		
#footer a,
#footer a:visited {  
 	text-decoration: none; 
	color: #999;
	}
#footer a:hover {
	color: #333366;
	}
	
#navGlobal li a {
	display: block;
/* 	float: left; */
	width: 109px;
	margin: 0;
	padding: 0;
	height: 20px;
	color: #FFFFFF;
	text-decoration: none;
	text-align: center;
	}
#navGlobal li a:hover {
	display: block;
	color: #FF9933;
	background-color: #FFFFFF;
	}


.u-r-here {
	list-style-type: square;
	color: #FF9933;
	font-weight: bold;
	
	}


/* ---------------------------- horizontal lists from Colleen --------------------------------*/	

 ul#navlistHorizontal
{
margin-left: 0;
padding-left: 0;
white-space: nowrap;
margin-bottom: 8px; 
}

#navlistHorizontal li
{
display: inline;
list-style-type: none;
}

#navlistHorizontal a { padding: 3px 10px; }

#navlistHorizontal a:link, #navlistHorizontal a:visited
{
color: #333333;
background-color: #ffffff;
text-decoration: none;
}

#navlistHorizontal a:hover
{
color: #ff9900;
background-color: #ffffff;
text-decoration: underline;
}

	/* ---------------------------------- grid details ------------------------------------*/	
#logo {
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 10;
	}	
#logoType {
	position: absolute;
	left: 225px;
	top: 20px;
	font-size: 36px;
	color: #CCCCCC;
	}
	
/* =================================== NAVIGATION =====================================*/		

#navAdmin {
	position: absolute;
	left: 618px;
	height: 10px;
	top: 40px;
	font-size: 9px;
	color: #669999;
	z-index: 20;
	letter-spacing: 1px;
	margin-top: 0px;
	}	

#navCrumbs {
	font-size: 9px;
	color: #999999;
	position: absolute;
	top: 107px;
	left: 100px;
	z-index: 51;
	}


/* ==================================== define COLUMNS =================================== */

/*  --------------------->> 2 COL << --------------------------  */

#col2-left {
	position: absolute;
	float: left;
	margin-left: 0px;
	padding-left: 80px;
	width: 400px;
	overflow: visible;
	background-color: #FFFFFF;
	height: auto;
	z-index: 20;
	clear: none;
	}
#content-L{
	position: absolute;
	top: 90px;
	}
#col2-right {
	position: relative;
	float: right;
	width: 205px;
	height: 245px;
	padding-right: 25px;		
	padding-top: 90px;
	z-index: 20;
	}


/*  --------------------->> 3 COL << --------------------------  */

#col3-left {
	position: absolute;
	width: 100px;
	top: 90px;
	left: 25px;
	}
#col3-middle {
	position: absolute;
	width: 400px;
	top: 20px;
	left: 140px;
	}
#col3-right {
	position: absolute;
	width: 200px;
	top: 40px;
	left: 550px;
	}

#dspText {
	padding-bottom: 25px;
	}
#dspImg {
	float: left;
	padding-right: 10px;
	padding-bottom: 15px;
	margin-top: 10px;
	}
	
	/*------ For wisdom lists --- */
	
/*------  may not need these for wisdom lists anymore 
.mainheading {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	color:   #003300;
	font-weight: 400;
}

.style1 {
	color: #990000;
	font-weight: bold;
}
.style3 {
	color: #990000;
	font-weight: bold;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
}
--- */
	
.topofpage {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: italic;
	color:   #003300;
	font-weight: 400;
	
}

.bookquotesdate {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 10px;
}
	


/* ----REDEFINE HTML --- */

input {
	font-size: 11px;
	color: #666666;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: 200px;
	}

.submit {
	font-size: 11px;
	color: #666666;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: 100px;
	}
	
select {
 font-size: 11px;
 color: #999999;
	}

textarea {
 font-size: 11px;
 color: #666666;
font-family: Verdana, Arial, Helvetica, sans-serif;
	}
.altrow {
	background-color: #F1F1F1;
	}
hr {
	width: 200px;
	height: 1px;
	margin-left: 0px;
	}
	
#quicklinkssplash ul {
	line-height: 12px;
	list-style-image: url(../imageLib/indent-bracket.gif);
	position: relative;
	top:30px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 8px;
    }
	
	 li #quicklinkssplash {
	position: absolute;
		margin-top: 10px;
		}
/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX INDIVIDUAL PAGE  STYLES AND LAYOUT  XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/