/* ---------------------------------------------

Title: OBT Stylesheet
Author(s): Angelo Simeoni, Ben Schulkin

T.O.C.
001. Globals
002. Typography
003. Layout
004. Forms

--------------------------------------------- */

/* 001. Globals */

html, body, div, span,
applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dd, dl, dt, li, ol, ul,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	line-height: 1;
	font-family: inherit;
	text-align: left;
	vertical-align: baseline;
}
a img, :link img, :visited img {
	border: 0;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
ol, ul {
	list-style: none;
}
q:before, q:after,
blockquote:before, blockquote:after {
	content: "";
}

html {
	background: #111;
	color: #111;
}

body {
	font-size: 62.5%;
	font-family: Helvetica, Arial, sans-serif;
	background: #111;
	color: #111;
	text-align: center;
	margin: 0 1em;
	line-height: 1;
}
strong {
	font-weight: bold;
}


#main a:hover {
	color: inherit;
}
/* 002. Typography */

#content p, #content address {
	font-size: 1.2em;
	margin: 4px 0 4px 20px;
	clear: left;
}


.hr {
	background: url(/images/horizontal-dot.gif) top left repeat-x;
	border: none;
	height: 1px;
	margin: 15px 0;
}

p, li, dd, dt   {
	font-size: 1.2em;
}

h1 {
	font-size: 1.8em;
}

h2 {
	font-size: 1.6em;
	font-weight: bold;
	}
h2.name {
	text-decoration: underline;
	color: #09628E;
	clear: left;
}

h3 {
	font-size: 1.4em;
	font-weight: bold;
	padding-top: .5em;
	xbackground: url(/images/horizontal-dot.gif) top left repeat-x;
}

dt {
	font-weight: bold;
	}
dd, dt {
	line-height: 1.4;
	padding: 0 10px;
}	
.group {
clear: left;
display: block;
}
dl {
	float: left;
	width: 33%;
	margin: 0 0 1em 0;
}

address {
	font-size: 1.2em;
	line-height: 1.2;
}

a:link {
	color: #16455c;
}

a:visited {
	color: #16455c;
}

a:hover {
	color: #36657c;
}

a:active {
	color: #16455c;
}

#content h1, #content h2, #content p, #content h3, #content address, #content dt {
	margin: 10px;
}
#content dd {
	margin: 10px 20px;
}

#content p {
	line-height: 1.4;
	padding-bottom: .5em;
}



fieldset h1, fieldset h2, fieldset p {
	margin: 0 0 .5em 0;
}

ul#site-nav {
	position: absolute;
	top: 15px;
	right: 15px;
	color: #1f6487;
	list-style-type: none;
}

ul#site-nav li {
	display: inline;
}

#site-nav a:link {
	text-decoration: none;
	color: #1f6487;
}

#site-nav a:visited {
	text-decoration: none;
	color: #1f6487;
}

#site-nav a:hover {
	text-decoration: underline;
	color: #1f6487;
}

#site-nav a:active {
	text-decoration: none;
	color: #1f6487;
}

#user-nav, #user-nav-logged-in  {
	position: absolute;
	bottom: 15px;
	right: 15px;
	color: #111;
	list-style-type: none;
}

ul#user-nav li {
	background: url(/images/user-bullet.gif) left center no-repeat;
	float: left;
	padding: 6px 0 6px 10px;
	margin: 0 0 0 15px;
}

#user-nav a:link {
color: #111;
text-decoration: none;
padding: 6px 60px 6px 0;
}

#user-nav a:visited {
color: #111;
padding: 6px 60px 6px 0;
text-decoration: none;
}

#user-nav a:hover {
color: #111;
padding: 6px 60px 6px 0;
text-decoration: underline;
}

#user-nav a:active {
color: #111;
padding: 6px 60px 6px 0;
text-decoration: none;
}

#user-nav-logged-in span {
	background: url(/images/user-bullet.gif) left center no-repeat;
	float: left;
	margin: 0 0 0 15px;
	padding: 6px 60px 6px 10px;
	font-size: 1.2em;
}

#user-nav-logged-in .logged-in-as {
	background: none;
	float: left;
	padding: 6px 0 6px 10px;
	margin: 0;
}

#user-nav-logged-in .view-profile, #user-nav-logged-in .logout{
	float: left;
	padding: 6px 0 6px 10px;
	margin: 0 0 0 10px;
}

.login {
	background: url(/images/login.gif) right center no-repeat;
}

.signup {
	background: url(/images/signup.gif) right center no-repeat;
}

#navigation ul {
	list-style-type:none;
}

