/*
Site Design
Kevin Douglas :: Satarah Studios
kdouglas@satarah.com [satarah.com]
*/

/* 
COLOR PALETTE:

page background		#71467C Purple
wrapper border		#420574 Indigo

document background	#E9E8D4 Dove
document font		#420574 Indigo
document border		#FFF White

menu link		#420574 Indigo
menu hover		#FFA500 Gold
menu active		#A40052 Wine

footer link		#E9E8D4 Dove
footer hover		#FFA500 Gold

font family		Arial, Sans-Serif

name graphic		Present Lt Std #420574 48px
tagline graphic		Baskerville Old Face #420574 22px 2%Kerning
caption graphic		"Same as tagline above" 16px Italic
all graphics		Custom designed and created by Kevin Douglas
*/



/* PAGE-SPECIFIC STYLING */
/* HOME */
#home #header {
  height: 420px;
  background: transparent url(../img/home.jpg) no-repeat top left;
}

#home #name {
  top: 75px;
  left: 135px;
}

#home #logo {
  top: 39px;
  left: 410px;
}

#home #tagline {
  top: 305px;
  left: 30px;
}

#home #caption {
  top: 330px;
  left: 30px;
}

#home #mark {
  top: 380px;
}

#home #docBody {
  padding: 35px 40px 35px 55px;
}

#home ul {
  padding: 0 0 20px 40px;
}

#home #menuBar {
  top: 395px;
}

#home #menuBar ul {
  padding: 0;
}

#menucapt { /* not currently in use */
display: none;
  position: absolute;
  top: 28px;
  left: 40px;
  font-size: 0.85em;
  font-style: italic;
  font-weight: normal;
  color: #420574;
  color: #A40052;
}


/* REVEALED */
#dictionary {
  border: solid #420574 1px;
  padding: 15px 20px 0 15px;
  font-size: 0.8em;
  letter-spacing: 0.05em;
}

#docFoot { /* Fine print */
  margin: 5px 5px 0; /* padding-bottom 0 IE empty box borders bug/fix */
  font-size: 0.7em;
}

#docFoot p {
  padding-bottom: 10px;
}


/* SAMPLES */
#samples #docBody {
  padding: 35px 55px 35px 25px;
}

div.sample {
  clear: both;
}

.sample a {
  text-decoration: none;
  font-weight: bold;
  color: #420574;
}

.sample a:hover {
  color: #FFA500;
}

.sample .title {
  float: left;
  width: 150px;
  margin-bottom: 40px;
}

.sample .title li {
  padding: 0;
  list-style: none;
  text-align: right;
}

.sample .title h3 {
  padding-bottom: 4px;
  text-align: right;
  font-size: 1.0em;
  color: #A40052;
}

.sample .title span {
  font-weight: normal;
  font-size: 0.85em;
}

.sample .title a {
  font-size: 0.9em;
}

.sample .blurb {
  float: left;
  width: 450px;
  margin-bottom: 40px;
  padding-left: 20px;
}


.clear {
  clear: both;
  height: 1px;
}


/* PUDDIN */
#testimonials p {
  padding-bottom: 10px;
  font-size: 0.95em;
  letter-spacing: 0.05em;
}

#testimonials ul {
  padding: 0 0 60px 350px;
}

#testimonials li {
  list-style: none;
 /* line-height: 0.95em;*//* Funky text bleed in IE */
  font-size: 0.85em;
}

#testimonials .signature {
  font-size: 0.9em;
  font-weight: bold;
}


/* CONTACT */
#contact #header {
  background: transparent url(../img/exit.jpg) no-repeat top left;
}

#contact #name {
  top: 49px;
  left: 45px;
}

#contact #logo {
  top: 41px;
  left: 365px;
}

#contact address {
  left: 85px;
}

#email span {
  letter-spacing: 0.05em;
  font-size: 1.2em;
}

#email {
  padding-bottom: 55px; /* IE hack to compensate for #docBody,#docFoot padding-bottom: 0, bug/fix */
}

