/* This stylesheet is in two sections; the standard build and the enhancements*/
/* The standard build is designed for the three basic layout containers for a header, body and footer on a web page*/
/* Each of these containers is specified by .maincontainer just stacked, one on top of the other*/
/* .maincontainer can then contain up to three columns; leftcontainer, centrecontainer and rightcontainer*/
/* .centrerightcontainer is there to take up the last two columns on the page, within a main container, should that be required*/
/* When laying out the XHTML, it should be in the form .manicontainer, .leftcontainer, .rightcontainer and then .centrecontainer*/
/*The reason for this is that the floated containers have to be processed by the browser first for this system to work*/

/*THE STANDARD BUILD*/

/* Set all margins and padding in the element cascade to zero so that these properties are available for all objects in the cascade*/

* {
	margin: 0px; /* The px setting does not vary when the user changes the font size locally in the browser*/
	padding: 0px;
	background-color: #F2F8F6;
}
/* Set up the basic page*/
body  {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 70%;
}	
.scientific { /* with a .scientific paragraph class, the sub and superscripts below can be specified for each character with the sub and sup tags */
	line-height: 1em; 
	padding: 0.5em;
}
	
.scientific sub, .scientific sup { 
	line-height: 0;
	font-size: 60%;
	vertical-align: top; 
}

img {
	border: 0px;
}

.maincontainer{ /*stack these to create a header, body and footer section (and more) down the page*/
	display: block;
	margin: 3px;
	width: 100%;
	height: auto;
	border-style: none;
	border-width; 1px;
	/*border-color: #00ffff;*/
}
.leftcontainer { /* put this in any maincontainer that requires a left hand column. Dup it out and rename it to enable it to apply to specific maincontainers*/
	position: relative; /* to its .maincontaier */
	float: left;
	width: 132px;
	/*border-style: solid;
	border-width; 1px;
	border-color: #ff00ff;*/
}

.rightcontainer {/* put this in any maincontainer that requires a right hand column. Dup it out and rename it to enable it to apply to specific maincontainers*/
	position: relative; /* to its .maincontaier */
	float: right;
	width: 165px;
	/*border-style: solid;
	border-width; 1px;
	border-color: #0000ff;*/
}
.centrecontainer {/* put this in any maincontainer that requires a middle column. Dup it out and rename it to enable it to apply to specific maincontainers*/
	margin-left: 133px; /* the width of the left container */
	margin-right: 165px; /* the width of the right container */
	/*border-style: solid;
	border-width; 1px;
	border-color: #00ff00;*/
}
.centrecontainerraised {/* put this in any maincontainer that requires a middle column that is raised above it's maincontainer (e.g. nestled into a rounded header graphic). Dup it out and rename it to enable it to apply to specific maincontainers*/
	position: relative; /* to its .maincontaier */
	top: 0px; /* the amount that the container is raised by */
	margin-left: 150px; /* the width of the left container */
	margin-right: 115px; /* the width of the right container */
	margin-bottom: 0px; /*stops a huge blank being left before the footer if centre is longest column */
	height: 500px;
	/*border-style: solid;
	border-width; 1px;
	border-color: #00ff00;*/
}
.centreandrightcontainer {/* put this in any maincontainer that requires a small left hand column with a large space after it. Dup it out and rename it to enable it to apply to specific maincontainers*/
	margin-left: 165px; /* the width of the left container */
	margin-right: 0px; /* there is no right container */
	height: auto;
	/*border-style: solid;
	border-width; 1px;
	border-color: #00ff00;*/
}


/* END OF STANDARD BUILD*/

/*ENHANCEMENTS */

/* The Header */

.headerleft {
	position: relative; /* to its .maincontaier */
	float: left;
	width: 150px;
	overflow: visible;
	background: url(../Site_Graphics/leftslice.jpg) 0 0 no-repeat;
	height: 150px;
	margin-right: -3px;
	margin-bottom: 0px;
	/*border-style: solid;
	border-width: 1px;
	border-color: #00ff00;*/
}
.headerright {
	position: relative; /* to its .maincontaier */
	float: right;
	width: 635px;
	background: url(../Site_Graphics/rightslice.jpg) 0 0 no-repeat;
	height: 150px;
	margin-right: -3px;
	margin-left: -3px;
	margin-bottom: 0px;
	/*border-style: solid;
	border-width: 1px;
	border-color: #00ff00;*/
}
.headercentre {
	background:  url(../Site_Graphics/1x1colour.jpg) 0 0 repeat-x;
	height: 150px;
	margin-right: -3px;
	/*border-style: solid;
	border-width: 1px;
	border-color: #297329;*/
}


a {
	color: #000000;
	text-decoration: underline;
	font-weight: normal;
}
a:hover {
	color: #418B56;
	text-decoration: underline;
}

