/* Global Stylesheet for DoctorChristina.com */

/* NOTES:
 * Working from the principle of keeping design separate from content,
 * #a_name (IDs) are generally used for placement of content, or page flow, 
 * while .a_name (CLASSes) have been established to perform presentation of 
 * that content. IDs will primarily have positioning rules, sometimes margins, 
 * floats, sizes, etc; while CLASSes for the most part will contain color, 
 * backgrounds, borders, padding, alignment, etc;

 * HTML tags modified by this stylesheet are most often treated as CLASSes.
 * Obviously, each design/page will have some overlapping of both content and 
 * presentation management, but I have attempted to keep that to a minimum.
 */


BODY      { margin: 0;
            background: #ffffff URL('/images/backgrounds/lavender_white_grad.jpg') repeat-x;
           }

/* ----------------------
 * #masthead : Top Banner Bar for logo, etc.
 * 1)	margins are already set to 0 (zero) by BODY margin: 0, above
 * 	except that Opera doesn't interpret that correctly. Restated here
 * 2)	absolute positioning allows this division to be moved anywhere 
 * 	in window, or if contained within another division anywhere 
 * 	within that division
 */

#masthead { position: absolute; top: 0; left: 0; width: 100%; height: 97px; }
.banr     { border-top: 7px #7f3e9a solid; margin-bottom: 7px;
            background: #ffffff URL('/images/banrs/clouds.jpg') no-repeat;
           }

/* Logo placement */
#logo     { position: absolute; top: 2px; left: 2px; z-index: 5; } /* make sure it's always on top */

/* ----------------------
 * Content for main page
 * NOTE: centering is done by global.js
 */

#content  { position: absolute; top: 110px;  width: 785px; }

/* IE does not correctly interpret the box properties listed here -- 
 * for some reason, 778 pixels for everybody else is approximately 
 * 780.378951 pixels for IE. IE's properties are rewritten by global.js
 */

.content_border {
            width: 778px; margin-left: 3px;
            border: 1px solid #bfa0c9; border-top: 0; border-bottom: 0; 
            background-color: #ffffff;
           }


/* ----------------------
 * Mainnavbar location and properties
 */

#mainnavbar { position: absolute; top: 112px; margin-left: 10px; z-index: 3; }

/* main nav classes
 * NOTE: each navlink is given its own class to allow for changing
 * the background to white while on that page (Change is handled 
 * automatically by /js/global.js:
 * eg; styl[0] { background: #ffffff URL(none); }
 */

.home, .services, .testimonials, .bio, .cremation, .contact {
            position: relative; top: 2px;
            padding: 12px; padding-top: 2px; padding-bottom: 5px;
            border-right: 1px solid #d5c5e0; z-index: 4;
           }

.home    { border-left: 1px solid #d5c5e0; }	/* add a border to left of home */


/* ----------------------
 * Page Title Images -- location of image, which determined by global.js
 */

#hedr  { position: absolute; top: 50px; left: 50px; z-index: 3;
/* DELETE FOLLOWING LINE WHEN IMAGES DONE */
         font: bold 32pt/40pt baskerville,"times new roman",geneva,serif; color: #ffffff;
        }


/* ----------------------
 * Content containers
 * NOTE: these exist primarily to achieve certain presentation appearances
 * and effects, despite being a mixture of IDs and CLASSES which is diametrically 
 * opposed to what I stated in the preamble to this stylesheet.
 */

#main, #botmbar  { position: relative; top: 0; }

.main_col1, .main_col2 {
             margin: 3px; margin-top: 0; padding: 8px;
             background: #ffffff URL('/images/backgrounds/main_text.jpg') repeat-x;
}
.main_col1 { width: 242px; height: 255px; float: left; border-right: 5px solid #ffffff; }
.main_col2 { width: 97%; }

#botmbar   { top: -3px; border: 0; margin: 0; margin-left: 1px; width:784;
             background: #efefef URL('/images/misc/bottom.gif') repeat-x; 
            } 


/* ----------------------
 * Links
 */

/* Main navigation link properties */

A.mainnav { color: #8800bb;
            font: normal normal 10pt/1.0em arial,helvetica,sans-serif;
           }
A.mainnav:visited { color: #8800bb; }


/* Special link properties -- white text, purple background */

A.special { color: #ffffff; text-decoration: underline;
            font: 9pt/1.1em helvetica,arial,sans-serif;
           }
A.special:visited { color: #ffffff; }


/* Properties for links in main body text */

A.pagenav { color: #7d3f94; text-decoration: underline;
            font: 8pt/1.5em verdana,arial,helvetica,sans-serif; 
           }
A.pagenav:visited { color: #7d3f94; }


/* Global link properties */

A { text-decoration: underline; }
A:active { color: #c500ff;
	text-decoration: underline;}
A:hover { text-decoration: underline; }




/* ----------------------
 * Text Elements 
 */
H1         { color: #7d3f94; font: bold 12pt/1.1em arial,helvetica,sans-serif; }
P, LI      { font: 8pt/1.5em verdana,arial,helvetica,sans-serif; color: #656567; }
LI         { list-style-type: disc; margin-top: 1.0em; }
P.qt       { font: italic 14pt/1.0em "times new roman",geneva,serif;  color: #333333; }
B          { font: bold 10pt/1.0em arial,helvetica,sans-serif; color: #7d3f94; }
.sans      { font: 9pt/1.0em arial,helvetica,sans-serif; color: #656567; }
.small     { font-size: 80%; }
.copyright { font: 8pt/1.0em arial,helvetica,sans-serif; color: #b295c1; }