@charset "utf-8";
/* CSS Document */


/*

The padding property can have from one to four values.

padding:25px 50px 75px 100px;
top padding is 25px
right padding is 50px
bottom padding is 75px
left padding is 100px

padding:25px 50px 75px;
top padding is 25px
right and left paddings are 50px
bottom padding is 75px

padding:25px 50px;
top and bottom paddings are 25px
right and left paddings are 50px

padding:25px;
all four paddings are 25px

*/


html {
	background: #E6E3D4;
}




body {

	font: 100% Georgia, "Times New Roman", Times, serif;

	line-height: 1.2; /* */
	margin: 0 auto;
/*	padding-bottom: 20em; */

	width: 95%;
    width: 60%; /* this comes from the largest screen query */
/* paul: ... have changed this to 60% */
/*paul: to display on Jamie's screen width needs to be 95%!!! */

}


/* this was the color on Jamie's screen and all looked good */
@media only screen and (max-width:1280px) {
body {
	width: 95%;
}
} /* end media query */



@media only screen and (min-width:1280px) {
body {
	width: 95%;
}
} /* end media query */



@media only screen and (min-width:1440px) {
body {
	width: 75%;
}
} /* end media query */




@media only screen and (min-width:1600px) {
body {
	width: 70%;
}
} /* end media query */




@media only screen and (min-width:1680px) {
body {
	width: 60%;
}
} /* end media query */






/*new: added shadow */
h1.shadow, h2.shadow, h3.shadow {
	font-weight: normal;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75);
	color: #575451; 

}

/*new: added shadow */
h1, h2, h3 {
	font-weight: normal;

}

h1.shadow {
	font-size: 1.8em;
}

h2.shadow {
	font-size: 1.5em;
}


/* for the ETF Sage logo and text only */ 
h1.LogoLine1, p.LogoLine1 {
	font: 100% Georgia, "Times New Roman", Times, serif;
	font-size: 3.4em;
	padding-top:8px;
    margin-top:8px;
	padding-left:80px;
	margin-bottom: 0;
	padding-bottom: 0; 
}

/* for the ETF Sage logo and text only */ 
p.LogoLine2 {
	font-size: 1.2em;
	padding-left: 70px;
	margin-left: 70px;
	padding-right: 10px;
	margin-right: 10px;
	margin-top: 0;
	padding-top: 0;
	margin-bottom: 0;
	padding-bottom: 0; 
}



/* for the ETF Sage logo and text only */ 
img.TextWrapLeft {
	float: left;
	margin: 10px;
	padding-left: 5px;
	padding-right: 10px;
}





/* for wrapping images and text: not ETF Sage logo */ 
img.TextWrapLeft2 {
	float: left;
	margin: 10px;
	padding-left: 10px;
	padding-right: 20px;
}



/* IE puts a blue order around some images, remove it */
img
{  border-style: none;
}



/* to display Info icon: position high */ 
img.InfoHigh {
	position:relative;
	top: -6px;
}


/* to display Canada icon: position high */ 
img.Canada {
	position:relative;
	top: -15px;
	left: +5px;
}


/* right-justify display image */ 
img.right {
	float: right;
}



img.em {
	position:relative;
	top: +7px;
}



/* used to clear floating elements */ 
/* floating elements created with: img.TextWrapLeft / img.TextWrapLeft2 */ 
p.clear, h1.clear, h2.clear {
	clear: both;
}

/* Padding is inside the element and margin is outside the element. The border, strangely enough, sits inbetween them */
h2 {
	font-size: 1.4em;
	margin-bottom: .5ex;
	/*margin-bottom: .5ex;*/ 
	/*padding-bottom: .5ex; */
}

h3 {
	font-size: 1.2em; 
	/*margin-bottom: 0; */
	/*padding-bottom: 0; */
	margin-bottom: .5ex; 
	padding-bottom: .5ex; 
}

h3.special {
	font-size: 1.2em; 
	/*margin-bottom: 0; */
	/*padding-bottom: 0; */
	margin-bottom: 0; 
	padding-bottom: 0; 
}

/* class="special2" - used in footer */
h3.special2, #etf-cats h3 {
	font-size: 1.2em; 
	/*margin-bottom: 0; */
	/*padding-bottom: 0; */
	margin-top: 0; 
	padding-top: 0; 
	margin-bottom: .5ex; 
	padding-bottom: .5ex; 
}

