html, body
{
	margin: 0px;
	padding: 0px;
	background-color: white;
	font-family: Arial, Tahoma, sans-serif;
	color: #5C5C5C;
}

html, body, div, span, p, a, table, td
{
	font-size: 13px;
}

p, h1, h2, h3, h4, form 
{
	margin: 0;
	padding: 0;
}

h1
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
}

h2
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
}

h3
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
}

h4
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

h5
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}

h6
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
}

ul, li 
{
	margin: 5px;
	padding: 0;
	list-style: disc;
}

img 
{
	border: 0;
	vertical-align: bottom;
}


a
{
	font-weight: normal;
	text-decoration: none;
	color: blue;
}

a:hover 
{
	text-decoration: underline;
}

strong
{
	font-weight: bold;
}


input, textarea
{
  border: 1px solid #54667F;
}


.headerWrapper
{
	background-image: url(../../images/5247_7113243_40001/header_logo_clear_w.jpg); 
	background-position: top; 
	background-repeat: repeat-x;
	padding-right: 23px;*/	
	height: 89px;	
}


.headerFuncBox
{
	background-image: url(../../images/4254_2261511_06710/func_box_bck.gif); 
	background-position: top; 
	background-repeat: repeat-x; 
	padding-top: 6px; 
	padding-right: 10px;	
}

.headerFuncBox img
{
	margin-right: 2px;	
}

.headerFuncBox a
{
	color: white;
}

.headerShade
{
	background-image: url(../../images/5757_2338522_40011/func_box_corner.gif); 
	background-position: top; 
	background-repeat: repeat-x;
}

.footerWrapper
{
	padding-right: 10px; 
	background-image: url(../../images/4250_2218923_77800/footer_bck.gif); 
	background-position: center; 
	background-repeat: repeat-x;
}

/* LOOK AND FEEL STYLES */

/* 
  HOME PAGE STYLES
  Modifying the styles below will change current look and feel of Gryphon home page   
*/

/* css style properties for separator between the tabbed menu and the rest of home page */
.menuContentSeparator
{
  background-color: #BC9D25;
  font-size: 5pt;
  border-top: 1px solid gray;
  border-bottom: 1px solid gray;
  padding-left: 10px;
}

/* css style properties for the left part of home page (banner and boxes bellow it) */
.bodyContentLeft
{
  background-color: #FFF8DC;
}

/* css style properties for the right part of home page (news and events, comments, ...) */
.bodyContentRight
{
  background-color: #FFF8DC;
  padding: 2px;
  border-right: 1px solid gray;
  width: 300px;
}

.bodyContentRight table
{
  border: 2px solid #999999;
}

/* css style properties for 'news and events' title */

.newsAndEventsHeader h3
{
  color: white; 
  font-weight: bold; 
  text-transform: uppercase; 
  font-size: 13px;
}

*.newsAndEventsHeader
{
   width:100%;
   vertical-align: middle;
   padding-top: 2px;
   padding-left: 10px;
   height: 25px;
   background-color: #354964;
   border-bottom: 3px solid #BC9D25;
}

/* css style properties for 'news and events' box */
.latestNewsAndEvents
{
   padding: 5px; 
   border-top: 1px solid white; 
}

.newsItem
{
   text-align: center; 
   padding-left:30px; 
   padding-right: 30px; 
   padding-top: 10px; 
   padding-bottom: 10px;
   width: 100%;
}
.newsRead
{
   text-align: right;
   width: 100%;
   padding-right: 15px;
}


/* css style properties for 'comment' box (below 'news and events' box) */
.commentBody
{
  background-color: #ffffff;
  border-color: #000000;
}

/* css style properties for boxes below banner */
.bodyContentLeftBottomBox
{
   width: 33%;
   height: 250px;
   vertical-align: top; 
   border: 2px solid #999999;
}

/* ... and their title ... */
#titleBox
{
  padding-top: 4px;
  padding-left: 10px;
  height: 20px;
  background-color: #E6DEAB;
  border-bottom: 3px solid #BC9D25;
}

#titleBox h3
{
  color: #4B4B4B;
  text-transform: uppercase;
  font-size: 13px;
}

#titleBox a
{
  color: #4B4B4B;
  font-size:13px;
  font-weight:bold;
}
#titleBox p
{
  display: inline;
}

#rightTitleBox
{
  padding-top: 4px;
  padding-left: 10px;
  height: 20px;
  background-color: #354964;
  border-bottom: 3px solid #BC9D25;
}

#rightTitleBox h3
{
  color: white;
  text-transform: uppercase;
  font-size: 13px;
}

/* ... and their body ... */
#bodyBox
{
  padding: 15px;
}

#resourceBodyBox
{
  padding: 15px;
}

