@import url("reset.css");

/**************************************************************************/
/* GENERAL PAGE LAYOUT SETTINGS                                           */
/**************************************************************************/
body {
background: #292b1f;
font-family:  "Trebuchet MS", Verdana, Arial, sans-serif;
font-size: 62.5%;
text-align: justify;
margin: 20px 0px 20px 0px;
color: #cccccc;
}


#wrapper {
font-size: 1.4em;
width: 888px;
margin: 0px auto;
background: #212318;
border: 5px solid #72705e;
padding: 0px;
}

#masthead {
 width: 888px;
 height: 120px;
 border: 2px dashed #ff00ff;
 margin: 0px;
 padding: 0px;
 border: 0px;
 display: block;
}

/**************************************************************************/
/* NAVIGATION BAR SETTINGS                                                */
/**************************************************************************/
#navigation li {
float: left;
display: inline;
}

#navigation a {
background: url(images/button.jpg) no-repeat left top;
font: bold 12px  Arial, Helvetica, sans-serif;
text-transform: uppercase;
color: #ffffff;
text-decoration: none;
display: block;
padding: 5px 0px 5px 16px;
width: 130px;
border-left: 1px solid #000000;
border-top: 1px solid #000000;
border-right: 1px solid #72705e;
border-bottom: 1px solid #333333;
}


/* make the menu items change to gold when hover over them */
#navigation a:hover {
background: url(images/button.jpg) no-repeat 0px -73px;
}

/* make the active page in the menu item blue */
body.home #navigation a.home,
body.author #navigation a.author,
body.orders #navigation a.orders,
body.potd #navigation a.potd,
body.signup #navigation a.signup,
body.news #navigation a.news  {
background: url(images/button.jpg) no-repeat 0px -145px;
}

/**************************************************************************/
/* MAIN TEXT SETTINGS                                                     */
/**************************************************************************/
#content {
padding: 50px 50px 50px 50px;
}

#content a {
color: #ffffff;
}

#content a:hover {
color: #F29315;
}

#content a:active {
color: #F29315;
}

separatorInvisible {
height: 0px;
clear: both;
}

img {
border: 1px solid #72705e;
padding: 2px 2px 2px 2px;
}



/* USED FOR MAIN HEADLINE ON FIRST PAGE */
#content h2 {
font-family:  Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 1.8em;
text-transform: capitalize;
font-style: italic;
line-height: 1.4em;
text-align: center;
margin: 0px 80px 15px 80px;
padding: 0px 0px 0px 0px;
color: #ffffff;
}


/* USED FOR SUB-HEADLINE ON FIRST PAGE */
#content h5 {
font-family:  Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 1.2em;
font-style: italic;
line-height: 1.3em;
text-align: center;
margin: 0px 20px 10px 20px;
padding: 0px;
color: #ffffff;
}



/* USED FOR 2nd SUB HEADING AND ORDER PULL-LINES THOUGHTOUT TEXT */
.callToOrder a {
font-size: 1em;
font-style: italic;
line-height: 1.2em;
text-align: center;
margin: 30px auto 35px auto;
padding: 4px 90px 4px 90px;
color: #F29315 !important;
border: 1px solid #72705e;
background: #35372a;
text-decoration: none;
display: block;
}

.callToOrder em {
text-decoration: underline;
text-transform: uppercase;
font-style: italic;
}

.callToOrder strong {
font-style: italic;
font-size: 1.25em;
}

/* setup links for the ORDER boxes */
.callToOrder a:link {
color: #F29315;
text-decoration: none;
}

.callToOrder a:visited {
color: #F29315;
text-decoration: none;
}

.callToOrder a:hover {
color: #dd2222;
text-decoration: underline;
color: red !important;
}

.callToOrder a:active {
color: #dd2222;
text-decoration: underline;
color: red !important;
}



/* GENERAL TEXT PARAGRAPHS */
#content p {
font-size: 90%;
line-height: 1.4em;
}


/* USED FOR GENERAL PAGE TITLES */
#content h1 {
font-size: 150%;
font-style: italic;
margin: 0px;
padding: 0px;
}

/* USED FOR SUB HEADINGS ON 'INSIDE THE BOOK' PAGE and BOOK COVERS*/
#content h3 {
font-size: 90%;
}


#content ul {
padding: 10px;
margin: 10px;
list-style-position: inside;
list-style-type: disc;

}

#content ul li {
padding: 0px 0px 0px 0px;
margin: 10px 0px 10px 0px;
text-align: left;
}

#content ol {
padding: 10px;
margin: 10px;
list-style-position: inside;
list-style-type: decimal;

}

#content ol li {
margin: 0px 0px 6px 10px;
text-align: left;
}



