/* styles used in the gnomedia trekking pages */
/*                  Copyright T Pushman, 2003 */

body {
    font: normal 12px Verdana,Arial,helvetica,sans-serif;
    margin:0px;
}

/* link styles */
a:active { color:#00cc00; }
a:link { color:#003300; }
a:visited { color:#009900; text-decoration:none; }
a:hover { color:#00cc00; }

/* link styles for the navbar*/
.pageNavBar a:active { color:#00cc00; }
.pageNavBar a:link { color:#003300;text-decoration:none; }
.pageNavBar a:visited { color:#006600;text-decoration:none; }
.pageNavBar a:hover { color:#00cc00; }

/* the usual kludge */
.kludge {
    width:100%;
    clear:both;
    height:0px;
}

/*****************************************************
   this style applies to the brass plaque that appears
   on the entry pages.
******************************************************/
#plaque {
    margin-top:55px;
    margin-left:50px;
    border-bottom:2px solid #003300;
    border-right:2px solid #003300;
}

/*****************************************************
 styles for the main travelogue entry page 'treks.php'
******************************************************/
/* dark green main header bar */
div.header {
    width:820px;
    height:200px;
    background-color:#006600;
}

div.topnav {
  background-color:#ffee99;
  width:808px;
  height:20px;
  padding:2px;
  padding-left:10px;
/*    border-top:5px solid #eeffee;*/
}

/* the div containing the thumbs */
div.trekentry {
    height:150px;
    background-color:#ffffdd;
    padding:5px;
    color:#006600;
}

/* trekintro is the left column on the treks.php page */
#trekintro {
    float:left;
    width:184px;
    height:474px;
    padding:8px;
    margin:10px;
    border:2px solid #ffdd99;
    background-image:url(photos/wooden-post-bg.jpg);
    background-repeat:no-repeat;
}

#trekintro p {
    font:normal 12px Verdana,Arial,helvetica,sans-serif;
    color:#006600;
}

/*****************************************************
 additional styles for the MIG pages
******************************************************/
/* the text under the thumbs */
div.shorttext {
    color:#006600;
}

/* the navigation links on an image list page */
span.navlinks {
    font-size:10px;
    line-height:14px;
    color:#006600;
}

div.navbar {
  text-align:center;
  border-top:1px solid black;
  border-bottom:1px solid black;
  width:100%;
  padding:5px;
}


/*****************************************************
  Styles that apply to the travelogue pages.
******************************************************/
/* 
   this is the overall container for all elements
   on a page.
 */
div.page {
    width:820px;
    margin-left:5%;
    font:14px normal Verdana,Arial,helvetica,sans-serif;
/*    border:1px solid blue;*/
}

/* 
   the first item on a page, contains usually a picture
   with a caption (hence the text-align)
 */
div.pageHead {
    width:820px;
    margin-top:15px;
    font:14px normal Verdana,Arial,helvetica,sans-serif;
    text-align:center;
/*    border:1px solid blue;*/
}

/*
  This is the main text container for the page.
  if there is no need for the three column layout
  then this could just become a text container.
 */
div.pageCenterCol {
  margin-left:40px;
  width:760px;
  /*  float:left;*/
  /*  border:1px solid black;*/
}

/* 
  This style makes a nice width column and allows
  for the pictures to sit half in/half out of the
  text flow.
 */
div.pageCenterCol p,dl {
  font: normal 12px Verdana,Arial,helvetica,sans-serif;
  color:#006600;
  text-align:justify;
  margin-left:120px;
  margin-right:120px;
}

/*
   Double bar at top and bottom of the page
   containing links to other pages in the section
 */
div.pageNavBar {
    text-align:center;
    border-top:3px solid #006600;
    border-bottom:3px solid #006600;
    font:12px bold Verdana,Arial,helvetica,sans-serif;
    margin-top:10px;
    margin-bottom:10px;
    padding-top:3px;
    padding-bottom:3px;
/*    background-color:green;*/
}

/*
   div container for a picture that will float the
   picture over to the right side of the text.
 */
div.picright { 
  float:right;
  margin:10px;
  text-align:center;
}

/*
   div container for a picture that will float the
   picture over to the left side of the text.
 */
.picleft {  
  float:left;
  margin:10px;
  text-align:center;
}

/*
   div container for google ads
   vertical, right side
*/
.gadsr {
  float:right;
  margin:0;
  margin-left:10px;
  width:120px;
}
/*
   div container for google ads
   vertical, left side
*/
.gadsl {
  float:left;
  margin:0;
  margin-right:10px;
  width:120px;
}

/* the copyright on the bottom of the page. */
div.copyright {  
  text-align:center;
  font:10px normal Verdana,Arial,helvetica,sans-serif;
  font-weight:bold;
  background-color:#ffee99;
  color:black;
  width:820px;
  height:25px;
  padding-top:8px;
  margin-bottom:10px;
}

/* a foreign name */
span.foreign {
  font-style:italic;
}

/* a place name */
span.placename {
  font-weight:bold;
}

span.pic-caption {
  font:11px normal Verdana,Arial,helvetica,sans-serif;
  font-weight:bold;
  color:#000000;
}

span.copyright {  
  font:10px normal Verdana,Arial,helvetica,sans-serif;
  font-weight:bold;
}
/*****************************************************
 *  these are styles for the various popup windows.  *
******************************************************/
.puText {
    font:normal 12px  Verdana,Arial,helvetica,sans-serif;
    color:black;
}

.puBody {
    background-color:#cceeff;
    margin:10px;
}

/* button to close the popup window */
/* margin:auto works in all except IE6 !! */
div.popupClose {
    background-color:#99ff99;
    margin-left:45%;
    margin-right:45%;
    margin-top:10px;
    color:black;
    width:100px;
    height:25px;
    padding:5px;
    text-align:center;
    text-decoration:none;
    border:1px solid #66cc66;
}

.popupClose a:link { text-decoration:none; }