#resourceBodyBox table
{
  border: none;
}
#resourceBodyBox a
{
  color: #5C5C5C;
  font-style: italic;
  font-weight: bold;
  font-size: 12px;
}
#resourceBodyBox a:hover
{
  text-decoration: none;
}




/* 
  CONTENT PAGE STYLES 
  Modifying the styles below will change current look and feel of Gryphon content page
*/

/* css style properties for column that contains navigation menus */
.leftNavigationColumn
{
  vertical-align: top;
  background-color: #E6DEAB;
  width: 245px;
  border-right: 1px solid gray;
  border-left: 1px solid gray;
}

/* css style properties for column that contains main content of page */
.mainContentColumn
{
  vertical-align: top;
  background-color: #FFF8DC;
  border-right: 1px solid gray;
}

/* css style properties for title of main content */
#main_content .mainContentTitle
{
  vertical-align: middle; 
  border-left: 1px solid white;
  border-bottom: 1px solid #BC9D25;
  padding-left: 10px;
  background-color: #E6DEAB;
  width: 80%;
  height: 25px;
}

#main_content .mainContentTitle span
{
  font-family: Arial; 
  font-weight: bold; 
  font-size: 14px;
}

/* css style properties for 'Print' and 'Send' options */
#main_content .mainContentOptions
{
  border-left: 1px solid white;
  border-bottom: 1px solid #BC9D25;
  padding-left: 10px;
  background-color: #E6DEAB;
  width: 20%;
  height: 25px;
  vertical-align: middle;
}

/* 
  SNIPPET STYLES 
  Modifying the styles below will change current look and feel of Gryphon snippets
*/

#snippet_area
{
  padding-left: 10px;
}

#snippet_area table
{
   width: 250px; 
   border: 1px solid #BCBCBC;
   border-bottom: none;
   color: white;
}

#snippet_area table td
{
  width:100%;
  background-color: #2C3D56;
  border-bottom: 1px solid #BCBCBC;
  border-right: 1px solid #BCBCBC;
}

#snippet_title
{
  width: 100%;
  margin: 0px;
  /*padding-left: 5px;*/
  font-family: Tahoma;
  font-size: 10pt;
  background-color: #D8C98E;
  border-bottom: 3px solid #BC9D25;
  color: #4B4B4B;
}

#snippet_title h3
{
  color: black;
  text-transform: uppercase;
  font-size:11px;
  padding:1px 0px;
  text-decoration:none;
}

#snippet_body
{
  padding: 5px;
}

/* 
  COMPLIANCE ASSESSMENT STYLES 
  Modifying the styles below will change current look and feel of CA iPhone banner and its body
*/

#ca_banner
{
  width:100%; 
  border-top: 1px solid rgb(207, 207, 207); 
  margin-top: 29px;
}

#ca_banner div
{
  margin:0; 
  padding:0;
  padding-bottom:3px;
  padding-right:2px;
  color: navy;
  font-size: 1em;
  font-weight:bold;
  font-family: Verdana, Helvetica, Arial, sans-serif;
}

#ca_banner div .odd
{
  font-size: 1.1em;
}

#ca_banner div .even
{
   font-size: 0.8em;
}

/* css style properties for CA body */
#ca_out td
{
  font-family: Helvetica,Arial,Verdana,sans-serif;
  font-size: 11px;
}

#ca_out textarea
{
  font-family: Helvetica,Arial,Verdana,sans-serif;
  font-size: 11px;
}

/* END LOOK AND FEEL STYLES */

#linkMenu
{
	padding-left: 5px;
    text-align: left;
    width: 100%;
}

#linkMenu ul
{
text-align: left;
	list-style-type: none;
	padding: 0;
	margin: 0;
	line-height: 16px;
}

#linkMenu li
{
text-align: left;
	margin-top: 3px;
	list-style-type: none;
	background-image: url(../../images/4255_7286108_16400/li_bullet.gif);
	background-repeat: no-repeat;
	background-position: 0px 5px;
	padding-left: 10PX;
}


.tabbedMenuWrapper
{
	background-image: url(../../images/4228_1872351_40100/tabbed_bck.gif); 
	background-position: center; 
	background-repeat: repeat-x; 
	padding-left: 10px;
	background-color: #BC9D25;
	height: 36px;
	width: 100%;
	vertical-align: middle;
}



/* Tabbed Menu */
/* - - - ADxMenu: BASIC styles [ MANDATORY ] - - - */
/* remove all list stylings */
.wdkTabbedMenu, .wdkTabbedMenu ul {
	margin: 0;
	padding: 0;
	border: 0;
	list-style-type: none;
	display: block;
}

