/* ------ Section 1 - Global Body, Font and Link Settings ------ */




body {

background-color: #803300; /* brown browser window background color and footer */

background-image: url(../image-files/background5.jpg);
background-repeat: repeat-y;
background-position: top center;
margin: 0;

padding: 0;

font-family: Verdana, Arial, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;

color: #000;

font-size: 80%;

}




/* -- General Link Styling -- */



a:link {

color:blue;

text-decoration: underline;

}



a:visited {

color: #CC6600;

text-decoration: underline;

}



a:hover {
color: blue;

text-decoration: underline;

}





/* ------ Section 2 - Global Page Structure ------- */



#PageWrapper {

width: 960px;

}



#Header {

height: 220px;

}



#ContentWrapper {

float: left;

width: 100%;

margin-top: -60px;
}



#CenterColumn {

margin: -10px 180px 0 180px;    /* STEP 1: set to "0 RightColumnWidth 0 LeftColumnWidth" */

}



#LeftColumn {

float: left;

width: 179px;               /* STEP 2: to set left column at 180, set 1 less than 180 here */

margin-left: -960px;        /* STEP 3: set to the same width specified in #PageWrapper above (but with minus sign)  */

margin-top: -50px;
}



#RightColumn {

float: left;

width: 179px;               /* STEP 4: to set right columns at 180, set 1 less than 180 here */

margin-left: -180px;        /* STEP 5: set to -(RightColumnWidth) */

margin-top: -80px;
}



#Footer {

clear: both;

width: 100%;

text-align: center;

padding: 8px 0;

}



.Liner {

padding: 10px 10px;

}



#Header .Liner {

padding: 10px 10px;

}



#Footer .Liner {

margin: 0;

padding: 0;

}





/* ------ Section 3 - Page Structure Details ------ */



#PageWrapper {

border: 0 solid #8f8fb3;   /* dark sea blue, headlines and borders */

margin: 0px auto;

background-image: url();

background-repeat: no-repeat;

}



#Header {

background-image: url(../image-files/header2.jpg);

background-repeat: no-repeat;

background-color: transparent;

background-position: top left;

}



#ContentWrapper {

background-image: url();

background-repeat: no-repeat;

}



#LeftColumn {

background-image: url();

background-repeat: no-repeat;

background-color: transparent;}



#CenterColumn {

background-image: url();

background-repeat: no-repeat;

background-color: transparent;

}



#RightColumn {

background-image: url();

background-repeat: no-repeat;

background-color: transparent;

text-align: center;
}



#Footer {

background-image: url();

background-repeat: no-repeat;

background-color: #803300;     /* brown like browser background */

border-top: 1px solid #c0c0c0;

}





/* ------ Section 4 - Left Column Navigation ------ */




.Navigation {

width: 100%;

font-family: Verdana, Arial, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;

background-color: transparent;

}




/* -- Nav Headers -- */



.Navigation h3 {

padding: 0 0 0 4px;

font-size: 110%;

color: #ffffc6;

background-color: #008073;
border: 1px solid #008073;

margin: 12px 0;

}





/* -- Nav List -- */



.Navigation ul {

list-style-type: none;

padding: 0 0 8px 0;

margin: -6px 0 0 0;

}



.Navigation li {

background-color: transparent;     

border: 1px solid transparent;
margin-bottom: 0;

}




/* -- Navigation Link styles -- */



.Navigation a {

color: #803300;
display: block;     /*  this makes the whole box highlight rather than just the text */

padding: 2px 0 2px 4px;

text-decoration: none;

border: 1px solid transparent;
}



.Navigation a:visited {

color: #803300;

text-decoration: none;

border: 1px solid transparent;
}



.Navigation a:hover {

color: #008073;

background-color: #bfece7;   /* light blue */

font-weight: normal;

border: 1px solid #008073;
}






/* ------ Section 5 - Additional Navigation ------ */




/* -- Thumbnail-with-Caption Navigation -- */



.imageCaptionLinkGroup {

text-align: center;

border: 1px solid #C0C0C0;
padding: 0px;
}



