/* destyle.css
style sheet for debbyelwell.EXT
created by barton cole
factotum@coraxdesign.com
date:042109
*/

/* 
body
  #wrapper
     #header 
	.nav
     #left 
	info
	contact
     #center
     #footer
#sitework
*/
/* 
===============================================  	
  	Google Map API Key for http://debbyelwell.com
===============================================  	

ABQIAAAAESGllKif5V8L-Zl22gPyjRT7r7kiPlxqF894fCPELYbmQulsbBSw7AQgBK0O2v6lOje-HV2-da75oA

/*===============================================  	
  END	Google Map API Key for http://debbyelwell.com END
===============================================*/ 	


/* 
===============================================  	
  	Base CSS
===============================================  	
  	This file simply removes default styling on most HTML elements in 
  	order to reduce the need to later override them.
	copied from source css www.freakswhocare.org
  	
  */

h2,h3,h4,h5,h6,pre,code,p {font-size: 1em;}
  ul,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input {margin: 0; padding: 0;}
  a img,:link img,:visited img {border: none;}
  address {font-style: normal;}
  a {text-decoration:none;}
ul {list-style-type:none;}

/*===============================================  	
  END	Base CSS			END
===============================================*/ 	

/*===============================================  	
		working borders and fills
----------------------------------------------- 	
#wrapper{border-left:1px solid #cccccc;
border-top:1px solid #cccccc;
border-right:1px solid #333333;
border-left:1px solid #333333;}
#header {border:1px solid gray;}
-----------------------------------------------
	END	working borders	and fills  END
===============================================*/ 	


/*===============================================  	
		global-styles
-----------------------------------------------*/ 	
body {
font-family: arial, helvetica, sans-serif;
font-size:1em;
background-color:#af4c2b;
background:#af4c2b url("images/dElwellBackAf4c2bGradLeft.jpg")top left repeat-y;
}
#left {background-color:#000000;}
#left img {background:#000000;}

.ordinal {font-size:.7em;line-height:.8em;}
#body-right {
width:100%;
height:auto;
background:transparent url(images/dElwellBackAf4c2bGradRight.jpg)top right repeat-y;
}
/*-----------------------------------------------
	END	global-styles		END
===============================================*/ 	



/*===============================================  	
		positioning
-----------------------------------------------*/ 	
#wrapper {
position:absolute;
width:800px;
height:600px;
top:0;
left:50%;
margin-left:-400px;
}

#header {
position:fixed;
top:0;
left:50%;
margin-left:-205px;
width:600px;
height:110px;
padding-left:.2em;
padding-top:.2em;
background:#ffffff;
}
#header .nav {
position:absolute;
bottom:0;
width:100%;
margin-bottom:5px;
margin-top:auto;
right:0;
float:right;
}
#header-bio {
position:relative;
float:right;
width:600px;
height:100px;
border-bottom:1px solid blue;
}
#header-bio .nav {
position:absolute;
bottom:0;
width:100%;
margin-bottom:5px;
margin-top:auto;
right:0;
float:right;
}
#header-contact {
position:relative;
float:right;
width:600px;
height:100px;
border-bottom:1px solid blue;
}
/* this following rule is temporary, for the sake of a deliverable screenshot*/
#header-contact img {
margin-top:20px;
margin-left:25px;
}
/*end the fakey rule*/
#header-contact .nav {
position:absolute;
bottom:0;
width:100%;
margin-bottom:5px;
margin-top:auto;
right:0;
float:right;
}


#left {
clear:both;
position:fixed;
float:left;
top:0;
left:50%;
margin-left:-400px;
width:195px; 
height:100%;
}
#quote {
position:relative;
width:auto;
margin:0px 15px;

}

#right {
position:fixed /*let's try this instead of relative */ ;
clear:both;
width:580px;
height:550px;
left:50%;
top:0;
margin-top:115px;
margin-right:1em;
margin-left:-205px;
padding:10px 10px 0px 10px;
overflow:auto;
}

#text-block {width:45%;
float:left;
margin-right:3em;
}
.categories {
float:right;
padding:.2em;
width:auto;
height:auto;
text-align:left;
}
#quote.note {text-align:center;}
/*-----------------------------------------------
	END	positioning		END
===============================================*/ 	



