12-Jan-04 (Created: 12-Jan-04) | More in 'CSS'

20.44 Westciv reference for selectors source page

/* Created using Style Master from Western Civilisation CSS1 { 53 383 708 448 } */
body {
background-color: #f3f1f4;
font-family: Verdana, Helvetica, Arial, sans-serif;
margin: 0em;
font-size: .8em;
background-image: url(images/decor/ellipses.gif);
background-repeat: repeat;
background-position: top left;
color: #49444c;
}

/* The following 5 are for the navigation bar at the top of each page which has the links to the 4 major sections of the site. */

#sm-layer {
position: relative;
z-index: 1;
text-align: left;
font-size: 1.5em;
font-style: normal;
font-weight: bold;
background-color: #f3f1f4;
margin-left: 17%;
border-left: 1px #625b66 solid;
padding-left: 10px;
border-right: 1px #625b66 solid;
padding-top: 5px;
margin-right: 12px;
}

#sm-layer a:link {
text-decoration: none;
color: #625b66;
}

#sm-layer a:visited {
text-decoration: none;
color: #625b66;
}

#sm-layer a:hover {
text-decoration: underline;
color: #625b66;
}

#lm-layer {
position: relative;
z-index: 1;
text-align: left;
font-size: 1.5em;
font-style: normal;
font-weight: bold;
background-color: #f3f1f4;
margin-left: 17%;
border-left: 1px #625b66 solid;
padding-left: 10px;
border-right: 1px #625b66 solid;
margin-right: 12px;
}

#lm-layer a:link {
text-decoration: none;
color: #625b66;
}

#lm-layer a:visited {
text-decoration: none;
color: #625b66;
}

#lm-layer a:hover {
text-decoration: underline;
color: #625b66;
}

#house-layer {
position: relative;
z-index: 1;
color: #4a88be;
text-align: left;
font-size: 1.5em;
font-style: normal;
font-weight: bold;
background-color: #f3f1f4;
margin-left: 17%;
border-left: 1px #625b66 solid;
padding-left: 10px;
border-right: 1px #625b66 solid;
margin-right: 12px;
}

#house-layer a:link {
text-decoration: none;
color: #4a88be;
}

#house-layer a:visited {
text-decoration: none;
color: #4a88be;
}

#house-layer a:hover {
text-decoration: underline;
color: #4a88be;
}

#courses-layer {
position: relative;
z-index: 1;
color: #625b66;
text-align: left;
font-size: 1.5em;
font-style: normal;
font-weight: bold;
border-bottom: 1px #625b66 dashed;
background-color: #f3f1f4;
margin-left: 17%;
border-left: 1px #625b66 solid;
padding-left: 10px;
border-right: 1px #625b66 solid;
padding-bottom: 5px;
margin-right: 12px;
}

#courses-layer a:link {
text-decoration: none;
color: #625b66;
}

#courses-layer a:visited {
text-decoration: none;
color: #625b66;
}

#courses-layer a:hover {
text-decoration: underline;
color: #625b66;
}

/* This too is in the top navigation bar - it's for the descriptions of each of the major sections. */

span.subtext {
letter-spacing: 0em;
font-size: 1em;
font-weight: normal;
}

/* This is for the left navigation bar that has the links to all the parts of the sub section of the site. */

#left-navbar {
background-color: #fff;
color: #4a88be;
font-weight: bold;
width: 17%;
text-align: right;
float: left;
margin-left: 0em;
margin-top: 3em;
padding-top: 1em;
padding-bottom: 1em;
}

p.left-navbar-1st-ad {
padding-right: 7px;
margin-top: 40px;
text-align: center;
}

p.left-navbar-2nd-ad {
padding-right: 7px;
margin-top: 100px;
text-align: center;
}

#left-navbar a:link {
text-decoration: none;
color: #4a88be;
}

#left-navbar a:visited {
text-decoration: none;
color: #4a88be;
}

#left-navbar a:hover {
text-decoration: none;
color: #224059;
}

#left-navbar a.left-current {
color: #224059;
}

p.left-navbar {
padding-right: 1em;
}

p.hideIEMacBug {
display: none;
}

/* All the rest is for the main text content of the site. */

#main-content {
margin-right: 12px;
margin-left: 17%;
background-color: white;
position: relative;
z-index: 5;
border-left: 1px #625b66 solid;
border-bottom: 1px #625b66 solid;
border-right: 1px #625b66 solid;
}