.imageCaptionLinkGroup a {

text-decoration: none;

}



.imageCaptionLinkGroup .caption {

text-decoration: underline;

}




/* -- Horizontal Text NavBar -- */



.text-NavBar {

font-family: Verdana, Arial, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;

margin: 12px auto 12px auto;

background-color: transparent;

width: 600px;           /* same width as the width of the center column (960 -180 - 180) */

}



.text-NavBar ul {

list-style-type: none;

padding: 0;

}



.text-NavBar ul li {

display: inline;

background-color: transparent;

text-align: center;

}



.text-NavBar a {

color: #ffffc6;

text-decoration: none;

text-align: center;

padding: 0 4px;

}



.text-NavBar a:visited {

color: #ffffc6;

text-decoration: none;

}



.text-NavBar a:hover {

color: #ffffc6;

background-color: transparent;

text-decoration: underline;

}


/* -- Page Top Text NavBar -- */



.pagetop-NavBar {

font-family: Verdana, Arial, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;

font-size: 85%;
margin: 0;
text-align: center;
background-color: transparent;

}



.pagetop-NavBar ul {

list-style-type: none;

padding: 4px;

}



.pagetop-NavBar ul li {

display: inline;

background-color: transparent;

text-align: center;

}



.pagetop-NavBar a {

color: #ffffc6;
text-decoration: none;

text-align: center;

padding: 0 8px;

}



.pagetop-NavBar a:visited {

color: #ffffc6;

text-decoration: none;

}



.pagetop-NavBar a:hover {

color: #ffffc6;

background-color: transparent;
text-decoration: underline;

}


/* -- Page Tabs -- */




.pagetabs {
clear: both;
font-family: Verdana, Arial, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;

font-size: 100%;
background-color: transparent;
margin: 0 0 0 0;
padding: 0;
width: 580px;           /* same width as the width of the center column - 20px liner padding) */



}



.pagetabs ul {

list-style-type: none;

border-bottom: 2px solid #c0c0c0;
padding: 3px;
margin: 0;
color: #803300;
}


.pagetabs ul li {

display: inline;

color: #803300;
text-align: center;

}



.pagetabs a {

color: #803300;
text-decoration: none;

border: 1px solid #c0c0c0;
background-color: #ffffc6;
text-align: center;

padding: 3px 10px 3px 10px;
}



.pagetabs a:visited {

color: #803300;

text-decoration: none;
}



.pagetabs a:hover {

color: #008073;

background-color: #bfece7;

text-decoration: none;

}








/* ------ Section 6 - Specific Font Styles ------ */



#LeftColumn {

font-size: 90%;

color: #803300;

}



#RightColumn {

font-size: 85%;

color: #000000;
}



#Footer {

font-size: 90%;

color: white;
}



h1, h2, h3 {

font-family: Arial, Verdana, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
background-color: transparent;

}



h2, h3, h4, h5, h6 {

margin-top: 24px;

}

h4, h5, h6 {

font-family: Verdana, Arial, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
background-color: transparent;

}




h1 {
margin-top: 5px;

color: black;

border-bottom: 0 solid black;

text-align: center;

clear: both;

font-size: 150%;

}



h2 {


color: #008073;
border-bottom: 0 dotted #008073;

font-size: 130%;

}



h3 {
color: black;

border-bottom: 0 solid black;

font-size: 110%;

}


h4 {
color: black;

border-bottom: 0 solid black;

font-size: 100%;

}

h8 {
color: #008073;
font-size: 200%;
font-weight: bold;
}



#LeftColumn h4 {

font-size: 90%;

color: #803300;
margin-top: 0;

}



#RightColumn h4 {

font-size: 100%;
font-family: Verdana, Arial, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
color: #008073;

text-align: center;
margin-top: 0;

}



.Caption {

font-size: 85%;

font-weight: bold;

color: #000;

clear: both;

line-height: 14px;

}



blockquote {

margin: 12px 56px;

color: #006;

font-size: 115%;

text-align: justify;
font-family: 'Courier New', Courier, monospace;

}




