@import url("layout.css");
/* iconize pdf etc. icon links - UNUSED */
/*@import url("iconize.css");*/

/* Main Colors:
 
	#402640 - purple links, and text on an orange background, and purple text on white background
	#000 - main content text

    #1e4b87 - dark blue - for H1 headings etc.
    #3d5da0 - medium blue - for 2nd level nav background

	#F3760F - main orange
	#F23115 - redder orange
    #F6984C - lighter orange

    #FFFFFF - white main page background
	#FFFFFF - white browser page background
    #FFF - various text, borders and nav
*/


/*** Main layout styling ***/

/* note not added p here */
html, body, table, tr, th, td 
{
    /* placed here to help the cms */
    text-align: left;
	color: #000;  
	font-family: Arial, Helvetica, sans-serif;
}
body
{
	/*font-size: 0.8em;*/
	font-size: 14px;
	background-repeat: repeat;
	background-color: #FFFFFF;
	/*background-color: #402640;*/
	/*background-image: url("../images/background.gif");*/
	background-attachment: scroll;
}
/* Bottom padding only - thus must set top padding for the first para on a page */
p
{
    line-height: 1.25em;
    margin: 0 0 1em;
}
/* the em fiddling about here is to help the cms */
table, tr, th, td, p {
	font-size: 1em;
}
.clear{
	clear:both;
	/* Stop br taking up space in ie */
	line-height: 0;
}
a:link, a:visited, a:hover, a:active {
	color: #F3760F;
	text-decoration: none;
}
a:hover {
	/*color: #402640;*/
	text-decoration: underline;
}
h1,h2,h3,h4,h5,h6 {
	color: #1e4b87;
}
h1 { font-size:1.75em; }
h2 { font-size:1.52em; }
h3 { font-size:1.32em; }
h4 { font-size:1.15em; }
h5 { font-size:1.00em; }
h6 { font-size:1.00em; font-style:italic; }
h1, h2 {
	border-bottom-width: 1px;
	border-bottom-style: solid;
}
th, td { vertical-align: top; }

/* Main website container */
#container 
{
    width: 920px;
    /*width: 760px;*/
	margin: 0 auto;
	/* tiny gap from browser top */
	margin-top: 2px;
	margin-bottom: 5px;
	/* White padding around whole content */
	padding: 4px;
	/* Raise border effect around whole content
	border-right: 2px solid #725972;
	border-bottom: 2px solid #725972;
	border-left: 2px solid #CCCCCC;
	border-top: 2px solid #CCCCCC; */
	background-color: #FFFFFF;
}
#container p
{
	/* No as anything not in a P is then wrong
    font-size: 1.1em;*/
}

/* Main banner */
#masthead {
	/* Calculated - standard width (ie 920), minus the margin-left below */
	width: 920px;
	/* Must set div height to background image height */
	height: 148px; /* for IE */
	min-height: 148px; /* for non-IE */ 
	background-image: url("../images/EUSSER-banner.jpg");
	background-repeat: no-repeat;
	/*text-align: center;*/
	margin-left: 0px;
	padding-bottom: 0px;
	border-bottom: 1px solid #1e4b87;
	/* The below will lose the top lh white square 
	border-left: solid 160px #F3760F;
	margin-left: 0px;
	border-bottom: 0px;
    */
}
/* Trick to get url link to fill the div */
#masthead a
{
	/*width: 760px;*/
	width: 920px;
	/* same as above */
	height: 148px;
	display: block;
    /* remove the dotted outline when image is clicked
       nb being clever and only doing this hover so that you can still use keyboard nav does not work well */
	outline: 0;
}
/* Trick to get url link to fill the div */
#masthead a span {
    visibility: hidden;
}
/* stop a tiny underline of the space char */
#masthead a:hover
{
    text-decoration: none;
}
/*
#masthead h1, #masthead h2, #masthead h3 {
	color: #fff;
}
*/

/* Main horizontal nav */
/*
#navigation-horiz1 {
	text-align: left;
	width: 760px;
	background-color:#F3760F;
}
*/
/*
#navigation-horiz1 span {
	padding-left: 10px;
	font-size: 1.3em;
	font-weight: bold;	
}
#navigation-horiz1 a {
	text-decoration:none;
	color: #fff;
}
#navigation-horiz1 a:hover {
	color: #402640;
}
*/