body.toc #main-content {
background-color: #f3f1f4;
}

#main-content p {
padding-left: 1.5em;
padding-right: 1.5em;
line-height: 1.6em;
}

#main-content ul {
padding-left: 2.5em;
}

#main-content ol {
padding-left: 2.5em;
}

#main-content li {
line-height: 1.6em;
}

#main-content a:link {
text-decoration: none;
color: #49444c;
background-color: #cfd7e6;
}

#main-content a:visited {
text-decoration: none;
background-color: #cfd7e6;
color: #49444c;
}

#main-content a:hover {
text-decoration: none;
background-color: #21425a;
color: #ffffff;
}

/* This is mainly for tutorials, case studies, manuals and so on. */

.code-example {
font-family: Courier, "Courier New", monospace;
background-color: #f3f1f4;
margin-left: 1.5em;
margin-right: 1.5em;
padding-top: 3px;
padding-bottom: 3px;
}

.exercise {
background-color: #224059;
font-style: italic;
margin-left: 1.5em;
margin-right: 1.5em;
padding-top: 3px;
padding-bottom: 3px;
color: #ffffff;
font-weight: bold;
}

pre {
font-family: Courier, "Courier New", monospace;
background-color: #f3f1f4;
margin-left: 1.5em;
margin-right: 1.5em;
padding: 3px;
border: 1px #625b66 solid;
}

span.button {
font-weight: bold;
}

code {
font-family: Courier, "Courier New", monospace;
font-size: 1em;
}

p.instruction-intro {
font-weight: bold;
text-decoration: underline;
}

#main-content p.instruction {
padding-left: 3em;
}

span.menu {
font-weight: bold;
}

/* Quotes in the review section. */

blockquote {
background-color: #f3f1f4;
border: 1px #625b66 solid;
margin-left: 2.5em;
margin-right: 2.5em;
}

blockquote p {
margin-left: 0em;
margin-right: 0em;
margin-top: 5px;
margin-bottom: 5px;
}

/* For the Style Master promotions in the main text */

.sm-promo {
border-top: 1px #625b66 solid;
border-bottom: 1px #625b66 solid;
background-color: #f3f1f4;
font-size: .8em;
background-image: url(images/decor/promo_bg.gif);
background-repeat: no-repeat;
background-position: 5px 37px;
}

.sm-promo h2 {
margin: 0em;
font-style: normal;
background-color: #4a88be;
letter-spacing: 4px;
color: #f3f1f4;
word-spacing: 3px;
}

p.promonav {}

#main-content .sm-promo p {
margin-left: 67px;
}

#main-content .sm-promo ul {
margin-left: 97px;
}

p.courselist {
text-align: center;
}

/* For the Courses promotions in the main text. */

.courses-promo {
border-top: 1px #625b66 solid;
border-bottom: 1px #625b66 solid;
background-color: #f3f1f4;
font-size: .8em;
background-image: url(images/decor/courses_promo.gif);
background-repeat: no-repeat;
background-position: 8px 37px;
}

.courses-promo h2 {
margin: 0em;
font-style: normal;
background-color: #4a88be;
letter-spacing: 4px;
color: #f3f1f4;
word-spacing: 3px;
}

#main-content .courses-promo p {
margin-left: 67px;
}

#main-content .courses-promo ul {
margin-left: 97px;
}

/* For the Workshop promotions in the main text. */

.workshop-promo {
border-top: 1px #625b66 solid;
border-bottom: 1px #625b66 solid;
background-color: #f3f1f4;
font-size: .8em;
background-image: url(images/decor/courses_promo.gif);
background-repeat: no-repeat;
background-position: 8px 37px;
}

.workshop-promo h2 {
margin: 0em;
font-style: normal;
background-color: #4a88be;
letter-spacing: 4px;
color: #f3f1f4;
word-spacing: 3px;
}

#main-content .workshop-promo p {
margin-left: 67px;
}

#main-content .workshop-promo ul {
margin-left: 97px;
}

/* For the book promotions throughout the main text. */

.book-promo {
border-top: 1px #625b66 solid;
border-bottom: 1px #625b66 solid;
margin-top: 20px;
margin-bottom: 20px;
background-color: #f3f1f4;
font-size: .8em;
background-image: url(images/decor/designing_without_tables.gif);
background-repeat: no-repeat;
background-position: 5px 37px;
}

