/*----------------------------- 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(../../stylesheets/viewer/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.jpg") right no-repeat;} /* ------------------------ SPECIFIC ELEMENTS ------------------------ */ /* Player Body */ #player-body {background:url(../../images/viewer/bg-player.png) no-repeat; 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; 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;margin-bottom:20px;} #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:100%; overflow-x:hidden; overflow-y:auto; padding-top:26px;} #case-viewer-left-col a:link, #case-viewer-left-col a:visited {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:#666;} #case-viewer-left-col .highlight, #case-viewer-left-col .category {color:#000;} #case-viewer-right-col {float:left; width:100%; text-align:center;font-size:13px;} #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 form {width:100%} #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; margin-left:10px} #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; overflow-x:hidden; overflow-y:auto; vertical-align:top; width:540px; margin:15px 0 15px} .case {position:relative; float:left; width:256px; margin-left:22px; 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 {margin:0 0 0 7px} div.image {display:-moz-inline-block; display:inline-block;position:relative;} 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.jpg"); 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 span.pipe {margin:0 10px;} #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:50px; 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:11px;} #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:325px;} #action_container a.email-friend:hover {background:url(../../images/viewer/action_container.png) 471px 100px;} /* ######################################## 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; border-left:2px solid #aaa; border-right:2px solid #aaa; border-bottom:2px solid #aaa; left:215px; top:80px; z-index:10; overflow-x:hidden; height:800px;} #search-menu #search-filters {border-bottom:2px solid #aaa; margin-bottom:15px; margin-left:-10px; padding-left:10px;} #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; 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;}.inpbtn {background:url(../images/submit_button.gif) 0 0 no-repeat !important; border:none; width:81px; height:27px; display:block; cursor:pointer}