/* $RCSfile: style.css,v $
* $Revision: 1.2 $ $Date: 2014/03/26 21:25:00 $
* Auth: Dave Loffredo (loffredo@steptools.com)
*
* Copyright (c) 1991-2014 by STEP Tools Inc.
* All Rights Reserved.
*
* STEP Tools Documentation styles - The master should be in the root
* of the stdev docs directory, but this file is often copied into the
* root of other packages (express, stpcad, igeslib) for convenience.
*
* Color pallet with different tones of slate blue. Easy on the
* eyes and works well with the strong logo colors.
* DEE7EF - light blue
* 9CAAC6 - medium blue, not used
* 5A79A5 - slate
* 000063 - dark blue, not used
* CE0000 - red, not used
*/
BODY {
background: white;
}
/* Use the default browser color, but flash the underline and color */
A:link { text-decoration: underline; }
A:visited { text-decoration: underline; }
A:hover { color: #FF0000; text-decoration: none; }
H1,H2,H3 {
font-family: helvetica, arial;
}
/* add a rule separator */
.rule { border-top:1px solid black; padding-top:0.2em; margin-top:3em; }
H1.rule { }
H2.rule { width:75% }
H3.rule { width:50% }
/* Use for main content in a single column flow */
DIV.main {
margin-left: 5%;
margin-right:5%;
padding: 0.5em;
}
/* Use for single column flow content that you want to stand out */
DIV.box {
margin-left: 10%;
margin-right:10%;
padding: 0.5em;
background: #DEE7EF;
border: solid 1px black;
}
DIV.figure {
text-align:center;
padding-top: 1em;
padding-bottom: 1em;
}
P.caption {
font-weight: bold;
text-align:center;
}
DIV.copyright {
font-size: 70%;
margin-right: 20%;
margin-left: 20%;
margin-top: 2em;
margin-bottom: 1em;
padding: 0.5em;
text-align: center;
border-top: 1px solid #000000;
clear: both; /* avoid interference with floats */
}
/* ============================================================
* TABLES - Since tables are often used for formatting, make them
* borderless so that we dont have to turn things off.
*/
TABLE {
vertical-align: top;
border: none;
border-collapse: collapse;
}
/* For normal text tables, as opposed to ones used for formatting.
* The auto margins will center tables on Moz and opera, but we force
* center in the html tag because IE will not center tables through
* CSS unless you center the entire body block.
*/
TABLE.normal { width: 70%;
/* margin-left: auto; */
/* margin-right: auto; */
margin-top: 1em;
margin-bottom: 1em;
border: solid 2px black}
TABLE.normal TD { vertical-align: top; margin: 0px; padding: 0.25em; }
TABLE.normal TH { vertical-align: top; margin: 0px; padding: 0.25em;
border-bottom: solid 2px black; }
/* For fancy text tables, with odd/even highlighting. We define local
* styles for TDs that match certain types of content
*/
TABLE.fancy {
border: 1px solid black;
border-collapse: collapse;
font-size: 90%;
}
TABLE.fancy TD { padding: 0.2em; }
TABLE.fancy TH {
padding: 0.2em;
color: white;
background: #5A79A5;
font-family: helvetica, arial;
font-weight: bold;
white-space: nowrap;
border-bottom: 1px solid black;
}
TR.even { background: white; }
TR.odd { background: #DEE7EF; }
/* Page banner on a normal page. There is a book variant below that
* allows for extra navigation links.
*/
TABLE.pagehead {
width: 100%;
background-image: url("images/pageheadbg.jpg");
background-repeat: repeat-y;
border-bottom: solid 10px black;
}
TD { vertical-align: top; margin: 0px; padding: 0px; }
TD.logo {
/* Logo as a background image with text indented */
font-family: helvetica, arial;
font-weight: bold;
font-size: 200%;
width: 75%;
height: 70px;
background-image: url("images/stlogo_sm.gif");
background-repeat: no-repeat;
vertical-align: top;
padding: 0 1em 0.2em 35px;
}
TD.quicklinks {
width: 20%;
vertical-align: top;
text-align: right;
}
TD.quicklinks A {
font-size: 80%;
display: block; /* put them on separate lines */
}
/* For the main body in a two column flow content. */
TD.main {
width: 70%;
padding-top: 1em;
padding-left: 1.5em;
padding-right: 1.5em;
}
/* For the display box in a two column flow */
TD.box {
width: 30%;
border: solid 1px black;
background: #DEE7EF;
padding-top: 0.5ex;
padding-left: 0.5em;
padding-right: 0.5em;
}
/* OLD STYLE SIDEBAR, REMOVE WHEN CONVERTED */
TD.box H2 {
font-size: 120%;
text-align: center;
padding-top: 0.2em;
padding-bottom: 0.2em;
border-bottom: groove thin;
/* background: #e0e0e0; */
background: #DEE7EF;
}
/* TD.box DL { font-size: 80%; } */
TD.box DT { font-weight: bold; }
TD.box DD {
font-size: 80%;
margin-left: 2em;
margin-bottom: 2ex;
}
/* ============================================================
* Sample Programs Sidebar
*/
/* For the main body in a two column flow content. */
.sidebox {
border: solid 1px black;
padding: 10px;
margin: 1em 1em 1.5em 0;
background: #DEE7EF;
}
.sidebox H2 {
font-size: 100%;
color: white;
background: #5A79A5;
padding: 3px 12px;
margin: -10px -10px 10px -10px;
border-bottom:1px solid black;
}
.sidebox UL {
padding: 0 .5em;
margin: 1em;
list-style-type: square;
}
.sidebox DT {
font-size: 90%;
font-weight: bold;
}
.sidebox DD {
font-size: 80%;
margin-left: 1em;
margin-bottom: 2ex;
}
/* ============================================================
* DOWNLOADS LIST
*/
/*
HTML bullets can be replaced with graphic images using
"list-style-image". However, the placement of these images is
inconsistent across most modern browsers. There is also very little
control over how the bullets appear beside the list items.
A far better option is to use background images for bullets.
background-image: url("images/demotxt.gif");
background-repeat: no-repeat;
background-position: 0 50%;
padding: 3px 0 3px 30px;
LI.txt { list-style-image: url("images/demotxt.gif"); }
LI.src { list-style-image: url("images/demosrc.gif"); }
LI.stp { list-style-image: url("images/demostp.gif") }
LI.project { list-style-image: url("images/demoproject.gif") }
*/
UL.downloads {
list-style-type: none;
padding: 0em;
margin-top: 0.2em;
margin-left: 0em;
}
LI.txt {
background-image: url("images/demotxt.gif");
background-repeat: no-repeat;
background-position: 0 0.5ex;
padding: 2px 0 2px 30px;
}
LI.src {
background-image: url("images/demosrc.gif");
background-repeat: no-repeat;
background-position: 0 0.5ex;
padding: 2px 0 2px 30px;
}
LI.java {
background-image: url("images/demojava.gif");
background-repeat: no-repeat;
background-position: 0 0.5ex;
padding: 2px 0 2px 30px;
}
LI.stp {
background-image: url("images/demostp.gif");
background-repeat: no-repeat;
background-position: 0 0.5ex;
padding: 2px 0 2px 30px;
}
LI.project {
background-image: url("images/demoproject.gif");
background-repeat: no-repeat;
background-position: 0 0.5ex;
padding: 2px 0 2px 30px;
}
/* ============================================================
* FORM STYLES - Give the input fields a sleeker look and give the
* buttons a background image.
*/
form.bksearch {
text-align: center;
line-height: 2em;
margin-left: 0.25em;
margin-right: 0.25em;
margin-top: 0;
margin-bottom: 0.5em;
padding-bottom: 0.5em;
border-bottom: solid 1px black;
}
input,select {
font-size: 11px;
background-color: #ffffff;
border: 1px solid #888888;
}
textarea {
font-size: 12px;
font-family: Arial, Verdana, Helvetica, sans-serif;
background-color: #ffffff;
border: 1px solid #888888;
}
.button {
font-size: 11px;
font-weight: normal;
color: #444444;
background-color: #ffffff;
background-image: url(images/form_button.gif);
border: 1px solid #444444;
}
.buttonOn {
font-size: 11px;
font-weight: normal;
color: #444444;
background-color: #ffffff;
background-image: url(images/form_button_on.gif);
border: 1px solid #444444;
}
.checkbox,.radio {
border:0px;
background-color: transparent;
margin: 0px;
vertical-align: bottom;
}
/* ============================================================
* BOOK STYLES - Used primarily by the reference manuals generated
* from Framemaker, but available for other pages as well.
*/
/* Variant of the page banner without the bottom border to make some
* extra space for the navigation links. We also turn of H1 in this
* so that we can use them, but they dont mess up the formatting.
*/
TABLE.bkhead {
width: 100%;
background-image: url("images/pageheadbg.jpg");
background-repeat: repeat-y;
}
.bkhead H1 { font-size: 100%; padding:0; margin:0; }
/* Navigation bars. For previous/next chapter and TOC links */
/* Upper bar, right below the page banner. */
DIV.bknavtop {
text-align: right;
font-weight: bold;
font-size: 80%;
padding: 1 3 1 3;
background: black;
color: white;
}
/* Use the default browser color, but flash the underline and color */
.bknavtop A:link { color: #FFFFFF; text-decoration: none; }
.bknavtop A:visited { color: #DDDDDD; text-decoration: none; }
.bknavtop A:hover { color: #FF0000; text-decoration: underline; }
/* Lower bar, right above the copyright. */
DIV.bknavbot {
text-align: center;
font-weight: bold;
font-size: 80%;
margin-top: 2em;
padding: 0.5em;
}
/* Table of contents display box. For local links to all of the
* sections on the current page. We usually put a search box there
* too. Do not put external links here, put them in the page body.
*/
DIV.bktoc {
font-size: 80%;
width: 20em;
border: solid 1px black;
/* background: #efefef; */
background: #DEE7EF;
padding: 1em;
margin-left: 1em;
margin-bottom: 1em;
float: right;
}
/* Kill the indent on lists and use different bullets. Some browsers
* use margin and others use padding, so set both to zero and just use
* the padding
*/
.bktoc UL{
margin: 0;
padding: 0;
padding-left: 1.5em;
list-style-type: square;
}
.bktoc UL UL {
list-style-type: disc;
}
/* ============================================================
* PARAGRAPH AND FONT STYLES - Used primarily by the reference manuals
* generated from Framemaker, but available for other pages as well.
*/
SPAN.keyword {
font-weight: bold;
}
SPAN.code {
font-size: 95%;
font-weight: bold;
font-family: monospace;
}
PRE.code {
margin-left: 5%;
margin-right:5%;
padding: 0.5em;
background: #DEE7EF;
border: solid 1px black;
}
/* Turn off the fancy backgrounds when used in tables */
TD PRE.code, TH PRE.code {
background: none;
border: none;
margin: 0;
padding: 0;
}
/* In the printed manuals, we use an alert icon, here we just use red
* bars on each side. There may be better ways to make it stand out.
*/
P.alert {
border-left: solid 3px #CE0000;
border-right: solid 3px #CE0000;
padding-left: 0.5em;
padding-right: 0.5em;
}
/* Nicely indented definition list for terms. Consider applying this
* to the base DL element.
*/
DL.termdefs { margin: 2em; padding: 0; }
DL.termdefs DT { font-weight: bold; }
DL.termdefs DD { margin: 0 3em 1em 3em; }
UL.tight LI { margin-top: 0; margin-bottom: 0; }
UL.loose LI { margin-top: 1em; margin-bottom: 1em; }