/*----------------------------- Last Modified  2006.11.10 ----------------------------
  Copyright Einstein Industries 2006. Used with Permission.
  May not be duplicated or reproduced.
  Please check for cross-browser compatibility prior to making changes
  MINIMUM BROWSER CHECK :: IE5.x/IE6/Firefox/Safari
  CSS Document - layout.css
--------------------------------------------------------------------------------------*/



/*------------------------------------------------------------------------------------
  undo some default styling of common (X)HTML browsers
--------------------------------------------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td,html,label,table,tr,td {margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img,a img,:link img,:visited img {border:0;}
address,caption,cite,code,dfn,th,var {font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%;}
q:before,q:after {content:'';}


/* Targetable by class IE 5.5 & IE 6 png hack */
.pngfix { behavior: url(iepngfix.htc) }
 
  
 
/* IE SELECT object hack 
IE6 and below requires an iframe element above a SELECT form object in order to hide it 
*/

iframe#case-viewer-iframe {
	filter: progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0);
	height: 30px;
	position: absolute;
	left: 70px;
	top: 45px;
	width: 210px;
	z-index: 90;
}
 
/* ------------------------ GLOBAL ELEMENTS ------------------------ */

/* ------------------------ type selectors ------------------------ */
body { 
	background: #153276 url("../../images/viewer/bg-body.jpg") top repeat-x;
	color: #fff;
	font: 12px/16px Helvetica, "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-align: center; 
}

blockquote { 
  margin-left: 10px;
  margin-right:10px;
}

h1 { font-size: 1.2em; color: #000; }
h2 { font-size: 1.1em; color: #000; }
h3 { font-size: 1.0em; color: #000; }

h1 span, h2 span, h3 span	{ display: none; }

a:link, a:visited	{ color: #fff; text-decoration: underline; outline: none; }
a:hover, a:active	{ color: #fff; text-decoration: underline; outline: none; }

/* ------------------------ classes ------------------------ */

.clear	{ 
	clear:both;
}

div.clear	{ 
	height: .01em; 
	overflow: hidden; 
}

p.back-to-top {
	text-align:right;
	display:block;
	padding-right:15px;
	background:url("../../images/viewer/bullet-back-to-top.html") right no-repeat;
	}

/* ------------------------ SPECIFIC ELEMENTS ------------------------ */

/* Player Body */

#player-body {
	background: url(../../images/viewer/bg-player.png) no-repeat;
	height: 550px;
	padding-top: 24px;
	width: 1000px;
}

#header-container {
	height: 26px;
}
#header-container h1 {
	float: left;
	font-size: 18px;
	line-height: 20px;
	margin: 2px 27px 0 50px;
}
#header-container a, #header-container h1, #header-container h2 {
	color: #1e4180;
	font-size: 18px;
	text-decoration: none;
}
#header-container h2 {
	float: right;
	margin: 2px 45px 0 0;
	text-align: right;
	width: 200px;
	line-height: 20px;
}

/* Top of page "Hat" div */

#hat {
	background: #000;
	font: 14px 'Lucida Sans',Verdana,Arial;
	height: 25px;
	padding: 5px 0 0 0;
	text-align: center;
}

#hat a {
	background: url(../../images/viewer/hat-icon.png) no-repeat;
  padding-left: 20px;
}

body.windowed #hat {
  display: none;
}

/* Player portal is the rectangle div below the header and above the contact console. */

#player-portal {
	width: 942px;
	height: 383px;
	margin: 0 0 0 32px;
	overflow-x: hidden;
	overflow-y: hidden;
	overflow: hidden;
	position: relative;
}

/* Case Viewer, displays two images side by side for opening with fancyzoom. Along with description information and navigation. */

#case-viewer {
	background: url(../../images/viewer/bg-case-viewer.jpg) no-repeat;
	width: 942px;
	height: 383px;
	position: absolute;
	top: 0px;
	left: 0;
	z-index: 100;
}
#case-viewer div.case-browser-header {
	position: absolute;
	width: 357px;
	height: 37px;
	background: url(../../images/viewer/case-browser-header_01.png) no-repeat;
	top: 346px;
	left: 0;
}
#case-viewer-left-col {
	float: left;
	width: 291px;
	height: 345px;
	overflow-x: hidden;
	overflow-y: auto;
	padding-top: 26px;
}
#case-viewer-left-col a:link,
#case-viewer-left-col a:visited {
	color: #fff;
	border-bottom: solid 1px #676767;
	text-decoration: none;
}
#case-viewer-left-col a:hover,
#case-viewer-left-col a:active {
	color: #fff;
	border-bottom: solid 1px #676767;
	text-decoration: underline;
}
#case-viewer-left-col p {
	margin: 0 32px 5px 29px;
}
#case-viewer-left-col .category {
	font-size: 16px;
	font-weight: bold;
	margin-top: 1em;
}
#case-viewer-left-col {
	color: #aaa;
}
#case-viewer-left-col .highlight, #case-viewer-left-col .category {
	color: #eee;
}
#case-viewer-right-col {
	float: left;
	width: 651px;
	height: 325px;
	overflow-x: hidden;
	overflow-y: auto;
	text-align: center;
}
#case-viewer-right-col a {
	border: none;
	display: block;
	margin: 50px 0 0px 0;
	text-decoration: none;
}
#case-viewer-right-col a img {
	border: 1px solid #c0c0c0;
	margin: 0 10px;
}
#case-viewer-navigation {
	width: 652px;
	height: 55px;
	position: absolute;
	left: 291px;
	top: 335px;
	text-align: center;
	margin-top: 5px;
}
#case-viewer-navigation a {
	width: 14px;
	height: 16px;
}


