/*************************/
/* SECTION 1 - MAIN BODY */
/*************************/

/*-------------------------------*/
/* Section 1.1 - Page definition */
/*-------------------------------*/

body {
	font-size: 67.5%; color: #759DA1; margin: 0em auto; padding: 0em; font-family: Verdana, Arial, Helvetica, sans-serif; background:#FFFFFF;
}

#container {
	width: 980px; margin: 0px auto; padding: 0px; border-left: solid 1px #759DA1; border-right: solid 1px #759DA1; background-color: #FFFFFF;
}

/**********************/
/* SECTION 2 - HEADER */
/**********************/

/*--------------------------------------*/
/* Section 2.1 - Global navigation menu */
/*--------------------------------------*/

.nav-global-container {
	float: left; position: absolute; z-index: 3; width: 980px; top: 5px; background-color: transparent;
}

.nav-global ul {	
	float: right; margin: 0px; padding: 0px; list-style: none;
}	

.nav-global li {
	float: left; white-space: nowrap; text-transform: uppercase;
}

.nav-global li a {
	display: block; margin: 0px; padding: 0px 5px 0px 5px; border-left: solid 1px rgb(150,150,150); background-color: rgb(255,255,255); color: rgb(36,69,12); text-decoration: none; font-size: 130%;font-weight: bold ;
}

.nav-global a:hover, .nav-global a.selected {
	background-color: rgb(255,255,255); color: #AC3913; text-decoration: none;
}

.img-flag {
	display: block; height: 1.2em; margin: 0px; padding: 0px; border: solid 1px rgb(0,0,0);
}

/*-----------------------------------*/
/* Section 2.2 - Sitename and Banner */
/*-----------------------------------*/
#headbody {
background-color:#599B8F;
height:175px;
margin:0 0 0 0;
padding:0 0 0 0;
}
#headimageleft {
float:left;
position:absolute;
z-index:auto;
}

#headimageright {
float:right;
position:absolute;
}
#headtop {
float: left;
width:inherit;
height:88px;
background-color:#599B8F;

}
#headtoptext {
	float:right;
	text-align:center;
	width:auto;
	height:auto;
	font-size: 24px;
	font-family: "Century Gothic";
	color:#CCFFFF;
	padding-top:30px;
	letter-spacing: 0.2em;
	padding-right: 49px;
}
#headbottom {
float: left;
width:100%;
height:87px;
background-color:#1C4585;


}
#headbottomtext {
float: right;
text-align:center;
width:50%;
height:auto;
padding-top: 38px;
text-align:center;
font-size: 16px;
color: #FFCC33;
font-style:normal
}

.img-header {
	clear: both; float: left; margin: 0px; padding-left: 0px;
}

/*------------------------------------*/
/* Section 2.3 - Main navigation menu */
/*------------------------------------*/

.nav-main {
	clear: both; float: left; width: 980px; margin: 0px; padding-top:10px; padding-bottom:2px; border-top: solid 1px rgb(125,125,125); border-bottom: solid 1px rgb(125,125,125); background-color: #8FB3B1; height:30px;
}

.nav-main ul {	
	list-style: none; margin: 0px; padding: 0px; 
}	

.nav-main li {
	float: left; display: block; white-space: nowrap; background-color: inherit;
}

.nav-main li a {
	color:#330066;
	margin: 0px;
	padding: 0px 5px 0px 5px;
	text-decoration: none;
	font-size: 120%;
	font-weight: bold;
}
.nav-main-date {
	color:#330066;
	margin: 0px;
	padding: 2px 5px 0px 5px;
	text-decoration: none;
	font-size: 110%;
	font-weight: normal;
}
.nav-main a:hover, .nav-main a.selected {
	background-color: inherit; color: #FF6600; text-decoration: none;
}

/*******************************************************************/
/* SECTION 5 -  Extend left column height to footer                */
/*-----------------------------------------------------------------*/
/* TRICK: To nest the right two columns (content and sidebar) and  */
/* give them a minimum height and white background. Then let the   */
/* left column have transparent background so the light-grey color */
/* from the global page definition comes through. However, nesting  */
/* floats inside each other with identical widths may activate the */
/* IE character duplicating bug, where the last characters of the  */
/* last float statement are duplicated outside the float. The      */
/* correction for this 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 600px height, it must remain smaller */
/* than the right columns. Otherwise the global page grey back-    */
/* will shine through after the end of the content and sidebar     */
/* columns. This situation may arise when you have very long left  */
/* navigation menus, and short content and sidebars. If this is    */
/* your situation, then simply increase the minimum height of the  */
/* left column, as well as the container defined in this section.  */
/*******************************************************************/

/* Contain both right columns (content and sidebar) in one         */
/* container and extended to a minimum height of 600 px            */
/* The "!important" statement is for Firefox so that the           */
/* "height" statement still allows the container to grow and       */
/* not remain fixed size. Necessary because IE cannot render       */
/* the "min-height" property                                       */

.container-content-sidebar {
   float: left; width: 980px; min-height: 400px; margin: 0px; padding: 0px; background-color: rgb(255,255,255);
}

