@import url(forms.css);
@import url(editor.css);

/* ######################################### STYLESHEET RESET ### */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
ul, ol {margin: 0.5em 0 0.5em 2em;}
:focus { outline: 0;}
.clear { clear:both; }
span.clear { display:block;}
.hidden { position:absolute; margin-left:-200000px; left:-200000px; top:-200000px;}
#mobile_name { display:none; }
a:link { color: #009; text-decoration:none; font-weight:bold;}
a:visited { text-decoration:none; font-weight:bold;}
a:hover { text-decoration:underline; font-weight:bold;}
a:active { text-decoration:underline; font-weight:bold;}
h2, h3, h4, h5, h6 {font-size: 1.3em; font-weight:normal; margin:0; padding:0;}
img {vertical-align:middle;}

.first { font-size: 1.2em; }

a:link {color: #039; text-decoration: none; font-weight: bold;}
a:visited {color: #60c; text-decoration: none; font-weight: bold;}
a:hover {color: #000; text-decoration: underline; font-weight: bold;}
a:active {color: #039; text-decoration: underline; font-weight: bold;}
a:focus {color: #333; text-decoration: underline; font-weight: bold;}

/* ######################################## BASIC LAYOUT ### */
body { font-size: 80%; font-family: Helvetica, Arial, Verdana, sans-serif; color: #333; padding:0; margin:0; line-height: 1.5; background: #fff url(./css_img/body_tile.gif) repeat-y 72em 0em; }
body > html {font-size: 12px;}

#wrapper { max-width: 72em; min-width: 50.75em;}
#container { clear: both; padding: 0 18px 0 10px; overflow: auto; }

/* ###################################### HEADER ELEMENTS */
#header  {position: relative; padding-bottom: 11.6em; margin:0;}
 
div.pseudoH1 a, #header h1 { display: block; width: 147px; height: 103px; position: absolute; top: 30px; left: 4px; }
div.pseudoH1 a span, #header h1 span, #header form label {position: absolute; margin-left: -1999px;}
div.pseudoH1 a:link, div.pseudoH1 a:visited, #header h1 {background: url(./css_img/logo.gif) no-repeat top left;}
div.pseudoH1 a:hover, div.pseudoH1 a:active {background: url(./css_img/logo.gif) no-repeat bottom left;}

p.access, p.users {color: #666; font-size: .9em;}
.access {position: absolute; top: 5px; left:20%;}
.users {position: absolute; top: 5px; right:0px;}

#header form {position: absolute; top: 0px; right:0px; width: 40%; height: 118px; border-top: 1px solid #fff;background: url(./css_img/xsearch_tile.gif) repeat-x top left; text-align: right;}

#header input.field {position: absolute; top: 2.2em; right: 6em; border: 1px solid #fff; color: #666; padding: 4px; background: #fff;}

#container #header input.button {outline: none; position: absolute; top: 2.2em;right: 1em; border: 1px outset #666; background: #E9ECF2; color: #666; padding: 3px; color: #333; font-weight: bold;}
#header form a { clear: both; color: #fff; font-size: .9em; display: block; font-weight: normal; margin:5em 1.1em 0 0;}

div#image_wrapper {background: url(./css_img/search_tile.gif) repeat-x top left; border-top:1px solid #ccc; border-bottom: 5px solid #999; height:118px; width:80.2%; position: absolute; top: 1.8em; right: 0;}
div#randomimage {background: url(./css_img/rand1.jpg) no-repeat top left;border-top: 1px solid #fff; width: 456px; height: 118px; position: absolute; top: 0px; left:0px;}

#header ul {position: absolute; bottom:0px; right:1em; margin:0; padding:0;}
#header ul li {display: inline; list-style-type: none; margin:0; padding:0; float: left; }
#header ul li a { float: left; padding: 0 0 0 2px; border-bottom: 1px solid #fff; color: #fff; font-weight: normal; background: url(./css_img/tab_l.gif) no-repeat left top; margin:0 0 0 1px; }
#header ul li a span { display: block; padding: 4px 6px 0 6px; background: url(./css_img/tab_r.gif) no-repeat right top; }
#header ul li a span.end { background: url(./css_img/tab_re.gif) no-repeat top right; }
#header ul li.active a { color: #eee; cursor: default;  padding: 0 0 0 2px; border-bottom: 1px solid #999; background: url(./css_img/tabact_l.gif) no-repeat left top; }
#header ul li.active a:hover, #header ul li.active a:active { text-decoration: none; }
#header ul li.active a span { display: block; padding: 4px 6px 0 6px; background: url(./css_img/tabact_r.gif) no-repeat right top; }
#header ul li.active a span.end { background: url(./css_img/tabact_re.gif) no-repeat top right; }

/* ###################################### COLUMN */
#navigation { background: #fff url(./css_img/nav_tile.gif) repeat-y top right; width: 17.2%; float: left; padding-right: 9px; margin: 0 0 12px 0; }
#navigation dl { font-size: .86em; padding: 5px; border-bottom: 5px solid #ccc;  background: #eee; }
#navigation dl dt { position: absolute; margin-left: -1999px; }
#navigation dl a { font-weight: normal; }

#navigation ul.topwidget {border-top: 5px solid #093E97;font-size: 1em;}
#navigation ul { margin:0; padding:1px 0 0 0; border-top: 5px solid #ccc; font-size: .9em;}
#navigation ul li { list-style-type: none; margin:0; padding:0 0 1px 0; line-height: 1.3; }

#navigation ul li a {  display: block; background: #DFE9FA; padding: 3px 4px 0 6px; }
#navigation ul li a:link { color: #333; background: #DFE9FA; border-bottom: 1px solid #D0DFF8;}
#navigation ul li a:visited { color: #666;border-bottom: 1px solid #D0DFF8; text-decoration: none;}
#navigation ul li a:hover, #navigation ul li a:active { text-decoration: none; color: #000; background: #D0DFF8; border-bottom: 1px solid #C6D2E4;}

#navigation form {margin:0; padding: 5px 5px 10px 5px; border-top: 5px solid #ccc; border-bottom: 5px solid #ccc; background:#eee; text-align: left;}
#navigation form select {float: left; border: 1px solid #666; font-size: .9em; padding: 0; width: 72%; margin-right: 5px;}
#navigation form .button { font-size: .9em; }
#navigation form option { padding:2px; margin: 0 3px; border-top: 1px solid #ccc; cursor: pointer; width: 15em; }

/* Left */
#navigation .supplement {margin: 0 0 1px 0; padding:5px 6px; background: #E3F1E0; clear:left; border-bottom: 5px solid #55B145; font-size: .9em;}
#navigation .supplement h2 {margin:0; padding: 2px 0 0 0;font-size: 1.2em; font-weight: bold; }
#navigation .supplement p { margin: 3px 0; padding:0; }
#navigation .supplement img {margin: 0 5px 5px 0;}

#navigation .featureAdvert {margin: 6px 0 0 0; padding: 0; text-align: center; clear: both;}
#navigation .featureAdvert img { padding: 1px; border: 1px solid #ccc; margin-bottom: 2px; }
#navigation .featureAdvert p { font-size: .9em; padding:2px 4px 0px 4px; margin:0; background: #DFE9FA; line-height: 1.1; }

/* ###################################### CONTENT */

#content { margin-top: 22px; width: 80.2%; float: right; overflow:hidden;}

#content h1 {font-size: 1.8em; font-weight: normal; margin:0 0 14px 0; padding:0;}
#content h2 {font-size: 1.6em; font-weight: normal; margin:0 0 .8em 0; padding:0;}
#content h3 {font-size: 1.5em; font-weight: normal; margin:0 0 .8em 0; padding:0;}
#content h4 {font-size: 1.4em; font-weight: normal; margin:0 0 .8em 0; padding:0;}

#content h2.altHeading, #content h3.altHeading {  margin:30px 0 0 0; padding: 0 0 0 20px; background: url(./css_img/arw_red.gif) no-repeat 0px 5px; font-size:1.4em; }
#content h2.heading, #content h3.heading {  margin:10px 0 0 0; padding: 0 0 10px 20px; background: url(./css_img/arw_grn.gif) no-repeat 0px 5px; font-size:1.4em; }

#content p { line-height: 1.4; margin-bottom: .8em; }
#content p.faq { margin: 10px 15px; font-size: 1.1em;}
#content p.date { margin: 10px 0; font-size: 0.9em; color: #666;}
#content p.page_down {  margin: 0 0 22px 0; padding-left: 18px; background: url(./css_img/icon_down.gif) no-repeat 0 0;}
#content p.small {font-size: 0.9em;}
#content p.note { color: #666; margin-top:20px; font-style: italic;}

#content table { margin: 10px 0; width:100%; border-collapse: collapse; background: #DFE9FA; border: 4px double #ccc}
#content table tr { border: 1px solid #fff; background: #DFE9FA}
#content table td { border: 1px solid #fff; background: #DFE9FA; padding: 3px}
#content table th { border: 1px solid #fff; background: #093E97; color: #fff; font-weight: bold;}
#content table th a:link, #content table th a:visited, #content table th a:hover, #content table th a:active { color: #fff; }

#content blockquote { color: #666; font-size: 1.1em; line-height: 1.4; margin-bottom: .9em; margin-left:12px; border-left:2px solid #ccc; padding-left: 12px;}
#content blockquote cite { font-size: .9em; color: #333; font-style: italic; padding-left: 6px;}

#content em { font-style: italic; }
#content strong { font-weight: bold; }

#content ul li { padding: 0 0 10px 0;}
#content ol li { padding: 0 0 10px 0;}

#content #left_box { width: 50%; float: left;}
#content #right_box { width: 45%; float: right;}

#content .info_left { margin:0; padding:0 1%; float:left; width: 47%;}
#content .info_right { margin:0; padding:0 1%; float:right; width: 47%;}

#content ul.list { margin:0 0 10px 12px; padding:0; list-style:none;}
#content ul.list li { font-size: 1.1em; margin: 5px 0; padding: 0 0 0 14px; background: url(./css_img/bllt.gif) no-repeat 0 6px;}
#content ul.list li a span { font-weight: normal; color: #999; }
#content ol.orderd_list { margin: 0 0 10px 30px;}

#content .byEditor ul { list-style-type: none; }
#content .byEditor ul li { background: url(./css_img/bullet.gif) no-repeat 0 7px; padding: 2px 0 2px 10px; }

#content .poll_box { border-bottom: 1px solid #ccc; padding: 10px 0; margin-bottom:10px}
#content .poll_box img { margin: 10px 0; border: 1px solid #ccc; padding: 1px;}

#content .contentimage, #content .main_image, #content .display_box img, #content .lead img {float:right; padding:2px; background: #fff;border:4px double #ccc; margin: 4px 0 20px 20px; width: 170px; }

#wrapper #content img.cllr_img {float:right; padding:2px; background: #fff;border:4px double #ccc; margin: 4px 0 20px 20px; width: 140px;}

#content .display_box, #content .lead {background: #eee; padding: 10px ; border: 6px double #fff; margin: 16px 0 20px 0; }
#content .display_box p {line-height:1.6;}
#content .display_box h2, #content .display_box h3,  #content .lead h2,  #content .lead h3 {margin:.2em 0 .4em 0;}

#content .download_box {padding:10px 20px; margin: 0 0 10px 0; border-bottom: 1px solid #ccc; }
#content .download_box h2, #content .download_box h3 { font-size: 1.3em; font-weight: bold; margin:0 0 5px 0;}
#content .download_box ul { margin: 0; padding: 0; list-style:none;}
#content .download_box ul li { margin: 0 0 5px 15px; padding: 0 0 0 15px; background: url(./css_img/bllt.gif) no-repeat 0 0.35em;}

#content .content_box { clear: both; margin: 0 0 14px 0; padding: 0 0 7px 0; border-bottom: 1px solid #ccc; }
#content .content_box h2 { margin:0 0 8px 0; }

#content .search_result { clear: left; margin: 0 0 14px 0; padding: 0 0 7px 10px; border-bottom: 1px solid #ccc; }
#content .search_result h2, #content .search_result h3 { margin:0 0 8px 0; }

#content .cate_info { clear: both; margin: 0 0 20px 0; border-bottom: 1px solid #ccc; padding-bottom: 12px; }
#content .cate_info h2 { margin:10px 0 0 0; padding: 0 0 10px 20px; background: url(./css_img/arw_grn.gif) no-repeat 0px 5px; font-size:1.4em;  }
#content .cate_info h2 a { font-weight: normal; }
#content .cate_info h2 a:link, #content div.cate_info h2 a:visited, #content div.cate_info h2 a:hover, #content div.cate_info h2 a:active, #content .doc_info h2 a:link, #content div.doc_info h2 a:visited, #content div.doc_info h2 a:hover, #content div.doc_info h2 a:active { 
	color: #333;}

#content .plain_box {margin: 20px 0; background: #DFE9FA; border: 6px double #fff; padding: 10px;}

/* DOCUMENTS */
#content #page_box { padding:20px 0; margin: 50px 0 10px 0 ; border-top:1px solid #ccc; }
#content #page_box h2 {  background: url(./css_img/icon_pages.gif) no-repeat 0 2px; padding-left: 20px; font-size: 1.3em; }
#content #page_box ol { list-style-type: none; margin:0 0 0 20px; padding:0; }
#content #page_box ol li strong { font-weight: normal; background: #666 url(./css_img/pge_arw.gif) no-repeat center right; color: #fff; padding: 3px 8px 1px 3px; }

#content #related { background: #DFE9FA; margin:20px 0; border: 6px double #fff; }
#content #related ul { margin:0; padding:10px; list-style:none; }
#content #related ul li { margin:0 0 10px 0; padding: 0; width:45%; float:left; padding-left: 20px;}

#content .relform {background: url(./css_img/icon_form.gif) no-repeat 0 0; padding-left: 20px;}
#content .reldownload { background: url(./css_img/icon_download.gif) no-repeat 0 0; padding-left: 20px;}
#content .relmeet { background: url(./css_img/icon_meet.gif) no-repeat 0 0; padding-left: 20px;}
#content .reldocs { background: url(./css_img/icon_doc.gif) no-repeat 0 0; padding-left: 20px;}
#content .relnews { background: url(./css_img/icon_news.gif) no-repeat 0 0; padding-left: 20px;}
#content .relevents { background: url(./css_img/icon_event.gif) no-repeat 0 0; padding-left: 20px;}
#content .comment, #content .relfaq { background: url(./css_img/icon_faq.gif) no-repeat 0 0; padding-left: 20px;}

/* CONTACTS */
#content dl.def_list { margin: 0 0 10px 0; }
#content dl.def_list dt { font-size: 1.4em; }
#content dl.def_list dd { margin:0 0 5px 12px; }
#content dl.def_list dd strong { font-size: 1.1em;}

#content .email {background: url(./css_img/icon_email.gif) no-repeat 0 0; padding-left: 20px;}
#content .tel {background: url(./css_img/icon_tel.gif) no-repeat 0 0; padding-left: 20px;}
#content .fax, #content .relprint {background: url(./css_img/icon_print.gif) no-repeat 0 0; padding-left: 20px;}
#content .adr {background: url(./css_img/icon_arrow.gif) no-repeat 0 0; padding-left: 20px;}
#content .user {background: url(./css_img/icon_user.gif) no-repeat 0 0; padding-left: 20px;}

#content ul#breadcrumb { font-size: .9em; color: #666; clear: both; margin: 0 0 14px 0; padding: 0 0 5px 0; border-bottom: 2px solid #ccc; }
#content ul#breadcrumb li { list-style-type: none; display: inline; line-height: 1.2;}
#content ul#breadcrumb li a { border-right: 1px solid #999; padding-right: 5px; margin-right: 5px; }
#content ul#breadcrumb li a:visited, .access a:visited, #content p.page_down a:visited {color: #039;}

#content #calendarcontainer {float: right; width: 200px; margin: 0 15px 10px 15px; }
#content #calendarcontainer #calendar td { text-align: center; padding:0;}
#content #calendarcontainer table#calendar td.today { background: #093E97; color: #fff;}
#content #calendarcontainer #calendar td a:link, #content #calendarcontainer #calendar td a:visited, #content #calendarcontainer #calendar td a:hover, #content #calendarcontainer #calendar td a:active { background: #3E68AD; color: #fff; display:block; text-decoration: none;}
#content #calendarcontainer #calendar td a:hover, #content #calendarcontainer #calendar td a:active { background: #093E97;}

/* A - Z */
#content ol.az_index { text-transform: uppercase; list-style:none; margin:20px 0; padding:0 0 20px 0; float: left; }
#content ol.az_index li { list-style:none; display:inline; font-size:1.4em;}
#content ol.az_index li a, ol.az_index li span { float: left; text-align: center; line-height:1em; margin:0 0 5px 5px; padding:2px 7px; display:block; }
#content ol.az_index li a:link {color: #333; border: 1px solid #D0DFF8; background: #DFE9FA;}
#content ol.az_index li a:visited {color: #666;border: 1px solid #D0DFF8; background: #DFE9FA;}
#content ol.az_index li a:hover, #content ol.az_index li a:active {color: #000; border:1px solid #C6D2E4; background:#D0DFF8; text-decoration: none;}

#content ol.az_index li span { border: 1px solid; color: #ccc; background: #fff;  font-weight:bold;}
#content #tag_cloud a {padding: .1em .4em; margin: 2.2em .4em; line-height: 1.4;}

/* LIVE SEARCH */
#content #az_live_find { background: #eee; padding: 10px; border: 1px solid #ccc; }
#content #az_live_find label { line-height: 1.2; display: block; margin: 0 0 12px 0; }

#content ul#search_results { list-style-type: none; margin:0 0 0 10px; padding:0;}
#content ul#search_results li { background: url(./css_img/bllt.gif) no-repeat 0 7px; padding: 3px 0 3px 12px; }

#content ul#search_results li img { margin: 0 0 2px 3px;}
#content ul#search_results li img:hover { cursor: pointer; }

#content ul#search_results li ul { list-style-type: none; margin:6px 0 6px 6px; padding:0;}
#content ul#search_results li ul li { padding: 1px 0; background: none; }

#content ul#search_results ul.map_icon li {background: url(./css_img/icon_arrow.gif) no-repeat 0 0px; padding: 0 0 0 16px;}

/* COUNCILLORS */
#content dl.person_box { width: 47%; margin: 10px 1% 18px 0; float: left; padding:0; }
#content .person_box dt { clear:left; display:block; font-size: 1.4em; padding: 12px 0 0 0;}
#content .person_box img { width: 50px; border: 1px solid #ccc; padding: 1px; float: left; margin:4px 12px 10px 0; }
#content .person_box dd { padding: 0 0 3px 0; font-size: 1.1em }
#content .person_box dd.border {border-bottom: 1px solid #ccc; clear:left;} 

/* supplements */ 
#content .supplement {margin: 12px 0; padding:0 0 3px 0; clear:left; background: #DFE9FA; border: 6px double #fff; }
#content .supplement h2 {margin:0; padding: 0 0 0 30px; color: #fff; border-bottom: 1px solid #fff; background: #55B145 url(./css_img/arw_grn2.gif) no-repeat 0 0; font-size: 1.2em;}
#content .supplement p { margin: 6px 12px 4px 12px; padding:0; }
#content .supplement img {margin:6px; padding: 1px; background: #fff; float: left;}

#content .featureAdvert { float: left; margin: 0 12px 12px 0; padding: 0; text-align: center;}
#content .featureAdvert img { padding: 1px; border: 1px solid #ccc; margin-bottom: 2px; }
#content .featureAdvert p { font-size: .9em; padding:2px 4px 0px 4px; margin:0; background: #DFE9FA; }
 
/* ###################################### FOOTER */

#footer { clear: both; margin: 20px 0; padding: 10px 0 0 0; border-top: 5px solid #ccc;color: #666; font-size: .9em; line-height: 2em; text-align: center; }

/* ###################################### FORMS */


#content input.field, #content form.xform input, #content select, #content textarea {border: 2px solid #999; padding: 2px 3px; font-size: 1.1em; margin:0 10px;}
#content input.field, #content textarea {width: 38%;font-family: Helvetica, Arial, Verdana, sans-serif;}
#content select {width: auto; font-family: Helvetica, Arial, Verdana, sans-serif;}

#content input.field:focus, #content select:focus, #content textarea:focus, #content .basic_form p.date_birth label input.dob:focus {outline: 4px solid #fff; border: 2px solid #666;}
#content input.disabled { background: #ddd;}
#content form.signin fieldset {padding:0;}

/* ###################################### FORM LAYOUT */

#content form.basic_form { padding:0; margin:20px 2px 20px 2px;clear:both;}
#content form.basic_form fieldset { border-bottom: 1px solid #D5D9E1; padding:0; margin:0 0 12px 0;}
#content legend { font-size: 1.2em; font-weight:bold; margin: 2px 0; display: block;}

#content form.basic_form label, #content form.basic_form .fake_label {font-weight:normal; font-size: 1.1em; color:#333; width:16em; float:left; margin:0; padding: 4px 0 0 12px;}
#content .basic_form p {color:#666; clear:both; margin:0; padding:12px 0; border-top: 1px solid #D5D9E1; border-right: 1px solid #D5D9E1; background: #EDF2FA url(./css_img/form_tile.gif) repeat-y top left; }

#content .basic_form p.center {text-align:center; padding:20px 0;}

#content .basic_form p.date_birth, #content .basic_form p.dataprotection { overflow: auto; }
#content .basic_form p.date_birth label {display: block; width: 15%;}
#content .basic_form p.date_birth label input.dob { width: 34%; border: 2px solid #999; padding: 2px 3px; font-size: 1em;}

#content .basic_form p.dataprotection label { width: 90%; float: left; }
#content .basic_form p.form_text {font-weight:normal; font-size: 1.1em; color:#333; margin:0; padding: 10px 0 20px 12px; border-bottom: none;}

#content .basic_form p.form_text label { float: left; margin: 5px 0 0 0; }

/* ###################################### ERROR MESSAGES */
#content h2.warning { color: #f00;}
#content h2.warning strong { color: #333;}
#content form label strong, #content form .form_text strong { color: #f00;}
.warning { color: #f00;}

#content .basic_form p em { font-size: .9em;}

#content #progressbar {height:10px; padding: 1px; border: 1px solid #ccc; width: 500px; background: #fff; margin: 10px 0;}
#content #progressbar img {height: 10px;}

/* ###################################### BUTTONS */
#container input.button { outline: 4px solid #fff; border: 1px outset #666; background:#E9ECF2; color: #333; padding: 2px 3px; font-weight: bold;}
#container input.button:hover { outline: 4px solid #fff; border: 1px outset #000; color: #000; cursor: pointer;}
#container input.button:focus {  color: #000; font-weight: bold; border: 1px inset #666; background: #DFE9FA;}

/* ###################################### XFORMS */

#content form.xform p.first {padding-left: 10px;}
#content form.xform span.question {font-weight:normal; font-size: 1.1em; color:#333; width:auto; display:block; float:none; margin:0; padding: 4px 0 0 12px;}
#content form.xform label {width: auto; float:none; padding: 0; }
#content form.xform input.checkbox { width: auto; border:none;}
#content .xform input.button { margin: 0; width:auto; border: 2px outset #000; }
#content .xform span.help { display:block; padding-left:11px;}
#content .xform .display_box { background: #eee; padding: 10px 15px; border: 4px double #fff; margin: 10px 0}

#content .basic_form .dob {width: 10%;}


/* SIGN-IN SPECIFIC */

#content .signin h2 { margin:0; padding:4px 0; }
#content .signin {margin:0 0 20px 0; padding: 0 14px; border-bottom: 5px solid #999; border-right: 1px solid #D5D9E1; background: #EDF2FA url(./css_img/form_tile.gif) repeat-y top left;}

#content .signin label { font-weight: bold; font-size: 1.1em; }
#content .signin .field {border: 2px solid #999; padding: 2px 3px; font-size: 1.1em; margin:0 6px; width: 26%;}