/* Style sheet for */
/* Mark Stefaniw Music Web Site from November 2011 */
/* Some pages may add additional rules if required as internal stylesheet */
/* Used in conjunction with a separate print stylesheet */
/* Some pages may link additional stylesheet for IE6 but most IE issues are resolved using IE7/8 script */
/* Based on Komposer style sheet of Charles Cooke */

/* Global scene setting */
/* ==================== */

html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, font, img, kbd, q, s, samp, strong, sub, sup, dl, dt, dd, ol, ul, li, table, caption, tbody, tfoot, thead, tr, th, td
{
    border: none;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}
body
{
    position: relative;
    margin: 0px;
    max-width: 58em;
    font-family: 'Palatino Linotype' , 'Book Antiqua' , Palatino, 'Calisto MT' , Times, 'Times New Roman' , Georgia, Baskerville, 'Century Schoolbook' , Century, 'Lucida Bright' , serif;
    font-size: 0.90em;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    background-color: #AA661E;
    line-height: 1;
    color: black;
}

/* Layout */
/* ====== */

#wrapper
{
    position: relative;
    font-size: 100%;
}
#main
{
    position: relative;
    left: 9em;
    margin-left: 43px;
    margin-right: 9em;
}
#content
{
    position: relative;
    border: 2px solid #1e2939;
	background-color: rgb( 233, 184, 131); /* a lighter version of my main body background color. */
    margin-bottom: 12px;
    padding: 8px;
}
#page_menu
{
    position: fixed;
    padding-left: 20px;
    height: 450px;
    z-index: 1;
    background-position: top left;
    background-repeat: no-repeat;
}
#site_menu
{
    position: absolute;
    right: -9.4em;
    width: 9em;
    margin-right: 0px;
    top: 102px;
}

#header
{
    position: relative;
    height: 102px;
    margin-bottom: 10px;
}


/* Global elements */
/* =============== */

p, blockquote
{
    margin: 1em 0;
    letter-spacing: 0.1em;
    line-height: 1.4em;
    text-align: left;
}
dt, dd
{
    letter-spacing: 0.05em;
    margin: 0.5em 0;
}
h1, h2, h3, h4, h5, h6
{
    font-weight: bold;
    margin: 1em 0 0.25em;
    color: #1e2939;
}
#content h2, #content h3, #content h4
{
    margin-left: 18px;
    text-indent: -28px;
}
h1
{
    font-size: 1.6em;
    margin-top: 0.25em;
    line-height: 1.2;
    text-shadow: 2px 2px 4px #aaa;
}
h2
{
    font-size: 1.4em;
    clear: both;
}
h3
{
    font-size: 1.2em;
}
h4, h5, h6
{
    font-size: 1em;
}

acronym
{
    font-variant: small-caps;
}

/* Due to be removed in HTML5 */
abbr
{
    font-variant: small-caps;
}
blockquote
{
    letter-spacing: 0.00em;
}
caption
{
    caption-side: top;
    margin-bottom: 0.25em;
    font-weight: bold;
    letter-spacing: 0.1em;
}
dd
{
    margin-bottom: 1em;
    line-height: 1em;
    margin-left: 1em;
}
dt
{
    font-weight: bold;
}
hr
{
    margin: 1em 10%;
    background-color: #4499bb;
    color: #1e2939;
    height: 2px;
}

/* From Mozilla*/
ol, ul
{
    margin-left: 2.5em;
    margin-bottom: 1em;
}
li
{
    margin-bottom: 0.1em;
    margin-top: 0.5em;
    letter-spacing: 0.1em;
    line-height: 1em;
    list-style-image: url(images/bassclef.png);
    font-size: small;
}

sub
{
    vertical-align: sub;
}
sup
{
    vertical-align: top;
    font-size: 0.8em;
    white-space: nowrap;
    text-transform: uppercase;
}
table
{
    border: 2px solid #1e2939;
    border-collapse: collapse;
}
td, th
{
    border: 1px dotted #1e2939;
    padding: 2px;
    text-align: center;
    letter-spacing: 0.1em;
}

/* Global classes*/
/* ============= */

