/*
MDFINANCIAL.CMA.CA GLOBAL STYLESHEET 
(c) 2008 MD Financial
*/

/* 
CORPORATE BRANDING COLOURS
Text: #111
Header black #111
Header orange #e37222
Links: #000099
Links hover #4892db
*/

/* ARCHITECTURE */

body {
  margin: 0;
  padding: 0;
  font-family: verdana,arial,tahoma,helvetica,sans-serif;
  font-size: 68.7%;
  color: #111;
  background: #e5e5e5;
}

#wrapper {
  width: 980px;
  margin: 10px auto 0 auto;
  padding: 0;
  background: #fff url(../img/content-backgr.gif) repeat-y;
}

#header {
  width: 980px;
  height: 108px;
  background: #fff url(../img/headers/corporate-header.png) no-repeat;
  margin: 0;
}

#header-left {
  position: relative;
  float: left;
  width: 400px;
  height: 78px;
  border: 0;
}

#header-right {
  position: relative;
  float: right;
  width: 580px;
  height: 78px;
  text-align: right;
}

#content-wrapper {
  float: left;
  width: 720px;
  min-height: 790px;
  padding: 10px 14px 0 14px;
  background: #fff;
}

#main-top {
  width: 740px;
  height: 240px;
}

#promos {
  float: left;
  width: 540px;
  height: 200px;
}

#login-panel {
  float: right;
  width: 188px;
  height: 120px;
  text-align: center;
  padding: 10px 6px;
  background: #a2ad00 url(../img/login-panel-backgr.png);
}

#extras {
  float: right;
  width: 164px;
  height: 40px;
  margin: 10px 0 0 0;
  padding: 17px 6px 6px 30px;
  background: url(../img/extras-panel-backgr.png) no-repeat;
}

* html #promos, * html #login-panel, * html #extras {
  display:inline; /* IE 6 fix */
}

.left-panel {
  float: left;
  width: 370px;
  height: 40px;
  text-align: center;
  margin: 10px 0 0 0;
}

.right-panel {
  float: right;
  width: 370px;
  height: 40px;
  text-align: center;
  margin: 10px 0 0 0;
}

.panel {
  float: left;
  width: 230px;
  height: 190px;
  margin: 10px 0 0 0;
  border-right: 10px solid #fff;
}

.panel2 {
  float: left;
  width: 235px;
  height: 190px;
  margin: 10px 0 0 0;
  border-right: 5px solid #fff;
}

.panel3 {
  float: left;
  width: 235px;
  height: 190px;
  margin: 10px 0 0 0;
  border-left: 5px solid #fff;
}

#jTabs {
  width: 740px;
  margin: 10px 0 20px 0;
}

.unitvalues {
  float: left;
  width: 740px;
  height: 40px;
  margin: 0 0 20px 0;
  clear: both;
}

.news {
  float: left;
  width: 460px;
  height: 348px;
  border-right: 10px solid #fff
}

.publications {
  float: right;
  width: 240px;
  height: 210px;
}

.publications-top {
  width: 240px;
  height: 100px;
}

.publications-bottom {
  width: 240px;
  height: 110px;
  clear: left;
}

.companies {
  width: 720px;
  height: 10px;
  clear: both;
}

#social {
  margin: 0 0 30px 0;
  clear: left;
}

#sidebar {
  float: left;
  width: 200px;
  min-height: 680px;
  margin: 0 10px 0 0;
  padding: 0;
  background: #eee;
}

#site-search {
  float: left;
  width: 180px;
  margin: 20px 0 0 0;
  padding: 0;
}

#footer {
  width: 980px;
  height: 160px;
  background: #e5e5e5;
  margin: 10px 0 0 0;
  text-align: center;
  clear: both;
}

#cma-logos {
  width: 778px;
  margin: 0 auto;
  padding: 0;
  background: #fff;
  border-top: 1px solid #eee;
  border-left: 200px solid #eee;
  border-bottom: 1px solid #ddd;
}


/* TYPOGRAPHY */

#login-panel h1 {
  font: normal 1.3em arial,verdana,tahoma,sans-serif;
  color: #fff;
  margin: 0 0 14px 0;
  padding: 0;
}

#login-panel h1 span {
  font-size: 1.25em;
  font-weight: bold;
}

#login-panel h2 {
  font: normal 1.2em arial,verdana,tahoma,sans-serif;
  color: #fff;
  margin: 0 0 16px 0;
  padding: 0;
}

#login-panel p {
  font-size: 1.0em;
  color: #fff;
  margin: 0 0 4px 0;
  padding: 0;
}

#login-panel p a.login-btn {
  font-size: 1.0em;
  font-weight: bold;
  color: #111;
  margin: 0;
  padding: 6px 9px;
  background: #f0f0f0 url(../img/signon-btn-backgr.png);
  text-decoration: none;
  border: 1px solid #555;
}

