tags around a short string, ie
Place text here
*/
.fut-ex {
font-family: "futura-ex";
font-size: 100%;
}
.goudy {
font-family: "goudy";
font-size: 100%;
}
.goudy-it {
font-family: "goudy-it";
font-size: 100%;
}
.gill {
font-family: "gillsans";
font-size: 100%;
}
.gill-it {
font-family: "gillsansi";
font-size: 100%;
}
.gill-bd {
font-family: "gillsansb";
font-size: 100%;
}
.gill-bd-it {
font-family: "gillsansbi";
font-size: 100%;
}
.gill-lt {
font-family: "gillsansl";
font-size: 100%;
}
.gill-lt-it {
font-family: "gillsansli";
font-size: 100%;
}
.fontsubhd {
font-family: "goudy-bd";
font-size: 125%;
font-weight:bold;
}
.fontsz85 {
font-size: 85%;
}
.fontsz50 {
font-size: 50%;
}
.slim-line {
font-size: 175%;
line-spacing: 142%;
line-height: 140%;
}
.small {
font-size: small;
}
.ital {
font-style: italic;
}
/* Miscellaneous */
h1 {
line-height: 115%;
}
h2 {
line-height: 115%;
}
.chaptername {
font-family: gillsansb;
text-indent: 0;
text-align: center;
margin-top: 2em;
margin-bottom: 1em;
}
.chaptersub {
font-family: gillsansb;
text-indent: 0;
text-align: center;
margin-top: 0em;
margin-bottom: 1em;
}
.copyright {
font-size: 67%;
line-spacing: 67%;
line-height: 98%;
}
/* DROP CAPS and UP CAPS */
/* Capps appear above the line */
span.dropcaps1 {
font-size: 50px;
line-height: 50px;
padding-top: 1px;
}
/* Another way to put caps above the line */
span.capup {
font-family: sans-serif;
font-size: 4.5em;
line-height: 0em;
}
/* Capps appear below the line */
span.dropcaps {
float: left;
font-size: 420%;
line-height: 0.85em;
margin-right: 0.03em;
margin-bottom: -0.25em;
}
span.dropcap {
float: left;
line-height: 1.5em;
font-size: 4em;
margin-top: -.45em;
margin-bottom: -.5em;
}
/* original below works in Sigil, but unworks in KoboAura */
/*
span.dropcaps2 {
float: left;
font-size: 50px;
line-height: 50px;
padding-top: 1px;
margin-top: -.09em;
margin-right: .09em;
}
*/
span.dropcaps2 {
float: left;
font-size: 3.0em;
line-height: 1.0em;
padding-top: 1px;
margin-top: -.09em;
margin-right: .09em;
}
/* Capps appear below the line */
span.dropcaps3lines {
float: left;
font-size: 80px;
line-height: 70px;
padding-top: 1px;
margin-top: -.09em;
margin-right: .09em;
}
/* DOING BOXES */
div.box {
margin-top: 2em;
margin-bottom: 2em;
border-bottom: 2px solid;
border-top: 2px solid;
border-left: 2px solid;
border-right: 2px solid;
line-height: 1.3em;
text-align: center;
padding-left: 1em;
padding-right: 1em;
padding-top: .5em;
padding-bottom: .5em;
}
span.box
{
border: 1px solid #020202;
padding: 0em .2em 0em .2em;
margin-top: 0em;
margin-bottom: 0em;
}
p.box
{
border-bottom: 1px double;
border-left: 1px double;
border-top: 1px double;
border-right: 1px double;
text-align: justify;
}
/* To form a grey box with text inside NO border */
/* Syntax in css file; Use Netscape color coding to select background color. This example gives a medium grey color */
div.cap {
text-align:center;
margin-top:0em;
margin-bottom:2em;
background-color:#D2D4D6;
padding:0.25em;
}
/* Syntax in xhtml file:*/
The quick brown fox jumps over the lazy grey squirrel.
/* Example syntax for text in css file; this can be changed to suit "look & feel" */
.figc {
font-size:85%;
font-family:serif;
margin-left:0.5em;
text-indent:0em;
margin-top:0.2em;
margin-bottom:0em;
text-align:left;
}
/* BOXES */
/* Box WITHOUT a border (but with a grey background)
place *before* this tag on xhtml page to create a white border on left/right margains */
div.blockquote {
margin-left:0.5em;
margin-right:0.5em;
}
div.box {
padding: 0.5em;
background-color: #e7e7e8;
}
/* Box WITH a border */
div.box { /* for box style in book */
border: 4px double;
padding-left: 2em;
padding-right: 2em;
padding-top: 5px;
padding-bottom: 1em;
margin-bottom: 1.5em;
margin-top: 1em;
background-color: #e7e7e8;
}
/* Simple thin black line border around a box */
div.border {
border-top: black solid .1em;
border-bottom: black solid .1em;
border-left: black solid .1em;
border-right: black solid .1em;
margin-top: 1em;
margin-bottom: 1em;
padding: 1em 1em 1em 1em;
}
h1.headlinebox {
color:#000000;
background-color: #cccccc;
border: double medium #cccccc;
padding: .2em;
font-family: serif; /*"ITC Serif Gothic Std ExtraBold"*/
font-size:1.083em;
font-weight:bold;
margin-bottom:10%;
margin-left:0;
margin-right:0;
margin-top:10%;
text-align:center;
text-indent:0;
}
/* This box has a border with a shadow and rounded corners */
div.box1
{
background-color: ghostwhite; /* Inside of box is white */
border: 1px solid #020202;
padding: .49em;
margin-top: .2%;
margin-bottom: 0em;
margin-left: .3em;
margin-right: .3em;
border-radius: 1em;
box-shadow: .2em .3em .2em #888888;
}
/* Fancier box with a shadow and rounded corners, plus a dotted line inside the box around the text. Requires both a div.xx and p.xx entry in styles.css: */
/* Example:
Text inside box is placed here.
*/
div.box2 {
background-color: #EFCF21; /* yellow box */
border: 1px solid #EFCF21;
padding: 1em;
margin-top: 0em;
margin-bottom: 0em;
margin-left: 0.3em;
margin-right: 0.3em;
border-radius: 1em;
box-shadow: .2em .3em .2em #888888;
}
p.fancier-box {
font-family: sans-serif; /* Set font here */
border: dotted 7px ghostwhite; /* size-color of dots */
padding: .7em;
color: #D62C21; /* font color, red */
margin-top: 0em;
margin-bottom: 1em;
text-indent: 0em;
}
/* Provides a container around which text will wrap */
/* Use this synatax in .xhtml file for an image 45% of the width on the left-hand side of the page:
*/
div.float-left45 {
width: 45%;
float: left;
margin-right: 8px;
}
div.float-left25 {
width: 25%;
float: left;
margin-right: 8px;
}
div.float-right25 {
width: 25%;
float: right;
margin-left: 8px;
}
/* Changes all text to upper case */
p.headline {
font-family: sans-serif;
text-transform:uppercase;
}
/* To redact (blackout, ie, in a classified document) a series of words. Example:
The secret code word 29dJB7htqSR only works on even-numbered Sundays.
*/
span.blackout {
background-color: #020202;
padding: 0.1em;
}
/* To add extra white space in a skipped line, ie
*/
.spaceBreak {
display: block;
margin-bottom: 0%;
margin-top: 7%;
text-align: center;
text-indent: 0%;
}
/* -- images that are largest on the vertical side -- */
img.vert {
margin: 0;
text-align: center;
height: 90%;
max-width: 100%;
}
/* -- images that are largest on the horizontal side -- */
img.horiz {
margin: 0;
text-align: center;
width: 100%;
height: auto;
}
/*
Ensure the followwing line of code is located in each of the xhtml files' headers. Must be located between the tag and the tag. Note that the file name, main.css, can be changed provided the link tagg header references are also changed to the new .css filename in each xhtml file. More than one .css file can be used, but each file must have a separate link line inserted in each xhtml file:
Note the correct way to call these fonts within the xhtml text itself. Example for a Goudy TTF headline:
Headline Text
Example to call p.abc above:
Text here.
Example to call div.block1 above:
Text here.
*/