@charset "utf-8";
/* --------------- GLOBAL PAGE SETTINGS -------------- */
body  {
	font: 1em Arial, Helvetica, sans-serif; /* The default parent font.  Any text element will show up with these setting unless specified differently on that element. */
	background: #ffffff; /* The overall while page background.*/
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0; /* ensures no extra spacing is added*/
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000; /* Sets the font color for the pages to be black */
}
/* This is the link treatment for all states of an a link */
a:link{ border:none; color:#007fC4;	text-decoration: none;}
a:visited{ border:none; text-decoration: none;}
a:hover{ text-decoration: underline;}
/* This creates the look for any of the headers with the grey gradient, orange borders */
.twoColFixRtHdr h2 { 
	font: .8em Verdana, Arial, Helvetica, sans-serif;
	color: #666666;
	font-weight: bold;
	margin: 0 0 15px 0;
	padding: 15px 0 10px 0;
	background-image: url(/images/h3-section-heading-bg.gif);
	background-repeat: repeat-x;
	border-bottom: 1px solid #CCCCCC;
}

/* --------------- CONTAINER: PARENT DIV -------------- */
.twoColFixRtHdr #container { 
	width: 49em;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #ffffff; /* Sets the background to be white of the parent container that hold all the other divs */
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	padding: 0;
} 

/*  LOGIN BAR  */
.twoColFixRtHdr #loginBar {
	margin: 2px 0;
	padding-right: 52px;
	float: right;
	height: 20px;
} 
.twoColFixRtHdr #loginBar ul{ 
	margin: 0px; /* ensures no extra spacing is added*/
	padding: 0px; /* ensures no extra spacing is added*/
	font-size: .65em; 
	color: #000000;
	text-decoration:none;
} 
.twoColFixRtHdr #loginBar li{
	display: inline; /* makes the LI elements appear horizontally instead of vertically */ 
	border-left: 2px solid #999999; /*creates the vertical bar seperator between the links */
	
	font-weight: bold; /* text appears bold */ 
	padding: 0px 5px 0px 5px; /* adds spacing between the links and the vertical bars (border) */ 
}
.twoColFixRtHdr #loginBar li.first{/* This class is used to identify the first item of the UL list */ 
	border-left: 0px; /* removes the vertical bar seperator */ 
}
.twoColFixRtHdr #loginBar li.cart{/* This class is used to identify the first item of the UL list */ 
	border-left: 0px; /* removes the vertical bar seperator */ 
	vertical-align:middle;
}
/*  SEARCH  */
.twoColFixRtHdr #searchTip {
	padding-right: 54px;
	float:right;
	font-size: .65em; 
} 
.twoColFixRtHdr #headerSearch {/* This is the search box div that appears in the top right of the page.  It is floated right in order to appear beside the FAL */
	width: 310px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	margin-top: 0px; /* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding-top: 0px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	float: right;  /*floats the search div to the right side of the header div to get it to line up correctly. */
	text-align: right;
} 
.twoColFixRtHdr #headerSearch form {
	padding: 0px;
	margin: 0px;
} /*Removes all padding fromt he form html elemement so that it lines up correctly twith the other elements ont he page*/
.twoColFixRtHdr form .elements1{border: 1px solid #007fC4; padding-left: 2px; margin-right: 3px; z-index: 50;} /*formats all elements of the form to have a smaller text size and spacing to ensure they line up correctly*/ 
.twoColFixRtHdr #headerSearch form .elements {
	border: 1px solid #007FC4;
	/* font-size: .75em;  took out to see what is causing h1 to default to small case*/
	margin-right: 5px;
	padding-left: 2px;
	padding-top: 0px;
	padding-bottom:0px;
} /*formats all elements of the form to have a smaller text size and spacing to ensure they line up correctly*/
.twoColFixRtHdr #headerSearch form .select {
	margin-bottom: 4px;
} /*required to have the search box align correctly*/

.twoColFixRtHdr #PrintLogo {
	display:none;
}

/*  FONTS - TYPE AHEAD STYLE  */
.twoColFixRtHdr #typeAhead {
	font-size: .75em; /* sets the font size for the Type Ahead section */
	padding: 0 .5em 0 .5em; /* top and bottom padding create visual space within this div */
	width: 18.45em; /* the width of the Type Ahead box, which is a little larger than the text input box*/
	border: 1px solid #CCC; /* creates the light grey border around the Type Ahead options */
	margin: 0 0 0 163px;
	text-align:left;
	background-color: #FFFFFF;
	display:block;
	position:absolute;
	z-index:99;
	left: 473px;
}
.twoColFixRtHdr #typeAhead ul{
	margin: 0px; /* ensures no extra spacing is added*/
	padding: 0px; /* ensures no extra spacing is added*/
	list-style: none; /* removes the dots infront of list items */
	z-index:100;
}
.twoColFixRtHdr #typeAhead li{
	margin: 0; /* ensures no extra spacing is added*/
	padding: .1em 0; /* ensures no extra spacing is added*/
	line-height: .95em; /* Sets the line hight of any line item to be .95 of an em */
	display: block; /* extends the list item to be the width of the parent div #typeAhead */
}
.twoColFixRtHdr #typeAhead a:link{display: block; margin: 0 -.5em; padding: .25em .5em; color:#333;}
.twoColFixRtHdr #typeAhead a:visited{color: #333; text-decoration: none; display: block; margin: 0 -.5em; padding: .25em .5em;}
.twoColFixRtHdr #typeAhead a:hover{text-decoration: none; background-color: #EEE; display: block;}
.twoColFixRtHdr #typeAhead strong{color: #007FC4;}

