html{font-size:medium; background:#fff url(bg_page.gif) 0 0 repeat-x;}
body{
	font-size:62.5%;
	font-family:georgia,times,"times new roman",serif;
	}
html,body,h1,h2,h3,h4,h5,h6,p,a,img,blockquote,
dl,dt,dd,ol,ul,li,form,fieldset,legend,label,
table,caption,thead,tbody,tfoot,tr,th,td{
	margin:0;
	padding:0;
	font-weight:normal;
	}
ul{list-style:none;}
img,fieldset{border:none}

#topbar{
	height:24px;
	width:100%;
	background:transparent url(bg_topbar.gif) 50% 0 repeat-x;
	}
	#topbar em{
		display:block;
		width:850px;
		margin:0 auto;
		position:relative;
		font-style:normal;
		}
	#topbar em a{
		height:42px;
		width:204px;
		display:block;
		position:absolute;
		top:0px;
		right:28px; /* use multiples of 4  because pattern is 4px wide*/
		color:#6D4E0F;
		background:transparent url(bg_topbar_tab_text_dual.gif) 50% 0 no-repeat;
		text-indent:-9999px;
		}
	#topbar em a:hover{background-position:50% bottom}

#page{
	width:852px;
	margin:0 auto;
	}
body#home{background:transparent url(bg_home.jpg) 50% 0 no-repeat;}
body#home #page{background:transparent url(bg_home.jpg) 50% -24px no-repeat;}

body#internal, body#internal #page{background:transparent url(bg_typewriter.jpg) 50% 0 no-repeat}

/* backgrounds for main (top nav tab) pages */
body#media-training, body#media-training #page{background:transparent url(bg_tv.jpg) 50% 0 no-repeat}
body#blog-workshop, body#blog-workshop #page{background:transparent url(bg_typewriter_key.jpg) 50% 0 no-repeat}
body#presentation-skills-training, body#presentation-skills-training #page{background:transparent url(bg_mic.jpg) 50% 0 no-repeat}
body#crisis-communications, body#crisis-communications #page{background:transparent url(bg_radio.jpg) 50% 0 no-repeat}
body#strategic-communications, body#strategic-communications #page{background:transparent url(bg_camera.jpg) 50% 0 no-repeat}

/* backgrounds for other (footer nav tab) pages */
body#blog, body#blog #page{background:transparent url(bg_typewriter_key.jpg) 50% 0 no-repeat}
body#about, body#about #page{background:transparent url(bg_typewriter.jpg) 50% 0 no-repeat}
body#contact, body#contact #page{background:transparent url(bg_typewriter.jpg) 50% 0 no-repeat}
body#tipcard, body#tipcard #page{background:transparent url(bg_typewriter.jpg) 50% 0 no-repeat}




#header-home{
	height:280px;
	position:relative;
	}
	#header-home p{
		position:absolute;
		right:12px;
		bottom:14px;
		}
	#header-home p.hide{display:none;} /* for homepage nav rollover and text swapping action */
	
	#header-home strong{
		color:#6D3200;
		font-size:220%;
		font-weight:normal;
		display:block;
		text-align:right;
		padding:0 0 10px 100px;
		}
	#header-home em{
		color:#58595B;
		font-size:120%;
		font-style:normal;
		display:block;
		clear:both;
		text-align:right;
		line-height:1.2em;
		padding:0 0 0 290px;
		}
		
#header{
	height:60px;
	position:relative;
	}
	#header h1{
		height:34px;
		width:144px;
		position:absolute;
		top:18px;
		left:28px;
		}
		#header h1 a{
			display:block;
			height:34px;
			width:144px;
			text-indent:-9999px;
			background:transparent url(logo_small_home.gif) 0 0 no-repeat;
			}

#content{
	width:850px;
	margin:0 0 0 1px;
	float:left
	}