/*===============================================  	
		colors
-----------------------------------------------*/ 	
#wrapper {background:#ffffff;}

/*-----------------------------------------------
	END	colors			END
===============================================*/ 	



/*font-styles==================================*/  	
iframe {font-size:.75em;}
p {margin-bottom:.5em;}
#quote {
font: 1.1em verdana;
color:#999999;
font-style:italic;
}
sup {font-size:.6em;}
.note {
font-size:.7em;
color:#999999;
font-style:normal;
}
#right {
font-size:.9em;}

#title {
position:relative;
width:325px;
height:80px;
padding:0;
overflow:hidden;
font:1.5em garamond, "times new roman", serif;
color:#993300;
}
#title span {
position:absolute;
width:325px;
height:80px;
left:0;
top:0;
margin:0;
background-image:url("images/dElwellTitleBlock325x80.jpg");
background-position:0 0 no-repeat;
}
h5 {margin-bottom:.5em;
text-decoration:underline;}

/*font-styles===============================END*/  	


/*anchors======================================*/ 	
/*anchors===================================END*/ 	


/*lists========================================*/  	
ul.categories, ul.providers {
color:#666666;
list-style-type:square;
line-height:1.2em;
font-weight:bold;
}
ul.providers {margin-left:1em;}
#header .nav ul {
position:relative;
width:100%;
bottom:0;
margin-bottom:2px;
margin-top:auto;
right:0;
height:1.5em;
float:right;

}
#header .nav ul li {
width:auto;
min-width:12%;
float:left;
line-height:2em;
text-align:center;
border-left:1px solid #dddddd;
border-right:1px solid #333333;
border-top:1px solid #dddddd;
border-bottom:1px solid #333333;

}
#header .nav ul li a {
display:block;
padding:0 1em;
line-height:2em;
color:#000000;
font-weight:bold;
font-variant:small-caps;
background-color:#d89234;
background-image:url("images/tab-d89234.jpg");
background-position:0px -10px repeat-x;

}
#header .nav ul li a.selected {
text-decoration:underline;
background-color: #9d6f31;
 background-image:url("images/tab-D67140.jpg");
background-position:0px -10px repeat-x;

}

#header .nav ul li a:hover {
color:#ffbb00;
background-image:url("images/tab-AA7766.jpg");
background-position:0px -10px repeat-x;

}
#header .nav ul li a.2-line:hover {
background-image:url(images/tab-AA7766.jpg);
background-position:0px -10px repeat-x;

}

/*lists=====================================END*/  	


/*===============================================  	
		media content
-----------------------------------------------*/ 	
#right img.right {
float:right;
margin:10px; padding:15px; border-top:1px solid #ccc; border-right:1px solid #333; border-bottom: 1px solid #333; border-left: 1px solid #ccc; background:#f9f4f4; }

/*-----------------------------------------------
	END	media content		END
===============================================*/ 	















/*======================================= SITEWORK======*/
#sitework {
position:absolute;
height:auto;
width:auto;
bottom:10px;
right:20px;
font:.6em verdana, trebuchet, arial, helvetica, sans-serif;
color:#ffffff;
background:transparent url(images/50trans.png)top left repeat;
padding:0px 2px 0px 2px;
}
#sitework a {
margin-top:-10px;
display:block;
line-height:22px;
height:16px;
padding-right:20px;
background:transparent url("http://www.coraxdesign.com/images/16TargetSpriteGryYel.jpg")bottom right no-repeat;
text-decoration:none;
font-size:.85em;
color:#ffffff;
font-weight:bold;
font-variant:small-caps;
}
#sitework a:link {color:#ffffff;}
#sitework a:visited {color:#ffffff;}
#sitework a:hover {color:#ff8800;background:transparent url("http://www.coraxdesign.com/images/16TargetSpriteGryYel.jpg")top right no-repeat;}
#sitework a:active {color:#cccccc;}
#sitework a img {border:1px solid transparent;}
/*===========================================end SITEWORK==*/