#email a {
  text-decoration: none;
  font-weight: bold;
  color: #420574;
}

#email a:hover {
  color: #FFA500;
}


/* PAGE DEFAULTS UNLESS SPECIFIED ABOVE */
#name {
  top: 50px;
  left: 248px;
}

#logo {
  top: 12px;
  left: 530px;
}

.address {
  top: 115px;
  left: 35px;
}


/* GLOBAL STYLE PROPERTIES */
/* CONTAINER ELEMENTS */
* {
  margin: 0;
  border: 0;
  padding: 0;
}

html {
  font-size: 0.85em;
  font-size: 14px; /* freeze text size in IE */
  text-align: center;
  background-color: #71467C;
  font-family: Arial, Sans-Serif;
}

html { /* force vertical scrollbar in FF */
  height: 101%;
}

#wrapper {
  width: 720px;
  position: relative;
  margin: 0 auto;
  border: 1px solid #420574;
}


/* HEADER ELEMENTS */
#header {
  width: 720px;
  height: 300px;
  border-bottom: solid #FFF 1px;
  background: transparent url(../img/subs.jpg) no-repeat top left;
}

#name {
  width: 247px;
  height: 38px;
  position: absolute;
}

#logo {
  width: 86px;
  height: 79px;
  position: absolute;
}

#tagline {
  width: 640px;
  height: 28px;
  position: absolute;
}

#caption {
  width: 640px;
  height: 28px;
  position: absolute;
}

.address {
  position: absolute;
  text-align: left;
  font-weight: bold;
  color: #420574;
}

.address a {
  text-decoration: none;
  color: #420574;
}

.address li {
  margin-left: -15px;
  list-style: none;
  font-size: 0.9em;
  font-style: italic;
}

.address > li { /* specificity fix for FF */
  margin-left: 0;
  list-style: none;
}

.address strong {
	font-size: 1.1em;
  font-style: normal;
}


/* DOC BODY ELEMENTS */
#docBody {
  padding: 35px 55px 0; /* padding-bottom 0 IE empty box borders bug/fix */
  text-align: left;
  color: #420574;
  background: #E9E8D4;
}

h1 {
  margin: 0 0 20px -20px;
  font-size: 1.4em;
  font-weight: normal;
  color: #A40052;
}

h2 {
  margin-left: -10px;
  padding-bottom: 20px;
  font-size: 1.1em;
}

h4 {
  margin-bottom: 1px;
  font-size: 0.9em;
}

p, dd {
  padding-bottom: 20px;
  font-size: 0.95em;
}

dt {
  font-weight: bold;
}

li {
  padding-bottom: 3px;
  list-style: inside none;
}


ul > li { /* graphical bullet for FF */
  list-style: inside none;
  /*list-style: inside url(images/bullet.gif);*/
}


/* MENU ELEMENTS */
/* MENU BAR */
#menuBar {
  height: 1.3em;
  width: 720px;
  position: absolute;
  top: 275px;
  left: 0;
  border-top: solid #FFF 1px;
}

#menuBar dl {
  margin: 2px 0 0 15px;
  text-align: left;
}

#menuBar dt {
  display: inline;
  list-style: none;
  font-weight: bold;
}

#menuBar dd {
  display: none;
}

#menuBar a {
  padding: 0 15px;
  text-decoration: none;
  color: #420574;
}

#menuBar a:hover {
  color: #FFA500;
}

#menuBar span {
  padding: 0 15px;
  color: #A40052;
}

#mark {
  display: none;
  position: absolute;
  top: 262px;
}


/* FOOTER ELEMENTS */
#footer {
  width: 720px;
  margin: 0px auto 0px auto;
  padding-bottom: 40px;
  font-size: 0.8em;
}

#footer a {
  padding: 0 4px;
  text-decoration: none;
  color: #E9E8D4;
}

#footer a:hover {
  color: #FFA500;
}

#copyright {
  float: left;
}

#siteDesign {
  float: right;
}