/* Sub horizontal nav - UNUSED */

#navigation-horiz2 
{
    display: none;
}

/* Hide EMPTY div from ie
#navigation-horiz2 
{
    height: 0px;
    min-height: 0px;
}
#navigation-horiz2 
{
    color: #402640;
	float: left;
	width: 760px;
	background-color:#F3760F;
	padding-bottom: 3px;
}
#navigation-horiz2 span {
	color: #402640;
}
#navigation-horiz2 a {
	text-decoration:none;
	color: #fff;
}
#navigation-horiz2 a:hover {
	color: #402640;
}
*/
/*
#navigation-horiz2 span.breadcrumb{
	padding-left: 10px;
	float: left;
	text-align: left;
	width: 400px;
	font-style: italic;
}
*/
#navigation-horiz2 span.navigation-constant{
	padding-right: 10px;
	float: right;
	text-align: right;
	width: 200px;
}

/* Main vertical nav */
#navigation {
	position: relative;
	float: left;
	/* match the menu image width */
	/* nb if this is too long then the whole content col wraps */
	width: 156px;
    font-family: Trebuchet MS, Tahoma;
	text-align: left;
	margin-top: 2px;
	/* pad out the nav for pages short on content */
	padding-bottom: 50px;
	/* spacer between col divider line and nav items */
	padding-right: 2px;
	/* divider line - reaches the bottom when little page content, but not when lots of content */
	border-right: 1px solid #1e4b87;
	/* IE 6 hack - dotted border would show as dashed */
	/*_border-right: 1px solid #1e4b87;*/
}
/* Vertical Navigation Styles */
#navigation ul {
	list-style-type: none;
	width: 100%;
	display: block;
	margin: 0;
	padding: 0;
}
#navigation li {
	display: block;
	margin: 0;
	padding: 0;
}
#navigation ul a, #navigation ul li.unselected a {
	/* vertical separator for menu item */
	padding-bottom: 0px;
    /* image height */
    height: 31px;
	background-image: url("../images/button_single_blu_dark.gif");
    background-repeat: no-repeat; 
	display: block;
	text-decoration: none;
}
#navigation ul a span
{
	/* text vert alignment */
	line-height: 30px;
	/* text horiz alignment */
	padding-left: 15px;
	/*
    font-family: Sans-Serif;
    font-variant: small-caps;
    letter-spacing: 1px;
    */
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
	/* stop text that is too long from messing up the menus completely */
	white-space: nowrap;
}
#navigation ul ul li 
{
	border: 0px;
}
#navigation ul ul a, #navigation ul ul li.unselected a {
	/* vertical separator for menu item */
	padding-bottom: 0px;
    /* image height */
    height: 31px;
	background-image: url("../images/button_single_blu_dark.gif");
    background-repeat: no-repeat; 
	/* Stop size doubling up of adjacent borders */
	border-top-width: 0px;
}
#navigation ul ul a span {
	/* text horiz alignment */
	padding-left: 25px;
	font-size: 12px;
	font-weight: bold;
	/* stop text that is too long from messing up the menus completely */
	white-space: nowrap;
}
#navigation ul ul ul a, #navigation ul ul ul li.unselected a {
	/* vertical separator for menu item */
	padding-bottom: 0px;
    /* image height */
    height: 31px;
	background-image: url("../images/button_single_blu_dark.gif");
    background-repeat: no-repeat;
}
#navigation ul ul ul a span {
	/* text horiz alignment */
	padding-left: 35px;
	font-size: 12px;
	font-weight: normal;
	/* stop text that is too long from messing up the menus completely */
	white-space: nowrap;
}
/* Selected and UnSelected nav item styles */
/* Extra li li etc. added as selected style within unselected would be overridden by the outer unselected 
   selected.
   There are 2 styles:
   - selected-onpath = on nav path to selected item
   - selected-leaf = the actual selected item
*/
/* selected - top level */
#navigation ul li.selected-onpath a span {
}
#navigation ul li.selected-leaf a span {
	/* Same as the hover state - nb it looked confusing if we styled selected-onpath the same also
	color: #F3760F; */
}
#navigation ul li.selected-leaf a {
	background-image: url("../images/button_single_blu_light.gif");
}
/* selected - other levels */
#navigation ul li li.selected-onpath a span, #navigation ul li li li.selected-onpath a span {
}
#navigation ul li li.selected-leaf a, #navigation ul li li li.selected-leaf a {
	background-image: url("../images/button_single_blu_light.gif");
}
#navigation ul li li.selected-leaf a span, #navigation ul li li li.selected-leaf a span {
	/* Same as the hover state - nb it looked confusing if we styled selected-onpath the same also
	color: #F3760F; */
}
/* unselected - top level */
#navigation ul li.unselected a span {
}
/* unselected - other levels */
#navigation ul li li.unselected a span, #navigation ul li li li.unselected a span {
}
/* hover styles */
/* nb remove li.selected-xxx if you want to to stop selected items having the hover effect, but prob don't want to stop selected-onpath  
   from having a hover effect.
*/
#navigation ul li.unselected a:hover span, #navigation ul li li.unselected a:hover span, #navigation ul li li li.unselected a:hover span 
, #navigation ul li.selected-onpath a:hover span, #navigation ul li li.selected-onpath a:hover span, #navigation ul li li li.selected-onpath a:hover span 
, #navigation ul li.selected-leaf a:hover span, #navigation ul li li.selected-leaf a:hover span, #navigation ul li li li.selected-leaf a:hover span 
{
	color: #F3760F;
}

