/* 
FUTURE
http://www.w3.org/Style/CSS/current-work

SELECTORS
http://www.w3.org/TR/1999/WD-CSS3-selectors-19990803
http://www.geocities.com/seanmhall2003/css3/compat.html

LISTS
http://css.maxdesign.com.au/

HACKS
http://centricle.com/ref/css/filters/
http://w3development.de/css/hide_css_from_browsers/

IE 5 MAC
http://www.l-c-n.com/IE5tests/

REFERENCES
(0) http://leftjustified.net/journal/2004/10/19/global-ws-reset/
(1) http://www.andybudd.com/archives/2004/02/css_crib_sheet_3_centering_a_div/index.php
(2) http://css-discuss.incutio.com/?page=BoxModelHack 
(3) http://positioniseverything.net/easyclearing.html
(4) http://www.kryogenix.org/code/browser/lir/
(5) http://css.maxdesign.com.au/listamatic/horizontal32.htm
(6) http://www.alistapart.com/articles/accesskeys/
(7) http://www.sam-i-am.com/work/sandbox/css/mac_ie5_hack.html
(8) http://www.info.com.ph/~etan/w3pantheon/style/starhtmlbug.html
(9) http://www.alistapart.com/articles/goingtoprint/
*/


/* Global White Space Reset (0) */
* {
	margin: 0;
	padding: 0;
}


body 
{
	background-color: #E5E5E5;
	text-align: center;
    height: 100%; 
	min-width: 735px; /* for N6+ margin:auto quirk (1) */
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #444;
}

/* LAYOUT */

#page_container
{

	/* border: 0px solid #AA0000; *//*for debug  */

    margin: 4px auto 100px;    /* (top right/left bottom) or (top right bottom left) */
	padding: 0px 0px 80px 0px; /* (top right/left bottom) or (top right bottom left) */
       
 	background: #E5E5E5 url(resources/page_footer.gif)  left bottom no-repeat; 
 	width: 735px !important; /* for most browsers */
	width /**/:735px; /* for IE5.5's bad box model */
	
	text-align: left;	
}

#page 
{
	/* border: 0px solid #AA0000; *//*for debug  */

	margin: 0;
	padding: 20px 35px 0px 20px;
	background: #FFFFFF url(resources/page_border.gif) left top repeat-y;
	text-align: left;
	width: 680px !important; /* for most browsers */
	
	
	/* Alternate BMH 3 (2) */
}

/* Auto clearing (3) */


#page:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}





#main
{
	display: block;
	float: left;
	width: 100%;
	margin: 0px 0px 0px;
	
	/* border: 0px solid #AA0000; *//*for debug  */
}


#content 
{
	margin-top: 0px;
	margin-left: 15px;
	border: 0px solid #AAA;
	float: right;
	width: 495px;
	min-width: 495px;
	padding-left: 0px;

}
/* This is to allow for the hr (6px) on MAC IE5 */
/* commented backslash hack v2 (7) \*/
#content {
	margin-top: 0px;
}
/* end hack */
	
#index #content {
	float: left;
	width: 100%;
	margin-top: 0;
}

#index #about, #index #news, #index #whs, #index #committees, #index #intachuk, #index #membership, #index #contact, #index #links, #index #newsitems, #index #committeemembers, #index #committeeresources {
	width: 48%;
	margin-top: 20px;
}
#index #about, #index #news, #index #newsitems, #index #committeemembers {
	margin-top: 0;
}
#index #about, #index #whs, #index #intachuk, #index #contact, #index #newsitems, #index #committeeresources {
	float: left;
}
#index #news, #index #committees, #index #membership, #index #links, #index #committeemembers {
	float: right;
}
#index #whs, #index #intachuk, #index #contact, #index #committeeresources {
	clear: left;
}

#footer {

	/* border: 0px solid #AA0000; *//*for debug  */

	float: left;
	width: 100%;
	margin-top: 20px;
	padding-top: 8px; 
	border-top: 1px solid #E5E5E5;
	text-align: center;	
}

/* HEADERS */

h1, h2, h3, h4 
{
	font-family : "Times New Roman", Times, serif;
	font-weight: normal;
	color: #444;
}

h1 
{
	font-size: 18px;
	line-height: 20px;
	word-spacing: -1px;
	margin-bottom: 8px;
}