/* ------ Section 7 - Boxes ------ */


.HorizontalLine {

clear: both;

width: 100%;

border-top: 1px solid #c0c0c0;

margin: 18px 0 9px 0;
Text-align: center;
}

.Divider {

clear: both;

width: 100%;

border-top: 1px solid #c0c0c0;

margin: 24px 0 24px 0;
Text-align: center;
}

.storyInput { 
height: 300px; 
}



.CalloutBox {

clear: both;
background-color: #bfece7;

width: 85%;

border: 1px solid #008073;

margin: 18px auto 24px auto;

padding: 4px;

color: black;

Text-align: left;
}



div.CalloutBox p {

margin: 13px;

}


p.CalloutBox {

padding: 13px;

}



div.CalloutBox h1, h2, h3, h4, h5, h6 {

margin: 0;

}


p.CalloutBox h1, h2, h3, h4, h5, h6 {

padding: 0;

}





.ReminderBoxLeft {           /* the container box */

background-color: #bfece7;

width: 24%;

border: 1px solid #008073;

margin: 0 18px 0 0;

float: left;             /* adding float enables text to flow around it */

color: #000;

}



.ReminderBoxLeft h4 {

margin: 0;

padding: 2px;

text-align: center;

background-color: #fff;

color: #008073;
}



.ReminderBoxLeft p {

font-size: 80%;

padding: 0 4px;

line-height: 13px;

}


.ReminderBoxRight {           /* the container box */

background-color: #bfece7;

width: 24%;

border: 1px solid #008073;

margin: 0 0 12px 18px;

float: right;             /* adding float enables text to flow around it */

color: #000;

}



.ReminderBoxRight h4 {

margin: 0;

padding: 2px;

text-align: center;

background-color: #fff;

color: #008073;
}



.ReminderBoxRight p {

font-size: 80%;

padding: 0 4px;

line-height: 13px;

}




.DownloadBox {           /* the container box */

background-color: transparent;

width: 100%;

border-top: 1px solid #c0c0c0;
border-bottom: 1px solid #c0c0c0;
margin: 0 0 12px 0px;

color: #666666;

clear: both;
text-align: center;
}



.DownloadBox h4 {
text-align: center;

background-color: #eeeeee;

color: #666666;
padding: 2px;
}



/* ---- Comparison Box ---- */

.ComparisonBox1 {           /* the container box */

width: 45%;

margin: 18px 0 24px 20px;
text-align: left;

float: left;
background-color: #ffffc6;
border: 1px solid #803300;
}



.ComparisonBox1 h4 {

margin: 0;

padding: 4px;


background-color: #803300;

color: white;
}



.ComparisonBox1 p {

padding: 0 4px;
background-color: #ffffc6;
color: #803300;
}



.ComparisonBox2 {           /* the container box */

width: 45%;

margin: 18px 20px 24px 0;

text-align: right;
float: right;
background-color: #bfece7;
border: 1px solid #008073;
}



.ComparisonBox2 h4 {

margin: 0;

padding: 4px;

background-color: #008073;

color: white;
}



.ComparisonBox2 p {

padding: 0 4px;
background-color: #bfece7;
color: #008073;
}

/* 2 Columns in Page */

.SqueezerTopLeft {           /* the container box */

width: 48%;

margin: 0x 0 0px 0;
padding: 10px 10px 10px 0;
text-align: left;

float: left;
background-color: transparent;
border-right: 1px solid #c0c0c0;
border-top:1px solid #c0c0c0;
border-bottom: 1px solid #c0c0c0;
}

.SqueezerTopRight {           /* the container box */

width: 48%;

margin: 0px 0 0px 0;

padding: 10px 0px 10px 10px;
text-align: left;
float: right;
background-color: transparent;
border: 0px solid #c0c0c0;
border-top: 1px solid #c0c0c0;
border-bottom: 1px solid #c0c0c0;
}

