You've already forked proefschrift
1013 lines
20 KiB
CSS
1013 lines
20 KiB
CSS
/* Cascading Style Sheet for HTML export */
|
|
|
|
/* Dark Red style */
|
|
/* All properties that are style specific are marked as "STYLE" */
|
|
|
|
/* Compatibility notes:
|
|
*
|
|
* Names starting with "#" are ID selectors meaning they point to one specific single object/element
|
|
*/
|
|
|
|
/* This stylesheet expects the following HTML structure
|
|
body#page
|
|
table#pageHeader
|
|
tr
|
|
td.left (rowspan 3)
|
|
td.right
|
|
div.utilities
|
|
span.command (0+)
|
|
a
|
|
img
|
|
span.label
|
|
tr
|
|
td.right
|
|
div.mapName
|
|
tr
|
|
td.right
|
|
div.contactInformation
|
|
|
|
col left is optional sidebar navigation
|
|
col.main
|
|
col.right
|
|
|
|
tr#breadcrumbsAndPageNavigation
|
|
td.left (0-1: include if sideNav)
|
|
div.box (0+)
|
|
... (see div.box contents below)
|
|
|
|
Optional Breadcrumb and pageNavigation
|
|
td.breadcrumbs
|
|
td.pageNavigation
|
|
|
|
td.right
|
|
|
|
<BODY MAIN CONTENT>
|
|
|
|
<TOPIC>
|
|
|
|
<TOP COMMAND>
|
|
|
|
table#pageFooter
|
|
tr
|
|
td.left (rowspan = 2, could be used for image)
|
|
td.center (rowspan = 2)
|
|
div.footerText
|
|
td.right
|
|
div.hyperlink
|
|
tr
|
|
td.right
|
|
div.lastUpdated
|
|
*/
|
|
|
|
|
|
|
|
/* GLOBAL SYTLE global styling, sets overall style of page */
|
|
|
|
body {
|
|
font-family: Verdana;
|
|
margin: 0px; /* increase to have page float on background */
|
|
padding: 0px;
|
|
font-size: 8pt;
|
|
}
|
|
|
|
li {
|
|
margin-bottom: .3em; /* make list items more compact than default */
|
|
}
|
|
|
|
img {
|
|
border: 0; /* by default, images should not have a border */
|
|
}
|
|
|
|
.emptyImage { /* used for special effects */
|
|
float:left;
|
|
margin: 0px; /* distance to outline */
|
|
}
|
|
|
|
|
|
/* all headers in boxes */
|
|
.header {
|
|
clear: both; /* floating element below */
|
|
}
|
|
|
|
/* link styles */
|
|
a {
|
|
text-decoration: underline; /* set to "none" to hide underlines on links */
|
|
}
|
|
|
|
a img {
|
|
text-decoration: none; /* set to "none" to hide underlines on links */
|
|
}
|
|
|
|
/* remove link underline from some special elements: Header and Overview Map */
|
|
#mapPageHeader a, {
|
|
text-decoration: none; /* set to "none" to hide underlines on links */
|
|
}
|
|
|
|
a:link {
|
|
color: #CC0000; /* STYLE */
|
|
}
|
|
|
|
a:visited {
|
|
color: #CC0000; /* STYLE */
|
|
}
|
|
|
|
/* Note: hover selector should be last in order to take precedence in :visited AND :hover situation */
|
|
a:hover {
|
|
color: #FF3300; /* STYLE */
|
|
}
|
|
|
|
/* special link styles */
|
|
a.noHover:hover {
|
|
background-color:transparent; /* If you don't want images wrapped in <a> to have hover effect, make it <a class="noHover"> */
|
|
}
|
|
|
|
a:active {
|
|
color: #FF3300; /* STYLE */
|
|
}
|
|
|
|
|
|
/*********************************************************************************/
|
|
/*** Styles of specific modules **************************************************/
|
|
/*********************************************************************************/
|
|
|
|
/* MODULE: HEADER --------------------------------------------*/
|
|
#pageHeader {
|
|
width: 100%;
|
|
border-bottom: 3px solid #FFCC66; /* STYLE */
|
|
background-image: url(../images/header_background.gif); /* STYLE */
|
|
background-repeat: repeat-y; /* STYLE */
|
|
background-color: #CC0000; /* STYLE */ /* same color as on right side in backgound image */
|
|
}
|
|
|
|
|
|
#pageHeader td {
|
|
padding-left: 6px;
|
|
padding-right: 6px;
|
|
}
|
|
|
|
#pageHeader div {
|
|
/*margin-bottom: .2em; */
|
|
}
|
|
|
|
/* logo image on left side of header */
|
|
#pageHeader .left {
|
|
width: auto;
|
|
margin-right: 8px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
/* header information */
|
|
#pageHeader .right {
|
|
margin-left: 8px;
|
|
width: 100%; /* helps to left align text */
|
|
color: White; /* STYLE */
|
|
}
|
|
|
|
#pageHeader .right .utilities {
|
|
text-align: right;
|
|
font-size: 8pt;
|
|
vertical-align: top;
|
|
}
|
|
|
|
.utilities_toc {
|
|
display: show; /* show table of content link */
|
|
}
|
|
|
|
/* link style in header */
|
|
/* note: Order is important. If ambiguous, last has precedence. */
|
|
#pageHeader a:link {
|
|
color: White; /* STYLE */
|
|
}
|
|
|
|
#pageHeader a:visited {
|
|
color: White; /* STYLE */
|
|
}
|
|
|
|
#pageHeader a:hover {
|
|
color: White; /* STYLE */
|
|
}
|
|
|
|
#pageHeader a:active {
|
|
color: White; /* STYLE */
|
|
}
|
|
|
|
/* note: Order is important. If ambiguous, last has precedence. */
|
|
#pageHeader .right .utilities a:link {
|
|
text-decoration: none; /* set to "none" to hide underlines on links */
|
|
}
|
|
|
|
#pageHeader .right .utilities a:visited {
|
|
text-decoration: none; /* set to "none" to hide underlines on links */
|
|
}
|
|
|
|
#pageHeader .right .utilities a:hover {
|
|
text-decoration: none; /* set to "none" to hide underlines on links */
|
|
}
|
|
#pageHeader .right .utilities a:active {
|
|
text-decoration: none; /* set to "none" to hide underlines on links */
|
|
}
|
|
|
|
#pageHeader .right .mapName {
|
|
text-align: left;
|
|
font-family: Arial;
|
|
font-size: 15pt;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
#pageHeader .right .contactInformation{
|
|
text-align: right;
|
|
font-size: 7pt;
|
|
vertical-align: bottom;
|
|
/*margin-right: 4px; */ /* to right align with commands in utilities */
|
|
}
|
|
|
|
|
|
/* MODULE: BODY (main content) ------------------------------------------ */
|
|
table#pageBody {
|
|
width: 100%;
|
|
}
|
|
|
|
.bodyColumn {
|
|
padding: 0px;
|
|
vertical-align: top;
|
|
text-align: left;
|
|
width: 100%;
|
|
}
|
|
|
|
|
|
/* width of second body column: liquid width for content */
|
|
#pageBody col.main {
|
|
width:auto;
|
|
}
|
|
|
|
#pageBody col.right {
|
|
width: auto;
|
|
}
|
|
|
|
/* some padding values for the core table in used page body */
|
|
table#pageBody tr td {
|
|
padding-left: 0px;
|
|
padding-right: 0px;
|
|
}
|
|
|
|
table#pageBody td.main {
|
|
padding-left: 10px; /* indent main topic content */
|
|
padding-right: 20px; /* and leave some space on the right */
|
|
}
|
|
|
|
table#pageBody td.breadcrumbs {
|
|
vertical-align: top;
|
|
padding-left: 10px; /* indent main topic content */
|
|
}
|
|
|
|
table#pageBody td.pageNavigation {
|
|
padding-right: 20px; /* and leave some space on the right */
|
|
}
|
|
|
|
.topicDivider {
|
|
border-top: 1px solid #FFCC66; /* STYLE */
|
|
height: 0.1em;
|
|
font-size: 2pt; /* I need a very narrow divider */
|
|
}
|
|
|
|
|
|
/* MODULE: FOOTER ------------------------------------------------------------*/
|
|
#pageFooter {
|
|
width: 100%;
|
|
background-color: #FFCC66; /* STYLE */
|
|
border-top: 2px solid #CC0000; /* STYLE */
|
|
border-bottom: 2px solid #CC0000; /* STYLE */
|
|
font-size: 8pt;
|
|
color: Black; /* STYLE */
|
|
margin-left: 2px;
|
|
}
|
|
|
|
|
|
#pageFooter td {
|
|
padding-left: 6px;
|
|
padding-right: 6px;
|
|
}
|
|
|
|
#pageFooter div {
|
|
/* margin-bottom: .2em; */
|
|
}
|
|
|
|
/* link style in footer */
|
|
|
|
#pageFooter a:link {
|
|
color: Black; /* STYLE */
|
|
}
|
|
|
|
#pageFooter a:visited {
|
|
color: Black; /* STYLE */
|
|
}
|
|
|
|
#pageFooter a:hover {
|
|
color: #CC0000; /* STYLE */
|
|
}
|
|
|
|
#pageFooter a:active {
|
|
color: #CC0000; /* STYLE */
|
|
}
|
|
|
|
/* reserved for image */
|
|
#pageFooter .left {
|
|
width: 0px;
|
|
margin-right: 0px;
|
|
}
|
|
|
|
#pageFooter .center {
|
|
width: 65%; /* helps to left align text */
|
|
text-align: left;
|
|
vertical-align: top;
|
|
}
|
|
|
|
#pageFooter .center .footerText {
|
|
}
|
|
|
|
/* Last update and hyperlink */
|
|
#pageFooter .right {
|
|
width: 35%;
|
|
text-align: right;
|
|
}
|
|
|
|
#pageFooter .right .hyperlink {
|
|
vertical-align: top;
|
|
}
|
|
|
|
#pageFooter .right .lastUpdated {
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
/* MODULE BREADCRUMBS AND PREV / NEXT NAVIGATION --------------------------------------------------*/
|
|
.breadcrumbs {
|
|
font-size: 7pt; /* STYLE */
|
|
text-align: left;
|
|
width: 70%;
|
|
vertical-align: top;
|
|
color: #CC0000; /* STYLE */
|
|
padding-top: 4px;
|
|
padding-bottom: 2px;
|
|
}
|
|
|
|
.breadcrumbs a:visited {
|
|
color: #CC0000; /* STYLE */ /* don't show visited colors for breadcrumbs */
|
|
}
|
|
|
|
.breadcrumbs .breadcrumb {
|
|
white-space: nowrap; /* set to "nowrap" to stop breadcrumbs from breaking in the middle */
|
|
}
|
|
|
|
/* move the previous / next links to the right side */
|
|
.pageNavigation {
|
|
text-align: right;
|
|
font-size: 7pt;
|
|
width: 30%;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.pageNavigation a:visited {
|
|
color: #CC0000; /* STYLE */ /* don't show visited colors for prev/next navigation */
|
|
}
|
|
|
|
|
|
/*----------------------------------------------------------------------------------*/
|
|
/* MODULE: TOPIC ------------------------------------------------------------------ */
|
|
/*----------------------------------------------------------------------------------*/
|
|
/*
|
|
tr.topic (0+)
|
|
td.main (colspan = 2)
|
|
tr.topicHeader
|
|
td.topicImageColumn
|
|
img.topicImage
|
|
td.topicLineColumn
|
|
span.outlineNumber
|
|
span.topicLine
|
|
span.topicIcons
|
|
img.topicIcon
|
|
div.body
|
|
<partial map>
|
|
div.topicTextNotes
|
|
div Notes
|
|
<callouts>
|
|
<task planning>
|
|
<review comments>
|
|
<related>
|
|
td.right
|
|
*/
|
|
|
|
.topic .main .body {
|
|
clear: both;
|
|
}
|
|
|
|
.topicHeader {
|
|
vertical-align: middle;
|
|
clear:both;
|
|
}
|
|
|
|
.topicImageColumn {
|
|
}
|
|
|
|
.topicImage {
|
|
margin-right: 6px; /* distance to outline */
|
|
}
|
|
|
|
.topicTopicLineColumn {
|
|
}
|
|
|
|
.outlineNumberFirst { /* first topic on page */
|
|
display: visible; /* set to none or visible to hide/show outlineNumbers */
|
|
font-size: 11pt;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.outlineNumber { /* other topics on page */
|
|
display: visible; /* set to none or visible to hide/show outlineNumbers */
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.topicLineFirst { /* first topic on page */
|
|
font-size: 11pt;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.topicLine { /* other topics on page */
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
}
|
|
|
|
/* group of icons */
|
|
.topicIcons {
|
|
margin-left: 4px; /* distance to topic text */
|
|
vertical-align: middle; /* center icons around text (important for single line callouts) */
|
|
}
|
|
|
|
/* single icons */
|
|
.topicIcon {
|
|
margin-right: 3px; /* distance between icons */
|
|
}
|
|
|
|
|
|
/* <div> around whole text notes */
|
|
.topicTextNotes {
|
|
font-size: 9pt;
|
|
margin-left: 0.3em;
|
|
margin-top: 0.5em;
|
|
}
|
|
|
|
.topicTextNotes div {
|
|
margin-bottom: 0.8em; /* distance between paragraphs */
|
|
}
|
|
|
|
.topicTextNotes table {
|
|
margin-bottom: 0.7em; /* some space below tables and before next paragraph starts */
|
|
}
|
|
|
|
.topicTextNotes table div {
|
|
margin-left: 0.3em; /* some left and right cell padding */
|
|
margin-right: 0.3em;
|
|
}
|
|
|
|
.topicTextNotes .lastTableNotesDiv {
|
|
margin-bottom: 0em; /* no bottom margin for last paragraph in Notes */
|
|
}
|
|
|
|
|
|
/* <div> around whole text notes in callouts */
|
|
.callouts .topicTextNotes {
|
|
font-size: 8pt;
|
|
margin-left: 0px;
|
|
}
|
|
|
|
/* single link, so far used in callout section */
|
|
.topicHyperlink {
|
|
font-size: 8pt;
|
|
}
|
|
|
|
/* the icon behind the link */
|
|
.topicHyperlinkIcon {
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
|
|
|
|
/* commands: active buttons / hot spots or links */
|
|
.command {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.command img {
|
|
display: inline; /* set to none or inline to hide or show command icons */
|
|
vertical-align: bottom;
|
|
margin-left: 2px;
|
|
}
|
|
|
|
.command .label {
|
|
display: inline; /* set to none or inline to hide or show command text labels */
|
|
vertical-align: middle;
|
|
}
|
|
|
|
|
|
|
|
/* MODULE: BOX - MAP GRAPHICS SNIPPET ---------------------------------------------------*/
|
|
/*
|
|
div.partialMapArea
|
|
table.partialMapTable
|
|
div.SubTopicItems
|
|
div.subtopicitem
|
|
img
|
|
a
|
|
div.partialMap
|
|
img
|
|
*/
|
|
|
|
.partialMapArea {
|
|
vertical-align: top;
|
|
margin-bottom: 10px; /* some distance below this block */
|
|
}
|
|
|
|
table#partialMapTable tr td {
|
|
padding: 0px;
|
|
}
|
|
|
|
.subTopicItems {
|
|
clear: both;
|
|
font-size: 8pt;
|
|
font-weight: normal;
|
|
margin-left: 10px;
|
|
margin-right: 50px;
|
|
}
|
|
|
|
.subtopicitem {
|
|
margin-top: 3px;
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
.partialMap {
|
|
margin-top: 5px;
|
|
margin-bottom: 5px;
|
|
display: none; /* this value will be set during the export depending on user setting in property inspector */
|
|
}
|
|
|
|
|
|
/* MODULE: CALLOUT -SECTION---------------------------------------------------------------------*/
|
|
/*
|
|
div.callouts
|
|
div.callout
|
|
div.calloutHeader
|
|
span topicIcons
|
|
img.topicIcon
|
|
tr.calloutBody
|
|
div.calloutImage
|
|
img.topicImage
|
|
div.topicTextNotes
|
|
div Notes
|
|
span a.topicGyperlink a.topicHyperlinkIcon
|
|
*/
|
|
|
|
/* all callouts */
|
|
.callouts {
|
|
background-color: #FAFAFA; /* STYLE */
|
|
width: 360px;
|
|
margin-left: 30px;
|
|
margin-bottom: 8px;
|
|
border: 1px solid #CC0000; /* STYLE */
|
|
border-top: 5px solid #CC0000; /* STYLE */
|
|
}
|
|
|
|
/* single callout */
|
|
.callout {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
margin-top: 0px;
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
/* topic text and icons */
|
|
.calloutHeader {
|
|
font-size: 8pt;
|
|
font-weight: bold;
|
|
color: #2F4F4F; /* STYLE */
|
|
padding-left: 4px; /* align with text notes */
|
|
}
|
|
|
|
.calloutBody {
|
|
vertical-align: top;
|
|
text-align: left;
|
|
}
|
|
|
|
.calloutImage {
|
|
padding-left: 4px; /* align with text notes */
|
|
}
|
|
|
|
|
|
/* -----------------------------------------------------*/
|
|
/* COLLAPSIBLE BOXES
|
|
/*-------------------------------------------------------*/
|
|
/*
|
|
div.<special box name>Area (need "Area" string for collapse button script)
|
|
div.collapsiblebox (1+)
|
|
div.header
|
|
span.title
|
|
img.expandOrCollapseButton
|
|
div.body
|
|
(varies)
|
|
*/
|
|
|
|
/* the body class is important for the collapse script. It follows the initial .collapsiblebox statement */
|
|
.body {
|
|
clear: both;
|
|
}
|
|
|
|
.clearFloat {
|
|
clear: both; /* needed to hold down bottom border sometimes */
|
|
}
|
|
|
|
|
|
.collapsiblebox {
|
|
clear: both;
|
|
width: 360px;
|
|
padding-bottom: 0px;
|
|
background-color: #D3D3D3; /* STYLE */
|
|
border: 1px solid #CC0000; /* STYLE */
|
|
margin-bottom: 8px;
|
|
margin-left: 30px;
|
|
}
|
|
|
|
.legend .collapsiblebox {
|
|
margin-left: 0px; /* overide for the legend box */
|
|
}
|
|
|
|
.collapsiblebox .title {
|
|
padding: 3px;
|
|
padding-left: 6px;
|
|
font-size: 8pt;
|
|
text-align: left;
|
|
font-weight: bold;
|
|
color: Black; /* STYLE */
|
|
float: left;
|
|
}
|
|
|
|
.collapsiblebox .expandOrCollapseButton {
|
|
float: right;
|
|
text-align: right;
|
|
margin-top: 2px;
|
|
margin-left: 8px;
|
|
margin-right: 4px;
|
|
vertical-align: middle;
|
|
display: inline; /* set to none to hide button(s); set to inline to show */
|
|
}
|
|
|
|
.collapsiblebox .body {
|
|
clear: both;
|
|
padding-bottom: 1px;
|
|
padding-left: 0px;
|
|
padding-right: 0px;
|
|
background-color: #FAFAFA; /* STYLE */
|
|
}
|
|
|
|
/* generic style for lists in boxes e.g. task information or about box */
|
|
.property {
|
|
clear: both;
|
|
height: 1em; /* since I'm using spans, I need some more line spacing */
|
|
}
|
|
|
|
.property .label {
|
|
float: left;
|
|
width: 15 em;
|
|
font-size: 7pt;
|
|
color: gray; /* STYLE */
|
|
text-indent: 6px;
|
|
}
|
|
|
|
.property .value {
|
|
float: left;
|
|
width: auto;
|
|
font-size: 8pt;
|
|
color: #2F4F4F; /* STYLE */
|
|
}
|
|
|
|
|
|
/* MODULES: BOX - TASK INFORMATION ---------------------------------------------------------- */
|
|
.taskInformationArea .body {
|
|
display: none; /* collapse when first shown */
|
|
}
|
|
|
|
/* MODULES: BOX - REVIEW COMMMENT ---------------------------------------------------------- */
|
|
.comment {
|
|
clear: both;
|
|
}
|
|
|
|
.commentsArea .body {
|
|
display: none; /* collapse when first shown */
|
|
font-size: 8pt;
|
|
color: #2F4F4F; /* STYLE */
|
|
}
|
|
|
|
.comment .userName {
|
|
font-weight: bold;
|
|
float: left;
|
|
margin-bottom: 0px;
|
|
padding-left: 6px;
|
|
}
|
|
|
|
.comment .date {
|
|
font-weight: bold;
|
|
float: right;
|
|
margin-bottom: 0px;
|
|
padding-right: 6px;
|
|
}
|
|
|
|
.comment .text {
|
|
clear: both;
|
|
padding-bottom: 4px; /* makes bottom 'border' bigger on opera */
|
|
padding-right: 6px;
|
|
padding-left: 6px;
|
|
}
|
|
|
|
|
|
/* MODULE: RELATED SECTION ----------------------------------------------------------------------*/
|
|
/*
|
|
div.relatedSection
|
|
div.oneRelatedSection
|
|
a topicHyperlink
|
|
div.relatedSectionBody
|
|
div.relatedItem
|
|
span relatedItemBullet
|
|
a topicHyperlink
|
|
a topicHyperlink (optional callout link)
|
|
img topicHyperlinkIcon
|
|
*/
|
|
|
|
.relatedSection {
|
|
}
|
|
|
|
.oneRelatedSection {
|
|
margin-top: 16px;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.relatedSectionHeader {
|
|
font-size: 8pt;
|
|
font-weight: bold;
|
|
padding-left: 4px; /* align with text notes */
|
|
}
|
|
|
|
.relatedItem {
|
|
font-size: 8pt;
|
|
margin-top: 1px;
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
.relatedItemBullet {
|
|
padding-left: 4px; /* align with text notes */
|
|
}
|
|
|
|
/* the icon behind the link */
|
|
.relatedItem .topicHyperlinkIcon {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
/* MODULE: TOP COMMAND ----------------------------------------------------------*/
|
|
.topCommand {
|
|
vertical-align: bottom;
|
|
font-size: 7pt;
|
|
margin-top: 10mm;
|
|
margin-bottom: 2mm;
|
|
}
|
|
|
|
.topCommand a:link {
|
|
text-decoration: none; /* set to "none" to hide underlines on links */
|
|
}
|
|
|
|
.topCommand a:visited {
|
|
text-decoration: none; /* set to "none" to hide underlines on links */
|
|
color: #CC0000; /* STYLE */ /* don't show visited colors for prev/next navigation */
|
|
}
|
|
|
|
.topCommand a:hover {
|
|
text-decoration: none; /* set to "none" to hide underlines on links */
|
|
}
|
|
.topCommand a:active {
|
|
text-decoration: none; /* set to "none" to hide underlines on links */
|
|
}
|
|
|
|
|
|
|
|
|
|
/**********************************************************************************************/
|
|
/******** OTHER WINDOW LAYOUTS ****************************************************************/
|
|
/**********************************************************************************************/
|
|
/* WINDOW: LEGEND ------------------------------------------------------------- */
|
|
/*
|
|
.div legend
|
|
.div collapsiblebox
|
|
.div body
|
|
.div legendGroup
|
|
.div legendItem
|
|
.div item
|
|
.div label
|
|
*/
|
|
|
|
.legend {
|
|
margin-left: 6px;
|
|
margin-top: 6px;
|
|
font-size: 8pt;
|
|
color: Gray; /* STYLE */
|
|
width: 200px;
|
|
}
|
|
|
|
/* set with of both divs to avoid right border if text wraps */
|
|
.legend .collapsiblebox {
|
|
width: 200px;
|
|
}
|
|
|
|
.legend .collapsiblebox .body {
|
|
width: 200px;
|
|
border: 1px solid #999999;
|
|
}
|
|
|
|
.legendGroup
|
|
{
|
|
clear: both;
|
|
font-weight: bold;
|
|
float: left;
|
|
margin-top: 5px;
|
|
margin-bottom: 4px;
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.legendItem
|
|
{
|
|
clear: both;
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.legendItem .item {
|
|
float: left;
|
|
margin-right: 6px;
|
|
}
|
|
|
|
.legendItem .label {
|
|
float: left;
|
|
margin-right: 2px;
|
|
}
|
|
|
|
|
|
/* WINDOW: CONTENT ------------------------------------------------------------- */
|
|
/*
|
|
div.Page
|
|
table.pageBody
|
|
col.TOCContents
|
|
div.body
|
|
div.contentItem1[1-9]
|
|
div.outlineNumber
|
|
div.topicLine
|
|
a topicHyperlink
|
|
col.TOCAbout
|
|
div.collapsiblebox
|
|
div.header
|
|
div.body
|
|
div.mapPreview
|
|
img
|
|
div.property
|
|
div.label
|
|
div.value
|
|
|
|
*/
|
|
|
|
.TOCContents {
|
|
text-align: left;
|
|
vertical-align: top;
|
|
width: 90%;
|
|
}
|
|
|
|
.TOCContents .body {
|
|
margin: 15px;
|
|
margin-right: 5px;
|
|
color: #CC0000; /* STYLE */
|
|
font-size: 8pt;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.TOCAbout {
|
|
text-align: right;
|
|
vertical-align: top;
|
|
width: 10%;
|
|
}
|
|
|
|
.TOCAbout .collapsiblebox {
|
|
margin: 15px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.TOCAbout .property {
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.TOCAbout .property .label {
|
|
text-align: left;
|
|
width: 7.5em;
|
|
}
|
|
|
|
.TOCAbout .property .value {
|
|
text-align: left;
|
|
margin-left: 1.0em;
|
|
}
|
|
|
|
.mapPreview {
|
|
padding-top: 10px;
|
|
padding-bottom: 16px;
|
|
text-align: center;
|
|
border-bottom: 1px solid #CC0000;
|
|
}
|
|
|
|
.contentItem1 {
|
|
margin-top: 5px;
|
|
clear: both;
|
|
}
|
|
|
|
.contentItem2 {
|
|
margin-top: 3px;
|
|
margin-left: 2em;
|
|
clear: both;
|
|
}
|
|
|
|
.contentItem3 {
|
|
margin-left: 4em;
|
|
clear: both;
|
|
}
|
|
|
|
.contentItem4 {
|
|
margin-left: 6em;
|
|
clear: both;
|
|
}
|
|
|
|
.contentItem5 {
|
|
margin-left: 8em;
|
|
clear: both;
|
|
}
|
|
|
|
.contentItem6 {
|
|
margin-left: 10em;
|
|
clear: both;
|
|
}
|
|
|
|
.contentItem7 {
|
|
margin-left: 12em;
|
|
clear: both;
|
|
}
|
|
|
|
.contentItem8 {
|
|
margin-left: 14em;
|
|
clear: both;
|
|
}
|
|
|
|
.contentItem9 {
|
|
margin-left: 16em;
|
|
clear: both;
|
|
}
|
|
|
|
.contentItemX {
|
|
margin-left: 18em;
|
|
clear: both;
|
|
}
|
|
|
|
|
|
/* WINDOW: OVERVIEW MAP ------------------------------------------------------------- */
|
|
/*
|
|
body overviewMapBody
|
|
.div overviewDiv
|
|
img mapOverview
|
|
img mapDetailed
|
|
*/
|
|
|
|
.overviewMapBody {
|
|
background-color: Gray; /* STYLE */
|
|
}
|
|
|
|
.overviewDiv {
|
|
cursor: hand;
|
|
text-align: center;
|
|
margin-top: 10px; /* remove once we can center horizontally */
|
|
}
|
|
|
|
img#mapOverview, img#mapDetailed {
|
|
margin: 0px;
|
|
}
|
|
|
|
body#mapPageFooter {
|
|
font-family: Verdana;
|
|
font-size: 8pt;
|
|
text-align: center;
|
|
padding-top: 3px;
|
|
vertical-align: middle;
|
|
color: white; /* STYLE */
|
|
background-color: #CC0000; /* STYLE */
|
|
border-top: 2px solid #FFCC66;
|
|
}
|
|
|
|
|
|
|