h3.products {
	font-size: 1.4em;
/*	color: #035c7c; */
	color: #d35537; /* red */
}


/* to display ETF Category */
h2.Category
 {
	background-color: #ebebeb; /* grey */
	background-color: #fc9200;
	padding-left:5px;
}


p {

	font: 100% verdana; /* fav */
	font-size: 1em;
	line-height: 1.3; /* */
}


p.special {
	font-size: 1em;
	margin-top: 0; 
	padding-top: 0;
}

p.special2 {
	margin-bottom: 0; 
	padding-bottom: 0;
}





code {
	font-size: 1em;
	/*margin-bottom: .5ex;*/ 
	/*padding-bottom: .5ex; */
}

/* for my indented address links */
a.nonmenu {
	font-size: 1em;
	/*margin-bottom: .5ex;*/ 
	/*padding-bottom: .5ex; */
}

/* for address links in black color, not blue & no underline */
a.black {
	color: #000000; /* black */
	text-decoration: none; /* remove underline from link */
}

/* for Disclaimer & Terms of Use: in red color, not blue & no underline */
a.red {
	color: #ff0000; /* red */
	text-decoration: none; /* remove underline from link */
}


/* for Disclaimer & Terms of Use: in red color, not blue & no underline */
a.lightgrey {
	color: #888888; /* lightgrey */
	text-decoration: none; /* remove underline from link */
}


/* for main page comments (mutual fund fees Vs ETF fees): in nice blue not normal blue & no underline */
a.blue {
	color: #084886; /* nice blue */
	text-decoration: none; /* remove underline from link */
}




a.black:hover {
	background: none;
	text-decoration:underline; 	
}

/* for address links in ETF Sage-logo color, not blue & no underline */
a {

	/*	color: #15afcb;
	color: #2694a9;*/
	/*color: #035c7c; /* ETF Sage-logo color */
	text-decoration: none; /* remove underline from link */
}

a:hover {
	background: none;
	text-decoration:underline; 	
}




/*micro-clearfix by Nicolas Gallagher http://nicolasgallagher.com/micro-clearfix-hack/*/
/* For modern browsers */
.cf:before, .cf:after {
	content:"";
	display:table;
}

