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

/* This style controls the list <LI tags> by removing the bullets and to control the spacing inside and outside the list */
ol#button {list-style: none; margin: 0; padding: 0; clear: both;}

  /* This part controls the button portion on the left */
  ol#button li {background: #bdf url(http://www.scotiabank.com/borrowing/Mortgage/Images/generalButtons.gif); float: left; margin: 0px; padding-left: 10px;}       
  
  /* This part controls the button portion on the right */
  ol#button a {background: url(http://www.scotiabank.com/borrowing/Mortgage/Images/generalButtons.gif) 100% 0; float: left; height: 26px; padding-right: 30px; padding-top: 2px; text-decoration: none; }    
  	
  /* This style controls the text & spacing in the button */
  ol#button li.current a {color: #cc0000; font-weight: bold; padding: 5 50 0 0; }

/* This style controls the list <LI tags> by removing the bullets and to control the spacing inside and outside the list */
ol#toc {height:28px; list-style:none; margin:0px; padding:0px; width:550px; clear:left; font-weight:bold; text-align:center; position:relative;}

  /* Each tab should float to the left and listed horizontally. Also this line controls the spacing between the tabs */
  ol#toc li {background:#bdf url(/Banking/Images/d2dTabs.gif); float:left; margin: 0px; padding: 0 0 0 10px;}       
  
  /* 100% 0 means 100% to the right, no offset vertically */
  ol#toc a {background: url(/Banking/Images/d2dTabs.gif) 100% 0; color:#333; display:block; float:left; padding: 6px 10px 6px 0; text-decoration: none; height:16px;}    
  
  /* This style controls that state of the selected tab.  */
  ol#toc li.current {background-color: #cc0000; background-position: 0 -44px;}
  
  /* This style controls the text & spacing around the ON state tab */
  ol#toc li.current a {background-position: 100% -44px; color:#fff; font-weight:bold; color:#CC3333;}

/* This is for the gray line under the navigation */
.line {border-top:1px #ccc solid; clear:left; width:550px; height:15px;}

div.Bottom {background: url(http://www.scotiabank.com/Banking/Images/bottom.gif); width: 100%; height: 3em;}

.topBanner {margin-bottom: 15px; float: left; width: 550px; height:}

#mainContainer {margin-bottom: 20px; float: left; width: 551px; background-color:#FFF; clear: both;}
.containerLeft {float: left; *margin-top: 10px ;width: 345px;}
.containerRight {float: right; *margin-top: 10px; width: 200px;}

#OverviewContainer {float: left; width: 550px; clear: both;}
.containerTop {background: url(http://www.scotiabank.com/Banking/Images/top.gif); *width: 100%; height: 2em; padding-left: 10px; padding-top: 5px; font-weight:bold}
.containerBottom {background: url(http://www.scotiabank.com/Banking/Images/bottom.gif); *width: 100%; height: 2em; width: 550px; margin-bottom: 30px; }
#example {width: 550px; margin-top: -4px; *margin-top: 0px;}
#navigation {clear: both;}

/* ------- This section is for the second level tabs ------------ */

/* Caution! Ensure accessibility in print and other media types... */
/* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
@media projection, screen { 
    .tabs-hide { display: none; }
}


/* Hide useless elements in print layouts... */
@media print {
  .tabs-nav {display: none;}
}

/* Skin */
.tabs-nav {background: url(http://www.scotiabank.com/Banking/Images/d2dProductTop.gif); list-style: none; margin: 0; padding: 0 0 0 0; height: 24px; width: 550px;  border-bottom: 1px solid #999; }

.tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block; clear: both; content: " ";}
	
.tabs-nav li {float: left; margin: 0 0 0 0px;}
.tabs-nav a {display: block; padding: 5 10 5 10; border-right: 1px solid #ccc; position: relative; top: 1px; z-index: 2; color: #cc0000;    
    line-height: 1.2; text-align: center; text-decoration: none;	
    white-space: nowrap; /* required in IE 6 */  	
}
.tabs-nav .tabs-selected a {color: #cc0000; background-color:#CCC; text-decoration: none; font-size: 11px;}
/* prevent dotted border in Firefox */
.tabs-nav .tabs-selected a, .tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active {outline: 0;}

*>.tabs-nav a span { /* hide from IE 6 */ width: auto; height: auto;}
.tabs-nav .tabs-selected a span { padding-top: 7px;}
.tabs-nav .tabs-selected a:link, .tabs-nav .tabs-selected a:visited, .tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */ cursor: text;}
.tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active { /* @ Opera, we need to be explicit again here now... */ cursor: pointer;}
.tabs-nav .tabs-disabled {opacity: .4;}
/* declare background color for container to avoid distorted fonts in IE while fading */
.tabs-container {padding: 1 8 10 8; border-left: 1px solid #ccc; border-right: 1px solid #ccc; *width: 550px;}
.tabs-loading em {padding: 0 0 0 0px; background: url(loading.gif) no-repeat 0 50%;}

/* ------- End of section ------------ */

/* Product Pages are broken into 4 section: 1.Features, 2. Add-ons, 3. Help, 4. How to Bank*/

.accountInto {padding: 0 6px 0 6px; margin: 0px;}
.featureContainer {float:left; padding: 4px; width: 440px;}
.addOnsContainer {float:left; padding: 4px; width: 440px;}
.serviceContainer {float:left; padding: 4px; width: 440px;}
#intro {clear: both; width: 550px; vertical-align:top; height: 200px;}
#container {clear: both; width: 550px; vertical-align:top;}
.howToBankLeftContainer {float:left; padding: 4px; width: 325px;}
.howToBankRightContainer {float:right; width: 191px; vertical-align:top;}
.howToBankContent {float:left; width: 248px;}
.imageContainer {float:left; width: 70px; padding-top: 7px; height: 54px;}
.dottedLine {background-image: url(http://www.scotiabank.com/hr/careers/images/greydots.gif); *width: 100%; height: 23px; clear: both;}
.clearLine {background-image: url(http://www.scotiabank.com/images/spacer.gif); *width: 100%; height: 23px; clear: both;}
.shortdottedLine {margin-left: 70px; background-image: url(http://www.scotiabank.com/hr/careers/images/greydots.gif); *width: 100%; height: 23px; clear: both;}

a#colour1:link {font-weight: bold;
	color: #4E288C;
	text-decoration: none;
	font-size: 11px;}
a#colour1:visited {font-weight: bold;
	color: #4E288C;
	text-decoration: none;
	font-size: 11px;}
a#colour1:hover {font-weight: bold;
	color: #4E288C;
	text-decoration: underline;
	font-size: 11px;}
	
.btn_tools_lrg_fr{
	background-image: url(http://www.scotiabank.com/images/retail/tools_bkg_lrg_fr.jpg);
	background-repeat: no-repeat;
	height: 120px;
	width: 194px;
	padding-top: 2px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 8px;}

.btn_tools_fr{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-image: url(http://www.scotiabank.com/images/retail/gr_bkg_fr.jpg);
	background-repeat: no-repeat;
	margin: 4px;
	height: 45px;
	width: 194px;
	background-position: center center;
	padding-top: 2px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 8px;
}