/*#case-viewer-navigation a.left-arrow { background: url(../../images/viewer/nav-left-arrow.png) no-repeat; }
#case-viewer-navigation a.dot { background: url(../../images/viewer/nav-dot.png) no-repeat; }
#case-viewer-navigation a.dot-selected { background: url(../../images/viewer/nav-dot-selected.png) no-repeat; }
#case-viewer-navigation a.right-arrow { background: url(../../images/viewer/nav-right-arrow.png) no-repeat; }*/

/* Case Browser displays the BNA cases in thumbnail format for opening to the Case Viewer */

#case-browser {
	position: relative;
}
#case-browser-header {
	height: 35px;
	background: url(../../images/viewer/case-browser-header_02.png) no-repeat;
	position: relative;
}
#case-browser-header-tab {
	height: 37px;
	background: url(../../images/viewer/case-browser-header_01.png) no-repeat;
	position: relative;
}
#case-browser-header div.category-selection {
	display: block;
	font-size: 15px;
	font-weight: bold;
	height: 20px;
	position: absolute;
	width: 500px;
	top: 8px;
	left: 30px;
	z-index: 1;
}
#case-browser-header div.category-selection select {
	height: 22px;
}
#case-browser-header .more-search-options {
	font-size: 14px;
	font-weight: normal;
	margin-left: 20px;
}
/* Case Browser Portal is the rectangle div that is below
the search options and navigation div that contains the linked thumbnails */
#case-browser-portal {
	position: relative;
	height: 311px;
	overflow-x: hidden;
	overflow-y: auto;
	vertical-align: top;
}

.case {
	position: relative;
	float: left;
	width: 256px;
	margin-left: 37px;
	margin-top: 10px;
	padding: 8px 4px 10px 4px;
	text-align: center;
}
.case:link, .case:visited {
	text-decoration: none;
}
.case:hover, .case:active {
	background: #ccc;
}

.case-label {
  color: #979796;
  display: block;
  font-size: 1.1em;
  font-weight: bold;
  padding-top: 10px;
}

.btn-view-case {
	position: absolute;
	top: 40%;
	left: 85px;
	height: 22px;
	width: 94px;
}

.case-browser-row {
	overflow: auto;
}

.images img {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
}

#case-viewer-right-col, div.image_set_images, div.image {
	position: relative;
}
div.image {
  display: -moz-inline-block;
  display: inline-block;
}

div.image img.btn-view-case {
  cursor: pointer;
  left: 50%;
  top: 50%;
  margin-left: -47px;
}

/* ------------------------ main framework ------------------------ */

#wrap {
	/* background:url("../../images/viewer/bg-wrap.jpg") repeat-y;*/
	width:1000px;
	margin: 0 auto;
	text-align: left;
}

/* ------------------------ bottom-wrap framework ------------------------ */

/* ------------ must have below column-left and column-right to clear the float ------------ */

#bottom-wrap {
	background: url("../../images/viewer/bottom-wrap.html");
	width: 100%; /* fix for Safar */
	height:20px;
	clear: both; /* important - do not remove */
}

/* ------------------------footer framework ------------------------ */

#footer {
	width: 1000px;
	margin: 0 auto;
	text-align: center;
	display: none;
}
#footer p {
	color: #fff;
	margin-bottom: 10px;
}
#footer a:link, #footer a:visited {
	color: #fff;
}
#footer a:hover, #footer a:active {
	color: #fff;
}
#footer ul {
	margin: 10px;
}
#footer li {  /* if your li's float, you can adjust border height w/ line-height */
	padding: 0 5px 0 7px; /* adjusts the spacing between each li display and border-left */
	display: inline;
	border-left: 1px solid #009900;
}
#footer li.first {
	border: none;
}


/* ------------------------ MAIN SLIDER FRAMEWORK ------------------------ */