.cf:after {
	clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.cf {
	zoom:1;
}
/*horizontal menu styles*/	


/* main menu nav: horizontal line */
/*
nav {
	background: #fc9200; 
	height: 2.1em;
}

*/


ul.topmenu {
	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
	background: #006da6; /* nice blue */
	height: 2em;
	width: 100%;

	font: 100% Georgia, "Times New Roman", Times, serif;
	font-size: 0.95em;

}
li.topmenu {
	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
	position: relative;
}
/* CSS for list item and links (ie anchors) */
/* added this */
/* note the anchors do not reference topmenu or submenu but because they are held within ul's defined such */
ul.submenu, ul.topmenu li a {
	display: block;
	line-height: 1.8em;
	padding: 0 1em;
	color: white;
	text-decoration: none;
	z-index:3; 
}

/* added this */
ul.topmenu li a:hover, ul.topmenu li:hover > a {
	background: #035c7c;
	height: 1.8em;
	padding-top: .3em;
	position: relative;
	top: -.3em;
	border-radius: .3em .3em 0 0;
	text-decoration: none; /* remove underline from link */
}
/* you can just have:
.current, a:hover.current, .topmenu li:hover a.current

or

ul.current, a:hover.current, ul.topmenu li:hover a.current

both work */
 
ul.current, a:hover.current, ul.topmenu li:hover a.current {
	background: #AD9B7F;
	color: #eee;
	padding-top: .3em;
	border-radius: .3em .3em 0 0;
	position: relative;
	top: -.3em;
	border-bottom: .3em solid #917F63;
	cursor: default;
}
/*dropdown menu styles*/
ul.submenu {
	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
	height: 1.8em;
	width: 100%;
	
	float: none;
	background: #035c7c;
	width: auto;
	height: auto;
	position: absolute;
	top: 1.8em;
	left: -9000em;
}
ul.submenu li {
	float: none;
}
ul.topmenu li:hover ul {
	left: 0;
}
ul.submenu li a {
	border-bottom: 1px solid white;
	padding: .2em 1em;
	white-space: nowrap;
}
ul.submenu li:last-child a {
	border-bottom: none;
}
ul.submenu li a:hover {
	background: #15afcb;
	height: 1.8em;
	padding-top: .2em;
	top: 0;
	border-radius: 0;
	text-decoration: none; /* remove underline from link */
}
/* by P */
/* by P */
/* by P*/
p.indent  {
		padding-left:5%;
		background: /*#f8f6f2; */ #e1d2af;
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-right: 5%;
	padding-top: 1%;
	padding-bottom: 1%;
}

p.indent2  {
		padding-left:5%;
		background: /*#f8f6f2; */ #e1d2af;
	/* Padding is inside the element and margin is outside the element.   The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-right: 5%;
	padding-top: 0;
	padding-bottom: 0;
}

p.font7 {
	font: 100% comic sans MS, new york, times;
	font-size: 0.7em;
}


p.font8 {
	font: 100% comic sans MS, new york, times;
	font-size: 0.8em;
}

p.font9 {
	font: 100% comic sans MS, new york, times;
	font-size: 0.9em;
}


img.indent {
			padding-left:5%;
}

img.indent2 {
			padding-left:15%;
}

div.indent {
	padding-left:5%;
	background: #e1d2af;
	
	padding-right: 5%;
	padding-top: 1%;
	padding-bottom: 1%;
}

div.indent2 {
	padding-left:5%;
/*	background: white; */
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-right: 5%;
	padding-top: 1%;
	padding-bottom: 1%;
}

/* smaller left padding, ie smaller indent */
div.indent3 {
	padding-left:2%;
/*	background: white; */
	/* Padding is inside the element and margin is outside the element.   The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-right: 5%;
	padding-top: 1%;
	padding-bottom: 1%;

}


/* use with p class="special" when you want script example type columns as in script-analysis-surprise-your-reader.html but without the colored background and large top/bottom margins */
div.indent4 {
	padding-left:5%;
/*	background: white; */
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-right: 5%;
	padding-top: 0;
	padding-bottom: 0;
}


/* smaller left padding, no top/bottom padding */
div.indent5 {
	padding-left:5%;
	background: /*#f8f6f2; */ #e1d2af;
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-right: 5%;
	padding-top: 1%;
	padding-bottom: 1%;
}

/* added: img.indent6 */
div.indent6, img.indent6 {
	padding-left:3%;
/*	background: white; */
	/* Padding is inside the element and margin is outside the element.   The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-right: 5%;
	padding-top: 0;
	padding-bottom: 0;

}


div.indent7 {
	background: #e1d2af;
	padding-left:2%;
	padding-right: 5%;
	padding-top: 0.5%;
	padding-bottom: 0.5%;
}


div.indent8 {
	padding-left:2%;
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-right: 0%;
	padding-top: 0;
	padding-bottom: 0;
}


div.indent9 {
	padding-left:5%;
	background: #e1d2af;
	
	padding-right: 5%;
	padding-top: 0.5%;
	padding-bottom: 0.5%;
}





/* the new version used for the disclaimer */
div.footer-testimonials {
	font: 100% comic sans MS, new york, times;
	font-size: 0.9em;
	text-align:center;
	color: #ff0000; /* red */
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-top: 1%;
	padding-bottom: 1%;
}


/* the orginal version */
div.footer-testimonials-original {
	font: 100% comic sans MS, new york, times;
	font-size: 0.8em;
	text-align:center;
	color: #084886; /* nice blue */
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-top: 0;
	margin-top: 0;
	padding-bottom: 0;
	margin-bottom: 0;
}



div.SmallText {
	font: 100% comic sans MS, new york, times;
	font-size: 0.8em;
	text-align:center;
	color: black;
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-top: 0.5%;
	padding-bottom: 0.5%;
}





center
{ 
	text-align:center;
}


red {
	color: #e40045;
}

lightred {
	color: #ff0000; /* red */
}


lightgrey {
	color: #888888;
}



/* Screenplay stuff */
div.script {
	   /* font: 14px/16px Courier,"Courier New",monospace !important;*/ 				    font: 1em Courier,"Courier New",monospace !important;
	padding-left:5%;
	max-width: 18cm;
	background: #f8f6f2;
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	/*margin-bottom: .5ex;*/ 
	padding-right: 5%;
	padding-top: 1%;
	padding-bottom: 1%;
}


/*paul: new, changed all 1.2 to 1, except menu and a few other places */

/* mod for my unordered lists */
li.extra {
    font-size: 1em;
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	margin-bottom: 1.5ex;
/*	padding-bottom: 1em;*/
}

/* mod for my unordered lists: smaller margin-bottom */
li.extra2 {
    font-size: 1em;
			/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	margin-bottom: 0.8ex;
/*	padding-bottom: 1em;*/
}

/* mod for my unordered lists */
/* added */
li.extra3 {
	font: 100% verdana; /* fav */
	font-size: 1em;
	margin-bottom: 1.1ex;
}


/* mod for my unordered lists */
li.arrows {
	font: 100% verdana; /* fav */
    font-size: 0.9em;
  	line-height: 1.2em;
	list-style-image:url('/etf-images/arrow4.jpg');
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	margin-left: 0.1em;
	margin-right: 0.1em;
	margin-top: 0.2ex;
	margin-bottom: 1.2ex;

  	padding-top: 0.1em;
  	padding-bottom: 0.1em;
  	padding-right: 0.1em;
  	padding-left: 0.1em;
}



/* mod for my unordered lists */
li.circle {
    font-size: 1em;
	list-style-type: circle;
	/* Padding is inside the element and margin is outside the element.  The border, strangely enough, sits inbetween them */
	margin-bottom: 1.5ex;
/*	padding-bottom: 1em;*/
}

/* mod for my unordered lists: remove bullets */
ul.nobullets {
	list-style-type: none;
}

/* for class "special" - unorder lists */
ul.extra {
	margin-top: 0;
    padding-top: 0;
	margin-bottom: 0;
    padding-bottom: 0;

}

/* for class "table1" - table stuff: black, single border, not double */
table.table1, th.table1,td.table1
{
	border-collapse:collapse; /* I don't want a double border */
	border: 2px solid black;
}

/* for class "table2" - table stuff: purple, single border, not double */
table.table2, th.table2, td.table2
{
	border-collapse:collapse;  /* I don't want a double border */
	border: 2px solid #800080; /*purple */
}


/* for class "table3" - table stuff: purple, single border, not double, nice light blue background */
/* used on Nicholl artile */ 
table.table3, th.table3, td.table3
{
	border:1px solid #800080; /* purple */
	border-collapse:collapse; /* I don't want a double border */
	background-color:#b4caee; /* nice light blue */
}


/* for class "center" - center align table text */
/* used on Nicholl artile */ 
td.center
{
	border:1px solid #800080; /* purple */
	border-collapse:collapse; /* I don't want a double border */
	background-color:#b4caee; /* nice light blue */
	
	text-align:center;
}




/* for class "form" - table stuff: increase text size */
table.form
{
    font-size: 1.1em;
}


/* for class "form" - table stuff: don't increase text size again otherwise it will be super-large*/
table.form, th.form, td.form
{
	border:1px solid #800080; /* purple */
	border-collapse:collapse; /* I don't want a double border */
	background-color:#b4caee; /* nice light blue */
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 2.5px;
	padding-bottom: 2.5px;
}


/* If you wanted to set table headings to a distinct background color then use:
/* for class "form" - table stuff
th.form
{
	border-style:solid;
	background-color:#4bacc6;
	/*background-color:#99b1d8; /* dark blue
}
*/


/* for class "noborder" - table has no border */
table.noborder, td.noborder, tr.noborder
{
	border: none;
	margin-top: 0;
	padding-top: 0;
}




/* for class "footer" - underordered list */
ul.footer ul{
    margin:0;
    padding:0;
    list-style:none;
}


/* for class "footer" - list item and anchors/links */
li.footer, a.footer {
  /* specify nice horizontal alignment */
  width:120px;
  display:block;
  float: left;
  text-align:center;
  font-size: 0.9em;
  
  /* re-worked NAV menu code to stop NAV code */
  display: block;
  line-height: 1em;
  padding: 0 1em;
  color: black;
/*  text-decoration: none; */
}

/* for class "footer" - list item */
li.footer {
	background: none;
}

/* for class "footer" - anchors/links: on hover */
a.footer:hover {
	background: none;
	text-decoration:underline; 	
}






/* for class "footer2" - anchors/links */
/* use >> in orange as anchor tag */
a.footer2:before, a.type2:before {
	font-size: 1.4em;
	content: "\00BB \0020";
	color: #f17521;
}

/* for class "footer2" - list item and anchors/links */
a.footer2, a.type2 {
  /* re-worked NAV menu code to stop NAV code */
  display: block;
  line-height: 0.5em;
  /* changed from: padding: 0.1em 1em; */
  padding-top: 0.1em;
  padding-bottom: 0.1em;
  padding-right: 1em;
  padding-left: 0.5em;

  color: black;
  /* adjust font size too */
  font-size: 0.9em;
  /* remove underline */
  text-decoration: none;
}


/* for ETF menu on Index.php page */
ul.etf-menu {
  line-height: 1em;
  /* changed from: padding: 0.1em 1em; */
  margin-top: 0em;
  margin-bottom: 0.1em;

  padding-top: 0em;
  padding-bottom: 0.1em;
  padding-right: 1em;
  padding-left: 1.5em;

}


/* for class "footer2" - anchors/links: on hover */
a.footer2:hover, a.type2:hover {
	background: none;
	text-decoration:underline;
}




/* START: category jump menu */
/* START: category jump menu */
/* START: category jump menu */

/* for class "category-jump-menu" - underordered list */
ul.category-jump-menu ul{
    margin:0;
    padding:0;
    list-style:none;
}


/* for class "category-jump-menu" - list item and anchors/links */
li.category-jump-menu, a.category-jump-menu {
  /* specify nice horizontal alignment */
  width:108px;
  display:block;
  float: left;
  text-align:center;
  font-size: 0.9em;
  
  /* re-worked NAV menu code to stop NAV code */
  display: block;
  line-height: 1em;
  padding: 0 1em;
  color: black;
/*  text-decoration: none; */
}



/* for class "category-jump-menu" - list item */
li.category-jump-menu {
	background: none;
}

/* for class "category-jump-menu" - anchors/links: on hover */
a.category-jump-menu:hover {
	background: none;
	text-decoration:underline; 	
}


/* END: category jump menu */
/* END: category jump menu */
/* END: category jump menu */






/* START: category jump menu Vlonger */
/* START: category jump menu Vlonger */
/* START: category jump menu Vlonger */

/* for class "category-jump-menuVlonger" - underordered list */
ul.category-jump-menuVlonger ul{
    margin:0;
    padding:0;
    list-style:none;
}


/* for class "category-jump-menuVlonger" - list item and anchors/links */
li.category-jump-menuVlonger, a.category-jump-menuVlonger {
  /* specify nice horizontal alignment */
  width:160px;
  display:block;
  float: left;
  text-align:center;
  font-size: 0.9em;
  
  /* re-worked NAV menu code to stop NAV code */
  display: block;
  line-height: 1em;
  padding: 0 1em;
  color: black;
/*  text-decoration: none; */
}



/* for class "category-jump-menuVlonger" - list item */
li.category-jump-menuVlonger {
	background: none;
}

/* for class "category-jump-menuVlonger" - anchors/links: on hover */
a.category-jump-menuVlonger:hover {
	background: none;
	text-decoration:underline; 	
}


/* END: category jump menu Vlonger */
/* END: category jump menu Vlonger */
/* END: category jump menu Vlonger */







/* #col1 definition moved to within media query */


/* #col2 definition moved to within media query */


/* CSS ID - can only be referenced once on any given page */
div#footer-col1 {
	width: 30%;
	float: left;
	padding: 10px 0 10px 5px;
	font-size: 0.9em;
}

/* CSS ID - can only be referenced once on any given page */
div#footer-col2 {
	width: 50%;
	float: left;
	padding: 10px 0 10px 0;
	font-size: 0.9em;
}





/* CSS ID - can only be referenced once on any given page */
/* changed the name of this from: #content-below */
#content-below-clear {
	clear: both;
}