.divided{background:transparent url(divider.gif) 509px 0 repeat-y} /* to draw the divider line between the main content and sidebar */
body#home #content{margin-bottom:8px}

	#content h2{
		color:#6d3200;
		font-size:220%;
		padding:0 0 12px;
		margin:0 0 12px;
		border-bottom:dashed #cacaca 1px;
		}
	#content #main h3{
		color:#6d4e0f;
		font-size:180%;
		padding:8px 0 0;
		margin:0 0 -6px 0;
		}
	#content h4{
		color:#000;
		font-family:"trebuchet ms",trebuchet,arial,sans-serif;
		text-transform:uppercase;
		font-size:110%;
		letter-spacing:1px;
		padding:10px 0 0;
		margin:0 0 0 0;
		}
	#main{
		float:left;
		width:462px;
		margin:0 0 0 30px;
		padding:24px 0 0;
		}
	* html #main{display:inline} /* IE6 hack */
	
	
	/* this is really hacky, but I couldn't get IE to play nice otherwise */
	#main p#space{
		display:block;
		margin:0.5em 0;
		height:20px;
		}
		
	#main.bottomline p#space{ /* add this class to the #main div if bottom border is needed -- like so "<div id="main" class="bottomline">  no need to change the html for "<p class="bottomline"> */
		border-top:dashed #ccc 1px;
		}
		
	#main a{
		color:#A27924;
		text-decoration:none;
		border-bottom:dotted #A27924 1px;
		}
	#main a:hover{
		color:#6d3200;
		border-bottom:dotted #6d3200 1px;
		}
	#main p{
		font-size:120%;
		margin:1em 0;
		line-height:1.5em;
		}
		#main ul{
			font-size:120%;
			margin:-0.75em 0 0.5em 0;
			line-height:1.5em;
			padding:0 0 10px 0;
			}
			#main ul li{
				background:transparent url(bullet.gif) 0 0.5em no-repeat;
				padding-left:26px;
				}
				
		#main ol{
			font-size:120%;
			margin:-0.75em 0 1em 23px;
			line-height:1.5em;
			padding:5px 0 0 0;
			}
			#main ol li{
				padding-left:12px;
				list-style-type: decimal;
				}
			
	#main cite{
		display:block;
		padding:20px 0 0;
		border-top:dashed #cacaca 1px;
		font-size:120%;
		color:#666;
		}
	
	#sidebar{
		float:right;
		width:338px;
		position:relative;
		padding:24px 0pt 26px;
		}
	* html #sidebar{display:inline} /* IE6 hack */
	
	#sidebar a{
		color:#A27924;
		text-decoration:none;
		border-bottom:dotted #A27924 1px;
		}
	#sidebar a:hover{
		color:#6D3200;
		border-bottom:dotted #6D3200 1px;
		}
	
	#sidebar em.crumb{
		display:block;
		margin:0 0 26px 6px;
		font-size:120%;
		}
		
		#portraits{
			margin:0 auto;
			}
		
			#portraits ul{
				float:left;
				}
				#portraits ul li{
					float:left;
					width:160px;
					margin:0 4px 16px;
					border-bottom:
					}
				*html #portraits ul li{margin:0 2px 16px} /* IE6 hack */
				
					#portraits ul li img{
						background:#fff;
						padding:4px;
						border:solid #6D3200 1px;
						display:block;
						}
					#portraits ul li img.fade{border-color:#E0D5CA}
					
					#portraits ul li h3{
						font-family:"trebuchet ms",trebuchet,arial,sans-serif;
						text-transform:uppercase;
						font-size:100%;
						letter-spacing:1px;
						font-weight:bold;
						border-top:dashed #ccc 1px;
						margin-top:10px;
						padding:6px 0 0 6px;
						}
			#portraits em{
				display:block;
				clear:both;
				color:#6D3200;
				font-size:120%;
				text-indent:6px;
				}
			#portraits em.more{
				width:322px;
				margin:0 auto;
				padding:12px 0 0;
				font-size:120%;
				border-top:dashed #ccc 1px;
				}

		#sidebar .quote{
			clear:both;
			width:294px;
			margin:62px auto 0 auto;
			border:dashed #cacaca 1px;
			border-width:1px 0 1px 0;
			padding:12px 0 14px;
			}
		#sidebar .first{border-width:1px 0 1px 0;} /* if using multiple .quote - add this class to the first one -- like so: <div class="quote first"> */
		#sidebar .second{border-width:0 0 1px 0;}
		
		#sidebar .top2{margin-top:2px}	/* a bit hackish, but you can use these (or create new ones) to control the top margin -- like so: <div class="quote first top2"> */
		#sidebar .top37{margin-top:37px}
		#sidebar .top100{margin-top:100px}
		#sidebar .top150{margin-top:150px}
		#sidebar .top250{margin-top:250px}
		
			#sidebar .quote blockquote{
				color:#6d3200;
				font-family:"trebuchet ms",trebuchet,arial,sans-serif;
				font-size:110%;
				margin:0 0 12px;
				line-height:1.6em;
				text-indent:-0.6em;
			    }
			* html #sidebar .quote blockquote{text-indent:0} /* ie6 hack */
			#sidebar .quote cite{
				color:#a27924;
				font-family:"trebuchet ms",trebuchet,arial,sans-serif;
				font-style:normal;
				text-transform:uppercase;
				}
				#sidebar .quote cite strong{
					color:#666;
					font-family:georgia,"times new roman",times,serif;
					font-weight:normal;
					display:block;
					font-size:120%;
					padding-top:3px;
					text-transform:none;
					}
					#sidebar .quote cite strong em{
						color:#000;
						}
	