.book-promo h2 {
margin: 0em;
font-style: normal;
background-color: #4a88be;
letter-spacing: 4px;
color: #f3f1f4;
word-spacing: 3px;
}

#main-content .book-promo p {
margin-left: 130px;
}

#main-content .book-promo ul {
margin-left: 160px;
}

/* This is for any tabular information, such as the volume licensing information. */

p.table {
text-align: center;
}

table.standard-table {
background-color: #f3f1f4;
border: 1px #625b66 solid;
width: 75%;
font-size: 1em;
}

td.toprow {
font-weight: bold;
color: #ffffff;
background-color: #132433;
}

td.leftcolumn {
background-color: #224059;
color: #ffffff;
}

table.standard-table td {
border: 1px #625b66 solid;
}

/* This is for the breadcrumb trail. */

#main-content p.crumb-trail {
padding-top: 2px;
background-color: #f3f1f4;
margin: 0em;
border-bottom: 1px #625b66 solid;
padding-bottom: 2px;
padding-left: 2px;
line-height: normal; }

#main-content a:link.crumb-back {
background-color: #f3f1f4;
color: #877d8c;
font-weight: bold;
font-size: .8em;
}

#main-content a:visited.crumb-back {
background-color: #f3f1f4;
color: #877d8c;
font-weight: bold;
font-size: .8em;
}

#main-content a:hover.crumb-back {
background-color: #f3f1f4;
color: #877d8c;
font-weight: bold;
font-size: .8em;
text-decoration: underline;
}

span.crumb-current {
font-size: .8em;
font-weight: bold;
color: #625b66;
}

span.crumb-arrow {
font-size: .7em;
color: #4a88be;
font-weight: 900;
}

/* The contextual selectors are for the links in tables of contents. */

/* Note that h1 is in fact outside the main-content div. */

h1 {
font-weight: bold;
text-align: right;
font-size: 1.3em;
color: #625b66;
margin: 0em;
padding-right: 3%;
padding-top: 5px;
background-color: #f3f1f4;
margin-left: 17%;
border-left: 1px #625b66 solid;
border-bottom: 1px #625b66 solid;
border-right: 1px #625b66 solid;
padding-bottom: 4px;
margin-right: 12px;
}

h2 {
border-bottom: 1px #625b66 solid;
font-style: italic;
font-size: 1.1em;
padding-left: .8em;
color: #625b66;
margin-bottom: 0px;
margin-top: 0px;
padding-top: 7px;
padding-bottom: 2px;
}

body.toc #main-content h2 {
font-style: normal;
color: #312d33;
}

h2.major-section {
background-color: #4a88be;
border-top: 1px #625b66 solid;
}

h3 {
font-size: 1em;
padding-left: 1.5em;
color: #625b66;
font-style: italic;
font-weight: bold;
text-decoration: underline;
}

body.toc #main-content h3 {
font-size: 1em;
font-style: normal;
padding-left: 2.4em;
margin-top: 0px;
margin-bottom: 0px;
background-color: #dbd9dc;
padding-top: 2px;
padding-bottom: 2px;
text-decoration: none;
color: #312d33;
font-weight: bold;
}

#main-content h3 a:link {
font-size: 1em;
color: #312d33;
background-color: #dbd9dc;
text-decoration: none;
}

#main-content h3 a:visited {
font-size: 1em;
color: #312d33;
background-color: #dbd9dc;
text-decoration: none;
}

#main-content h3 a:hover {
font-size: 1em;
color: #224059;
background-color: #dbd9dc;
text-decoration: underline;
}

h4 {
font-size: 1em;
padding-left: 1.5em;
color: #625b66;
font-style: italic;
font-weight: bold;
text-decoration: none;
}

body.toc #main-content h4 {
font-size: 1em;
padding-left: 4.0em;
margin-bottom: 0px;
margin-top: 0px;
background-color: #c1c0c2;
padding-top: 2px;
padding-bottom: 2px;
font-style: normal;
color: #312d33;
font-weight: bold;
text-decoration: none;
}

#main-content h4 a:link {
font-size: 1em;
color: #312d33;
background-color: #c1c0c2;
font-weight: bold;
text-decoration: none;
}