/* CSS ID - can only be referenced once on any given page */
p#copyright  {
    text-align: right;
	color: #888888;
	font-size: 0.8em;
}


/* added for ETF Sage: START */
/* added for ETF Sage: START */
/* added for ETF Sage: START */

/* 3x div columns */
div.div3x-col1 {
	width: 25%;
	float: left;
	padding: 10px 0 10px 5px;
	font-size: 1em;
}

/* 3x div columns */
div.div3x-col2 {
	width: 25%;
	float: left;
	padding: 10px 0 10px 0;
	font-size: 1em;
}


/* 3x div columns */
div.div3x-col3 {
	width: 25%;
	float: left;
	clear: right;
	padding: 10px 0 10px 0;
	font-size: 1em;
}



/* 2x div columns */
div.div2x-col1 {
	width: 48%;
	float: left;
	padding: 10px 0 10px 5px;
	font-size: 1em;
}


/* 2x div columns */
div.div2x-col2 {
	width: 48%;
	float: left;
	clear: right;
	padding: 10px 0 10px 0;
	font-size: 1em;
}


/* 2x div columns */
div.div2xV2-col1 {
	width: 65%;
	float: left;
	padding: 10px 0 10px 5px;
	font-size: 1em;
}



/* 2x div columns */
div.div2xV2-col2 {
	width: 25%;
	float: left;
	clear: right;
	padding: 10px 0 10px 0;
	font-size: 1em;
}