.wdkTabbedMenu li {
	margin: 0;
	padding: 0;
	border: 0;
	display: block;
	float: left;	/* move all main list items into one row, by floating them */
	position: relative;	/* position each LI, thus creating potential IE.win overlap problem */
	z-index: 5;		/* thus we need to apply explicit z-index here... */
	list-style-type: none;
}

.wdkTabbedMenu li:hover {
	z-index: 10000;	/* ...and here. this makes sure active item is always above anything else in the wdkTabbedMenu */
	white-space: normal;/* required to resolve IE7 :hover bug (z-index above is ignored if this is not present)
							see http://www.tanfa.co.uk/css/articles/pure-css-popups-bug.asp for other stuff that work */
}

.wdkTabbedMenu li li {
	float: none;/* items of the nested wdkTabbedMenus are kept on separate lines */
}

.wdkTabbedMenu ul {
	visibility: hidden;	/* initially hide all subwdkTabbedMenus. */
	position: absolute;
	z-index: 10;
	left: 0;	/* while hidden, always keep them at the top left corner, */
	top: 0;		/* 		to avoid scrollbars as much as possible */
}

.wdkTabbedMenu li:hover>ul {
	visibility: visible;	/* display subwdkTabbedMenu them on hover */
	top: 100%;	/* 1st level go below their parent item */
}

.wdkTabbedMenu li li:hover>ul {	/* 2nd+ levels go on the right side of the parent item */
	top: 0;
	left: 100%;
}

/* -- float.clear --
	force containment of floated LIs inside of UL */
.wdkTabbedMenu:after, .wdkTabbedMenu ul:after {
	content: ".";
	height: 0;
	display: block;
	visibility: hidden;
	overflow: hidden;
	clear: both;
}
.wdkTabbedMenu, .wdkTabbedMenu ul {	/* IE7 float clear: */
	min-height: 0;
}
/* -- float.clear.END --  */

/* -- sticky.subwdkTabbedMenu --
	it should not disappear when your mouse moves a bit outside the subwdkTabbedMenu
	YOU SHOULD NOT STYLE the background of the ".wdkTabbedMenu UL" or this feature may not work properly!
	if you do it, make sure you 110% know what you do */
.wdkTabbedMenu ul {
	background-image: url(../../images/5102-3025421-51070/empty.gif);	/* required for sticky to work in IE6 and IE7 - due to their (different) hover bugs */
	padding: 10px 30px 30px 30px;
	margin: -10px 0 0 -30px;
	/*background: #f00;*/	/* uncomment this if you want to see the "safe" area.
								you can also use to adjust the safe area to your requirement */
}
.wdkTabbedMenu ul ul {
	padding: 30px 30px 30px 10px;
	margin: -30px 0 0 -10px;
}
/* -- sticky.subwdkTabbedMenu.END -- */

/* - - - ADxwdkTabbedMenu: DESIGN styles [ OPTIONAL, design your heart out :) ] - - - */

.wdkTabbedMenu, .wdkTabbedMenu ul li {
	color: #eee;
	background: none;	
}

.wdkTabbedMenu ul {
	width: 15em;
}

.wdkTabbedMenu a {
	text-decoration: none;
	color: #eee;
	padding: .4em 1em;
	display: block;
	position: relative;
	border-left: 1px solid gray;
}

.wdkTabbedMenu a:hover, .wdkTabbedMenu li:hover>a {
	color: #fc3;
	background-color: gray;
}

.wdkTabbedMenu li li {	/* create borders around each item */
	border: 1px solid #ccc;
	background: #455770;
}

.wdkTabbedMenu ul>li + li {	/* and remove the top border on all but first item in the list */
	border-top: 0;
}

.wdkTabbedMenu li li:hover>ul {	/* inset 2nd+ subwdkTabbedMenus, to show off overlapping */
	top: 5px;
	left: 90%;
}

/* special colouring for "Main wdkTabbedMenu:", and for "xx subwdkTabbedMenu" items in ADxwdkTabbedMenu
	placed here to clarify the terminology I use when referencing subwdkTabbedMenus in posts */
.wdkTabbedMenu>li:first-child>a, .wdkTabbedMenu li + li + li li:first-child>a {
	color: white;
}

/* Fix for IE5/Mac \*//*/
.wdkTabbedMenu a {
	float: left;
}
/* End Fix */


/* Left Navigation Menu */
.wdkLeftNavMenu {
	width: 10em;/* VERY IMPORTANT! Set this to appropriate value, either here on down in the design section */
}

.wdkLeftNavMenu, .wdkLeftNavMenu ul {	/* remove all list stylings */
	margin: 0;
	padding: 0;
	border: 0;
	list-style-type: none;
	display: block;
}