.SqueezerBottomLeft {           /* the container box */

width: 48%;

margin: 0x 0 0px 0;
padding: 10px 10px 10px 0;
text-align: left;

float: left;
background-color: transparent;
border-right: 1px solid #c0c0c0;
border-bottom: 1px solid #c0c0c0;
}

.SqueezerBottomRight {           /* the container box */

width: 48%;

margin: 0px 0 0px 0;

padding: 10px 0px 10px 10px;
text-align: left;
float: right;
background-color: transparent;
border-bottom: 1px solid #c0c0c0;
}




/* AdSense */




.AdSenseBoxLeft, .AdSenseBoxRight, .AdSenseBoxCenter468, .AdSenseBoxRightColumn {

padding: 10px;

background-color: transparent;

border: 1px solid #c0c0c0;

}


.AdSenseBoxLeft {

margin: 0 18px 12px 0;

float: left;

}


.AdSenseBoxRight {

margin: 0 0 12px 18px;

float: right;

}


.AdSenseBoxCenter468 {

width: 468px;

margin: 0 auto 12px auto;

clear: both;

}


.AdSenseBoxRightColumn {

padding: 0;

margin: 0 auto 12px auto;

clear: both;

}

/* -- Breadcrumb -- */



.breadcrumb {
clear: both;
font-family: Verdana, Arial, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;

font-size: 100%;
text-align: left;
background-color: #ffffc6;
border-top: 1px solid #8f8fb3;
border-bottom: 1px solid #8f8fb3;
margin: 0 0 12px 0;
padding: 8px 0 0 0;
width: 580px;           /* same width as the width of the center column - 20px liner padding) */



}



.breadcrumb ul {

list-style-type: none;

padding: 0;
background-color: #ffffc6;
border: 1px solid #ffffc6;
color: #803300;
}

.breadcrumb ul h7 {
background-color: #008073;
border: 1px solid #008073;
font-weight: bold;
color: #ffffc6;
padding: 0 3px 0 3px;
}


.breadcrumb ul li {

display: inline;

background-color: transparent;

text-align: center;

border: 1px solid transparent;
}



.breadcrumb a {

color: #803300;
text-decoration: none;

text-align: center;

padding: 0 3px 0 3px;

border: 1px solid transparent;
}



.breadcrumb a:visited {

color: #803300;

text-decoration: none;
border: 1px solid transparent;
}



.breadcrumb a:hover {

color: #008073;

background-color: #bfece7;

text-decoration: none;

border: 1px solid #008073
}





/* -- RSS Box -- */



#RSSbox {

width: 148px;

background-color: transparent;

border: 0;

margin: 8px auto 10px 0;

padding: 2px 2px 3px 3px;

font-size: 100%;

font-weight: bold;

color: #803300;

line-height: 14px;

text-align: left;

float: left;
}



/* -- Thumbnail Image Viewer -- */

.thumbnail {
position: relative;
z-index: 0;
color: #803300;
}

.thumbnail:hover {
background-color: transparent;
z-index: 50;
}

.thumbnail span {
border:  none;
padding: 5px;
position: absolute;
background-color: transparent;
left: -1000px;
display: none;
color: black;
text-decoration: none;
}

.thumbnail span img {
border: thin outset #803300;
padding: 0px;
}

.thumbnail:hover span {
border:  none;
display: inline;
left: 0px;
top: 0;
}





/* ------ Section 8 - Frequently Used Styles ------ */




.clear {

clear: both;

}




img {

border: 0 solid black;


}




/* -- lists -- */



#CenterColumn ul {

list-style-type: disc;

margin: 0 0 8px 10px;

}



#CenterColumn li {

margin: 0 0 8px 5px;

}




#CenterColumn ol {

list-style-type: decimal;

margin: 0 0 8px 10px;

}




/* -- floats -- */



.ItemRight {

float: right;

margin: 2px 0 12px 18px;

text-align: center;

}



.ItemCenter {

margin: 2px auto 12px auto;

text-align: center;

clear: both;

}



.ItemLeft {

float: left;

margin: 2px 18px 12px 0;

text-align: center;

}



.center {

text-align: center;

}