#action_container {
	height: 100px;
	width: 942px;
	padding: 0;
	overflow: hidden;
	margin-top: 1px;
	margin-left: 32px;
	position: relative;
}
#action_container a.contact-us {
	background: url(../../images/viewer/action_container.png) no-repeat;
	width: 471px;
	height: 100px;
	position: absolute;
	top: 0;
	left: 0;
}
#action_container a.contact-us:hover {
	background: url(../../images/viewer/action_container.png) 0 100px;
}
#action_container a.email-friend {
	background: url(../../images/viewer/action_container.png) 471px 0px;
	width: 471px;
	height: 100px;
	position: absolute;
	top: 0;
	left: 471px;
}
#action_container a.email-friend:hover {
	background: url(../../images/viewer/action_container.png) 471px 100px;
}
#action_container a h3, #action_container a h4 {
	display: none;
}


/* ########################################
       horizontal contact form                    
   ######################################## */

#horiz-form {
	height: 105px;
	position: relative;
	width: 350px;
	margin: 20px 0 20px 40px;
}
#horiz-form label {
	font-family: Helvetica, "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #fff;
	margin: 0;
	padding: 0;
}
#horiz-form form {
	width: 350px;
	margin: 0;
}
#horiz-form input, #horiz-form textarea, #horiz-form select {
	width: 145px;
	font-family: Helvetica, "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;
}
#horiz-form input {
	margin-bottom: 5px;
}
#horiz-form select {
	width: 150px;
	padding: 0;
}
#horiz-form textarea {
	height: 40px;
	overflow: auto;
}
#horiz-form dl dt {
	width: 155px;
	float: left;
}
#horiz-form input.submit {
	width: 151px;
}

/* The Search Menu is the div that should appear when "More Search Options" is clicked. */

#search-menu {
	position: absolute;
	background: #414141 url(../../images/viewer/bg-search-menu.jpg) repeat-x scroll 0 0;
	width: 570px;
	height: 300px;
	border-left: 2px solid #aaa;
	border-right: 2px solid #aaa;
	border-bottom: 2px solid #aaa;
	left: 215px;
	top: 71px;
	z-index: 10;
	overflow-x: hidden;
}
#search-menu #search-filters {
  border-bottom: 2px solid #aaa;
  height: 245px;
  margin-bottom: 15px;
  margin-left: -10px;
  padding-left: 10px;
  overflow-y: scroll;
}
#search-menu #search-filters,
#search-menu #search-filters li {
	position: relative;	
}

#case-browser #search-menu h2 {
	color: #fff;
	margin: 10px 5px 0px 0px;
	display: block;
	font-size: 16px;
}
#case-browser #search-menu span.allnone {
	margin: 5px 0 0px 0px;
	display: block;
	font-size: 11px;
}
#filters_message {
	color: #aaa;
	font-size: 10px;
}
#case-browser #search-menu form {
	margin: 0px 0px 10px 10px;
}
#case-browser #search-menu .search {
	background: url(../../images/viewer/btn-search.png);
	width: 61px;
	height: 21px;
	border: 0;
	padding: 0;
	margin: 0 0 10px 0;
}
#case-browser #search-menu .search:hover {
	background: url(../../images/viewer/btn-search.png) 0px 21px;
}
#case-browser #search-menu .reset {
	background: url(../../images/viewer/btn-reset.png);
	width: 61px;
	height: 21px;
	border: 0;
	padding: 0;
	margin: 0 0 10px 0;
}
#case-browser #search-menu .reset:hover {
	background: url(../../images/viewer/btn-reset.png) 0px 21px;
}
#case-browser #search-menu .cancel {
	background: url(../../images/viewer/btn-cancel.png);
	width: 61px;
	height: 21px;
	border: 0;
	padding: 0;
	margin: 0 0 10px 0;
}
#case-browser #search-menu .cancel:hover {
	background: url(../../images/viewer/btn-cancel.png) 0px 21px;
}

.checklist {
	border: 1px solid #ccc;
	list-style: none;
	overflow: auto;
	margin: 0px 0px 30px 0px !important;
	padding: 10px 10px !important;
	width: 510px;
	clear: both;
}
.checklist li {
	height: 20px;
	margin: 5px 5px 5px 5px;
	padding: 5px 5px 5px 5px;
	border: 0px solid #fff;
	display: block;
	position: relative;
}
.checklist li input {
	float: left;
}
.checklist li:hover {
	background-color: #777;
	color: #fff;
}
.checklist label {
	display: block;
	padding-left: 20px;
	margin-left: 5px;
  position: absolute;
  top: 7px;
  left: 5px;
}

body.windowed {
  background-color: transparent !important;
  background-image: none !important;
}

body.windowed #wrap {
  margin-left: -15px;
}

#MB_content dd {
  margin-bottom: 10px;
}

#MB_content p {
  font-size: 1.2em;
  margin-top: 10px;
  text-align: center;
}

#MB_content p a {
  color: #1A68AD;
  text-decoration: none;
}

#MB_content p a:hover {
  text-decoration: underline;
}