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


body {
background-color: #fff; /* aqua color for browser window background color and footer top border */
margin: 0;
padding: 0;
}

body {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000;
font-size: 80%;
}




/* -- General Link Styling -- */

a:link {
color:blue; 
text-decoration: underline;
}

a:visited {
color: purple;
text-decoration: underline;
}

a:hover {
color: red;
text-decoration: underline;
}



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

#PageWrapper {
width: 960px;
}

#Header {
height: 185px;
}

#ContentWrapper {
float: left;
width: 100%;
}

#CenterColumn {
margin: 0 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)  */
}

#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) */
}

#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: 2px solid #08c;   /* dark sea blue, headlines and borders */
margin: 24px auto;
background-image: url();
background-repeat: repeat-y;
}

#Header {
background-image: url(http://www.great-vacation-in-alaska.com/images/vacation-in-alaska-map-3.jpg);
background-repeat: no-repeat;
background-color: #08c;
background-position: top left;

}

#ContentWrapper {
background-image: url();
background-color: #08c;
background-repeat: repeat-y;
}

#LeftColumn {
background-image: url();
background-repeat: repeat-y;
background-color: #08c;
}

#CenterColumn {
background-image: url();
background-repeat: no-repeat;
background-color: #fff;
}

#RightColumn {
background-image: url();
background-repeat: no-repeat;
background-color: #08c;
}

#Footer {
background-image: url();
background-repeat: no-repeat;
background-color: #08c;     /* blue-gray used in left and right columns of anguilla-background.gif and for footer and horizontal text-navbar */
border-top: 1px solid #08c;
}






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


/****************************************************
this area of the stylesheet is for your navigation panel*/

#navigator {

}

.navbutton {
line-height: 90%;
}

.navbutton a {
font-size: 80%;
font-family:  verdana, sans-serif;
}

.navbutton a:hover {
font-size: 80%;
font-family:  Verdana, sans-serif;
}


/***********************************************************
 this part below is for the color on the background, surrounding the buttons. Change the color, and the 
border, if you like. For the border, you can use solid, dashed, or dotted, for different border styles*/

#navigator {

background-color: transparent;

border:  none;


width: auto;

margin-top: auto;

margin-left: auto;

margin-right: auto;

padding: 2px;

text-align: left;


}

/* want more space between your buttons? just increase the margins
from 1px. Font weight can be bold if you prefer.*/

.navbutton {

font-weight: normal;
text-align: left;
margin-bottom: 2px;
margin-top: 2px;
}


/* this part is for the colors of your buttons "at rest" so to speak. Notice the
top/left, and the bottom/right are colored in pairs? If you change the colors, you will need to do the same, to
maintain the illusion of 3D buttons. Make one set of sides a slightly darker shade than the other pair.
This will give the button a 3D look*/

.navbutton a {

padding: 4px;

text-decoration: none;

display: block;

color: white; /*this is where you change the button font color*/

background-color: transparent;

border-top: none;

border-left: none;

border-bottom: none;

border-right: none;

}

/*this part is how the buttons look, once the pointer passes over them. Same thing as above, but this time
the top/left colors should SWAP with the bottom/right, to give the correct effect.
Also the background color should go a shade darker, to make it seem as if it were now below the 
level of the page, and is not getting any light on it*/

.navbutton a:hover {

color: navy; /*-----this is where you change the button font color, when the button is hovered over*/

background-color: #0088CC;

border-top:  none;

border-left: none;

border-bottom:  none;

border-right: none;

}



/************************************
this is for the navigation headings*/
.nav{
white-space:nowrap;
font-size: 100%;
color: yellow;
background-color: #5CB3FF; 
border-top:2px solid #5CB3FF;
border-bottom:2px solid #5CB3FF;
border-left:2px solid navy;
border-right:2px solid navy;
width: 95%;
padding-left:5px;
padding-right:5px;
}




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


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

.imageCaptionLinkGroup {
text-align: center;
}

.imageCaptionLinkGroup a {
text-decoration: none;
}

.imageCaptionLinkGroup .caption {
text-decoration: underline;
}


/* -- Horizontal Text NavBar -- */

.text-NavBar {
font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;
margin: 1px auto 2px auto;
background-color: yellow;
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: yellow;
text-align: center;
}

.text-NavBar a {
color: blue;
text-decoration: none;
text-align: center;
padding: 0 4px;
}

.text-NavBar a:visited {
color: purple;
text-decoration: none;
}

.text-NavBar a:hover {
color: red;
background-color: #d3e4fb;
text-decoration: underline;
}


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

.pagetop-NavBar {
font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;
margin: 12px auto 12px auto;
float:right;
background-color: #abc4e3;
width:600px;
}

.pagetop-NavBar ul {
list-style-type: none;
padding:0;
}

.pagetop-NavBar ul li {
display: inline;
background-color: #ffc;
text-align: center;
}

.pagetop-NavBar a {
color: blue;
text-decoration: none;
text-align: center;
padding:0 4px;
}