h2 {	
	font-size: 16px;
	line-height: 18px;
	margin-top: 160px;
	margin-bottom: 8px;
}

h3 {
	font-size: 14px;
	line-height: 16px;
	margin-top: 16px;
	margin-bottom: 8px;
}

h4 {
	font-size: 12px;
	line-height: 14px;
	margin-top: 14px;
	margin-bottom: 8px;
}


/* Lir image replacement technique (4) */
#index #logo h1, #about #logo h1, #news #logo h1, #whs #logo h1, #committees #logo h1, #intachuk #logo h1, #membership #logo h1, #contact #logo h1, #links #logo h1, #notfound #logo h1, #newsitems #logo h1, #committeemembers #logo h1, #committeeresources #logo h1 {
   	padding-top: 46px;
	overflow: hidden;
	background-image: url(/img/icomos-uk.gif);
	background-repeat: no-repeat; 
	height: 0px !important; /* for most browsers */
	height /**/:46px; /* for IE5.5's bad box model */
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: lowercase;
	font-size: 30px; /*32*/
	font-weight: normal;
	letter-spacing: -1px;
}

/* Lir image replacement technique (4) */
#about h1, #news h1, #whs h1, #committees h1, #intachuk h1, #membership h1, #contact h1, #links h1, #notfound h1, #newsitems h1, #committeemembers h1, #committeeresources h1 {
	padding-top: 20px;
	overflow: hidden;
	background-repeat: no-repeat;
    height: 0px !important; /* for most browsers */
	height /**/:20px; /* for IE5.5's bad box model */
}
#about h1 {background-image: url(/img/headers/about.gif);}
#news h1 {background-image: url(/img/headers/news.gif);}
#whs h1 {background-image: url(/img/headers/whs.gif);}
#committees h1 {background-image: url(/img/headers/committees.gif);}
#intachuk h1 {background-image: url(/img/headers/intachuk.gif);}
#membership h1 {background-image: url(/img/headers/membership.gif);}
#contact h1 {background-image: url(/img/headers/contact.gif);}
#links h1 {background-image: url(/img/headers/links.gif);}
#notfound h1 {background-image: url(/img/headers/404.gif);}
#newsitems h1 {background-image: url(/img/headers/news_items.gif);}
#committeemembers h1 {background-image: url(/img/headers/committee_members.gif);}
#committeeresources h1 {background-image: url(/img/headers/committee_resources.gif);}


/* PARAGRAPHS */

p {
	font-size: 11px;
	line-height: 16px;
	margin-bottom: 6px;
}
em {
	color: #9DB61F; 
}


hr {
	clear: both;
	visibility: hidden;
}
/* commented backslash hack v2 (7) \*/
hr {
	display: none;
}
/* end hack */

#content hr {
    clear: none;
    border: solid #E5E5E5;
    border-width:0px 0px 1px 0px;
	visibility: visible;
	display: block;

}



/* LISTS */

ol, ul, li {
	/* list-style-type: none; */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 16px;
}

#nav1 li {
	display: inline;
}
#nav1 li.on {
	display: none; /* Hide turn style on link */
}
/* Fat Erik 5s Simple Pipe List (5) */
#nav1 li:before { 
	content: "| "; 
}
#nav1 li:first-child:before { 
	content: ""; 
}

#nav2 ul {
	border-bottom: 1px solid #F3F3F3;
}
	
#content ul {
	margin-bottom: 20px;
}
#content li {
	list-style-type: disc;
	list-style-image: url(/img/bullet.gif);
	margin-left: 16px;
}

#content #nav3 ul {
	width: 100%;
	margin-bottom: 0;
}
#content #nav3 li  {
	list-style-type: none;
	margin-left: 0;
	display: block;
	float: left;
	width: 33%;
	line-height: 20px;
}
/* Auto clearing (3) */
#content #nav3 ul:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
#content #nav3 ul {display: inline-table;}
/* Hides from IE-mac \*/
* html #content #nav3 ul {height: 1%;}
#content #nav3 ul {display: block;}
/* End hide from IE-mac */

