
/*
 * style's for dan and assana's main home page 
 */ 

body {
    font: 1.0em/1.5em arial, verdana, chalkboard, comic sans ms;
    color: #4f4f4f;
    background: #86a694 url(../images/bgShading.png) repeat-x bottom;
    background: #4f6358;	/* green */
    text-align: center;
    margin: 0;
    padding: 0;
    -webkit-border-radius:10px;
}

img {
    border: 0;
}

#bodyShading {
    background: #86a694 url(../images/bgShading.png) repeat-x bottom;
}

#outerWrapper {		/* includes the top navLine and the footer */
    width: 878px;
    font: .70em/1.5em arial, verdana, chalkboard, comic sans ms;
    margin: 0 auto;
    padding: 0;
    padding-top: 6px;
    padding-bottom: 64px;
}

#headerShadow {
    width: 878px;
    margin: 0 auto;
    padding: 0;
    padding-top: 6px;	
    background: url(../images/topShadow850.png) no-repeat top;
}

#headerTop {
    margin: 0 auto;
    padding: 0;
    width: 850px;
    height: 25px;
    background: #4f4437;	/* darker wimereiner */
}

#footerShadow {
    margin: 0 auto;
    padding: 0;
    width: 878px;
    padding-bottom: 22px;
    background: url(../images/bottomShadow850.png) no-repeat bottom;
}
#footerTop {
    margin: 0 auto;
    padding: 0;
    width: 850px;
    height: 22px;
    background: #e6e2af;
    background: #ffffdc;
 }

#bodyShadow {
    margin: 0 auto;
    width: 878px;
    padding: 0;
    background: url(../images/bodyShadow850.png) repeat-y center;
}

#header {
    margin: 0 auto;
    padding: 0;
    width: 850px;
    height: 150px;
    background: #877d6c;	/* weimereiner */
    background: #4f4437;	/* darker */
}

#wrapper {
    clear: both;
    width: 850px;
    text-align: left;
    background: #ffffdc;
    margin: 0 auto;
}

#header h2 {
    display: block;
    margin: 0 auto;
    padding: 0;
    width: 850px;
    height: 150px;
    position: relative;
    background: url(../images/DanAndAssana.png) no-repeat bottom right; 
    text-indent: -9999px;
    color: white;
}

#mainNavigation {
    font: 1.3em/1.2em arial, verdana, chalkboard, comic sans ms;
    font-variant:small-caps;
    padding: 0;
    margin: 0;
    margin-top: 20px;
    width: 160px;
    float: left;
}

#mainNavigationBG {
    background: #ffffdc;
    margin: 0;
    padding:0;
    width: 160px;
    float: left;
}

#content{
    zoom: 1;
    min-height: 20em;
    font: 1.2em/1.4em arial, verdana, chalkboard, comic sans ms;
    padding: 1.5em 1.0em 8em 1.0em; 	/* ~ 15px 15px 100px 10px */
    padding: 20px 35px 70px 5px;
    margin: 0 0 0 200px;
    border-left: 1px solid #9f9f9f;
    /*width: 639px;	 780 - 200(sidebar) - 2*5(paddings) - 1(left-border) */
}

#contentWithSidebar {
    margin: 0 165px;
}

#content h2 {
    padding: 0;
    margin: 0;
}

#content h1, #content h2, #content h3, #content h4 {
    font-family: arial, verdana, chalkboard, comic sans ms;
}
#content p {
    font-family: chalkboard, comic sans ms, arial, verdana;
}

#content p a, #content li a {
    padding: 0;
    margin: 0;
}

#content ul {
    padding: 0 1em;
    margin: 0;
}

#content h3 a {
    padding:0;
    margin: 0;
}

#sidebar {
    background: #c3a886;
    background: #d9bc96;
    font: .75em/1.5em arial, verdana, chalkboard, comic sans ms;
    clear: left;
    padding: 15px 5px 100px 5px;
    margin: 25px 5px;
    border: 1px solid #9f9f9f;
    width: 178px;	/* 200 - 5*2(padding) - 5*2(margin) - 2(border) */
    float: left;
}

#mainNavigation #sidebar p {
    color: black;
}

#mainNavigation #sidebar ul {
    list-style: circle;
    list-style-position:inside;
    margin: 0;
    padding: 0;
}