.pagetop-NavBar a:visited {
color: purple;
text-decoration: none;
}

.pagetop-NavBar a:hover {
color: red;
background-color: #d3e4fb;
text-decoration: underline;
}








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

#LeftColumn {
font-size: 90%;
color: white;
}

#RightColumn {
font-size: 90%;
}

#Footer {
font-size: 100%;
}

h1, h2, h3, h4, h5, h6 {
background-color: transparent;
color: #000086;
clear: both;
}

h2, h3, h4, h5, h6 {
margin-top: 24px;
}


h1 {
margin-top: 5px;
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 32px;
text-align: center;
font-weight : bold;
color : #039;
}


H4 {
	font-family: Tahoma,Verdana, Eyechart, Geneva, Arial, Helvetica, sans-serif;
	font-size: medium;
	background: #08c;
	color: #fff;
	padding: 3px;
	width: 100%;
	BORDER-TOP: navy thin solid;
	BORDER-LEFT: navy thin solid;
	BORDER-BOTTOM: navy thin solid;
	BORDER-RIGHT: navy thin solid;
	text-align: center;
	
}



H2 {
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 18px;
	text-align: center;
	padding: 10px;
	font-style: bold;
	width: 100%;
	color : #666;
}


H3{
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align: left;
	padding: 10px;
	font-style: bold;
	width: 100%;
	color : #666;
}


H5 {
	font-family: Verdana, Eyechart, Geneva, Arial, Helvetica, sans-serif;
	font-size: small;
	color: #ff0000;
	padding: 3px;
	width: 75%;
	text-align: left;
	
}

h6 {
	font-family: tahoma, Arial, sans-serif;
	font-size: small;
	color: #000;
	padding: 10px;
	background-color: #5CB3FF;
	font-style: ;
	width: 100%;
	BORDER-TOP: navy thin solid;
	BORDER-LEFT: navy thin solid;
	BORDER-BOTTOM: navy thin solid;
	BORDER-RIGHT: navy thin solid;
	text-align: center;
}




#LeftColumn h4 {
font-size: 90%;
color: white;
margin-top: 0;
}

#RightColumn h4 {
font-size: 90%;
color: white;
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: 100%;
line-height: 20px;
font-family: 'Courier New', Courier, monospace;
}



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


.CalloutBox {
background-color: #fff;
width: 85%;
border: 1px dotted #8f8fb3;
margin: 18px auto 24px auto;
padding: 4px;
color: black;
}

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;
}


.ReminderBox {           /* the container box */
background-color: #ddd;
width: 24%;
border: 1px solid #8f8fb3;
margin: 0 0 12px 18px;
float: right;             /* adding float enables text to flow around it */
color: #006;
}

.ReminderBox h4 {
margin: 0;
padding: 2px;
text-align: center;
background-color: #fff;
}

.ReminderBox p {
font-size: 80%;
padding: 0 4px;
line-height: 13px;
}


.AdSenseBoxLeft, .AdSenseBoxRight, .AdSenseBoxCenter468, .AdSenseBoxRightColumn {
padding: 5px;
background-color: #08c;
border: 0px;
}
.AdSenseBoxLeft {
margin: 0 18px 12px 18px;
float: left;
}
.AdSenseBoxRight {
margin: 0 18px 12px 18px;
float: right;
}
.AdSenseBoxCenter468 {
width: 468px;
margin: 0 auto 12px auto;
clear: both;
}
.AdSenseBoxRightColumn {
padding: 0;
margin: 0 auto 12px auto;
clear: both;
}


.ReturnToNavBox {
background-color: #fff;
width: 100%;
border-top: 1px solid #8f8fb3;
border-bottom: 1px solid #8f8fb3;
margin: 0 auto 12px auto;
padding: 4px;
}
	

/* -- RSS Box -- */

#RSSbox {
width: 148px;
background-color: yellow;
border: 1px solid yellow;
margin: 8px auto 10px 3px;
padding: 2px 2px 10px 2px;
font-size: 100%;
font-weight: bold;
color: #1d487e;
line-height: 14px;
text-align: center;
}




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


.clear {
clear: both;
}


img {
border: 0 solid #ddd;
}


/* -- 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;
}

#CenterColumn li {
margin: 0 0 8px 5px;
}


/* -- floats -- */

.ItemRight {
float: right;
margin: 2px 0 12px 18px;
text-align: center;
}

.ItemCenter {
margin: 2px auto 12px auto;
text-align: center;

}

.ItemCenterGoogle {
margin: 2px auto 12px auto;
text-align: center;
vertical-align: baseline;

}



.ItemLeft {
float: left;
margin: 2px 18px 12px 0;
text-align: center;
}

.center { 
text-align: center;
}


td.tester {
width: 725px;
background-color:#ffff00;
}

ul{
	list-style-image:url(http://www.great-vacation-in-alaska.com/image-files/li.jpg);
	list-style-position:outside;
	list-style-type:none;
}