div.clear {
	clear: both;
}



/* is this used???? */
h2.normal
{
	font-weight: normal;
	text-shadow: none;
	color: black;
	font-size: 1.4em;
	margin-bottom: .5ex;
}





/* START: ETF FACTS TABLE */
/* START: ETF FACTS TABLE */
/* START: ETF FACTS TABLE */


/* table: for ETF facts */
table.table-etf-facts
{
	font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
	font-size: 12px;
	margin-left: 5px;
	width: 400px;
	text-align: left;
	border-collapse: collapse;
	border: 1px solid #69c;
}


/* table: for ETF facts */
th.table-etf-facts
{
	font-size: 13px;
	font-weight: normal;
	padding: 8px;
	background: #ebf5fe; /* bkg for heading: light blue */
	border:none; /* this is required due to above and then below */
	border-bottom: 1px solid #b8bcbf; /* grey */
}

/* table: for ETF facts */
td.table-etf-facts
{
	padding: 8px;
	color: #669;
	border:none;
}

/* table: for ETF facts */
td.table-etf-facts-red
{
	padding: 8px;
	color: red;
	border:none;
}

/* table: for ETF facts */
tr.table-etf-facts-odd
{
	background: #f6f6f6; 
}


/* table: for ETF facts */
tr.table-etf-facts:hover td, tr.table-etf-facts-odd:hover td
{
	background: #d0dafd;
	color: #339;
}