/*Hyperlinked Menu in leftcontainer */
/*Hyperlinks are li's because just putting an A link into a div where the text wraps beyond the specified width, wraps text OVER the bottom border of the div*/
/*So all this is so that the dividing lines between menu items display gracefully, however long the text is. Who said this was easy?*/

ul.leftmenu { /*Styling the list so that it doesn't look like a list*/
	width: 100%;
	padding: 0px;
}


li {
	list-style-image: url(../Site_Graphics/bullet.png);
}


.leftmenuheader { /*The headings in the menu section*/
	background-color: #418B56; /*#63ad63;*/
	color: #ffffff;
	padding: 3px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #F2F8F6;
	list-style-image: none;
	margin-left: 0px;
}
.leftmenuitem { /*The menu items themselves*/
	background-color: #D6F7D6;
	padding: 3px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #F2F8F6;
    list-style-image: none;
	margin-left: 0px;
}

.leftmenuitem li {
	position: relative;
	display: inline;
	float: left;
	border-style: solid;
	border-left-style: none;
	border-width: 1px;
	border-color: #297331;
	height: 100%;
	margin: 0px;
	background-color: #D6F7D6;

}

.leftmenuitem ul li a{
	text-decoration: none;
	background-color: #D6F7D6;
	color: #418B56;
}

.leftmenuitem li ul a:hover{
	text-decoration: none;
	background: #297331;
	color: #ffffff;
}

li.leftmenuenditem { /*Styling the last item on a list to enable it to be different from the rest e.g. a rounded graphic.*/
	background:  url(../Site_Graphics/menuitemend.png) 100% 100% no-repeat;
	height: 67px;
	background-color: #D6F7D6;
	padding: 3px;
	list-style-image: none;
	margin-left: 0px;
	/*border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #ffffff;*/
}

li.leftmenuitem: a hover{
	background: #297331;
	color: #ffffff;
}
a.leftmenuitemlink { /*Overriding standard hyperlink styles to get the style required*/
	background-color: #D6F7D6;
	text-decoration: none;
	color: #000000;
	list-style-image: none;
	margin-left: 0px;
}
a.leftmenuitemlink:hover { /*Overriding standard hyperlink styles to get the style required*/
	text-decoration: none;
	color: #418B56;
}
a.leftmenuitemlink:visited {
	text-decoration: none;
	color: #000000;
}
a.leftmenuitemlink:unvisited:hover {
	text-decoration: none;
	color: #418B56;
}
a.leftmenuitemlink:visited:hover {
	text-decoration: none;
	color: #418B56;

}

/* this is the main body of the page */

.pagetitle {
	/*font-family: Times New Roman, Times, serif;*/
	
	margin-left: 0px;
	margin-top: 17px;
	margin-bottom: 7px;
	font-size: 210%;
	text-transform: capitalize;
	color: #297331;
}
.strapline {
	/*font-family: Times New Roman, Times, serif;*/
	position: relative;
	top: -4px;
	font-size: 170%;
	text-transform: capitalize;
	color: #297331;
}

.subhead {
	/*font-family: Times New Roman, Times, serif;*/
	font-size: 150%;
	color: #297331;
}
.pagecontent {
	margin-bottom: 3px;
	padding-left: 5px;
	/*border-style: solid;
	border-width: 1px;
	border-color: #000000;*/

}
.Activelifecover {
	text-align: center;
}

select {

	border-width: 0px;
	border-color: #D6F7D6;
}

.searchresults {	
	position: relative;
	width: 70%;
	border-style: solid;
	border-width: 1px;
	border-color: #297331;
	margin-top: 5px;
	margin-bottom: 5px;
}

.searchresults td {
	font-size: 80%;
	padding: 5px;
	vertical-align: center;
}
ul.words {
	margin-left: 15px;
}
	

/* this is the right hand list of banner ads */

.rightadvertising {
	position: relative; /* to its .maincontaier */
	float: right;
	width: 115px;
	padding-top: 3px;
	padding-right: 0px;
	padding-left: 3px;
	padding-bottom: 3px;
	text-align: center;
	/*border-style: solid;
	border-width; 1px;
	border-color: #0000ff;*/
}

.rightbanneradimg {
	padding-bottom: 5px; /* ensures vertical spacing between the banners */
}
/* this is the footer*/

