/* 
* ---------------------------------------
*	Ecopsis SA - Main Stylesheet
* --------------------------------------- 
*/
body { font-family: Verdana,Arial,Helvetica,sans-serif; background-color: #d6dadd; overflow: scroll; }
/*body { background-image: -webkit-gradient(lenear, 0 0, 300 300, from(#ffffff), to(#000000)); }*/
.fixclear { clear:both; }

#main { width: 920px; margin: 3px auto;  }

/* ---------->> BG-IMAGE <<---------- */
#header, #header .wrapper,
#footer, #footer .wrapper { background: #d6dadd url(../images/bg_topbot.gif) no-repeat 0 0; }
#header { background-position: 100% 0; }
#header .wrapper { background-position: 0 0; }
#footer { background-position: 0 100%; }
#footer .wrapper { background-position: 100% 100%; }

#center, #center .wrapper { background: #d6dadd url(../images/bg_mid.gif) repeat-y 0 0; }
#center { background-position: 0 0; padding-left: 16px;  }
#center .wrapper { background-position: 100% 0; padding: 0px 17px 0 0;  }

/* ---------->> HEADER <<---------- */
#header { padding-right: 16px; }
#header .wrapper { padding: 11px 0 0 17px;  height: 177px; position: relative; }
#header h1, #header .slogan { display: none; }
#ecopsis-logo { padding: 20px 0 0; height: 156px; width: 232px; float: left; position: relative; }
#ecopsis-logo .locale { color:#0072BA; font-size:14px; font-family:Verdana,Arial,sans-serif; letter-spacing:0.11em; font-weight: normal; 
	position:absolute; left: 234px; top:152px; }
#header .banner-graphics { position: relative; }
#header .banner-graphics img { float: right;  }

#language-selector { color: #C2DFEF; height: 20px; font-size: 11px; margin: 0px 250px 0 0; }
#language-selector ul { float: right; padding: 0; margin: 1px 0 0; }
#language-selector li { list-style: none; float: left; border-right: solid 1px #fff; }
#language-selector li.last { border: none; }
#language-selector li a,
#language-selector li span { display: block; line-height: 1.1em; text-decoration: none; color: #C2DFEF; padding: 0 5px; }
#language-selector li a:hover { color: #FF0; background-color: inherit; text-decoration: underline; }
#language-selector li span.selected { text-decoration: underline; color: #FFF; }

#i18n-selector { position: absolute; top: 10px; right: 5px; }
#i18n-selector li { float: left; }
#i18n-selector a { color: #fff; text-decoration: none; font-size: 11px; line-height: 19px; padding: 2px 0 2px 28px; margin: 0; }
#i18n-selector a:hover span { color: #FF0; text-decoration: underline; cursor: pointer;}
#i18n-selector .selected a:hover, #i18n-selector .selected a:hover span { color: #FFF; text-decoration: none; cursor: default; }
#i18n-selector a, #i18n-selector a span { background: url(../images/locale_mnu.png) 0 0 no-repeat; }
#i18n-selector a span { padding: 2px 6px 2px 0px; }
#i18n-selector a.ch { background-position: 0 0; } #i18n-selector a.ch span { background-position: 100% 0; }
#i18n-selector .selected a.ch { background-position: 0 -19px; } #i18n-selector .selected a.ch span { background-position: 100% -19px; }
#i18n-selector a.intl { background-position: 0 -38px; } #i18n-selector a.intl span { background-position: 100% -38px; }
#i18n-selector .selected a.intl{ background-position: 0 -57px; } #i18n-selector .selected a.intl span { background-position: 100% -57px; }


/* ---------->> FOOTER <<---------- */
#footer { padding-left: 16px; color: #fff; font-size: 11px; text-align: center; }
#footer .wrapper { padding: 8px 17px 0 0; height: 28px; }
#footer hr { display: none; }
#footer .vcard { background-color: #0767B1; padding: 0; line-height: 18px; }
#footer a { color: #fff; text-decoration: none; }
#footer a.email:hover { text-decoration: underline; }

/* ---------->> Navigation Bar <<---------- */
#navigation-bar { height: 35px; }
#main-navigation { background: url(../images/nav-bg.gif) 0 0 repeat-x; height: 33px; border-right: solid 1px #8EA4AF; }
#main-navigation li { float: left; height: 38px; }
#main-navigation li.first { border-left: none;  }
#main-navigation li.last  { border-right: none; }

#navigation-bar li a { 
	display: block; width: 105px; padding: 2px 0 2px; height: 34px; line-height: 30px; 
	color: #0a344b; text-decoration: none; font-size: 12px; text-align: center;
	background: url(../images/nav-but.png) 0 0 no-repeat; 
}
#navigation-bar li.long_menu_item a { line-height: 13px; }
#navigation-bar li a:hover { background-position: 0 -76px; }
#navigation-bar li a.selected,
#navigation-bar li a.selected:hover{ background-position: 0 -38px; }
#navigation-bar li.first a { background-position: -105px 0; }
#navigation-bar li.first a:hover { background-position: -105px -76px; }
#navigation-bar li.first a.selected { background-position: -105px -38px; }
#navigation-bar li.last a { background-position: -210px 0; }
#navigation-bar li.last a:hover { background-position: -210px -76px; }
#navigation-bar li.last a.selected { background-position: -210px -38px; }