/* Main content */
#content 
{
	float: left;
	/* Calculated - standard width (ie 920), minus the navigation width (ish) */
	width: 760px;
	/* Relies on the min-height setting to make sure that content shorter than the lh nav actually reaches the footer */
	/* non-IE min height */
	min-height: 360px; 
	/* IE min-height */
	height:auto !important;
    height:500px;
	/* divider line - reaches the bottom when a lot of page content, but not when little page of content */
	/* -ve margin is to get the nav and content dividing line to line up */
    margin-left: -1px;
	border-left: 1px solid #1e4b87;
	/* IE 6 hack - dotted border would show as dashed */
	/*_border-left: 1px solid #1e4b87;*/
	/* don't do this in #content-inner */
	padding-bottom: 30px;
}
#content-inner
{
	/* move text away from the side borders - don't do this in #content */
	/*padding-top: 10px*/
	padding-right: 20px;
	padding-left: 20px;
}
/*
Note that we make as little as possible a descedant of #content because if we do, the cms
editor will not pick this up - thus we make as many styles as we can global styles.
*/
#content div.breadcrumb{
	font-size: 0.9em;
	text-align: left;
	font-style: italic;
	padding-top: 5px;
}

/* Images */
/* When floating: 
   - top margin is set to P top margin 
   - all must be placed ABOVE any text wraping P
*/

.Border, .imageborder
{
    border: solid 1px #999;
}
/* Image with no caption */
/*
.imagefloatright 
{
  float: right;
  margin: 1.2em 5px 6px 25px;
}
.imagefloatleft 
{
  float: left;
  margin: 1.2em 10px 5px 0px;
  padding : 5px;
}
*/
/* Image with caption */
div.floatright, div.floatleft
{
/* without this the div right padding in FF is never consistent - nb min-width fails also */
width: 352px;
padding: 5px;
/* Bevel
border-top: 1px solid #999;
border-right: 2px solid #555;
border-bottom: 2px solid #555;
border-left: 1px solid #999;
*/
}
/* div usage - floatright float450 imageborder */
div.float450
{
    width: 452px;
}
div.float250
{
    width: 252px;
}
div.floatright
{
float: right;
margin: 0 0 5px 1em;
}
div.floatleft
{
float: left;
margin: 0px 1em 5px 0px;
}
/* Bevel
div.floatright img, div.floatleft img
{
border-top: 2px solid #555;
border-right: 1px solid #999;
border-bottom: 1px solid #999;
border-left: 2px solid #555;
}
*/
span.caption 
{
	font-size: 0.9em;
}