#navigation li {
	float:left;
	/* width:192px; */
	width: 19%; /* come up with a more graceful fix for ie5.5 so nav expands full width - ALSO small full width bug in safari */
	w\idth: 20%;
	xbackground: url(/images/main-nav-bullets.gif) 100% 50% no-repeat;
	font-size: 1.4em;
}

#navigation a {
	font-family: verdana;
	display:block;
	/* width:192px; */
	width: 100%;
	xbackground: url(/images/main-nav-bullets.gif) 0 50% no-repeat;
	color:#EEE; 
	text-align:center; 
	padding:6px 0; 
	text-decoration:none; 
	float:left; 
}

#navigation li.last, #navigation li.first a {
	background-image: none;
}

#navigation a:hover {
	color:#fff; 
	background:#398a87;
}

#sub-navigation ul {
	list-style-type:none;
}


#sub-navigation li {
	float:left;
	width: 25%; /* 34%; */ /* come up with a more graceful fix for ie5.5 so nav expands full width - ALSO small full width bug in safari */
	w\idth: 25%; /* 34%; */
	xbackground: url(/images/main-nav-bullets.gif) 100% 50% no-repeat;
	font-size: 1.2em;
}

#sub-navigation a {
	font-family: verdana;
	display:block;
	/* width:192px; */
	width: 100%;
	xbackground: url(/images/main-nav-bullets.gif) 0 50% no-repeat;
	color:#EEE; 
	text-align:center; 
	padding:6px 0; 
	text-decoration:none; 
	float:left; 
}

#sub-navigation li.last, #sub-navigation li.first a {
	background-image: none;
	
}

#sub-navigation li.last, #sub-navigation li.first {
	/* BRS: width: 33%; */
	width: 25%;
}


#sub-navigation a:hover {
	color:#fff; 
	background:#398a87;
}

/* 003. Layout */

#header {
/*	width: 962px; */ /* MAKE ME ELASTIC */ 
	min-width: 760px;
	max-width: 962px;
	background: #efe7c6;
	margin: 0 auto;
	text-align: left;
}

#content {
	min-width: 760px;
	max-width: 962px;
	background: #f0e7c8;	
	xbackground: #efe7c6;
	margin: 0 auto;
	text-align: left;
	padding: 1px 0; /* decide on max width, implement on all page layout areas. */
	min-height:240px; 
	height:auto;
}
/* for Internet Explorer */
/*\*/
* html #content {
	height: 240px;
}
/**/

#navigation, #sub-navigation {
	min-width: 760px;
	max-width: 960px;
	/* width: 962px; */
	/* w\idth: 960px; */ /* MAKE ME ELASTIC */ /* ie 5.5 sbmh http://centricle.com/ref/css/filters/tests/sbmh/ */
	background: #111;
	margin: 0px auto;
	text-align: left;
	border: 1px solid #398a87;
}

#sub-navigation {
	margin: 3px auto 0 auto;
}

#header {
	height: 150px;
	position: relative;
	background: url(/images/header.jpg) top right no-repeat;
	margin: 1em auto 0 auto;
}

#header h1, #header h2 {
	text-indent: -9999px;
}

#logo {
	display: block;
	position: absolute;
	top: 15px;
	left: 15px;
	width: 417px;
	height: 117px;
	background: url(/images/new_obt_logo.gif) top left no-repeat;
}

#logo a {
	display: block;
	width: 349px;
	height: 117px;
	text-decoration: none;
}

#graphics {
	height: 126px;
	min-width: 760px;
	max-width: 962px;
	margin: 3px auto;
}

#graphic-one {
	background: url(/images/header-graphic-1.jpg) top left no-repeat;
	width: 320px;
	width: 34%;
	height: 126px;
	float: left;
}

#graphic-two {
	background: url(/images/header-graphic-2.jpg) -5px 0px no-repeat;
	width: 322px;
	width: 33%;
	height: 126px;
	float: left;	
}

#graphic-three {
	background: url(/images/header-graphic-3.jpg) top right no-repeat;
	width: 320px;
	width: 33%;
	height: 126px;
	float: left;
}

#content {
	margin: 3px auto;
	xbackground: #F8F2e2;
}

#main {
	width: 63%;	
	float: left;
}
/* not sure what this code was for, but was causing inconsistent display of site typography.
#main h1{
	padding: 30px 30px 5px 30px;
	background: url(/images/h1-bullet.gif) 15px 35px no-repeat;
}
#main p {
	margin: 0 30px 15px 30px;
	line-height: 1.4;
	font-size: 1.4em;
}
*/
#sidebar, .sidebar {
	width: 36%;	
	float: right;
}