/* ---------->> CONTENT <<---------- */
#content {
	font-family: Verdana,Arial,Helvetica,sans-serif;
	font-size: 11px;
	color: #222;
	padding: 10px 20px;
	position: relative;
}

#content h2 { color:#0767B1; font-size:13px; letter-spacing: 0.05em; font-weight:bold; height: 24px; line-height: 22px; padding-left: 20px; margin-bottom: 7px; background: url(../images/title-bullet.gif) 0 50% no-repeat; }
#content h3, 
#content h4 { color: #0767B1; font-weight: bold; margin: 20px 0 0px; }


#content p { margin: 10px 0 5px; line-height: 1.25em; }
#content strong { font-weight: bold; color: #333; }

#content a, #content a.link, #content a:visited { color: blue; }
#content a.pop-up { text-decoration: none; color: #0767B1; font-weight: bold; }
#content a:hover { text-decoration: underline; }

#content ul { padding: 0 100px 0 0px; }
#content ul li { margin: 5px 0 10px 15px; padding-left: 15px; line-height: 1.25em; background: url(../images/ul-bullet.gif) 0 0.4em no-repeat; }

#content th, 
#content td { vertical-align: top; }

#content .clearfix { clear: both; }

#ref-table { border-collapse: separate; border-spacing: 1px; border: solid 1px #B0B0B0; width: 100%; margin: 0; }
#ref-table thead tr th { padding: 4px 14px 4px 6px; width: 50px; line-height: 1em; vertical-align: middle; }
#ref-table thead tr th.completion { width: 35px; }
#ref-table thead tr th.description { width: auto; }
#ref-table tbody tr td.description { line-height: 1.2em; }

#ref-table tr.highlight td { background-color: #EEF; }
#ref-table .editable { width: 30px; }
#ref-table .editable a { color: #333; text-decoration: none; font-size: 11px; font-weight: bold; }
#ref-table .editable a:hover { color: red; }
#ref-table .editable .refnum { text-align: center; padding: 3px 0; margin-top: 7px; background: #E6EEEE;  }

#ref-table .editable .edit,
#ref-table .editable .delete { display: block; float: left; width: 16px; height: 16px; margin: 0 5px 5px 0;  }
#ref-table .editable .edit { background: url(images/application_form_edit.png) 0 0 no-repeat; }
#ref-table .editable .delete { background: url(images/application_form_delete.png) 0 0 no-repeat; }
#ref-table .editable .edit span,
#ref-table .editable .delete span  { display: none; }

.ui-filterable-query { position: absolute; top: 10px; right: 20px; font-size: 11px; height: 24px; line-height: 22px; }
.ui-filterable-query input { font-size: 11px; margin-left: 7px; }

.ui-filterable-options-box { display: none; border: solid 1px #777; border-color: #777 #AAA #DDD; background-color: #F2F2F2; padding: 4px; }
.ui-filterable-options-box label { float: left; width: 100px; margin: 14px 0 0 12px; font-size: 10px; color: #999; }
.ui-filterable-options-box select { float: right; font-size: 10px; }
.ui-filterable-options-button { font-size: 10px; color: #0767B1; }

#staff { margin-top: 12px; }
#staff .vcard { 
	margin: 0 120px 15px 0px; padding: 5px 20px 5px 5px; font-size: 13px; position: relative;
	border: solid 1px #999; border-color: #E0E0E9 #C0C0C9 #999 #C0C0C9; background: #F8F8FA;
}

#staff .vcard .org { display: none; }
#staff .vcard .photo { float: left; display: block; height: 145px; width: 109px; margin: 0 15px 0 0; border: solid 1px #666;  }
#staff .vcard .name { margin-top: 0px; }
#staff .vcard .fn { font-weight: bold; font-size: 115%; line-height: 2em; letter-spacing: 0.03em; color: #164364; }
#staff .vcard .role { }
#staff .vcard .email { }
#staff .vcard .description { margin-top: 13px; margin-left: 126px; line-height:1.2em; text-align:justify;}


/* Login / Logout */
#main-navigation li.logout { float: right; }
#main-navigation li.edit   { float: right; }
#main-navigation li.edit a { height: 28px; }

#content .vcard p { margin: 4px 0 4px; padding: 0;}
.vcard .adr { line-height: 1.35em; margin: 7px 0; }
#footer .vcard .adr { margin: 0; line-height: 1; }
#center .vcard .postal-code, #center .vcard .locality { font-size: 110%; line-height: 1.6em; }
.vcard .email, .vcard .url { color: blue; }
.vcard a.url:link, .vcard a.url:visited { color: blue; }
.vcard .photo { border: solid 1px #999; }