/* IE6-hack for min-height. Also works for IE7-Beta2 */
* html .container-content-sidebar {
	height: 400px;
} 
/* End IE-Hack */

/* Put a buffer between sub-navigation column and      */
/* main-navigation so that the global page background  */
/* color does not come through in this place           */

.buffer {
 	float: left; width: 160px; height: 30px; margin: 0px; padding: 0px; background-color: rgb(255,255,255);	
}

/***********************/
/* SECTION 6 - CONTENT */
/***********************/

/*--------------------*/
/* Section 6.1 - Size */
/*--------------------*/

.content {
	float: left;
	width: 935px;
	margin: 0px;
	background-color: rgb(255,255,255);
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 20px;
}

/*-------------------------*/
/* Section 6.2 - Pagetitle */
/*-------------------------*/

.content-pagetitle {
	margin: 0px;
	padding: 0px;
}

.content-pagetitle p {
	padding: 0px; margin: 0px;  font-size: 140%;
}

.content-pagetitle h1 {
	clear: left; margin: 1.0em 0px 1.0em 0px; font-size: 160%; font-weight: normal;
}

/*----------------------------------*/
/* Section 6.3 - Extra container    */
/*----------------------------------*/
/* To ensure that no problems arise */
/* with right and left floatings    */
/* and make the implementation      */
/* robuster.                        */
/*----------------------------------*/

.contentbox-container-full {
	float: left;
	width: 950px;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 1.5em;
	margin-left: 0px;
	padding-right: 0px;
}

/*--------------------------------*/
/* Section 6.5 - Contentbox size  */
/*--------------------------------*/

/* No shading */
.contentbox-noshading {
	margin: 0px; padding: 0.7em 0px 0px 0px; background-color: transparent; 
}

.contentbox-noshading a{
text-decoration:none;
}

/* Shading */
.contentbox-shading {
	margin: 0px; padding: 7px 10px 5px 10px; background-color: transparent;
}

/*-------------------------------*/
/* Section 6.6 - Contentbox text */
/*-------------------------------*/

/* Heading */
h1 {
	clear: left; margin: 1.0em 0px 1.0em 0px; font-size: 150%;
}

h2 {
	clear: left; margin: 1.5em 0px 1.0em 0px; font-weight: bold; font-size: 140%;
}

h3 {
	clear: left; margin: 1.0em 0px 0.6em 0px;	font-weight: bold; font-size: 130%;
}

h4 {
	clear: left; margin: 0.5em 0px 0.5em 0px;	font-weight: bold; font-style: italic; font-size: 140%;
}

/* Paragraph text */
p {
   clear: left; margin: 0em 0px 0.5em 0px; padding: 0px; font-size: 130%;
}

/* Unordered list */
.content ul {
	margin: 0px 10px 0px 10px; padding: 0px 0px 0px 30px; list-style-type: disc; list-style-position: outside; font-size: 130%;
}

/* Ordered List */
.content ol {
	margin: 0px 10px 0px 17px; padding: 0px 0px 0px 30px; list-style-type: decimal; list-style-position: outside; font-size: 130%;
}

/*----------------------*/
/* Section 6.8 - Images */
/*----------------------*/

/* No border */
.img-left-noborder {
	float: left; margin: 0.3em 7px 3px 0px;
}
.img-center-noborder {
 margin: 0.3em 0px 3px 98px;
}
.img-right-noborder {
	float: right; margin: 0em 0px 3px 7px;
}
.banner { float: right; margin: -100px 0px 3px 7px; clear:left;}
/* Border */
.img-left-border {
	float: left; margin: 0.3em 7px 3px 0px; border: solid 1px rgb(150,150,150);
}

.img-right-border {
	float: right; margin: 0.3em 0px 3px 7px; border: solid 1px rgb(150,150,150);	
}

.footer {
	clear: both; width: 980px; margin: 0em 0px 0px 0px; padding: 5px 0px 5px 0px; border-top: solid 1px  #009966; border-bottom: solid 1px  #009966; background-color: #599B8F; text-align: center;	
}

/***************************************************/
/* SECTION 9 - HYPERLINKS FOR NON-NAVIGATION TEXTS */
/***************************************************/

.content a, .sidebar a {
	color: #330066; text-decoration: none;
}

.content a:hover, .sidebar a:hover {
	color: #FF6600; text-decoration: none;
}

.content a:visited, .sidebar a:visited {
	color: rgb(110,110,110);
}

.footer a {
	color: #330066; text-decoration: underline;
}

.footer a:hover {
	color: #FF6600; text-decoration: none;
}


/********************************/
/* SECTION 10 - GENERIC CLASSES */
/********************************/

/*------------------------------------------*/
/* Section 10.1 - Global default fonts      */
/*------------------------------------------*/
/* Only applied to the main div-statements  */
/* for the basic page regions.              */
/*------------------------------------------*/

.nav-global-font {
	font-size: 1.0em;
}

.nav-main-font {
	font-size: 1.0em;
}

.content-font {
	font-size: 1.1em; line-height: 1.7em; color: #759DA1;
}