#login-panel p a:hover.login-btn {
  color: #000099;
  text-decoration: none;
    background: #f0f0f0 url(../img/signon-btn-backgr2.png);
  border: 1px solid #000099;
}

#login-panel span.login-btn a {
  font-size: 1.0em;
  font-weight: bold;
  color: #111;
  margin: 0;
  padding: 6px 9px;
  background: #f0f0f0 url(../img/signon-btn-backgr.png);
  text-decoration: none;
  border: 1px solid #555;
}

#login-panel span.login-btn a:hover {
  color: #000099;
  text-decoration: none;
    background: #f0f0f0 url(../img/signon-btn-backgr2.png);
  border: 1px solid #000099;
}

#login-panel p a.quicklink {
  color: #fff;
  text-decoration: none;
}

#login-panel p a:hover.quicklink {
  color: #000099;
  text-decoration: none;
}

#extras a {
  color: #fff;
  text-decoration: none;
}

#extras a:hover {
  color: #000099;
  text-decoration: none;
}

#content-wrapper h1.segments-title {
  font: normal 1.1em arial,verdana,tahoma,sans-serif;
  color: #888;
  margin: 0 0 4px 0;
  padding: 0;
  border: 0;
}

.panel h1, .panel2 h1, .panel3 h1 {
  width: 236px;
  font: bold 1.5em arial,verdana,tahoma,sans-serif;
  line-height: 1.0em;
  color: #4892db;
  margin: 0 0 8px 0;
  padding: 0 0 8px 0;
  border-bottom: 1px solid #ddd;
}

.panel h1 span, .panel2 h1 span, .panel3 h1 span {
  font-size: 0.7em;
  font-weight: normal;
  color: #666;
}

.news h1, .publications h1, .companies h1 {
  font: bold 1.5em arial,verdana,tahoma,sans-serif;
  line-height: 1.7em;
  color: #e37222;
  padding: 0 0 4px 0;
  border-bottom: 1px solid #ddd;
}

.publications h1 {
  margin: 0 0 12px 0;
}

.unitvalues h1 {
  font: bold 1.5em arial,verdana,tahoma,sans-serif;
  line-height: 1.7em;
  color: #111;
  padding: 0 0 4px 0;
  border-bottom: 1px solid #ddd;
}

.unitvalues h1 a {
  color: #000099;
  text-decoration: none;
}

.unitvalues h1 a:hover {
  color: #a2ad00;
  text-decoration: none;
}

.unitvalues h1 a span {
  font-size: 0.65em;
  font-weight: normal;
  color: #666;
  text-decoration: none;
  padding: 0 0 0 12px;
}

.unitvalues h1 a:hover span {
  color: #000099;
  text-decoration: none;
}

.unitvalues p.date, #unitvalues-panel p.date {
  color: #a2ad00;
  margin: 0 0 10px 0;
}

.publications h4 {
  font-size: 1.0em;
  font-weight: bold;
  line-height: 1.2em;
  margin: 0 0 3px 0;
}

.publications h4 a {
  color: #000099;
  text-decoration: none;
}

.publications h4 a:hover {
  color: #4892db;
  text-decoration: none;
}

.publications p.date {
  line-height: 1.4em;
  color: #777;
}


#content-wrapper p a.download {
  color: #666;
  text-decoration: none;
}

#content-wrapper p a:hover.download {
  color: #4892db;
  text-decoration: none;
}

#content-wrapper p a {
  color: #000099;
  text-decoration: underline;
}

#content-wrapper p a:hover {
  color: #4892db;
  text-decoration: underline;
}

#footer p {
  font-size: 1.0em;
  color: #888;
  margin: 20px 0 0 0;
  padding: 0;
}


/* LISTS */

.panel ul, .panel2 ul, .panel3 ul, #tab1 ul.items {
  margin: 0;
  padding: 0;
  list-style: none;
}

.panel li, .panel2 li, .panel3 li, #tab1 ul.items li {
  display: block;
  font-size: 1.0em;
  margin: 0 0 16px 0;
  padding: 0;
}

.panel li a, .panel2 li a, .panel3 li a, #tab1 ul.items li a {
  color: #000099;
  text-decoration: none;
}

.panel li a:hover, .panel2 li a:hover, .panel3 li a:hover, #tab1 ul.items li a:hover {
  color: #4892db;
  text-decoration: none;
}

.news ul {
  margin: 10px 0 16px 0;
  padding: 0;
  list-style: none;
}

.news li {
  display: block;
  margin: 0 0 12px 0;
  padding: 0;
}

.news li a {
  font-size: 1.0em;
  font-weight: bold;
  line-height: 1.3em;
  color: #000099;
  text-decoration: none;
}

.news li a:hover {
  color: #4892db;
  text-decoration: none;
}