/* Footer */
#footer {
	font-size: 0.9em;
	clear: both;
	/*width: 740px;*/
	width: 920px;
	padding-top: 2px;
	border-top: 1px solid #1e4b87;
	/* IE 6 hack - dotted border would show as dashed */
	/*_border-top: 1px solid #1e4b87;*/
}
#footer p 
{
	text-align: center;
}
/*
#footer hr {
	height: 1px;
	width: 90%;
	background-color: #1e4b87; -- for FF
	color: #1e4b87; -- for IE 
	border: none;
}
*/
#footer p {
	/* For IE7 */
	margin-top: 10px;
	color: #402640;
}
#footer #copyright {
	margin-top: -10px;	
}
#footer a:link, #footer a:visited, #footer a:hover, #footer a:active {
	text-decoration: none;
	color: #402640;
	font-weight: bold;	
}
#footer a:hover {
	text-decoration: underline;
}


/*** Forms ***/

#form
{
    padding-top: 10px;
    /*
    text-align: left;
    */
}
.inputFieldSec{
	padding:3px 0;
	width:100%;
	display:block;
}
.inputLabel, .inputLabel_Long{
	float:left;
	text-align:right;
	padding-right:5px;
	font-weight:bold;
	color:#402640;
	width:142px;
}
.inputLabel_Long{
	width:250px;
}
.inputFieldText, .inputFieldText_Long, .inputFieldText_Short, .inputFieldTextArea, .inputFieldTextArea_Small, .inputFieldTextArea_Address {
	float:left;
	width:200px;
	/* no border because can't style the dd lists
	border:1px solid #1e4b87;*/
	margin-right: 3px;
}
.inputFieldText_Long
{
    width:300px;
}
.inputFieldText_Short
{
    width:150px;
}
.inputFieldTextArea 
{
    width: 500px;
    height: 90px;
}
.inputFieldTextArea_Small
{
    width: 350px;
    height: 50px;
}
.inputFieldTextArea_Address
{
    width: 250px;
    height: 50px;
}
legend 
{
	color:#402640;
}
.btnLeft1
{
    /* line up with inputLabel width and padding */
	padding:0 10px 0 147px;
	float:left;
}
.error_field {
    background-image: url(../images/error_field.gif);
    background-repeat: no-repeat;
    /*background-position: 3px 0px;*/
    /* Turn into apointer */
    cursor: default;
}
/* Simple error style */
.error {
    /* line up with inputLabel width and padding */
	padding:0 10px 0px 147px;
	color:Red;
}
/* Fancy error and success messages */
.error_fancy
{
    background-color: #FFD88C;
    border: 1px solid #FF0C00;
    color: #FF0C00;
    padding: 10px 5px 10px 35px;
    margin-bottom: 10px;
    background-image: url(../images/error.gif);
    background-repeat: no-repeat;
    background-position: 8px 10px;
    font-weight: bold;
}
.noerror_fancy
{
    /*width: 100%; - do not set this */
    background-color: #E1FFD6;
    border: 1px solid #859681;
    color: #55844A;
    padding: 10px 5px 10px 35px;
    margin-bottom: 10px;
    background-image: url(../images/noerror.gif);
    background-repeat: no-repeat;
    background-position: 8px 10px;
    font-weight: bold;
}
.info 
{
    background-color: #E1FFD6;
    border: 1px solid #859681;
    color: #55844A;
    padding: 10px 5px 10px 5px;
    margin-bottom: 10px;
    font-weight: bold;
}
/* Stop paragraphs from misaligning with the icon */
.noerror_fancy p, .error_fancy p, .info p
{
    padding-top: 0;
    margin-top: 0;
}
.button 
{
    color: #402640;
	font-weight:bold;
	margin-top: 10px;
}
.select 
{
    width: 150px;
}
.required 
{
    /*width: 15px;
    height: 15px;*/
    color: #402640;
    font-weight: bold;
    font-style: normal;
}
DIV.requiredhint
{
    font-style: italic;
    padding-bottom: 5px;
}
.formhint 
{
    color: #000;
    padding-left: 3px;
    font-style: italic;
}
#form fieldset 
{
    padding: 5px 0px;
    margin-bottom: 10px;
}
#form legend 
{
    padding-bottom: 5px ;
}
/*
#CreateUserWizard1, #CreateUserWizard1 td, #CreateUserWizard1 tr, #CreateUserWizard1 table
{
    border-collapse: collapse;
    text-align: left !important;
    width: 100%;
    border: none;
    padding: 0;
    margin: 0;
    color: Blue;
}
*/