.sidebar li {
	font-size: 1em;
	}

#sidebar-content {
	background: url(/images/vertical-dot.gif) top left repeat-y;
	padding: 0 0 0 15px;
	margin: 0 0 15px 0;
}

#sidebar p {
	margin: 30px 30px 0 0px;
	line-height: 1.4;
}

#sidebar ul {
	float: left;
	color: #16455c;
	font-weight: bold;
	margin: 1em 1em 0 0;
}

#sidebar li {
	margin: 0 0 0 1.5em;
	line-height: 1.4;
	list-style-type: square;
}

#sidebar h2.library, #sidebar h2.listen {
	background: url(/images/sidebar-h2.gif) 0 4px no-repeat;
	font-size: 1.4em;
	margin: 0 0 1em 0;
	padding: 0 0 0 16px;
}

#sidebar h2.library a:link, #sidebar h2.library a:visited, #sidebar h2.library a:hover, #sidebar h2.library a:active {
	width: 70%;	
	padding: 3px 60px 3px 0;
	display: block;
	xbackground: url(/images/play-button.gif) top right no-repeat;
}

#sidebar h2.listen a:link, #sidebar h2.listen a:visited, #sidebar h2.listen a:hover, #sidebar h2.listen a:active {
	width: 70%;
	padding: 3px 60px 3px 0;
	display: block;
	background: url(/images/play-button.gif) top right no-repeat;
}

#footer {
	clear: both;
	color: #927a27;
	xcolor: #eFc84A;
	text-align: center;
	min-width: 760px;
	max-width: 962px;
	/* width: 962px; *//* MAKE ME ELASTIC */ 
	background: #111;
	margin: 0 auto;
	padding: 1em 0;
	position: relative;
	top: 2px; /* needed for home footer bottom border */

}

/* BRS: 6/3/08
#footer p {
	text-align: center;
	letter-spacing: 1px;
	word-spacing: 1px;
	line-height: 1.6;
padding: 0;
margin: 0;
}
*/

#footer span {
	font-size: 1.1em;
	text-align: center;
	letter-spacing: 1px;
	word-spacing: 1px;
	line-height: 1.6;
padding-right: 15px;
padding-left: 15px;
margin: 0;
}

#footer a:link,
#footer a:visited, 
#footer a:hover, 
#footer a:active {
	color: #a6ce39;
}

.clearfix {
	clear: both;
}

/* -------------------------------
accordion
------------------------------- */

.term li{
	display: block;
	height: 1px;
	}
a.search {
	display: block;
	padding: 3px 3px 3px 1em !important;
	margin: 0px 1px;
	background: url(/images/li.gif) 5px 6px no-repeat;
	color: #111;
	overflow: auto;
}

div>.term li {
	height: auto;
}


.type a:hover {
	background: #ffd85a url(/images/li.gif) 5px 6px no-repeat;
}

li a.search-selected {
	background-color: #a0e1ff;
	color: #111;
}

.cue {
	padding: 3px;
}

.type {
	background: #FFF;
	border: 1px solid #cdc5a2;
	margin: -1em 2px 4em 0;
	float: left;
	position: relative;
	left: 7px;
	height:625px; 
	overflow: auto;
}


.type h1 {
	font-size: 1.2em;
	background: #cdc5a2 !important;
	background-image: none !important;
	padding: 4px 0 2px 2px !important;
	margin: 0 !important;
}

.type ul {
	margin: .5em 0 0 0;
}

.type li {
	list-style-type: none;
	font-size: 1.1em;
}

#search-by {
	margin: 1em 0 0 10px;
}

#search-h1 {
	float: left;
	padding: 0 0 0 15px;
	background: url(/images/h1.gif) 0 25% no-repeat;
}

#content h1 {
	margin: 0px;
	padding: 10px 0 0 24px;
	background: url(/images/h1.gif) 10px 14px no-repeat;
}

#search-by .on {
	font-weight: bold;
	text-decoration: none;
}

#search-by a:hover.on {
	text-decoration: underline;
}

.directions {
	font-weight: normal;
}

.form_error {
	display: block;
	color: #C00;
}
#error_for_license_id {
font-size: 1.2em;
margin: 0 0 .5em 0;
}

#search {
position: absolute;
top: 35px;
right: 15px;
}
#search label {
font-size: 1.2em;
}
#search input {
width: 8em;
}

#search #cue_lookup_submit {
width: auto;
}

/* credit page additions */

.credit-callout {
font-size: 12px;
margin-top: 5px;
padding-left: 14px;
font-weight: bold;
background: url(/images/star.png) top left no-repeat;
font-style: italic;
}