.news li a span {
  font-size: 0.9em;
  font-weight: normal;
  color: #888;
}

.news li a:hover span {
  color: #444;
  text-decoration: none;
}


/* TABULAR DATA */

/* IMAGES */

#header-left img {
  border: 0;
}

#promos img {
  border: 0;
}

.panel img, .panel2 img, .panel3 img {
  border: 0;
  vertical-align: middle;
  padding: 0 8px 0 0;
}

.unitvalues img, #unitvalues-panel img {
  border: 0;
  vertical-align: middle;
}

.news img {
  border: 0;
  margin: 18px 16px 0 0;
}

.publications img.icon {
  border: 0;
  vertical-align: middle;
  margin: 0 4px 0 0;
}

.companies img {
  margin: 12px 16px 0 0;
  border: 0;
}

.thumb img{
float: left;
margin: 0 8px 0 0;
border: 3px solid #ddd;
}

.thumb:hover img{
border: 3px solid #4892db;
}

.thumb:hover{
color: #4892db; /* irrelevant definition to overcome IE bug */
}

.news img.new-win {
  border: 0;
  margin: 0 0 0 4px;
  vertical-align: middle;
}


#cma-logos img {
  margin: 0 5px;
  padding: 15px;
  border: 0;
  vertical-align: middle;
}

a {
  outline: none;
}



/* FORMS */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

.drop {
  font: normal 1.0em verdana,arial,tahoma,sans-serif;
  color: #111;
  margin: 0;
  padding: 5px;
  border: 1px solid #ddd;
  background: #fff;
}

.drop-btn {
  font: bold 0.97em verdana,arial,tahoma,sans-serif;
  color: #111;
  margin: 0 0 0 10px;
  padding: 3px;
}

/* TOOLTIPS */

.glt-elm{
  position: absolute;
  left: 0;
  top: 0;
  width: 460px;
  color: #333;
  visibility: hidden;
  border: 1px solid #aaa;
  z-index: 999;
}

.glt-elm p{
  background: #eee;
  margin: 0;
  padding: 0.8em 0.5em;
  font-size: 1.0em;
  text-align: center;
  line-height: 1.5em;
}

.glt-elm img {
  display: block;
}


/* MAIN PAGE PROMOS */

.glidecontentwrapper {
  position: relative; /* Do not change this value */
  width: 520px;
  height: 198px; /* Set height to be able to contain height of largest content shown*/
  background: url(../promos/img/promo-backgr-f.png) no-repeat;
  border: 1px solid #ddd;
  overflow: hidden;
}
/*
	Total wrapper width: 350px+5px+5px=360px
	Or width of wrapper div itself plus any left and right CSS border and padding
	Adjust related containers below according to comments
*/

.glidecontent { /*style for each glide content DIV within wrapper.*/
  position: absolute; /* Do not change this value */
  background: #fff;
  padding: 0;
  visibility: hidden;
  width: 520px;
}
/*
 Total glidecontent width: 330px+10px+10px=350px
	Or width of wrapper div itself (not counting wrapper border/padding)
*/

.glidecontenttoggler { /*style for DIV used to contain toggler links. */
  width: 520px;
  margin-top: 6px;
  text-align: right; /*How to align pagination links: "left", "center", or "right"
background: white; /*always declare an explicit background color for fade effect to properly render in IE*/
}
/*
 Total contenttoggler width: 350px+5px+5px=360px
	Or total width of wrapper div (counting wrapper border/padding)
*/

.glidecontenttoggler a { /*style for every navigational link within toggler */
  display: -moz-inline-box;
  display: inline-block;
  font-weight: normal;
  color: #999;
  text-decoration: none;
  margin: 0 0 0 6px;
  padding: 4px 6px;
  border: 1px solid #ddd;
  background: #eee;
}

.glidecontenttoggler a.selected { /*style for selected page's toggler link. ".selected" class auto generated! */
  background: #ddd;
  color: #111;
}

.glidecontenttoggler a:hover {
  background: #ddd;
  color: #111;
}

.glidecontenttoggler a.toc { /*style for individual toggler links (page 1, page 2, etc). ".toc" class auto generated! */
}

.glidecontenttoggler a.prev, .glidecontenttoggler a.next { /*style for "prev" and "next" toggler links. ".prev" and ".next" classes auto generated! */
}

.glidecontenttoggler a.prev:hover, .glidecontenttoggler a.next:hover {
  background: #ddd;
  color: #111;
}

/* Promo Typography  */

.glidecontent h1 {
  font: normal 2.6em arial,verdana,tahoma,sans-serif;
  color: #fff;
  margin: 0;
  padding: 16px 0 0 240px;
}

.glidecontent h2 {
  font: normal 1.6em arial,verdana,tahoma,sans-serif;
  color: #fff;
  margin: 0;
  padding: 0 0 0 240px;
}