#nav-home{
	width:850px;
	margin:0 auto;
	height:75px;
	}
	#nav-home ul{
		height:75px;
		}
	 #nav-home ul li{
		width:170px;
		height:75px;
		float:left;
		}
		#nav-home ul li a{
			width:170px;
			height:75px;
			display:block;
			text-indent:-9999px;
			}
		#nav-home ul li.media-training a{background:#EADBBA url(tab_media-training.gif) 0 0 no-repeat}
		#nav-home ul li.blog-workshop a{background:#EADBBA url(tab_blog-workshop.gif) 0 0 no-repeat}
		#nav-home ul li.presentation-skills-training a{background:#EADBBA url(tab_presentation-skills.gif) 0 0 no-repeat}
		#nav-home ul li.crisis-communications a{background:#EADBBA url(tab_crisis-communications.gif) 0 0 no-repeat}
		#nav-home ul li.strategic-communications a{background:#EADBBA url(tab_strategic-communication.gif) 0 0 no-repeat}
		#nav-home ul li a:hover{background-position:0 bottom}
		
#nav{
	width:850px;
	margin:0 auto;
	height:75px;
	}
	#nav ul{
		height:75px;
		}
	 #nav ul li{
		width:170px;
		height:75px;
		float:left;
		}
		#nav ul li a{
			width:170px;
			height:75px;
			display:block;
			text-indent:-9999px;
			}
		#nav ul li.media-training a{background:transparent url(tabs_media-training.gif) 0 0 no-repeat}
		#nav ul li.blog-workshop a{background:transparent url(tabs_blog-workshop.gif) 0 0 no-repeat}
		#nav ul li.presentation-skills-training a{background:transparent url(tabs_presentation-skills.gif) 0 0 no-repeat}
		#nav ul li.crisis-communications a{background:transparent url(tabs_crisis-communications.gif) 0 0 no-repeat}
		#nav ul li.strategic-communications a{background:transparent url(tabs_strategic-comm.gif) 0 0 no-repeat}
		#nav ul li a:hover{background-position:0 bottom}

		
#footer{
	width:850px;
	margin:0 auto 20px;
	padding: 0 0 20px 0;
	clear:both;
	position:relative;
	}