/**************************************************************************/
/* PULL QUOTE BOXOUT                                                      */
/**************************************************************************/
#boxout {
float: right;
width: 150px;
color: #ffffff;
border-top: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
margin: 7px 0px 20px 30px;
padding: 7px 0px 7px 0px;
font-style: italic;
font-size: 110%;
line-height: 0.6em;
text-align: center;
font-weight: bold;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}

#bookCovers {
  margin: 30px auto;
}

/**************************************************************************/
/* BOOK COVER THUMBNAILS                                                  */
/**************************************************************************/
/* BOXOUT AREA FOR BOTH THUMBNAILS */
.covershotsboxout {
clear: left;
float: left;
margin: -10px 40px 12px 00px;
padding: 0px;
width: 204px;
}

/* THUMBNAIL HEADINGS */
.covershotsboxout h3 {
font-variant: small-caps;
font-style: italic;
margin: 10px 0px 7px 0px;
color: #ffffff;
}

/* FOR SMALL TEXT SAYING 'CLICK TO ENLARGE' */
.covershotsboxout h4 {
font-size: 60%;
font-variant: normal;
font-style: italic;
margin: 2px 2px 0px 0px;
text-align: right;
}


/**************************************************************************/
/* 'LOOK INSIDE THE BOOK' THUMBNAILS                                      */
/**************************************************************************/
/* BOXOUT AREA FOR ALL THUMBNAILS */
.lookinsideboxout {
clear: right;
float: right;
margin: 0px 0px 7px 40px;
padding: 0px;
width: 204px;
}

/* THUMBNAIL HEADINGS */
.lookinsideboxout h3 {
padding: 30px 10px 0px 10px;
font-variant: small-caps;
font-style: italic;
color: #ffffff;
}

/* FOR SMALL TEXT SAYING 'CLICK TO DOWNLOAD' */
.lookinsideboxout h4 {
font-size: 60%;
font-variant: normal;
font-style: italic;
margin: 0px 10px 0px 10px;
padding: 10px 10px 10px 10px;
text-align: center;
}

.lookinsideboxout #adobeimg {
border: none;
}

.lookinsideboxout img {
margin: 0px 0px 0px 0px;
}


/**************************************************************************/
/* LARGE BOOK COVER PAGES                                                 */
/**************************************************************************/
#coverlarge  {
margin: 0 auto;
width: 506px;
}

#coverlarge h3 {
font-variant: small-caps;
font-style: italic;
margin: 15px 0px 7px 0px;
font-size: 100%;
color: #ffffff;
}



/**************************************************************************/
/* AUTHOR PORTRAIT IMAGE SETTINGS                                         */
/**************************************************************************/
#portrait {
float: right;
margin: 5px 0px 20px 30px;
padding: 0px;
}

/**************************************************************************/
/* BOOK REVIEW QUOTATION BOXES                                            */
/**************************************************************************/
.review {
margin: auto;
margin: 20px 70px 20px 70px;
color: #dddddd;
border: 1px solid #72705e;
background: #292b1f;

text-align: center;
}

.review-text {
font-size: 100%;
font-style: italic;
line-height: 1.5em;
padding: 7px 70px 7px 70px;
}

.review-author {
font-weight: bold;           
padding: 15px 0px 15px 0px;
}



/**************************************************************************/
/* PAYPAL LOGO GRAPHIC AREA                                               */
/**************************************************************************/
#pplogo {
margin-left: auto;
margin-right: auto;
margin-top: 40px;
margin-bottom: -20px;
padding: 0;
background-color: #292b1f;
width: 90%;
border: 2px solid   #72705e;
}

#pplogo h4 {
font-size: 70%;
font-variant: normal;
font-style: italic;
margin: 0px 10px 0px 10px;
padding: 10px 10px 10px 10px;
text-align: center;
}




/**************************************************************************/
/* PRODUCT OFFER BOXES STYLING                                            */
/**************************************************************************/
.product-offer {
border: 1px solid #72705e;
background: #292b1f;
padding: 0px 0px 0px 0px;
margin: 30px 30px 30px 30px;
}


.product-title {
padding: 5px 10px 5px 10px;
margin: 0px 0px 0px 0px;
background: #72705e;
color: #ffffff;
font-size: 110%;
text-transform: capitalize;
font-weight: bold;
line-height: 1.5em;
text-align: center;
}

.product-img {
padding: 10px 10px 10px 10px;
margin: 0px 0px 0px 0px;
}

.product-description {
padding: 10px 12px 10px 10px;
margin: 0px 0px 0px 0px;
}

.product-description strong {
color: #F29315;
}