#mainNavigation #sidebar li a {
    text-decoration: none;
}

#banner {
    text-align: center;
    margin-top: 5px;
}
#banner img {
    width: 850px;
}

#toc {
    background: #d9bc96;
    width: 140px;
    float: right;
    font: .75em/1.5em arial, verdana, chalkboard, comic sans ms;
    padding: 15px 8px 18px 18px;
    margin: 0 5px;
    border: 1px solid red;
}

#reference {
    float: center;
    text-decoration: none;
    font-family: arial, verdana, chalkboard, comic sans ms;
    font-size: 0.9em;
    background-color: #d9bc96;
    padding: 20px 20px 10px 20px;
}

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

#reference table th {
    text-align: center;
}
#reference table td {
    vertical-align: top;
    padding: 0 20px;
}

fieldset {
    display: inline;
    margin:0;
    padding:10px;
    background-color: #ffffdc;
    border: 1px solid #9f9f9f;
}

legend {
    background-color:#4f4437;
    border: 1px solid #9f9f9f;
    -webkit-border-radius: 5px;
    color: #ffffdc;
    padding: 5px 10px;
}



#footer {
    clear: both;
    width: 850px;
    padding: 0;
    text-align: left;
    margin: 0 auto;
    margin-top: -15px;
}

.navline {
    display: block;
    clear: both;
    margin: 0;
    padding:0;
}

/* stuff in common for all the navigation lists: style, margin, padding */
#mainNavigation ul, .navLine ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.navLine ul {
    margin-right: 10px;
    margin-top: 10px;
}

#mainNavigation li a, .navLine li a, #wrapper a, #content a {
    padding: 0px 8px;
    text-decoration: none;
}  

#content a {
    padding: 0;
    text-decoration: none;
}


#reference a,
#mainNavigation #sidebar a {
    padding: 0px;
}

.navLine ul{
    float: right;
}

.navLine li {
    float: left;
}

.navLine a:link, 
.navLine a:visited {
    color: #7f7f7f;
}

#mainNavigation #sidebar li a:link, #mainNavigation #sidebar li a:visited,
#content a:link, #content a:visited,
#wrapper a:link, #wrapper a:visited,
#reference li a:link, #reference li a:visited,
#mainNavigation a:link, #mainNavigation a:visited {
    color: #3b836c;
    color: rgb(0, 100, 118);
    text-decoration: none;
}
/* stuff in common for all the navigation: style, margin, padding */

#mainNavigation #sidebar li a:hover, #mainNavigation #sidebar li a:focus, 
#content a:hover, #content a:focus, 
#wrapper a:hover, #wrapper a:focus, 
#reference li a:hover, #reference li a:focus, 
#mainNavigation a:hover, #mainNavigation a:focus, 
.navLine a:hover, 
.navLine a:focus 
{
    color: #3f3f3f;
    text-decoration: underline;
}

#mainNavigation #sidebar a:active,
#content a:active, #content li a:active,
#wrapper a:active,
#reference li a:active,
#mainNavigation a:active, 
.navLine a:active 
{
    color: #5f5f5f;
    text-decoration: none;
}

#copywrite {
    margin-left: .2em;
    color: #afafaf;
    color: #5f5f5f;
}

#footer .navLine {
    float: right;
}

.shaded a{
    color: red;
}

/*
#footer a {
    text-align:right;
}
#footer a:link, #footer a:visited, #footer a:active {
    text-align:right;
    color: #afafaf;
    text-decoration: none;
}

#footer a:hover, #footer a:focus {
    color: #5f5f5f;
    text-decoration: underline;
}

#reference a:link, #reference a:visited, #reference a:active {
    color: #5f5f5f;
    text-decoration: underline;
}

#reference a:hover, #reference a:focus {
    color: blue;
    text-decoration: underline;
}

*/

/*
 *
 * psuedo classes
 *
 */

/*
a {
}

a:link, a:visited {
    color: #afafaf;
    text-decoration: none;
}

a:hover, a:focus {
    color: #5f5f5f;
    text-decoration: underline;
}

a:active {
    color: #afafaf;
    text-decoration: none;
}

a.external:link, a.external:visited, a.external:active {
    color: #2f2f2f;
    text-decoration: none;
}

a.external:hover, a.external:focus {
    color: green;
    text-decoration: underline;
}

*/