#content #nav4 ul {
	width: 100%;
	margin-bottom: 0;
}
#content #nav4 li  {
	list-style-type: none;
	margin-left: 0;
	display: block;
	float: left;
	width: 33%;
	line-height: 20px;
	text-align: center;
}
/* Auto clearing (3) */
#content #nav4 ul:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
#content #nav4 ul {display: inline-table;}
/* Hides from IE-mac \*/
* html #content #nav4 ul {height: 1%;}
#content #nav4 ul {display: block;}
/* End hide from IE-mac */


#nav_head
{
	display: block;
	float: left;
	width: 100%;
	margin: 0px 0px 20px;
	
	/* border: 0px solid #AA0000; *//*for debug  */

}

#nav_head #nav_meta
{
	/* border: 0px solid #AA0000; *//*for debug  */

	float: left;
}

#nav_head #nav_lang
{
	/* border: 0px solid #AA0000; *//*for debug  */

	float: right;
	text-align: right;
}

#nav_head ul { width: 325px; margin: 0 0; }
#nav_head li { color: #4D4D4D; display: inline;}
#nav_head li:before { content: " | "; }
#nav_head li:first-child:before { content: ""; }

#nav_head a:link {color: #4D4D4D;	text-decoration: none;}
#nav_head a:visited {color: #4D4D4D; text-decoration: none;}
#nav_head a:hover {color: #9DB61F; text-decoration: none; }
#nav_head .act a:link {color: #9DB61F;	text-decoration: none;}
#nav_head .act a:visited {color: #9DB61F;	text-decoration: none;}
#nav_head .hid a:link {display: none; color: #AAA;	text-decoration: none;}
#nav_head .dis span {color: #AAA; text-decoration: none;} 




#nav_main
{
	/* border: 0px solid #AA0000; *//*for debug  */

	float: left;
	width: 165px;
	margin: 0px 0px 20px;
}


#nav_main ul 
{
	/* border: 0px solid #AA0000; *//*for debug  */
	
	width: 160px; 
	margin: 0 0;
}


#nav_main a:link {color: #4D4D4D; text-decoration: none;}
#nav_main a:visited {color: #4D4D4D; text-decoration: none;}
#nav_main a:hover {color: #9DB61F; text-decoration: none;}
#nav_main *.act a:link {color: #9DB61F; text-decoration: none;}
#nav_main *.act a:visited {color: #9DB61F; text-decoration: none;}
#nav_main *.hid a:link {display: none; color: #4D4D4D; text-decoration: none;}


#nav_main li#nav_main_level1 
{ 
	list-style-type: none;
	font-size: 12px;
	padding: 0px 0px 4px 0px;
	border: 0px solid #AAA;
	width : 155px;
}

#nav_main li#nav_main_level2 
{ 
	list-style-type: none;
	font-size: 11px;
	padding: 0px 0px 4px 5px;
	border: 0px solid #AAA;
	width : 150px;
}

#nav_main li#nav_main_level3 
{ 
	list-style-type: none;
	font-size: 11px;
	padding: 0px 0px 4px 10px;
	border: 0px solid #AAA;
	width : 145px;
}

#nav_main li#nav_main_level4 
{ 
	list-style-type: none;
	font-size: 11px;
	padding: 0px 0px 2px 15px;
	border: 0px solid #AAA;
	width : 140px;
}


#nav_main li#nav_main_level5 
{ 
	list-style-type: none;
	font-size: 11px;
	padding: 0px 0px 2px 20px;
	border: 0px solid #AAA;
	width : 135px;
}



#footer ul {
	width: 490px;
	margin: 0 auto;
}
#footer li {
	color: #B2B2B2;
	display: inline;
}
/* Fat Erik 5s Simple Pipe List (5) */
#footer li:before { 
	content: "| "; 
}
#footer li:first-child:before { 
	content: ""; 
}


/* DEFINITION LISTS */
dl {
	font-size: 11px;
	line-height: 16px;
	margin-bottom: 20px;
}
dt {
	color: #9E9E8A;
	margin-top: 10px;
}
dd {
	margin-left: 20px;
}


/* LINKS */

/* Unlocking Hidden Navigation (6) */
/*
a[accesskey]:hover:after, a[accesskey]:focus:after {
	content: " [" attr(accesskey) "] ";
}
*/