.footer-font {
	font-size: 1.1em; color: #FFFFFF;
}

/*--------------------------------------*/
/* Section 10.2 - Horizontal alignments */
/*--------------------------------------*/

.align-left {
	text-align: left;
}

.align-right {
	text-align: right;
}

.float-left {
	float: left;
}

.float-right {
	float: right;
}

/*-------------------------------------*/
/* Section 10.3 - Title decoration box */
/*-------------------------------------*/

.box-on {
	float: left; width: 1.0em; margin-right: 0.2em; padding-left: 0.3em;
}

.box-off {
	display: none;
}

/*---------------------------*/
/* Section 10.4  Text colors */
/*---------------------------*/

/* Basic Colors */
.txt-white {
	color: rgb(255,255,255);
}

.txt-black {
	color: rgb(0,0,0);
}


/******************************/
/* SECTION 11 - MISCELLANEOUS */
/******************************/

/* Horizontal line */
hr {
	clear: both; width: 425px; height: 1px; border: none;
}

/* HTML-code examples */
.showcode {
  font-family: monospace; font-weight: bold; font-size: 13px; color: rgb(255,0,0);
}

/* Hide HTML-tags. Good when no pagestyle supported by browser */
.hide {
	display: none;
}

br {
	clear: both;

/***************************/
/* DHTML GOODIES SLIDESHOW */
/***************************/

}	
	#dhtmlgoodies_slideshow{
		width:940px;	/* Total width of slideshow */


	}
		
	#waitMessage{
		display:none;
		position:absolute;
		left:470px;
		top:620px;
		background-color:#FFF;
		border:3px double #000;
		padding:4px;
		color:#555;
		font-size:1.1em;
		font-family:arial;	
	}	
	#previewPane{	/* Height of big DIV where the large image is showing */
	
		border:1px solid #759DA1;
		margin-right:10px;	
		text-align:center;
		vertical-align:middle;
		padding:30px 20px 0px 20px;	/* 30 pixel space above images */
		
		
		/* CSS HACK */
		height: 492px;	/* IE 5.x */
		height/* */:/**/460px;	/* Other browsers */
		height: /**/488px;
		
		width:760px;	/* Width of preview */		
		float:left;	/* To get the filmstrip and large image side by side */
	}
		
	#galleryContainer{	/* Big Div surrounding up image, list of images and down image */
		float:left;	/* Floating */
		
		/* CSS HACK */
		height: 494px;	/* IE 5.x - 120 px + 2 px for borders and 2px for padding*/
		height/* */:/**/468px;	/* Other browsers */
		height: /**/515px;
		
		/* CSS HACK */
		width: 124px;	/* IE 5.x - 120 px + 2 px for borders and 2px for padding*/
		width/* */:/**/120px;	/* Other browsers */
		width: /**/120px;
				
		border:1px solid #759DA1;	/* Black border */		
		padding:1px;	/* A little space between the black border and the content inside */
		
	}
	#galleryContainer #arrow_down{	/* Arrow down image */
		height:35px;
	}
	#galleryContainer #arrow_up{
		height:35px;	/* Arrow up image */
	}
	
	#theImages{	/* DIV where the images are located */
		position:relative;
		overflow:hidden;
		height:445px;	/* Height of boxes for the images */

	}
	#theImages div{	
		position:relative;	/* Don't change this */
		height:1500px;	/* Higher than total height of thumbnails */
		
	}
	#theImages img{
		border:0px;	/* No border */
		filter:alpha(opacity=50);	/* Transparency - IE */
		opacity:0.5; /* Transparency - Firefox */
		padding-top:1px;	/* Space between images */
		
		
	}
	
	#previewPane #largeImageCaption{	/* CSS styling of image caption below large image */
	text-align:center;
	color: #759DA1;
	font-size: 130%;
				
	}
	#theImages .imageCaption{
		display:none;
	}

#imageSlideshowHolder{

		/* This is a CSS hack in order to get a nice look in IE 5.5 and lower 

		In these versions of Internet Explorer, we need to add borders and padding to the width. In this example, we have a 3 pixel
		border on all sides. This means that the width in IE5.5 should be 606 pixels(600 + border 3px on the left + border 3 px on the right). Height
		should be set to 456 pixels(450 + 3 +3). IE 5.5 will ignore the width attributes below the first line. These will be applied to other browsers.

		*/
		/* CSS HACK */
		width: 606px;	/* IE 5.x */
		width/* */:/**/600px;	/* Other browsers */
		width: /**/600px;
		
		/* CSS HACK */
		height: 456px;	/* IE 5.x */
		height/* */:/**/450px;	/* Other browsers */
		height: /**/450px;
		
		background-color:#ffffff;
		border:1px solid #759DA1;
		position:relative;	/* Never change this value */
		
	}
	.imageInGallery{		
		width:600px;
		height:450px;
		background-color:#ffffff;
		
		/* Never change these 3 value */
		left:0px;
		top:0px;
		position:absolute;	
	}
	
	
	#imageSlideshowHolder img{
		position:absolute;
	}
