/*     This is the style Sheet for the home page of saundby.com
    It's not a template, don't use it unless you have my permission.
    Thanks.
    -Mark Graybill, August 2009
*/

/* Basics */

html { margin: 0; padding: 0; }

body {
    margin: 0;
    padding: 0;
/*    background: #ebd3b0 url('images/Signetics8080BarePCB-BG.jpg') no-repeat top; */
    background: #d2d7df url('images/Signetics8080BarePCB-BGt.png') no-repeat top;
    color: #fff383;
    line-height: 120%;
    font-family: Didot, Baskerville, Times New Roman, Georgia, Palatino, serif;

    letter-spacing: 0.13em;
    text-align: center;
    width: 100%;
    min-width: 850px;
}

img {
    margin: 5px;
    border-width: 1px;
}

h1 {
    letter-spacing: 0.2em;
    text-align: center;
    line-height: 125%;
}

h2 {
    letter-spacing: 0.15em;
    font-style: italic;
    text-align: center;
}

#pagetitle h3 {
    letter-spacing: 0.15em;
    font-style: italic;
    text-align: center;
}

#pagetitle h4 {
    letter-spacing: 0.15em;
    text-align: center;
}

a:link { color: #0077ff; }
a:visited { color: #a700df; }
a:hover { color: #00ffff; }

.title {
    font-variant: small-caps;
}

/* Divisions */

/* PAGETITLE ================================= */
/* This division sits above the rest of the page,
    across the top. The three columns of leftcol,
    rightcol, and main all start underneath this. 
    An ad banner can safely be placed over this div. */
    
#pagetitle {
    clear: both;
    margin: 20px 20px 20px 20px;
    float: top;
}

#pagetitle h2 {
    letter-spacing: 0.15em;
    font-style: italic;
    text-align: center;
}

#pagetitle h3 {
    letter-spacing: 0.15em;
    font-style: italic;
    text-align: center;
}

/* LEFTCOL ===================================== */
/* This is the outer "wrapper" for the left column.
    Other divisions like NAVBAR, link lists, and so on
    go inside this division. */

#leftcol {
    float: left;
    padding: 0;
    margin: 0;
    width: 210px;
}

/* RIGHTCOL =================================== */
/* This is the outer "wrapper" for the right column.
    Other divisions like NAVBAR, link lists, and so on
    go inside this division. */

#rightcol {
    float: right;
    padding: 0;
    margin: 0;
    width: 145px;
}

#rightcol a:link { color: #00adff; }
#rightcol a:visited { color: #d020ef; }
#rightcol a:hover { color: #00ffff; }


/* CONTAINER ================================= */
/* This wraps the content of the center section
    of the screen. The main section, and the footer
    are usual divisions to put inside the CONTAINER */
    
#container {
    margin: 0 auto;
    padding: 20px;
    background: #000;
    width: 830px;
    text-align: left;
}

/* NAVBAR ===================================== */
/* This is a general format for navigation bars,
    usually placed in either the left or right column. */
    
#navbar {
    padding: 0.5em; 
    margin: 0;
/*    background: #202434; Restore this 
    if you want a contrasting background. */
    letter-spacing: 0.15em;
    color: #00b7ff;
}

#navbar h1 { letter-spacing: 0.15em; margin: 0 0 .3em 0;}
#navbar h2 { letter-spacing: 0.15em; margin: 0 0 .3em 0;}
#navbar h3 { letter-spacing: 0.15em; margin: 0 0 .3em 0; color:#f0f060;}
#navbar h4 { letter-spacing: 0.15em; margin: 0 0 .3em 0;}
#navbar h5 { letter-spacing: 0.15em; margin: 0 0 .3em 0;}
#navbar h6 { letter-spacing: 0.15em; margin: 0 0 .3em 0;}

#navbar ul { 
    list-style-type: none; 
    padding: 0;
    margin: 0;
}

#navbar li { padding: 0 0 0.25em 0.25em; }

#navbar a:link { color: #006dd0; }
#navbar a:visited { color: #b700f0; }
#navbar a:hover { color: #dddd00; }


/* SUMMARY =================================== */
/* This is a pullquote or small intro statement
    for the page. Usually sits in the right column,
    can be moved to the left column, it may be
    desirable to change the width if so. */
    
#summary {
    margin: 0; 
    padding: 5px;
    width: 135px; 
    /* background: #202434; */
    letter-spacing: 0.15em;
    font: italic 10pt/22pt;
    color: #e0e060;
    text-align:center;
}