.product-price {
padding: 0px 25px 0px 5px;
margin: 0px 0px 0px 0px;
text-align: right;
color: #F29315;
font-size: 100%;

font-family:  "Trebuchet MS", Arial, Helvetica, sans-serif;
}

.product-price strong {
font-size: 150%;
}

.product-instructions {
padding: 0px 5px 5px 0px;
margin: 0px 0px 0px 0px;
font-size: 68%;
font-variant: normal;
font-style: italic;
text-align: right;
}

.viewbasket-button {
padding: 0px 0px 0px 0px;
margin-left: auto;
margin-right: auto;
width: 144px;
}

/**************************************************************************/
/* END NAVIGATION BAR                                                     */
/**************************************************************************/
#endnavigation {
margin: 0px;
text-align: center;
padding: 10px 0px 17px 0px;
}

#endnavigation a {
text-decoration: none;
color: #ffffff;
}

#endnavigation a:hover {
color: #F29315;
}

#endnavigation a:active {
color: #F29315;
}

#endnavigation p {
margin: 0;
padding: 0;
}


/**************************************************************************/
/* FOOTER                                                                 */
/**************************************************************************/
#footer {
background-color: #52503e;
margin: 0px;
text-align: center;
padding: 17px 0px 17px 0px;
}

#footer a {
color: #ffffff;
}

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

#footer a:active {
color: #F29315;
}

#footer p {
margin: 0;
padding: 0;
}



/**************************************************************************/
/* POSTAL ZONE IMAGE PLACEMENT                                            */
/**************************************************************************/

.postalzone {
padding: 0px 0px 0px 0px;
margin-left: auto;
margin-right: auto;
width: 110px;
}

.postalzoneleft {
float: left;
padding: 0px 0px 0px 0px;
margin-left: auto;
margin-right: auto;
width: 110px;
}

.postalzoneright {
float: right;
padding: 0px 0px 0px 0px;
margin-left: auto;
margin-right: auto;
width: 110px;
}



/**************************************************************************/
/* MAILING LIST FORM STYLING                                              */
/**************************************************************************/


fieldset {
margin: 30px 20px;
border: 1px solid  #F29315;
}

legend {
padding: 0px 10px;
font: 12px Verdana, Arial, sans-serif;
background-color: #212318;
text-transform: uppercase;
font-weight: bold;
color: #ffffff;
}

.formrow {
clear: both;
padding: 10px 0px 0px 0px;
}

.formlabel {
float: left;
text-align: right;
font-weight: bold;
width: 200px;
color: #ffffff;
}

.formcontrol {
float: right;
width: 350px;
}


.formfield {
border: 1px solid #72705e;
background: #35372a;
color: #ffffff;
}


.spacer {
clear: both;
height: 10px;
}

.formnotice {
float: right;
padding: 5px 10px 5px 10px;
color: #ffffff;
text-align: center;
}






/**************************************************************************/
/* PICTURE OF THE DAY                                                     */
/**************************************************************************/
#photoOfTheDayBanner {
width: 200px;
float: left;
border-top: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
margin: 5px 30px 15px 0px;
text-align: center;
}

#photoOfTheDayBanner p {
font-size: 72%;
font-style: italic;
text-decoration: none;
padding: 5px 5px 5px 5px;
margin: 0px 0px 0px 0px;
}

#photoOfTheDayBanner img {
border: none;
padding: 5px 0px 5px 0px;
margin: 0;
}

#content a:link #photoOfTheDayBanner {
color: #Ffffff;
text-decoration: none;
}

#content a:visited #photoOfTheDayBanner {
color: #ffffff;
text-decoration: none;
}

#content a:hover #photoOfTheDayBanner {
color: #dd2222;
text-decoration: none;
}

#content a:active #photoOfTheDayBanner {
color: #dd2222;
text-decoration: none;
}



#galleryImage  {
margin: 0 auto;
background: #ffffff;
padding: 9px 9px 9px 9px;
}


#galleryImage h3 {
font-variant: small-caps;
font-style: italic;
margin: 15px 0px 7px 0px;
font-size: 100%;
color: #ffffff;
}


.galleryschedule img {
margin: 0px 25px 0px 25px;
}


.scheduleArtist {
font-variant: small-caps;
margin: 15px 0px 7px 0px;
font-size: 100%;
color: #ffffff;
font-weight: bold;
text-align: left;
}

.scheduleTitle {
padding: 0px 0px 0px 10px;
font-style: italic;
font-size: 80%;
color: #dddddd;
}


.scheduleToday  {
background: #292b1f;
}


.schedulePast .scheduleArtist {
color: #777777;
}

.schedulePast .scheduleTitle {
color: #777777;
}