/* The FAL child div which is in the parent div header */
.twoColFixRtHdr #falLinks {
	margin: 0; /* set to 0 to ensure alignment of element*/
	padding: 1.0em 0 0 0; /* top padding added to push element down to align with bottom of the Search box*/
	color: #FF9900; /* organge color used for text in order to have bullets between links appear orange*/
	text-align:left; /* used to line up the FAL links with the right edge of the element and main content below */
	width: 29.5em; /* width of the FAL need to align everything correctly.  This is also need to have the float work correctly.*/
	float: left; /* this element is floated to the left to line up with the search box which is floated to the right of their parent div header*/
}
/* The FAL links are controlled by UL, LI and A elements which are styled to appear horizontal with spacing */ 
.twoColFixRtHdr #falLinks ul {
	margin-left: 15px; /* spacing between SaskTel logo and FAL UL */
	padding: 0px; /* ensures no extra spacing is added to UL*/
	display:inline; /* required to have the FAL UL appear beside the SaskTel logo*/
	font-size: 0.75em; /* changes text size to match other text elements on the page */
	font-family: Verdana, Arial, Helvetica, sans-serif; /* the font is changed from the default here to have the bullets appear as dots and not squares. */
}
.twoColFixRtHdr #falLinks li {
	margin: 0px; /* ensures no extra spacing is added to LI elements*/
	display: inline; /* makes LI elements line up horizontally instead of vertically */
}
.twoColFixRtHdr #falLinks li a{	font-family: Arial, Helvetica, sans-serif;}/* sets the text back to the default for the wording on the LI elements*/

/* --------------- MAIN CONTENT: LEFT HAND COLUMN -------------- */
.twoColFixRtHdr #mainContent {
	margin: .65em 0 2.5em 0; /* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	border-left: 1px solid #CCCCCC; /* grey border on the left of the column */
	border-right: 1px solid #CCCCCC; /* grey border on the right of the column */
	border-bottom: 1px solid #CCCCCC; /* grey border on the bottom of the column.  This also creates the look of the bottom border on module 1 and 2 */
	padding: 0px; /* ensures no extra spacing is added */
	width: 31.5em; /* the width of the left hand column */
	clear: left; /* clears all left floating items so that the mainContent displays under the header */
} 
/* These are the elements required to make the main PERSONAL, BUSINESS, SUPPORT links */
.twoColFixRtHdr #mainLinks { 
	margin: 0; /* ensures no extra spacing is added*/
	padding: 12px 0 7px 0; /*adds padding to the top and bottom of the div to give the correct spacing. */
	background-image: url(/images/h3-section-heading-bg.gif); /* the gradient background */
	background-repeat: repeat-x; /* only repeats the background horizontally */
	border-bottom: 1px solid #CCCCCC; /* grey bottom border used to seperate main links from the flash animation or image */
	text-align:center; /* centers the links */
} 
/* UL is used to displays the list of mainlinks horizontally */ 
.twoColFixRtHdr #mainLinks ul{ 
	margin: 0px; /* ensures no extra spacing is added*/
	padding: 0px; /* ensures no extra spacing is added*/
} 
.twoColFixRtHdr #mainLinks li{
	display: inline; /* makes the LI elements appear horizontally instead of vertically */ 
	border-left: 1px solid #999999; /*creats the vertical bar seperator between the links */
}
/* This class is used to identify the first item of the UL list */ 
.twoColFixRtHdr #mainLinks li.first{
	border-left: 0px; /* removes the vertical bar seperator */ 
}
/* Changes the links from default look to a bolder larger look to stand out on page */ 
.twoColFixRtHdr #mainLinks li a{
	font-size: 1.2em; /* increases the font size */ 
	font-weight: bolder; /* text appears bold */ 
	padding: 0px 35px 0px 37px; /* adds spacing between the links and the vertical bars (border) */ 
}
.twoColFixRtHdr #mainContentFlash {
	text-align:center; /* centers the flash or image element in the content window */
	z-index:1;
} 
/* fully contains the left module under the flash or image element in the main content div */
.twoColFixRtHdr #module1 { 
	padding: 0; /* ensures no extra spacing is added */
	margin: 0 15.75em 0 0; /* spacing is added the right so that this module appears to the right of module 2 */
	border-right: 1px solid #CCCCCC; /* greg border that seperates module 1 from module 2.  If module 2 has more content than module 1, this statement must be moved to the module2 div inorder for the grey line to fill the entire space */
} 
/* Sets the look/feel of the text within module 1 */
.twoColFixRtHdr #module1 p { 
	padding: 0px 5px 10px 10px; /* spacing around the text within the module */
	margin: 0px; /* ensures no extra spacing is added */
	font-size: .75em; /* sets the font size within Module 1 */
	color:#666; /* grey text within Module 1 */
} 
/* fully contains the right module under the flash or image element in the main content div */
.twoColFixRtHdr #module2 { 
	margin: 0; /* ensures no extra spacing is added */
	width: 15.75em; /* width of Module 2 is the same as the right margin on Module 1 so both elements align. */
} 
/* Sets the look/feel of the text within module 2 */
.twoColFixRtHdr #module2 p { 
	padding: 0px 5px 10px 10px;/* spacing around the text within the module */
	margin: 0px; /* ensures no extra spacing is added */
	font-size: .75em; /* sets the font size within Module 1 */
	color:#666; /* grey text within Module 1 */
} 