.poweredbylogo {
	background: url(https://www.amris.com/images/powered_by_amris.gif) center center;
	title: "Amris Logo";
	background-repeat: no-repeat;
	height: 50px;
	/*border-style: solid;
	border-width; 1px;
	border-color: #ff00ff;*/
}
.footertext {
	color: #000000;
}
a.footerlink {
	color: #000000;
	text-decoration: underline;
	font-weight: normal;
}
a.footerlink:hover {
	color: #4e874e;
	text-decoration: underline;
	font-weight: normal;
}

.line {
    border-top-width: 5px;
	border-top-style: solid;
	border-top-color: #317329;
	margin-top: 5px;
    width: auto;
}

/*Corporate Profile Styles */

body.profile { /* Centres the profile container and colours the page background */
	text-align: center;
	background-color: #F2F8F6;
}

.profilecontainer {/* put this in any maincontainer that requires a middle column. Dup it out and rename it to enable it to apply to specific maincontainers*/
	background-color: #F2F8F6;
	width: 798px; /* the width of the header banner */
	height: auto;
	text-align: center;
	border-bottom-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-width: 1px;
	border-color: #2A7C32;
	padding-bottom: 10px;
}
.profileheader {
	/*margin-left: -69px;*/
	position: relative;
	width: 100%;
	text-align: left;
	margin-bottom: 5px;
}

.profilemenusection {
	position: relative;
	width: 100%;
	text-align: left;
}
.profiledetails {
	width: 100%;
	text-align: left;
	padding: 5px;
}

ul.corporateprofiletopmenu {
	list-style: none;
	font-size: 130%;
	color: #297331;
	margin: 0px;
}

ul.corporateprofiletopmenu li {
	position: relative;
	display: inline;
	float: left;
	border-style: solid;
	border-left-style: none;
	border-width: 1px;
	border-color: #297331;
	height: 100%;
	margin: 0px;
	background-color: #D6F7D6;
}

ul.corporateprofiletopmenu li a{
	text-decoration: none;
	background-color: #D6F7D6;
	color: #000000;
	padding: 2px;
}

ul.corporateprofiletopmenu li a:hover{
	text-decoration: none;
	background: #297331;
	color: #ffffff;
	padding: 2px;
}

/* forms */

img.right{
	margin: 5px;
	z-index: 3000;

}

fieldset {
	  width: 100%;
	  border-color: #418B56;
	  border-width: 1px;
	  border-style: solid;
	  padding-bottom: 10px;
}
form {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
	  margin: 0;
	  padding: 0;
	  width: 100%;
}

form fieldset {
  /* clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
	  border-color: #418B56;
	  border-top-width: 1px;
	  border-bottom-width: 0px;
	  border-left-width: 0px;
	  border-right-width: 0px;
	  border-style: solid;
	  padding: 10px;        /* padding in fieldset support spotty in IE */
	  margin: 0;
}

form fieldset legend {
	 font-size: 130%; /* bump up legend font size, not too large or it'll overwrite border on left */
     font-weight: 800;
	 padding: 5px;
	 color: #317329;                   /* be careful with padding, it'll shift the nice offset on top of border  */
}

form input, form textarea, form select, form checkbox {
	/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
	width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
	margin:5px 0 0 10px; /* set margin on left of form elements rather than right of label aligns textarea better in IE */
	padding: 0px;
	height: auto;
	border-color: #F2F8F6;
	font-size: 90%; 
}


label {
	/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
	width: auto;    /* set width of form elements to auto-size, otherwise watch for wrap on resize */
	margin: 5px 0 0 10px; /* set margin on left of form elements rather than right of label aligns textarea better in IE */
	padding: 5px;     
}

.requiredtext {   
	font-weight: bold;
	
} /* uses class instead of div, more efficient */

/*label:first-letter { /* use first-letter pseudo-class to underline accesskey, note that */
/*	text-decoration:underline;    /* Firefox 1.07 WIN and Explorer 5.2 Mac don't support first-letter */
                                 /* pseudo-class on legend elements, but do support it on label elements */
                                    /* we instead underline first letter on each label element and accesskey */
                                    /* each input. doing only legends would  lessens cognitive load */
                                   /* opera breaks after first letter underlined legends but not labels */
/*}*/

.multiselect {
	width: 100%;
	padding: 5px;
	border-width: 0px;
	border-color: #F2F8F6;
	font-size: 90%; 
}

td.words {
	width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
	margin: 5px 0 0 10px; /* set top margin same as form input - textarea etc. elements */
	padding-left: 15px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;   
}

td.wordsred {
	width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
	margin: 5px 0 0 10px; /* set top margin same as form input - textarea etc. elements */
	padding-left: 15px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
	color: #ff0000;   
}

td.agencylist, td.agencylist img  {
	text-align: center;
	vertical-align: top;
	padding: 5px;
	border-width: 0px;
	border-color: #F2F8F6;
}

form input#reset {
	margin-left: 0px; /* set margin-left back to zero on reset button (set above) */
}

form textarea { 
	overflow: auto; 
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

form br {
	clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */
}

.button {
	padding: 1px;
	background: #D6F7D6;
	border-color: #D6F7D6;
	color: #000000;
	font-size: 90%;

}