.wdkLeftNavMenu li {
	margin: 0;
	padding: 0;
	border: 0;
	display: block;
	position: relative;	/* position each LI, thus creating potential IE.win overlap problem */
	z-index: 5;		/* thus we need to apply explicit z-index here... */
}

.wdkLeftNavMenu li:hover {
	z-index: 10000;	/* ...and here. this makes sure active item is always above anything else in the menu */
	white-space: normal;/* required to resolve IE7 :hover bug (z-index above is ignored if this is not present)
							see http://www.tanfa.co.uk/css/articles/pure-css-popups-bug.asp for other stuff that work */
}

.wdkLeftNavMenu ul {
	visibility: hidden;	/* initially hide all submenus. */
	position: absolute;
	z-index: 10;
	left: 0;	/* while hidden, always keep them at the top left corner, */
	top: 0;		/* 		to avoid scrollbars as much as possible */
}

.wdkLeftNavMenu li:hover>ul {
	visibility: visible;	/* display submenu them on hover */
	left: 100%;	/* and move them to the right of the item */
}

/* -- float.clear --
	force containment of floated LIs inside of UL */
.wdkLeftNavMenu:after, .wdkLeftNavMenu ul:after {
	content: ".";
	height: 0;
	display: block;
	visibility: hidden;
	overflow: hidden;
	clear: both;
}
.wdkLeftNavMenu, .wdkLeftNavMenu ul {	/* IE7 float clear: */
	min-height: 0;
}
/* -- float.clear.END --  */

/* sticky submenu: it should not disappear when your mouse moves a bit outside the submenu
	YOU SHOULD NOT STYLE the background of the ".wdkLeftNavMenu UL" or this feature may not work properly!
	if you do it, make sure you 110% know what you do */
.wdkLeftNavMenu ul {
	background-image: url(../../images/5102-3025421-51070/empty.gif);	/* required for sticky to work in IE6 and IE7 - due to their (different) hover bugs */
	padding: 30px 30px 30px 10px;
	margin: -30px 0 0 -10px;
	/*background: #f00;*/	/* uncomment this if you want to see the "safe" area.
								you can also use to adjust the safe area to your requirement */
}


/* - - - ADxMenu: DESIGN styles - - - */

.wdkLeftNavMenu, .wdkLeftNavMenu ul li {
	color: #eee;
	background: #2C3D56;
}

.wdkLeftNavMenu {
	width: 100% !important;
	width: 226px;
}

.wdkLeftNavMenu ul {
	width: 11em;
}

.wdkLeftNavMenu a {
	text-decoration: none;
	color: #eee;
	padding: .4em 1em;
	display: block;
}

.wdkLeftNavMenu a:hover, .wdkLeftNavMenu li:hover>a {
	color: #fc3;
background: #6B7C96;
}

.wdkLeftNavMenu li {	/* create borders around each item */
	border: 1px solid #ccc;
}
.wdkLeftNavMenu>li + li, .wdkLeftNavMenu ul>li + li {	/* and remove the top border on all but first item in the list */
	border-top: 0;
}

.wdkLeftNavMenu li:hover>ul {	/* inset submenus, to show off overlapping */
	top: 5px;
	left: 90%;
}

/* special colouring for "Main menu:", and for "xx submenu" items in ADxMenu
	placed here to clarify the terminology I use when referencing submenus in posts */
.wdkLeftNavMenu>li:first-child>a, .wdkLeftNavMenu li + li + li li:first-child>a {
	
}


#leftNavMenuWrapper
{ 
	padding: 10px; 
	width: 228px; 
	text-align: left;
padding-bottom: 0px;
}

#leftNavMenuTitle
{
	padding-top: 4px; 
	padding-left: 10px; 
	background-color: #D8C98E; 
	border-bottom: 3px solid #BC9D25; 
}

#leftNavMenuTitle h3
{
	color: #4B4B4B; 
	margin: 0px; 
	padding-left: 8px; 
	background-image: url(../../images/4247_1451015_41550/bullet.gif); 
	background-repeat: no-repeat; 
	background-position: center left;
}

/* Legal Menu */
#legalmenu ul 
{
	background-color: none;
	margin: 0px;	
	padding-top: 3px;
}

#legalmenu li {
	list-style-type: none;
	padding-right: 3px;
	padding-left: 8px;
	border-left: 1px solid gray;
	display: inline;
	font-size: 8pt;		
	vertical-align: top;
	margin: 0px;
}

#legalmenu li.legalmenuFirstChild 
{
	border: none;		
}

#legalmenu a 
{
	font-family: tahoma, verdana, arial;
	font-size: 8pt;		
	text-decoration: none;
	color: white;
}

#legalmenu a:hover 
{
	color: orange;
	text-decoration: underline;
}