#summary p { margin: 0.3em; }

#summary h1 { letter-spacing: 0.2em; margin: 0 0 0.5em 0; line-height:1.2;}
#summary h2 { letter-spacing: 0.2em; margin: 0 0 0.5em 0; line-height:1.2;}
#summary h3 { letter-spacing: 0.2em; margin: 0 0 0.5em 0; line-height:1.2;}
#summary h4 { letter-spacing: 0.2em; margin: 0 0 0.5em 0;}
#summary h5 { letter-spacing: 0.2em; margin: 0 0 0.5em 0;}
#summary h6 { letter-spacing: 0.2em; margin: 0 0 0.5em 0;}

/* MAIN ===================================== */
/* The main section of the page. This
    stays in the center margin, and does not
    flow into the third column. */

#main {
    margin: 0 150px  0 215px;
    padding: 0;
    width: 445px;
}

/* ITEM ======================================== */
/* This is a format for short news items or links to
    other articles placed in the main section. */
#item {
    margin: 0 0 0.5em 0;
    padding:0;
    border: 1px solid gray;
    overflow: visible;
    min-height: 144px;
}

#item p {
    padding: 0 0.4em 0.2em 0.5em;
    color: #fdf7e0;
    font: normal 11pt/18pt;
    line-height: 135%;
}

#item h3 {
    margin: 0 0 0 0;
    padding: 0.3em;
    background: #02e;
    font-variant: small-caps;
    border-bottom: 1px solid gray;
}

#item p.highlight {
    padding: 0 0.4em 0.2em 0.5em;
    color: #3d5;
}

#item img {
    padding: 0;
    margin: 6px;
}

#item ul {
    margin: 0 0 0.5em 2em;
    padding: 4px;
}

/* INDEX ITEM ================================= */

#indexitem {
    margin: 0 0 0.5em 0;
    padding:0;
    border: 1px solid gray;
    overflow: visible;
    min-height: 144px;
}

#indexitem p {
    padding: 0 0.4em 0.2em 0.5em;
    font: normal 11pt/18pt Didot, Hoefler Text, Baskerville, Times New Roman, Georgia, Palatino, serif;
}


#indexitem h3 {
    margin: 0 0 0 0;
    padding: 0.3em;
    background: #303740;
    font-variant: small-caps;
    border-bottom: 1px solid gray;
}

#indexitem p.highlight {
    padding: 0 0.4em 0.2em 0.5em;
    color: #3d5;
}

#indexitem img {
    padding: 0;
    margin: 6px;
}

#indexitem ul {
    margin: 0 0 0.5em 2em;
    padding: 4px;
}


/* ARTICLE ==================================== */
/* A larger item on the page than an item, doesn't need to
    be set off as much, */

#article {
    margin: 0 0 0.5em 0;
    padding:0;
    overflow: visible;
    min-height: 144px;
}

#article p {
    padding: 0 0.4em 0.2em 0.5em;
    color: #f0f0ff;
    font: normal 11pt/18pt;
    letter-spacing: 110%;
    line-height: 125%;
}

#article h3 {
/* This is the title for the article and should br set off in some way,
    either through typography or color or a bacground. */
    margin: 0 0 0 0;
    padding: 0.3em;
    background: #444;
    font-variant: small-caps;
}

#article h4 {
/* This is used for article subtitles, should be set off mildly from
    text and brighten the page to avoid monotony in long runs of text. */
    margin: 0;
    padding: 0.2em 0 0 0;
    color: #3e7;
}
#article p.highlight {
    padding: 0 0.4em 0.2em 0.5em;
    color: #3d5;
}

#article img {
    padding: 0;
    margin: 6px;
}

#article ul {
    margin: 0 0 0.5em 2em;
    padding: 4px;
}


/* FOOTER ===================================== */
/* This is the section for the foot of the page, it will
    drop below the level of all content on the page that comes before it, including long left or right columns. Ads can be safely placed inside or after the footer. */
    
#footer {
    clear: both;
    margin: 0.3em;
    padding: 0.2em;
    font: normal 8pt/14pt Andale Mono, monospace;
    text-align: center;
    color: #fff393;

}


/* ADSENSE ====================================== */
/* This section holds formatting stuff for different adsense ads,
    a different adsense id can be created for each type of ad. */
    
#adsense-square { /* This is for 200x200 square ads
                        placed in the left column. */
    clear:left;
    float: left;
    margin: 1em 0 0 0;
}