#main-content h4 a:visited {
font-size: 1em;
color: #312d33;
background-color: #c1c0c2;
font-weight: bold;
text-decoration: none;
}

#main-content h4 a:hover {
font-size: 1em;
color: #224059;
background-color: #c1c0c2;
text-decoration: underline;
font-weight: bold;
}

h5 {
font-size: 1em;
padding-left: 1.5em;
color: #625b66;
text-decoration: underline;
font-style: normal;
font-weight: normal;
}

body.toc #main-content h5 {
font-size: 1em;
padding-left: 4.8em;
margin-top: 0px;
margin-bottom: 0px;
background-color: #a8a7a8;
padding-top: 2px;
padding-bottom: 2px;
text-decoration: none;
color: #312d33;
font-weight: bold;
font-style: normal;
}

#main-content h5 a:link {
font-size: 1em;
color: #312d33;
background-color: #a8a7a8;
text-decoration: none;
}

#main-content h5 a:visited {
font-size: 1em;
color: #312d33;
background-color: #a8a7a8;
text-decoration: none;
}

#main-content h5 a:hover {
font-size: 1em;
color: #224059;
background-color: #a8a7a8;
text-decoration: underline;
}

h6 {
font-size: 1em;
padding-left: 1.5em;
color: #625b66;
font-style: italic;
font-weight: normal;
text-decoration: none;
}

body.toc #main-content h6 {
font-size: 1em;
padding-left: 5.6em;
margin-bottom: 0px;
margin-top: 0px;
background-color: #8e8d8f;
padding-top: 2px;
padding-bottom: 2px;
color: #312d33;
font-style: normal;
font-weight: bold;
text-decoration: none;
}

#main-content h6 a:link {
font-size: 1em;
color: #312d33;
background-color: #8e8d8f;
text-decoration: none;
}

#main-content h6 a:visited {
font-size: 1em;
color: #312d33;
background-color: #8e8d8f;
text-decoration: none;
}

#main-content h6 a:hover {
font-size: 1em;
color: #224059;
background-color: #8e8d8f;
text-decoration: underline;
}

p.figure {
text-align: center;
}

p.figure img {
padding-top: 3px;
}

p.figure-label {
font-size: .8em;
font-weight: bold;
text-align: center;
}

a img {
border: none;
}

img.floatright {
float: right;
}

img.floatleft {
float: left;
padding-right: 10px;
}

/* The following are largely for the hands-on tutorial. */

.sm-only {
background-color: #feeddd;
border-top: 1px #625b66 solid;
border-bottom: 1px #625b66 solid;
}

/* This is for the copyright notice at the bottom of the page, whcih is in fact outside the main-content div. */

#copy-notice {
margin-top: 0em;
font-size: .7em;
text-align: center;
margin-right: 12px;
margin-left: 17%;
background-color: #224059;
padding-top: 3px;
padding-bottom: 3px;
margin-bottom: 10px;
border-left: 1px #625b66 solid;
border-bottom: 1px #625b66 solid;
position: relative;
z-index: 5;
border-right: 1px #625b66 solid;
}

#copy-notice p {
margin: 0em;
}

#copy-notice a:link {
text-decoration: none;
color: white;
background-color: #224059;
}

#copy-notice a:visited {
text-decoration: none;
color: white;
background-color: #224059;
}

#copy-notice a:hover {
text-decoration: underline;
color: white;
background-color: #224059;
}

#lm-made {
margin-left: 7px;
margin-top: -45px;
}

#sm-made {
margin-left: 7px;
margin-top: -80px;
}

/* This is for the banner ads throughout the house of style. */

div.smbanner {
background-color: #ff7d00;
color: white;
font-size: 1.1em;
font-style: italic;
font-weight: bold;
padding-bottom: .5em;
padding-top: .5em;
text-align: center;
margin: 0em;
}

#main-content div.smbanner a:link {
background-color: #ff7d00;
color: white;
text-decoration: underline;
}

#main-content div.smbanner a:visited {
background-color: #ff7d00;
color: white;
text-decoration: underline;
}

#main-content div.smbanner a:hover {
background-color: #ff7d00;
color: #4c2500;
text-decoration: underline;
}

div.lmbanner {
background-color: #70bc1f;
color: white;
font-size: 1.1em;
font-style: italic;
font-weight: bold;
padding-bottom: .5em;
padding-top: .5em;
text-align: center;
margin: 0em;
}

