/*-----------------------------------------------------------------------*/
/* FONT-SIZE DEFINITIONS                                                 */
/*-----------------------------------------------------------------------*/
/* Relative font-sizes in "em" are used where necessary. To make the     */
/* "em"-units normed, the incoming font sizes are set to 1.0 em. The     */
/* font-size variations throughout the webpage are then expressed in     */
/* percentage values respective to the incoming font-size. To make       */
/* calculations easier, the font definition in the css-class "body" is   */
/* 62.5%, which gives 1.0em = 10px This makes life a real breeze!        */
/*-----------------------------------------------------------------------*/

/* Comments for individual lines are found to the right of the respective row */

/*************************/
/* SECTION 1 - MAIN BODY */
/*************************/
body {font-size: 62.5%; margin: 0em auto; padding: 0px; font-family: arial, tahoma, verdana, sans-serif; background-color:#FFFFEE;}
.page-container {width: 770px; margin: 0px auto; padding: 0px; border-left: solid 1px #7D7D7D; border-right: solid 1px #7D7D7D; border-bottom: solid 1px #7D7D7D; background-color: #FFFFFF;}

/*-----------------------------------*/
/* Section 2.2 - Sitename and Banner */
/*-----------------------------------*/
.site-name  {clear: both; float: left; position: absolute; z-index: 2; width: 700px; top: 20px; margin: 0px; padding-left: 17px; background-color: transparent; color: #FFFFFF; font-weight: bold; font-size: 24px;}
.site-slogan  {float: left; position: absolute; z-index: 1; width: 700px; top: 1.9em; left: 15px; margin: 0px; padding: 0px 0px 0px 3px; background-color: transparent; color: #FFFFFF; font-weight: bold; font-size: 14px;}
.img-header {clear: both; float: left; width: 770px; height: 150px; margin: 0px; padding: 0px;}

/*------------------------------------*/
/* Section 2.3 - Main navigation menu */
/*------------------------------------*/
.nav-main {clear: both; float: left; width: 770px;  min-height: 2.0em; height: auto !important; height: 2.0em; line-height: 2.0em; margin: 0px; padding: 0px; border-top: solid 1px #7D7D7D; border-bottom: solid 1px #7D7D7D; background-color: #9FB6D5;} /* Use background-color: rgb(176,207,106);	for green */
.nav-main ul {list-style: none; margin: 0px; padding: 0px; font-weight: bold;}	
.nav-main li {float: left; white-space: nowrap; background-color: inherit;}
.nav-main li a {margin: 0px; padding: 0px 10px 0px 10px; border-right: solid 1px #FFFFFF; color: #FFFFFF; text-decoration: none; font-size: 110%;}
.nav-main a:hover, .nav-main a.selected {background-color: inherit; color: #000000; text-decoration: none;}
.buffer-tgw {float: left; width: 770px; height: 20px; margin: 0px; padding: 0px; background-color: #FFFFFF;}
.buffer2-tgw {float: left; width: 600px; height: 20px; margin: 0px; padding: 0px; background-color: #FFFFFF;}


/******************************/
/* SECTION 4 - SUB-NAVIGATION */
/******************************/
.nav-sub {clear: both; float: left; width: 160px; min-height: 500px; height: auto !important; height: 500px; margin: 0px; padding: 0px; background-color: #FFFFFF;}
.nav-sub ul {float: left; list-style: none; width: 160px; margin: 0px; padding: 0px; border-bottom: solid 1px #C8C8C8;}	
.nav-sub li {margin: 0px; padding: 0px;}
.nav-sub li.title {vertical-align: top; margin: 0px; padding: 0px 5px 4px 20px; color: #646464; text-transform: uppercase; font-weight: bold; font-size: 140%;}
.nav-sub li.group a {display: block; min-height: 1.5em; height: auto !important; height: 1.5em; line-height: 1.5em; margin: 1px 0px 1px 0px; padding: 0px 7px 0px 10px; border-top: solid 1px #C8C8C8;  border-left: solid 10px #C9C6EA; color: #646464; font-weight: bold; font-size: 120%;}
.nav-sub li a {display: block; min-height: 1.5em; height: auto !important; height: 1.5em; line-height: 1.5em; margin: 1px 0px 1px 0px; padding: 0px 7px 0px 10px; border-left: solid 10px #C9C6EA; color: #646464; text-decoration: none; font-size: 120%;}
.nav-sub li a:hover, .nav-sub li a.selected {border-left: solid 10px #7999C4; color: #000000; text-decoration: none;}

.nav-sub-tgw {clear: both; margin: 0px; padding: 0px; background-color: #FFFFFF;}
.nav-sub-tgw ul {float: left; list-style: none; margin: 0px; padding: 0px;}	
.nav-sub-tgw li {margin: 0px; padding: 0px;}
.nav-sub-tgw li.group a {display: block; min-height: 1.5em; height: auto !important; height: 1.5em; line-height: 1.5em; margin: 1px 0px 1px 0px; padding: 0px 7px 0px 10px; border-top: solid 1px #C8C8C8;  border-left: solid 10px #C9C6EA; color: #646464; font-weight: bold; font-size: 120%;}
.nav-sub-tgw li a {display: block; min-height: 1.5em; height: auto !important; height: 1.5em; line-height: 1.5em; margin: 1px 0px 1px 0px; padding: 0px 7px 0px 10px; border-left: solid 10px #D7C1FF; color: #646464; text-decoration: none; font-size: 120%;}
.nav-sub-tgw li a:hover, .nav-sub li a.selected {border-left: solid 10px #7999C4; color: #000000; text-decoration: none;}


/*******************************************************************/
/* SECTION 5 -  CONTAINER FOR CONTENT AND SIDEBAR                  */
/*              Reason: To extend navigation border to footer      */
/*******************************************************************/
/* TRICK: Nest the right two columns (content and sidebar) and     */
/* give them a minimum height and white background and a left      */
/* border-line. However, nesting floats inside each other with     */
/* with identical widths may activate the spurious IE character    */
/* duplication bug, where the last characters of the last float    */
/* statement are duplicated outside the float. The correction for  */
/* this bug is to reduce the sidebar float so that the  sum of     */
/* the content and sidebar floats are 6px less than the container  */
/* holding them. See Section 7.1, where this is done.              */
/* ----------------------------------------------------------------*/
/* RESTRICTION: For situations where the left navigation menu is   */
/* expanding over the minimum 500px height, it must remain smaller */
/* than the container holding the rigth two columns. Otherwise     */
/* the borderline will only extend as far down as the container.   */
/*******************************************************************/
.container-content-sidebar-front {float: left; width: 609px; min-height: 500px; height: auto !important; height: 500px; margin: 0px; padding: 0px 0px 20px 1px; background-color: #FFFFFF;}
.container-content-sidebar, .container-content2-sidebar {float: left; width: 609px; min-height: 500px; height: auto !important; height: 500px; margin: 0px; padding: 0px 0px 20px 0px; border-left: solid 1px #C8C8C8; background-color: #FFFFFF;}
.container-content-sidebar-tgw {float: left; width: 609px; min-height: 500px; height: auto !important; height: 500px; margin: 0px; padding: 0px 0px 20px 0px; border-left: none; background-color: #FFFFFF;}

/*********************************************/
/* SECTION 6A - INDEX PAGE / PHOTO PAGES     */
/*********************************************/
.content {float: left; width: 428px; margin: 0px; padding: 0px 0px 0px 20px; background-color: transparent; color: #000000;} /* Width should be 444px, but IE-duplication bug forces us to reduce with 6px to 428px */
.contentbox-container {clear: both; float: left; width: 425px; margin: 0px 0px 15px 0px; padding: 0px;} /* Width should be 428px, but IE-duplication bug forces us to reduce with 3px to 425px */
.contentbox-full {width: 425px; margin: 0px; padding: 0px;}
.contentbox-half-left {float: left; width: 205px; margin: 0px; padding: 0px;}
.contentbox-half-right {float: right; width: 205px; margin: 0px; padding: 0px;}

.content-index-tgw {float: left; width: 738px; margin: 0px; padding: 0px 0px 0px 20px; background-color: transparent; color: #000000;} 
.contentbox-container-index-tgw {clear: both; float: left; width: 732px; margin: 0px 0px 15px 0px; padding: 0px;}
.contentbox-full-index-tgw {width: 732px; margin: 0px; padding: 0px;}
.contentbox-half-left-index-tgw {float: left; width: 350px; margin: 0px; padding: 0px;}
.contentbox-half-right-index-tgw {float: right; width: 350px; margin: 0px; padding: 0px;}

/*************************************/
/* SECTION 6A - TRAVELOGUE PAGES     */
/*************************************/
.content-travel-tgw {float: left; width: 578px; margin: 0px; padding: 0px 0px 0px 20px; background-color: transparent; color: #000000;} 
.contentbox-container-travel-tgw {clear: both; float: left; width: 572px; margin: 0px 0px 15px 0px; padding: 0px;}
.contentbox-full-travel-tgw {width: 572px; margin: 0px; padding: 0px;}
.contentbox-places-travel-tgw {
	margin: 0px;
	padding: 1px 0px 2px 3px;
	background-color: #DEDCF2;
	color: #000000;
	font-weight: bold;
	font-size: 130%;
	border-left-width: none;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-left-color: #D7C1FF;
}

x-half-right-index-tgw {float: right; width: 350px; margin: 0px; padding: 0px;}


/************************************/
/* SECTION 6C - CONTENT PAGE COMMON */
/************************************/
/*--------------------------------------------------*/
/* Section 6C.4 - Page title, title and content box */
/*--------------------------------------------------*/
.content-pagetitle {width: 100%; margin: 0px 0px 10px 0px; padding: 0px 0px 5px 0px; background-color: transparent; border-bottom: solid 0px #C8C8C8; color: #646464; text-transform: uppercase; font-weight: bold; font-size: 140%;}
.content-pagetitle-tgw {width: 100%; margin: 0px 0px 10px 0px; padding: 0px 0px 5px 0px; background-color: transparent; border-bottom: solid 0px #C8C8C8; color: #646464; font-weight: bold; font-size: 140%;}
.contentbox-title-noshading-small {margin: 0px 0px -5px 0px; padding: 0px; background-color: transparent;  color: #000000; font-weight: bold; font-size: 130%;}
.contentbox-title-noshading-medium {margin: 0px 0px -5px 0px; padding: 0px; background-color: transparent; color: #000000; font-weight: bold; font-size: 150%;}
.contentbox-title-noshading-large {margin: 0px 0px -5px 0px; padding: 0px; background-color: transparent; color: #000000; font-weight: bold; font-size: 170%;}
.contentbox-title-noshading-huge {margin: 0px 0px -5px 0px; padding: 0px; background-color: transparent; color: #000000; font-weight: bold; font-size: 180%;}
.contentbox-title-shading-small {
	margin: 0px;
	padding: 1px 0px 2px 3px;
	background-color: #DEDCF2;
	color: #000000;
	font-weight: bold;
	font-size: 130%;
	border-left-width: 10px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: solid;
	border-left-color: #D7C1FF;
}
.contentbox-title-shading-medium {margin: 0px; padding: 1px 0px 2px 3px; background-color: #DEDCF2; color: #000000; font-weight: bold; font-size: 150%;}
.contentbox-title-shading-large {margin: 0px; padding: 1px 0px 2px 3px; background-color: #DEDCF2; color: #000000; font-weight: bold; font-size: 170%; border-left-width: 10px; border-left-style: solid; border-left-color: #D7C1FF;}
.contentbox-title-shading-huge {margin: 0px; padding: 1px 0px 2px 3px; background-color: #DEDCF2;color: #000000; font-weight: bold; font-size: 180%;}
.contentbox-noshading {margin: 0px; padding: 0.7em 0px 0px 0px; background-color: transparent;}
.contentbox-shading {margin: 0px; padding: 7px 10px 5px 10px; background-color: #DEDCF2;}


/***********************/
/* SECTION 7 - SIDEBAR */
/***********************/
/*-----------------------------------------------*/
/* Section 7.1 - Size                            */
/*-----------------------------------------------*/
/* Because of IE float-rendering bug, the width  */
/* must be reduced by 6px, otherwise it will     */
/* duplicate characters after the last float     */
/* Reason: IE may not alwys allow nested floats  */
/* have identical widths, but inside float must  */
/* be smaller than outside float. This IE-bug is */
/* somewhat unpredictable. See Section 5 header  */
/* for more details on this topic.               */
/*-----------------------------------------------*/

.sidebar {float: right; width: 155px; margin: 0px ; padding: 3.1em 0px 0px 0px; background-color: #FFFFFF; text-align: left;  color: rgb(75,75,75);} /* Actual width should be: 175px, but because of IE-bug we reduce with 6px so that container has some free space) */
.sidebarbox-noborder {width: 140px; margin: 0px 0px 1.0em 9px; padding: 0px;}
.sidebarbox-border {width: 130px; margin: 0px 0px 1.0em 9px; padding: 4px 4px 4px 4px; border: solid 1px #C8C8C8;}
.sidebarbox-title-noshading {display: block; margin: 0px 0px 2px 0px; padding: 0px; background-color: transparent; font-weight: bold; font-size: 110%;}
.sidebarbox-title-shading {display: block; margin: 0px 0px 2px 0px; padding: 2px 5px 3px 5px; background-color: rgb(225,225,225); font-weight: bold; font-size: 110%;}
.sidebarbox-noborder p {margin: 0px 5px 0.4em 5px; padding: 0px; background-color: transparent; line-height: 1.2em; font-size: 110%;}
.sidebarbox-border p {margin: 0px 0px 0.4em 0px; padding: 0px; background-color: transparent; line-height: 1.2em; font-size: 110%;}


/**********************/
/* SECTION 8 - FOOTER */
/**********************/
.footer-tgw {clear: both; width: 770px; height: 8.0em; margin: 0px; padding: 0.5em 0px 0.5em 0px; border-top: solid 1px #7D7D7D; background-color: #9FB6D5; color: #FFFFFF;}
.footer p {margin: 0px; padding: 0px; text-align: center; line-height: 1.3em; font-size: 110%;}

/********************************/
/* SECTION 10 - GENERIC CLASSES */
/********************************/
/*------------------------------------------*/
/* Section 10.1 - Global default font sizes */
/*------------------------------------------*/
.nav-global-font {font-size: 1.0em;}
.nav-main-font {font-size: 1.0em;}
.nav-sub-font {font-size: 1.0em;}
.nav-sub-font-tgw {font-size: 0.9em;}
.content-font {font-size: 1.0em;}
.content-font-tgw {font-size: 1.3em;}
.content-caption-tgw {font-size: 1.0em;}
.content-blurb-tgw {font-size: 1.2em;}
.sidebar-font {font-size: 1.0em;}
.footer-font {font-size: 1.0em;}