html { width: 100%; height: 100%; }
body { color: black; font-family: georgia; background-color: white; background-image: url(images/make-real-love-bg.jpg); background-repeat: repeat; height: 100%; margin: 0; padding: 0; }
p {}
a:link { color: blue ; text-decoration: none; }

a:visited { color: purple }

a:hover { color: purple ; }

a:active { color: red }
#fade-out { background-image: url(images/shadows/wrap-bg1.png); background-repeat: repeat-x; background-attachment: fixed; background-position: right bottom; margin: 0; position: fixed; z-index: 1; bottom: 0; width: 100%; height: 100%; padding: 0; }
#wrap { position: relative; width: 900px; z-index: 10; margin-top: 0; margin-right: auto; margin-left: auto; padding-bottom: 63px; }
#flowerTop { background-image: url(images/flowerTop1.png); position: absolute; top: 45px; left: 0; width: 662px; height: 350px; z-index: 11; margin: 0; padding: 0; }
#flowerBottom { background-image: url(images/flowerBottom.png); position: absolute; z-index: 11; right: 0; bottom: 0; width: 662px; height: 320px; margin: 0; padding: 0; }
/*** HEADER ***/
#header { position: relative; top: 0; width: 715px; height: 160px; z-index: 15; margin: 0 auto; padding-top: 12px; padding-left: 12px; }
#header a { line-height: 100%; margin: 0; padding: 0; }
#header p.dianeaKohl { color: #066; font-size: 32px; font-family: "Lithos Pro", sans-serif; font-weight: bold; line-height: 100%; text-transform: capitalize; margin: 20px 0 0 96px; padding: 0; }
#header p.dianeaKohl b { display: none; }
#header p.dianeaKohl span { background-image: url(images/dianea-kohl.png); width: 335px; height: 41px; display: block; }
#header p.biline { color: #066; font-size: 28px; font-family: "Brush Script Std", cursive; font-weight: bold; line-height: 100%; margin: 9px 0 0; padding: 0; }
#header p.biline i { display: none; }
#header p.biline span { background-image: url(images/psychotherapy-of-the-heart.png); width: 530px; height: 53px; display: block; }
#header p.tear { line-height: 100%; position: absolute; right: 46px; bottom: 0; }
#header p.tear span { background-image: url(images/tear-fade.png); width: 104px; height: 148px; display: block; }
#header p.tear img { display: none; }
/*** MAIN middle ***/
#main-middle { background-color: white; position: relative; width: 700px; height: auto; z-index: 20; margin: 0 auto; padding: 0; }
/*nav*/
#nav { background-image: url(images/nav-bg.jpg); background-repeat: repeat-x; background-position: 0 bottom; text-align: center; position: relative; top: 0; left: 0; width: 550px; height: 36px; z-index: 24; float: left; margin: 0; padding: 16px 0 0 16px; }
#nav span { display: none; }
#nav p { font-size: 18px; font-family: georgia; margin: 0; padding: 0; }
#nav p a { color: black; font-family: georgia; font-weight: bold; text-decoration: none; margin: 0; padding: 16px 9px 12px; }
#nav p a:visited { color: #666; }
#nav p a:hover, #nav p a.active { color: #369; background-image: url(images/shadows/wrap-bg1.png); background-repeat: repeat-x; background-position: 0 bottom; text-decoration: underline; }
/*** middle CONTENT ****/
#middle-content { font-size: 90%; background-color: white; position: relative; left: 0; width: 550px; height: auto; z-index: 23; float: left; padding-left: 12px; }
#middle-content div.book, #middle-content div.booklil { font-weight: bold; text-align: center; margin: 0; padding: 0; display: inline-table; }
#middle-content div.One, #middle-content div.lil { width: 125px; }
#middle-content div.Two { width: 175px; height: 150px; }
#middle-content div.book { height: 150px; }
#middle-content div.lil { height: 110px; }
#middle-content div.book:hover { background-image: url(images/shadows/wrap-bg1.png); background-repeat: repeat; background-position: 0 bottom; }
#middle-content div.book a { padding: 0 2px 0; text-decoration: none; }
#middle-content div.book a:hover { color: white; text-decoration: underline; background-color: #369; }
#middle-content div.book a:visited { }