#main-content div.lmbanner a:link {
background-color: #70bc1f;
color: white;
text-decoration: underline;
}

#main-content div.lmbanner a:visited {
background-color: #70bc1f;
color: white;
text-decoration: underline;
}

#main-content div.lmbanner a:hover {
background-color: #70bc1f;
color: #2d4c0c;
text-decoration: underline;
}

/* This is for the navigation tables inside multipage tutorials, manuals, the Guide etc. */

/* navbar1 is for the navigation bars that have only one arrow. */

#main-content p.top-navbar1 {
margin: 0em;
font-size: .8em;
border-bottom: 1px #625b66 solid;
background-color: #dae4f0;
color: #625b66;
padding-top: 2px;
padding-bottom: 2px;
padding-right: 50px;
text-align: center;
padding-left: 2px;
}

#main-content p.top-navbar1 a:link {
background-color: #dae4f0;
color: #625b66;
}

#main-content p.top-navbar1 a.current:link {
background-color: #224059;
color: #dae4f0;
}

#main-content p.top-navbar1 a:visited {
background-color: #dae4f0;
color: #625b66;
}

#main-content p.top-navbar1 a.current:visited {
background-color: #224059;
color: #dae4f0;
}

#main-content p.top-navbar1 a:hover {
background-color: #224059;
color: #dae4f0;
}

#main-content p.bot-navbar1 {
margin: 0em;
font-size: .8em;
border-top: 1px #625b66 solid;
background-color: #dae4f0;
color: #625b66;
padding-top: 2px;
padding-bottom: 2px;
padding-right: 50px;
text-align: center;
padding-left: 2px;
}

#main-content p.bot-navbar1 a:link {
background-color: #dae4f0;
color: #625b66;
}

#main-content p.bot-navbar1 a.current:link {
background-color: #224059;
color: #dae4f0;
}

#main-content p.bot-navbar1 a:visited {
background-color: #dae4f0;
color: #625b66;
}

#main-content p.bot-navbar1 a.current:visited {
background-color: #224059;
color: #dae4f0;
}

#main-content p.bot-navbar1 a:hover {
background-color: #224059;
color: #dae4f0;
}

/* navbar2 is for the navigation bars that have 2 arrows. */

#main-content p.top-navbar2 {
margin: 0em;
font-size: .8em;
border-bottom: 1px #625b66 solid;
background-color: #dae4f0;
color: #625b66;
padding-top: 2px;
padding-bottom: 2px;
padding-right: 93px;
text-align: center;
padding-left: 2px;
}

#main-content p.top-navbar2 a:link {
background-color: #dae4f0;
color: #625b66;
}

#main-content p.top-navbar2 a.current:link {
background-color: #224059;
color: #dae4f0;
}

#main-content p.top-navbar2 a:visited {
background-color: #dae4f0;
color: #625b66;
}

#main-content p.top-navbar2 a.current:visited {
background-color: #224059;
color: #dae4f0;
}

#main-content p.top-navbar2 a:hover {
background-color: #224059;
color: #dae4f0;
}

#main-content p.bot-navbar2 {
margin: 0em;
font-size: .8em;
border-top: 1px #625b66 solid;
background-color: #dae4f0;
color: #625b66;
padding-top: 2px;
padding-bottom: 2px;
padding-right: 93px;
text-align: center;
padding-left: 2px;
}

#main-content p.bot-navbar2 a:link {
background-color: #dae4f0;
color: #625b66;
}

#main-content p.bot-navbar2 a.current:link {
background-color: #224059;
color: #dae4f0;
}

#main-content p.bot-navbar2 a:visited {
background-color: #dae4f0;
color: #625b66;
}

#main-content p.bot-navbar2 a.current:visited {
background-color: #224059;
color: #dae4f0;
}

#main-content p.bot-navbar2 a:hover {
background-color: #224059;
color: #dae4f0;
}

#main-content p.nav-arrows {
text-align: right;
margin-bottom: 0em;
margin-left: 0em;
margin-right: 0em;
margin-top: -44px;
padding-right: 4px;
}

p.nav-arrows img {
padding-right: 4px;
}

p.fullversion {
margin-left: 2.5em;
margin-right: 2.5em;
border-top: 4px #316384 dotted;
border-bottom: 4px #316384 dotted;
}