.bigger
{
    font-size: larger;
}
.smaller
{
    font-size: smaller;
}
.centre
{
    margin-left: auto;
    margin-right: auto;
}
.clear_r
{
    clear: right;
}
.clear_l
{
    clear: left;
}
.clear_n
{
    clear: none;
}
.keycap
{
    background-color: #eae9D7;
    border-color: #f5f8ed #a4a585 #a4a585 #eee;
    border-style: solid;
    border-width: 2px;
    color: #000000;
    font-weight: bold;
    padding: 1px;
    color: red;
}
/* To be reviewed - Replace using kbd??? */
.left
{
    float: left;
    position: relative;
    margin-right: 4px;
    clear: left;
}
/* Position to sort IE6 bug */
.nobreak
{
    white-space: nowrap;
}
.nofloat
{
    float: none;
}
.right
{
    float: right;
    position: relative;
    margin-left: 4px;
    clear: right;
}
/* Position to sort IE6 bug */
.strikeout
{
    text-decoration: line-through;
}
div.image_holder h6
{
    text-align: center;
    margin-top: 0;
}


/* Global Links*/
/* =========== */

a:link, a:visited
{
    text-decoration: underline;
    letter-spacing: 0.1em;
    color: #1e2939;
}
a:focus
{
    outline: 2px #1e2939 dotted;
}
a[href^="http"]
{
    padding-right: 4px;
}

/* Global Complex selectors */

h1 + p:first-letter, h1 + h2 + p:first-letter
{
    font-weight: bold;
    color: #1e2939;
    text-transform: uppercase;
    font-size: 3.5em;
    float: left;
    line-height: 0.7;
    letter-spacing: 0;
    text-shadow: 2px 2px 4px #aaa;
}
h1 + p:first-line, h1 + h2 + p:first-line
{
    text-transform: uppercase;
    font-weight: bold;
    color: #1e2939;
}
div.clearance
{
    clear: both;
    height: 1px;
    font-size: 1px;
}
div.clearance_l
{
    clear: left;
    height: 1px;
    font-size: 1px;
}
div.dem_box
{
    border: 2px solid #4289b5;
    padding: 0em 1em;
    background-color: #f4f8ff;
    overflow: auto;
}
div.dem_box p
{
    text-align: left;
    margin-bottom: 1em;
    line-height: 1;
}
div.side_box
{
    border: 2px solid #4289b5;
    padding-right: 8px;
    margin-left: 4px;
    margin-bottom: 0.25em;
    width: 40%;
    float: right;
    padding-left: 4px;
    position: relative;
}
div.tip
{
    border-style: solid;
    border-color: #4289b5;
    border-width: 10px 0px;
    margin: 4px 0px 4px 4px;
    padding-left: 4px;
    width: 250px;
    float: right;
    position: relative;
    clear: right;
    background-color: #f4f8ff;
}
div.w150
{
    width: 150px;
}
div.w15e
{
    width: 15em;
}
div.w25e
{
    width: 25em;
}
div.display p
{
    margin: 0;
    color: #666;
    font-size: large;
    font-weight: bold;
    text-align: center;
}
span.tab5
{
    position: absolute;
    left: 5em;
}
/* Previously tab1 */
span.tab10
{
    position: absolute;
    left: 10em;
}
/* Previously tab2 */
span.tab15
{
    position: absolute;
    left: 15em;
}
/* Previously tab3 */
span.tab20
{
    position: absolute;
    left: 20em;
}
/* Previously tab4 */


/* Notes specials*/
/* ============== */
div#notes
{
    clear: both;
}
div#notes ul
{
    margin-left: 2em;
    list-style-type: none;
}


/* References specials*/
/* ============== */
#references
{
    clear: both;
}
#references ul
{
    margin-left: 1em;
    list-style-type: none;
}
#references li
{
    margin-left: 3em;
    text-indent: -3em;
}


/* Footer specials*/
/* ============== */
#footer
{
    background-color: #1E2939;
    color: white;
    padding: 4px;
    margin-bottom: 1em;
}
#footer p
{
    margin: 0;
    font-size: 0.8em;
}
#footer p.copyright, #footer p.update
{
    text-align: center;
}

/* Menu specials*/
/* ============ */

#page_menu h2, #site_menu h2
{
    text-align: center;
    font-size: 1em;
}
ul.menu
{
    margin: 0 0 0.5em 0;
    list-style-type: none;

}
ul.menu li
{
    margin: .25em 0;
    line-height: 1.2;
    list-style-image: none;
}
ul.menu li a
{
    border: 1px solid black;
    display: block;
    text-align: center;
    background-color: #1E2939;
    color: white;
    text-decoration: none;
}
ul.menu a.current:link, a.current:visited
{
    color: #1E2939;
	text-align: right;
    background-color: rgb( 233, 184, 131); /* a lighter version of my main body background color. */
    font-weight: bold;
}