#middle-content div.mainImage { background-color: #ebedff; text-align: center; width: 182px; float: left; margin-top: 12px; border: inset 4px #ccf; }
#middle-content div.mainImage img {  }
#middle-content div.mainImage p { color: #369; font-size: 90%; font-variant: small-caps; line-height: 100%; text-align: center; margin: 0; padding: 0; }
#middle-content div.mainHeader { background-image: url(images/vertical-content-border.jpg); background-repeat: no-repeat; width: 324px; float: right; min-height: 291px; margin: 0; padding: 0 18px; }
#middle-content div.mainHeader h1, #middle-content h1 { color: #369; margin: 0; padding: 0; }
#middle-content div.mainHeader h2 { font-size: 18px; margin: 0; padding: 0; }
#middle-content div.mainHeader p { display: inline; margin: 0; padding: 0; }
#middle-content div.bookCopy { margin: 3px; padding: 3px; }
#middle-content div.mainHeader ul { margin: 0; padding: 0; }
#middle-content div.mainHeader li { font-variant: small-caps; background-image: url(images/bullet-tear.jpg); background-repeat: no-repeat; padding-top: 4px; padding-bottom: 4px; padding-left: 23px; display: block; }
#middle-content div.blurb { background-image: url(images/horizontal-content-border.jpg); background-repeat: no-repeat; background-position: right 0; width: 317px; padding-top: 19px; padding-right: 3px; }
#middle-content div.mainRest { width: auto; margin: 8px }
#middle-content div.mainRest i { padding-right: 12px; padding-left: 12px; }
/* shadows */
#main-middle div.top-shadow { background-image: url(images/shadows/top.png); background-repeat: repeat-x; background-position: 0 0; position: absolute; top: 0; width: 684px; height: 13px; z-index: 30; margin: 0; padding: 0; }
#main-middle div.bottom-shadow { background-image: url(images/shadows/bottom.png); background-repeat: repeat-x; background-position: 0 0; margin: 0; padding: 0; position: absolute; bottom: 0; width: 700px; height: 5px; z-index: 30; }
#main-middle div.right-shadow { background-image: url(images/shadows/right.png); background-repeat: repeat-y; background-position: 0 0; margin: 13px 0 5px; padding: 0; position: absolute; top: 0; right: 0; bottom: 0; width: 5px; height: auto; z-index: 30; }
#main-middle div.left-shadow { background-image: url(images/shadows/left.png); background-repeat: repeat-y; background-position: 0 0; margin: 13px 0 5px; padding: 0; position: absolute; top: 0; left: 0; bottom: 0; z-index: 30; width: 13px; height: auto; }
/*green book panel*/
#book-panel { background-image: url(images/green-book-panel.jpg); background-repeat: repeat; background-attachment: scroll; text-align: center; position: absolute; top: 0; right: 0; width: 120px; height: 100%; z-index: 25; overflow: auto; float: right; margin: 0; padding: 0 10px; }
#book-panel h3 { font-size: 115%; font-weight: bold; }
#book-panel img { margin-top: 6px; border: solid 1px transparent; }
#book-panel img:hover { border-color: #c30; }
#book-panel code { font-size: 10px; font-family: verdana; line-height: 100%; margin: 0; padding: 0; }
#book-panel a { color: black; text-decoration: none; }
#book-panel a:hover { color: #c30; text-decoration: none; }
/*footer*/
#footer { position: relative; width: 700px; z-index: 20; margin-right: auto; margin-left: auto; }
#footer p.footerNav { width: 450px; float: left; }
#footer p.footerNav a { color: black; font-weight: bold; background-image: url(images/shadows/footerNavBG.png); background-repeat: repeat-x; background-position: 0 6px; padding: 1px 2px; }
#footer p.footerNav a:hover, #footer p.footerNav a.active { color: blue; background-image: url(images/shadows/footerNavBG-active.png); background-position: 0 3px; text-decoration: underline; }
#footer p.footerNav a:visited { color: #666; }
#footer p { font-size: 12px; }
#footer span.immllc { background-image: url(images/immllcPNG.png); width: 117px; height: 17px; display: block; }
/*** CLASSES ***/
.alignJustify { text-align: justify; padding-right: 12px; }
.babyBlue { color: #09f; }
.red { color: red; }
.alignCenter { text-align: center; margin-right: auto; margin-left: auto; }
.bold { font-size: 110% !important; font-weight: bold; }
.floatRight { width: auto; float: right; }
.floatLeft { width: auto; float: left; }
.clearBoth { clear: both; }
.width100 { width: 100%; }