/* --------------- SIDEBAR: RIGHT HAND COLUMN -------------- */
.twoColFixRtHdr #sidebar1 {
	float: right; /* since this element is floated, a width must be given */
	width: 16.5em; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	margin: .65em 0 2.5em 0; /* spacing added to align correctly with the maincontent div and to add extra space at the bottom of the screen before the footer */
	padding-top: 0px; /* ensures no extra spacing is added */
	background: #FFFFFF; /* the background color will be displayed for the length of the content in the column, but no further */
	border-left: 1px solid #CCCCCC; /* border added to left of column */
	border-right: 1px solid #CCCCCC; /* border added to right of column */
	border-bottom: 1px solid #CCCCCC; /* border added to bottom of column */
	clear:both; /* clears the any floating elements that have been placed above the sidebar, to make sure sidebar appears below the header and in-line witht he maincontent */
}
 /* Sets the look and feel for the list elements in the right sidebar */
.twoColFixRtHdr #sidebar1 ul{
	list-style-image: url(/images/btn-orange-arrow.gif);  /* replaces the standard dot with the orange arrow for list items */
	padding:0 0 0 25px;  /* spacing added to left side of ul to indent it from the side of the sidebar */
	margin: 0; /* ensures no extra spacing is added */
	font-size: .75em; /* text size set to match the rest of the page */
}
.twoColFixRtHdr #sidebar1 li{
	padding-bottom: 10px;  /* padding added to seperate each li item */
}
.twoColFixRtHdr #sidebar1 li.extraSpacing{
	padding-bottom: 2em;  /* adds extra padding for li items in order to align the 3rd heading in the right column with the module 1/2 headings in the left column */
}

/* --------------- FOOTER -------------- */
.twoColFixRtHdr #footer {
	padding: 1em 0 1em 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	margin-top: .5em;  /* spacing added to seperate the footer from the rest of the page */
	border-top: 1px dashed #FF9900;  /* orange dashed line to visually seperate the footer from the content */
	font-size: 0.7em;  /* font size is set slightly smaller than the other elements on the page to signify less importance */
	text-align:center;  /* all items within the footer are centered on the page */
	clear:both;  /* clears any floats from the other elements on the page, so that the footer appears below them */
} 
.twoColFixRtHdr #footer ul {
	padding: 0; /* ensures no extra spacing is added */
	margin: 0; /* ensures no extra spacing is added */
}
.twoColFixRtHdr #footer li {
	display: inline;  /* displays list items horizontally */
	margin: 0; /* ensures no extra spacing is added */
	padding: 0px 1px 0px 5px;  /* spacing between list items and vertical spacer (border) */
	/*border-left: 1px solid #000;  /* visual vertical spacer to seperate links */
}
.twoColFixRtHdr #leftBorder{
	border-left: 1px solid #000;  /* visual vertical spacer to seperate links */
	
}
}
.twoColFixRtHdr #leftRightBorder{
	border-left: 1px solid #000;  /* visual vertical spacer to seperate links */
	border-right: 1px solid #000;  /* visual vertical spacer to seperate links */
	padding: 0px 2px 0px 2px;  /* spacing between list items and vertical spacer (border) */
}

.twoColFixRtHdr #footer li.first{
	border-left: 0px;  /* seperater (border) removed from the first item in the list */
}
.twoColFixRtHdr #footer p {
	margin: 0; /* ensures no extra spacing is added */
	padding: 0; /* ensures no extra spacing is added */
}

/* --------------- FLOAT SETTINGS -------------- */
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}