/* 
#table1 tr:hover td
ul.topmenu li a:hover, ul.topmenu li:hover > a { */


/* END: ETF FACTS TABLE */
/* END: ETF FACTS TABLE */
/* END: ETF FACTS TABLE */





/* START: ETF MAIN CATEGORY MENU TABLE */
/* START: ETF MAIN CATEGORY MENU TABLE */
/* START: ETF MAIN CATEGORY MENU TABLE */

/* table: for ETF Main Category Menu */
table.table-etf-main-category-menu
{
	font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
	font-size: 12px;

	font-family: Verdana, Arial; /* fav */
    font-size: 0.9em;

	margin-left: 5px;
	width: 900px;
	text-align: left;
	border-collapse: collapse;
	border: 1px solid #69c;
}


/* table: for ETF Main Category Menu */
th.table-etf-main-category-menu
{
	font-size: 13px;
	font-weight: normal;

	font-family: Verdana, Arial; /* fav */
    font-size: 0.9em;


	padding: 8px;
	background: #ebf5fe; /* bkg for heading: light blue */
	border:none; /* this is required due to above and then below */
	border-bottom: 1px solid #b8bcbf; /* grey */
}

/* table: for ETF Main Category Menu */
td.table-etf-main-category-menu
{

	font-family: verdana; /* fav */
    font-size: 0.9em;

	padding: 8px;
	color: #669;
	border:none;
}

/* table: for ETF Main Category Menu */
td.table-etf-main-category-menu-red
{
	padding: 8px;
	color: red;
	border:none;
}

/* table: for ETF Main Category Menu */
tr.table-etf-main-category-menu-odd
{
	background: #f6f6f6; 
}