/*** Styling for specific pages ***/

/* Common cross page */

ul.NewsList 
{
    margin-top:-5px;
}
ul.MeetingsList 
{
    margin-top:-5px;
}
ul.NewsList li, ul.MeetingsList li {
    display:block;
    float:left;
    list-style-image:none;
    list-style-position:outside;
    list-style-type:none;
    position:relative;
    /* Don't fill whole width */
    width:90%;
}
ul.NewsList li 
{
    margin-top:15px;
}
ul.MeetingsList li {
    margin-top:25px;
}
ul.PageList li, ul.PageList li {
    display:block;
    float:left;
    list-style-image:none;
    list-style-position:outside;
    list-style-type:none;
    position:relative;
    /* Don't fill whole width */
    width:90%;
	font-weight: bold;
    margin-top: 5px;
}
.ListTitle {
    text-decoration:none;
    font-weight: bold;
	color: #1e4b87;
}
.ListSummary div {
    margin-top: 5px;
}
.ListSummary div img {
    display:block;
    float:left;
    margin-right:10px;
    margin-bottom: 5px;
}
.ListSummary div p 
{
    /* Essential for ie */
    margin-top: 3px;
}
a.ListReadMore {
    font-size: 1em;
}

/* Meetings pages */
.MeetingDate 
{
    font-style: italic;
    /* Lose the bottom margin of the heading above, but add it to the bottom of us */
    padding-top: 0px;
    margin-top: -15px;    
    margin-bottom: 15px;    
}

/* Home page */

#snippet_homestrapline
{
    margin: -10px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    text-align: center;
    font-style: italic;
    color: #1e4b87;
	font-size: 2.2em;
	/*font-family: Times New Roman;*/
	font-weight: bold;
}
#snippet_homemessage 
{
    margin: 15px 0px 25px 0px;
    padding: 10px 15px;
	font-size: 1.1em;
	border: solid 1px #1e4b87;
	/*background-color: #F6984C;*/
	background-color: #fff;
}
#snippet_homenews h3
{
    /*margin-bottom: 0px;*/
}

/* Board page */

ul.thumb {
	float: left;
	list-style: none;
	margin: 0; padding: 10px;
	/*  
        Make 20px when many many board members.
        170px works for 5 board members.
        130px works for 6 board members.
    */
    margin: 0px 130px;
    /* IE6 - or while block flows under the LH nav */
    _margin: 0px 10px;
}
ul.thumb li {
	margin: 0; padding: 5px;
	float: left;
	position: relative;  /* Set the absolute positioning base coordinate */
	/*
	width: 110px;
	height: 110px;
    */
	/* If these are greater than li img size, then this is the padding */
	width: 55px;
	height: 78px;
}
ul.thumb li img {
	/*width: 100px; height: 100px;*/ /* Set the small thumbnail size */
	width: 51px; height: 74px; /* Set the small thumbnail size - match with jquery code */
	-ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */
	border: 1px solid #ddd;
	padding: 3px; /* match with jquery code */
	background: #f0f0f0;
	position: absolute;
	left: 0; top: 0;
}

#board_profile
{
    /*margin-left: auto; margin-right: auto; text-align: left;*/
    margin: 30px 0px 30px 0px;
    width: 100%;
}
#board_profile tr td
{
    padding: 15px;
}
#board_profile img
{
    width: 84px;
    height: 122px;
	border: 1px solid #ddd;
	padding: 5px;
	background: #f0f0f0;
	/* Compensate for RH extra padding */
	margin-top: 10px;
}
#board_profile td.image
{
    width: 60px;
}
#board_profile table.details
{
}
#board_profile table.details tr td
{
    padding: 5px;
}
#board_profile td.vert_divide
{
    width: 0px;
    padding: 0px;
}
table.details tr.role td
{
    /*font-weight:bold;
    font-size: 1.2em;*/
}
table.details tr.role td h3
{
    padding: 0px;
    margin: 0px;
    /* Compensate for top cell padding - nb watch ie cutting off the top */
    /*margin-top: -5px;*/
}
table.details tr.name td
{
    font-weight:bold;
}
table.details tr.attrib td
{
}