body#home #footer{margin-top:8px}

	#footer ul {
		height:102px;
		border-bottom:dotted #D0BC91 1px;
		margin:0 0 14px;
		}
		#footer ul li{
			height:102px;
			float:left;
			background:transparent url(bg_footer.gif) 0 0 no-repeat;
			}
		#footer ul li.blog{
			width:171px;
			}
			#footer ul li.blog a{
				display:block;
				background:transparent url(footer_divider.gif) right 0 no-repeat;
				}
		#footer ul li.about{
			width:170px;
			background-position:50% 0;
			}
			#footer ul li.about a{
				display:block;
				background:transparent url(footer_divider.gif) right 0 no-repeat;
				}
		#footer ul li.contact{
			width:170px;
			background-position:50% 0;
			}
		#footer ul li.tipcard2{
			width:280px;
			background-position:50% 0;
			}
		#footer ul li.tipcard{
			width:229px;
			background-position:right 0;
			}
			#footer ul li a{
				display:block;
				height:82px;
				text-decoration:none;
				padding:16px 0 0 14px;
				color:#A27924;
				}
			#footer ul li.tipcard a{
				padding-top:14px;
				}
			#footer ul li a em{
				text-transform:uppercase;
				font-style:normal;
				border-bottom:dotted #A27924 1px;
				}
			#footer ul li a:hover em{
				color:#6d3200;
				border-bottom:dotted #6d3200 1px;
				}
			#footer ul li a strong{
				display:block;
				font-size:200%;
				color:#6D3200;
				font-weight:normal;
				padding:0 0 10px;
				}
			#footer ul li a small{
				font-size:90%;
				text-transform:uppercase;
				letter-spacing:1px;
				color:#000;
				}
				#footer ul li a small span{
					color:#6D3200;
					}
	
	/* these will turn off  top borders for footer nav tabs when using BODY ID -- for "current" or "you are here" state 
	could add "body#contact #footer ul li.contact" if needed */
	body#blog #footer ul li.blog,
	body#about #footer ul li.about{background:transparent}
	
	#footer div.tipcard{
		position:absolute;
		top:-20px;
		right:-65px;
		}
		
		#footer div.tipcard2{
		position:absolute;
		top:-20px;
		right:200px;
		}
	#footer div.fineprint{
		color:#E8C38A;
		line-height:1.9em;
		}
		#footer div.fineprint a.logo{
			width:115px;
			height:17px;
			display:block;
			float:left;
			text-indent:-9999px;
			background:transparent url(logo_small.gif) 0 0 no-repeat;
			}
		#footer div.fineprint a.login{
			float:left;
			margin-left:72px;
			color:#E8C38A;
			text-transform:uppercase;
			text-decoration:none;
			}
		#footer div.fineprint a.login:hover{text-decoration:underline}
		
		#footer div.fineprint p.copy{
			float:right;
			text-align:right;
			}
			#footer div.fineprint p.copy a{
				color:#A27924;
				text-decoration:none;
				}
			#footer div.fineprint p.copy a:hover{border-bottom:dotted #A27924 1px}
	
form#tipcardform{
	margin:0 0 20px 0;}
form#tipcardform p em{
	display:block;
	color:#777;
	}
	form#tipcardform fieldset fieldset input{
		display:block;
		float:left;
		width:215px;
		margin-right:10px;
		border:solid #cacaca 1px;
		font-family:inherit;
		font-size:120%;
		padding:3px 0;
		text-indent:3px;
		}
	form#tipcardform legend{
		font-family:"trebuchet ms",trebuchet,arial,sans-serif;
		color:#000;
		font-size:110%;
		text-transform:uppercase;
		letter-spacing:1px;
		margin:0 0 6px 0;
		padding:0;
		}
	form#tipcardform fieldset{
		margin-bottom:10px;
		}
	form#tipcardform fieldset fieldset{
		float:left;
		}
	form#tipcardform fieldset fieldset.clear{
		clear:both;
		}
	form#tipcardform input.wide{
		width:445px;
		}
	form#tipcardform label{
		clear:both;
		display:block;
		float:left;
		font-family:"trebuchet ms",trebuchet,arial,sans-serif;
		color:#6D3200;
		}
		
cfform#tipcardform{
	margin:0 0 20px 0;}
cfform#tipcardform p em{
	display:block;
	color:#777;
	}
	cfform#tipcardform fieldset fieldset input{
		display:block;
		float:left;
		width:215px;
		margin-right:10px;
		border:solid #cacaca 1px;
		font-family:inherit;
		font-size:120%;
		padding:3px 0;
		text-indent:3px;
		}
	cfform#tipcardform legend{
		font-family:"trebuchet ms",trebuchet,arial,sans-serif;
		color:#000;
		font-size:110%;
		text-transform:uppercase;
		letter-spacing:1px;
		margin:0 0 6px 0;
		padding:0;
		}
	cfform#tipcardform fieldset{
		margin-bottom:10px;
		}
	cfform#tipcardform fieldset fieldset{
		float:left;
		}
	cfform#tipcardform fieldset fieldset.clear{
		clear:both;
		}
	cfform#tipcardform input.wide{
		width:445px;
		}
	cfform#tipcardform label{
		clear:both;
		display:block;
		float:left;
		font-family:"trebuchet ms",trebuchet,arial,sans-serif;
		color:#6D3200;
		}