/* table: for ETF Main Category Menu */
tr.table-etf-main-category-menu:hover td, tr.table-etf-main-category-menu-odd:hover td
{
	background: #d0dafd;
	color: #339;
}

/* 
#table1 tr:hover td
ul.topmenu li a:hover, ul.topmenu li:hover > a { */

/* END: ETF MAIN CATEGORY MENU TABLE */
/* END: ETF MAIN CATEGORY MENU TABLE */
/* END: ETF MAIN CATEGORY MENU TABLE */








div.workspace {
	padding-left:2%;
	background: #fbfbfb; /* slightly dirty white */
	background: #e1d2af;
		background:none;
	padding-right: 2%;
	padding-top: 1%;
	padding-bottom: 1%;
}


div.table-border {
	width:405px;
	padding: 5px;
	margin: 5px;
	background:white;
	left-padding:10px;
	left-margin:10px;
}

div.table-border-cat-menu {
	width:905px;
	padding: 5px;
	margin: 5px;
	background:white;
	left-padding:10px;
	left-margin:10px;
}

/*
p {
		font: 100% georgia;
		font: 100% helvetica; /*hate*/ 
/*		font: 100% arial;
		font: 100% times;
		font: 100% "Times New Roman";
		font: 100% verdana; /* fav */

	/*font-size: 1.1em;
}*/


p.warning1 {
	margin-top: 0.1em; 
	padding-top: 0.1em;
	margin-bottom: 0; 
	padding-bottom: 0;
	line-height: 1; /* */
	font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
	font-size: 10px;
	text-align: right;
	color: #669;
}


small
{
	font-size: 10px;
	text-align: right;
}


/* decided not to use this */
h1.t1
{

	font-weight: normal;
	text-shadow: none;
	font: 100% verdana; /* fav */
	font-size: 1.6em;
	margin-bottom: .5ex;

}

/* decided not to use this */
h2.t1
{

	font-weight: normal;
	text-shadow: none;
	font: 100% verdana; /* fav */
	font-size: 1.4em;
	margin-bottom: .5ex;

}

/* decided not to use this */
h3.t1
{

	font-weight: normal;
	text-shadow: none;
	font: 100% verdana; /* fav */
	font-size: 1em;
	margin-bottom: .5ex;

}














/*etfnavmenu*/

/* for tabs, ie tab menu */
#etfnavmenu {
	position:relative;
	float:left;
	width:100%;
	padding:0 0 1.75em 1em;
	margin:0;
	list-style:none;
	line-height:1em;
	z-index:1; 
}

/* for tabs, ie tab menu */
#etfnavmenu LI {
	float:left;
	margin:0;
	padding:0;
}

/* for tabs, ie tab menu */
#etfnavmenu A {
	display:block;
	color:#444;
	text-decoration:none;
	font-weight:bold;
	background:#ddd;
	margin:0;
	padding:0.25em 1em;
	border-left:1px solid #fff;
	border-top:1px solid #fff;
	border-right:1px solid #aaa;
}

/* for tabs, ie tab menu */
#etfnavmenu A:hover,
#etfnavmenu A:active,
#etfnavmenu A.here:link,
#etfnavmenu A.here:visited {
	background:#bbb;
}

/* for tabs, ie tab menu */
#etfnavmenu A.here:link,
#etfnavmenu A.here:visited {
	position:relative;
/*	z-index:102; */
}


/*subnav*/
/* for tabs, ie tab menu */
#etfnavmenu UL {
	position:absolute;
	left:0;
	top:1.5em;
	float:left;
	background:#bbb;
	width:100%;
	margin:0;
	padding:0.25em 0.25em 0.25em 1em;
	list-style:none;
	border-top:1px solid #fff;
}

/* for tabs, ie tab menu */
#etfnavmenu UL LI {
	float:left;
	display:block;
	margin-top:1px;
}

/* for tabs, ie tab menu */
#etfnavmenu UL A {
	background:#bbb;
	color:#fff;
	display:inline;
	margin:0;
	padding:0 1em;
	border:0
}
/* for tabs, ie tab menu */
#etfnavmenu UL A:hover,
#etfnavmenu UL A:active,
#etfnavmenu UL A.here:link,
#etfnavmenu UL A.here:visited {
	color:#444;
}