/* Links page */

#links ul li {
	list-style-type: square;
	/* Unable to style the bullet color without the text
	color: #1e4b87; */
}
/*
#links ul 
{
    padding-left: 0;
}
#links ul li {
	list-style-type: none;
	margin: 0;
	padding: 0;
	padding-top: 10px;
	color: #402640;
	font-weight:bold;
	font-size: 1.1em;
}
#links a {
}
#links a:hover {
}
#links ul ul {
    padding-left: 30px;
}
#links ul ul li
{
	list-style-type: square;
	margin: 0;
	padding: 0;
	color: #000;
	border-bottom: 0px;
	font-weight:normal;
	font-size: 1em;
}
#links ul ul a {
}
#links ul ul a:hover {
}
*/
#links h3 {
	padding-top: 15px;
}


/* Committees page */

.committee 
{
    padding: 10px 10px;
}
.committee_role 
{
    padding: 3px 0px;
}
.committee_members 
{
    padding-top: 5px;
}
/* Based on inputLabel */
.committee_label {
	float:left;
	text-align:right;
	padding-right:5px;
	font-weight:bold;
	color:#402640;
	width:130px;
	white-space: nowrap;
}
.committee_member {
	float:left;
	/* Same padding as the above padding-right plus width */
	padding-left:135px;
}


/* General Assembly */

ul#MinutesList li 
{
    list-style-type: square;
}


/* Sitemap page */

#sitemap
{
    /* Move away from lh side - content is not very wide and looks odd */
    padding-left: 0px;
}

#sitemap li a
{
    font-weight: bold;
}
#sitemap li li a
{
    font-weight: normal;
}


/* ListOfMembers and ListOfMembersSearch pages */

.member_alphabetletterlist, .member_alphabetletter 
{
    font-weight: bold;
    /* Same as h3 */ 
    font-size: 1.32em;
}
/* ABCD etc. links */
.member_alphabetletterlist 
{
    padding-bottom: 10px;
}
/* Single letter bookmarks */
.member_alphabetletter 
{
    text-decoration: underline;
    color: #402640;
    margin-top: 10px;
}

p.member_search_dd
{
    margin: 0px;
    padding: 5px 5px 5px 15px;
}

h3.member_search
{
    margin-top: 20px;
}

/* main wrapper */
.member 
{
    padding: 0px 10px 15px 10px;
    /*border: solid 1px #000;*/
}

/* 2 col wrapper */
.member_nameandaddress 
{
    /* Total of the two below */
	width:700px;
	display:block;
	margin-top:15px;
}

/* lh col */
.member_name 
{
	float:left;
	text-align:left;
	padding-right:5px;
	width:190px;
    color: #402640;
    font-weight: bold;
}

/* rh col */
.member_address, .member_bio
{
    float:right;
    /* without this the cols won't line up */
	width:490px;
}
.member_address
{
}
.member_label 
{
    font-style: italic;
}
.member_bio_label 
{
    margin: 10px 0px 5px 0px;
}
.member_bio_text
{
    margin-left: 5px;
}

/* 2 col display */
/*
.member_bio 
{
	float:left;
	text-align:left;
	margin-top:0px;
    margin-bottom:0px;
}
*/

.member_bio 
{
}


/*** Independent styles - nb these will appear in the snippetmaster styles dd ***/

/* Removed due to dup with snippetmaster bold etc. toolbar items */
/*
.style-bold {
	font-weight: bold;
}
.style-italic {
	font-style: italic;
}
*/

/* Use this class to make sure that images won't get iconized - see iconize.css */
.style-do_not_show_doc_image {
	padding-right: 0px !important;
	background: none !important;
}


/*** Printing styling - add LAST ***/
#footer-print 
{
    display: none;
}
#masthead-print 
{
    display: none;
}