a:link {color: #007297; text-decoration: none;}
a:visited {color: #007297; text-decoration: none;}
a:hover {color: #007297; text-decoration: none;}

/* Could be a nice feature to visually differentiate links */
/* a[rel="external"]:after{} */
/* a[rel="download"]:after{} */

#nav1 a:link {color: #666; text-decoration: none;}
#nav1 a:visited {color: #666; text-decoration: none;}
#nav1 a:hover {color: #FFF; text-decoration: none; background-color: #B2B2B2;}

#nav2 a {
	display: block;	
	border-top: 0px solid #F3F3F3;
	background-color: #fff;
	color: #666;
	text-decoration: none;
	/* Alternate BMH 3 (2) */
	padding: 8px 2px;
	width: 176px !important;
	width /**/:180px; 
}
#nav2 a:hover {
	background-color: #F5F5F5; 
	color: #000;
}
#nav2 a.active {
	font-weight: bold;
	text-decoration: none; 
	color: #9DB61F; 
	background-color: #FFF;
}
#nav2 a.active:hover {
	color: #9DB61F;  
	background-color: #FFF;
}


#footer a:link {color: #B2B2B2;	text-decoration: none;}
#footer a:visited {color: #B2B2B2; text-decoration: none;}
#footer a:hover {color: #9DB61F; text-decoration: none;}

#banner_head 
{ 

	/* border: 0px solid #AA0000; *//*for debug  */

	display: block;
	width: 100%;
	border-bottom: 4px solid #9DB61F;
	margin: 0px 0px 4px;
	background-color: #FFF;
	background-repeat: no-repeat;
	background-position: left top;
	# background-image: url(resources/icomos.ch_banner0001.jpg);
	padding: 0px;
	height: 85px; 
}

#logo 
{
	display: block;
	width: 100%;
	clear: both;
    margin: 0px 0px 10px;
    
    /* border: 0px solid #AA0000; *//*for debug  */

	/* Lir image replacement technique (4) */
	padding-top: 0px;
	overflow: hidden;
	background-color: #FFF; 
	background-repeat: no-repeat;
	background-position: right top;
	background-image: url(resources/icomos.ch_logo.gif);
    height: 75px ;  /* for most browsers */
	/* height /**/:84px; /* for IE5.5's bad box model */		
}

#logo 
{
	float: none;
}

#logo_text 
{
	display: none;
	border: 1px solid #AAA;
}


#banner 
{
	display: block;
	width: 100%;
	/* clear: both; */
    margin: 100px 0 20px;
    border: 100px solid #AAA;
	/* Lir image replacement technique (4) */
	/*  padding-top: 84px; */
	/* overflow: hidden; */
	background-color: #9DB61F; 
	background-repeat: no-repeat;
	background-position: left top;	
    height: 0px !important; /* for most browsers */
	height /**/:84px; /* for IE5.5's bad box model */		
}

/* commented backslash hack v2 (7) \*/

#banner 
{
	/* float: none; */
}
/* end hack */



/* TABLES */
table {
	margin-top: 20px;
	margin-bottom: 20px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 11px;
	width: 100%;
}
th {
	font-weight: normal;
	color: #9E9E8A;
}
td {
	vertical-align: top;
	padding: 3px 10px 3px 0;
	border-top: 1px solid #E5E5E5;
}


/* FORMS */
form {
	margin-bottom: 20px;
}
select {
	font-family : "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size : 11px;
	color : #333;
	width: 100%;
}
input, textarea {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #333;
	border: none;
	border-left: 1px solid #F3F3F3;
	padding: 5px 0 5px 5px;
	width: 434px;  /* content width (460px) - dd margin (20px) - input,textarea border (1px) - input,textarea padding (5px) */
}	
textarea {
	overflow: auto;
}

/* input[type="submit"], input[type="file"] */
.submit, .file {
	width: 100px;
	padding: 0;
	border: 1px solid #F3F3F3;
}
/* input[type="checkbox"] */
.checkbox {
	width: auto;
	border: none;
}
.highlight {
	border: 1px solid #9DB61F;
	width: 50%;
}

/* IMAGES */
img {
	border: 0;
	vertical-align: middle;
}
.img {
	margin-bottom: 20px;
}
.img img {
	background-image: url(/img/bg.gif);
	border-top: 1px solid #9DB61F; 
	border-bottom: 1px solid #9DB61F; 
}

.caption {
	background-color: #9DB61F; 
}
.caption:before {
	content: "Caption: ";
}