/* ------------------------------------------------------------------
	MAIN STYLESHEET
	
	Project: Wightman Telecom
	Created: 2010-06-29
	Created by: Cindy Dochstader cindy@rkd.ca
	
	COLOURS:	
	Blue: #004b8d
	Text Grey: #444444
------------------------------------------------------------------- */


/* TABLE OF CONTENTS */
/* ---------------------------------------- HTML, BODY, RESETS */
/* ---------------------------------------- GLOBAL STYLES */
/* ---------------------------------------- STRUCTURE */
/* -------------------------------------------- Header */
/* ----------------------------------------------- Top Nav */
/* ----------------------------------------------- Main Nav */
/* ----------------------------------------------- Sub Nav */
/* -------------------------------------------- Wrapper/Content Area */
/* ----------------------------------------------- Main Content */
/* -------------------------------------------------- Pricing Pages*/
/* -------------------------------------------------- Content Check Availability */
/* -------------------------------------------------- Major Links */
/* -------------------------------------------------- Community Board */
/* -------------------------------------------------- Misc*/
/* ----------------------------------------------- Side Bar */
/* -------------------------------------------------- Side Nav */
/* -------------------------------------------------- Side Bar Callouts */
/* -------------------------------------------- Footer */




@import url("reset.css");
@import url("promo.css");
@import url("jquery.cluetip.css");



 
/* ----------------------------------------------
	HTML, BODY, RESETS
---------------------------------------------- */

html { 
	overflow-y: scroll; /* keeps vertical scroll bar in firefox at all times so page doesn't jump around */
	height: 100%;
	}

body {
	background: #fff; /* background colour should be same as content area background colour to ensure WYSIWYG looks same as website */
	margin: 0;
	padding: 0;
	top: 0;
	left: 0px;
	font: 13px/22px Verdana, Geneva, Tahoma, sans-serif;
	color:#444;
	}
	.BodyStyle { /* use this class to set body background colour so that it does not interfere with the WYSIWYG editor */
		color:#444;
		background: #fff url(../../images/body-bg.png) repeat-x;}

img, form { /* removes all default formatting on images and forms */
	margin: 0;
	padding: 0;
	border: 0;
	}

:focus { outline: none; } /* removes dotted outline from links */

.Clear { clear: both; } /* clears all floats; apply to empty divs */



/* ----------------------------------------------
	GLOBAL STYLES - style as necessary
---------------------------------------------- */

a:link, a:visited {
	color: #004b8d;
	text-decoration: none;
	}

a:hover, a:active {
	color: #004b8d;
	text-decoration: underline;
	}
	a.ArrowLink {background: url("../../images/link-bullet.png") no-repeat 0 5px; padding-left:10px;}


p {padding-bottom:11px;}
	p.Caption {
		font-size:11px;
		line-height:18px;
		padding:5px 0 22px 0;
		}
	p.Caption220 {
		width:220px;
		font-size:11px;
		line-height:18px;
		padding:5px 0 22px 0;
		}

strong, b {font-weight: bold;}

em, i {font-style: italic;}

h1 {
	font-weight: bold;
	font-size:17px;
	line-height:22px;
	text-transform: uppercase;
	padding-bottom:22px;
	color: #004b8d;
	}
	h1.AbovePromo {padding-bottom:10px;}	
		
h2 {
	color: #004b8d;
	font-weight: bold;
	font-size:15px;	
	line-height:19spx;
	padding:11px 0;
	}
	h2.UnderH1 {padding: 0 0 11px 0;}
	h2.UnderH1TWN {padding: 0 0 21px 0;}
	h2.Pricing {background: url("../../images/pricing-tr-line.png") no-repeat 0 bottom;}
		h2.TopMargin20 {margin-top:20px;}
		h2 img {vertical-align:middle; margin-right:5px;}
		h2 strong {font-size:18px;}
	
h3 {
	color: #004b8d;
	font-weight: bold;
	font-size:13px;	
	line-height:17px;
	padding:11px 0 0 0;
	}
	
ul { 
	list-style:none; 
	margin:0; 
	padding: 0 0 11px 0; 
	}

	ul li { 
		line-height:19px;
		padding: 0 0 11px 15px; 
		background: url("../../images/li-bullet.png") no-repeat 0 7px;
		}
	ul.LinksList li {	background: url("../../images/link-bullet.png") no-repeat 0 7px;}
	
ol {
	padding: 0 0 11px 20px;
	list-style-type: decimal;
	}
	ol li { 
		line-height:19px;
		padding: 0 0 11px 0; 
		}

.Note {
	font-size:11px; 
	line-height:15px; 
	font-weight:normal;
	}

.FloatLeft {float:left;}

.ImageFloatLeft {float:left; padding:6px 20px 10px 0;}
.ImageFloatRight {float:right; padding:6px 20px 10px 0;}
	.ExtraMarginBottom10 {margin-bottom:10px;}
	.ExtraMarginBottom40 {margin-bottom:40px;}

.SubInfo {font-weight:normal; color:#444; font-size:13px;}

hr {display: none;}
	
	.HR {
		clear:both;
		height:1px;
		margin:20px 0;
		background: url(../../images/pricing-tr-line.png) no-repeat;
		}


/* styles used by WYSIWYG - style as necessary */
pre { }
address { }




/* ----------------------------------------------
	STRUCTURE
---------------------------------------------- */

/* ---------------------------------------- Header */

#PrintHeader { display: none; }

#Header { 
	width: 940px;
	margin:0 auto;
	padding:0;
	position: relative;
 	}

.Logo { 
	float:left; 
	margin-top:34px;
	}


/* -------------------------- Top Nav */
		
.TopNav {
	float:right;
	margin-top:53px;
	}
	
.TopNav ul {
	list-style: none;
	padding:0;
	margin:0;
	overflow:hidden;
	}
	.TopNav li {
		padding:0;
		margin:0;
		float:left;
		background: url(none);
		}
	
.TopNav a {
	float:left;
	font-size:11px;
	color:#444;
	padding-top:25px;
	margin-left:40px;
	}
	.TopNav a.TopNavSelf     {background:url(../../images/self-icon.gif) no-repeat center 0;}
	.TopNav a.TopNavAccount  {background:url(../../images/account-icon.png) no-repeat center 0;}		
	.TopNav a.TopNavWebmail  {background:url(../../images/webmail-icon.png) no-repeat center 0;}			
	.TopNav a.TopNavContact  {background:url(../../images/contact-icon.png) no-repeat center 0;}
	
.google {
	position: absolute;
	right: 0;
	top: 0;
	width: 358px;
	height: 35px;
	background: url(../../images/google-bg.jpg) no-repeat;
	}	
	.google-logo {
		float: left;
		padding-top: 7px;
		margin-right: 10px;
		margin-left: 10px;
		}
	.google-form {
		float:right;
		}
	.text-input {
		margin-top: 7px;
		width: 230px;
		float:left;
		}
	.search-button {
		float: right;
		padding-top: 7px;
		margin-left: 5px;
		margin-right: 10px;
		}
		


/* -------------------------- Main Nav */
		
.MainNav {
	margin:12px 0 -4px 0;
	height:36px;
	z-index:500;
	position:relative;
	overflow:hidden;
	}
	
.MainNav ul {
	float:left;
	list-style: none;
	padding:0;
	margin:0;
	overflow:hidden;
	}
	.MainNav li {
		padding:0;
		margin:0;
		float:left;
		background:url(../../images/mainnav-dividers.png) no-repeat right 1px;
		}
		
		.MainNav ul.RightSide {
			float:right;
			}
	
.MainNav a {
	height:30px;
	float:left;
	font-weight:bold;
	text-transform:uppercase;
	color:#fff;
	padding:6px 12px 0 12px;
	}
	
	.MainNav .NavResidential, .MainNav .NavSupport {background:url(../../images/mainnav-dividers.png) no-repeat left 1px;}
	
	.MainNav a:link, .MainNav a:visited {color: #fff; text-decoration: none;}	
	.MainNav a:hover, .MainNav a:active {color: #dfdfdf; text-decoration: none;}	
	
	.MainNav .Selected a {
		background:url(../../images/mainnav-selected-bg.png) repeat-x top left;
		color:#004b8d;
		}
		.MainNav .Selected a:link, .MainNav .Selected a:visited {color: #004b8d; text-decoration: none;}	
		.MainNav .Selected a:hover, .MainNav .Selected a:active {color: #444; text-decoration: none;}	
	
	
/* -------------------------- Sub Nav */
		
.SubNav {
	background:url(../../images/subnav-bg.png) repeat-x top left;
	height:31px;
	z-index:1;
	}
	
.SubNav ul {
	list-style: none;
	padding:0;
	margin:0;
	overflow:hidden;
	}
	.SubNav ul.Right {float:right;}
	.SubNav li {
		padding:0;
		margin:0;
		float:left;
		background:url(none);
		}
	
.SubNav a {
	float:left;
	font-size:11px;
	color:#444;
	padding:5px 12px 0 12px;
	background:url(../../images/subnav-dividers.png) no-repeat right 6px;
	}
	.SubNav .Selected a {font-weight:bold;}	
	.SubNav .LastItem {background:url(none);}

	
	
/* ---------------------------------------- Wrapper/Content Area */
	
#Wrapper {
	width: 940px;
	margin: 0 auto;
	overflow:hidden;
	}
	
	#Content {
		float:left;
		width:700px;
		margin:25px 0;
		}
	
	
/* ---------------------------------------- Main Content */

/* -------------------------- Pricing Pages*/

.ChangeTown  {
		font-size:11px;
		text-transform:none;
		font-weight:normal;
		color:#004b8d;
		padding-left:15px;		
		margin-left:5px;
		background: url("../../images/changetown-icon.png") no-repeat 0 2px;
		}
		
.Bundle	{
	width:700px;
	height:130px;
	margin-bottom:30px;
	}
	.TopBundle {margin-bottom:15px;}

.PricingTable {width:700px; margin-bottom:40px;}
	.PricingTableFixed {table-layout:fixed}	/* use in conjunction with .PricingTable */
	
	.PricingTable tr {background: url("../../images/pricing-tr-line.png") no-repeat 50% bottom;}
		.PricingTable tr.Alt {background: url("../../images/pricing-alt-bg.png") no-repeat 50% bottom;}
		
	.PricingTable td {padding:10px 0;}
	
		.PricingTable td.Title {font-weight:bold; padding-right:10px;}
		
		.PricingTable td.Prices {font-weight:bold; text-align:left; }
			.PricingTable td.LeftPadding15 {padding-left:20px}
		
		.PricingTable td.Details {font-size:11px; text-align:right; }
			.PricingTable td.Details a {background: url("../../images/link-bullet.png") no-repeat 0 4px; padding-left:10px;}	
			
		.PricingTable td.Header {color:#004b8d; font-weight:bold; font-size:15px; vertical-align:bottom;}
			.PricingTable td.HeaderH3 {color:#004b8d; font-weight:bold; font-size:13px; vertical-align:bottom;}		

		
.Checkmark {padding-right:2px;}

			
	/*TR background image fix for IE, Safari and Opera - Regular and ALT rows*/
	.PricingTable td.Title, .PricingTable td.First {background: url("../../images/pricing-tr-line.png") no-repeat left bottom;}	
		.PricingTable tr.Alt td.Title, .PricingTable tr.Alt td.First {background: url("../../images/pricing-alt-bg.png") no-repeat left bottom;}
	
	.PricingTable td.Details, .PricingTable td.Last {background: url("../../images/pricing-tr-line.png") no-repeat 100% bottom;}	
		.PricingTable tr.Alt td.Details, .PricingTable tr.Alt td.Last {background: url("../../images/pricing-alt-bg.png") no-repeat 100% bottom;}
	


/* -------------------------- Content Area Check Availability */

.CheckAvailability {
	margin-top:10px;
	padding-bottom:15px;
	background: url("../../images/content-check-availability-bottom-line.png") no-repeat 0 bottom;
	}

.CheckAvailability h2 {
	font-size:13px;
	color: #004b8d;
	font-weight: bold;
	line-height:15px;
	padding:20px 0 0 75px;
	height:42px;
	}
	.CheckAvailability h2.Residential {background: url("../../images/content-check-availability-residential-bg.jpg") no-repeat 0 top;}
	.CheckAvailability h2.Business {background: url("../../images/content-check-availability-business-bg.jpg") no-repeat 0 top; padding-left:85px;}

	
.CheckAvailability p {padding: 0 0 5px 75px;}
	.CheckAvailability p.Note {padding: 0 0 5px 134px;}
.CheckAvailability select {margin:0 0 10px 10px; width:190px}
.CheckAvailability .Submit {margin:0 0 15px 246px;}
	
	
	
/* -------------------------- Major Links */

.MajorLinks {
	display:block;
	width:600px;
	margin:0 0 20px 0;
	padding: 6px 0 0 70px;
	height:40px;
	font-weight:bold;
	}
	.InternationalRates {background: url("../../images/links-international-rates.png") no-repeat ;}
	.Support {background: url("../../images/links-support.png") no-repeat ;}
	.CheckAvailabilityResidentialLink {background: url("../../images/links-check-availability.png") no-repeat ;}
	.CheckAvailabilityBusinessLink {background: url("../../images/links-check-availability-business.png") no-repeat ; padding: 6px 0 0 85px;}
	.TV {background: url("../../images/links-tv.png") no-repeat ;}
	.Internet {background: url("../../images/links-internet.png") no-repeat ; height:45px;}
	.Phone {background: url("../../images/links-phone.png") no-repeat ; height:47px;}
	.Fibre {background: url("../../images/links-fibre.png") no-repeat ; padding: 6px 0 0 80px;}
	.NoIcon {background: url("../../images/links-noicon.png") no-repeat ;padding: 0 0 0 15px;}
	
	.ExtraTopMargin20 {margin-top:20px;}
	.ExtraTopMargin40 {margin-top:40px;}
	.ExtraBottomMargin40 {margin-bottom:40px;}
	.FloatRightInternetByFibre {float:right; width:460px;}
	.ContactEmail {margin-bottom:-15px;}




/* -------------------------- Community Board*/

.CommunityBoardSearch {
	background:#e9e9e9 url("../../images/community-board-bg.png") no-repeat left top;
	width:660px;
	padding:20px;
	margin:10px 0 40px 0;
	}
	
.Pagination {
	background: url(../../images/pricing-tr-line.png) no-repeat left bottom ;
	padding-bottom:5px;
	font-weight:bold;
	margin-bottom:20px;
	}
	
.CommunityBoardListingTitle {
	background:#e9e9e9 url("../../images/community-board-bg.png") no-repeat left top;
	margin-bottom:20px;
	}
	.CommunityBoardListingTitle td {padding:8px 20px;}
	
.CommunityBoardListing {margin-bottom:40px;}

.calendar td {padding:2px;}


/* -------------------------- Misc*/

.Map iframe {
	border:1px solid #e1e1e1;
	}
	
.NetworkAlerts {
	background:#dc0c02 url("../../images/network-alert-bg.png") no-repeat left top;
	width:660px;
	margin-top:20px;
	padding:20px;
	}	
	.NetworkAlerts p, .NetworkAlerts h2 {color:#fff}	
	
.Remotes td {padding:0 20px 40px 0;}

.Alert {
	color:#dc0c02;
	font-weight:bold;}
	
.MonitoringText {margin-top:85px;}




/* ---------------------------------------- Side Bar */		

#SideBar {
	margin:31px 0 0 0;
	width:220px;
	float:right;
	}
		
		
/* -------------------------- Side Bar Nav */

.SideNav h2 {
	height:31px;
	padding:3px 0 0 12px;
	color:#fff;
	font-size:13px;
	background: url(../../images/sidenav-top-bg.png) no-repeat;
	}
	.SideNav h2 a:link, .SideNav h2 a:visited, .SideNav h2 a:hover, .SideNav h2 a:active{ color:#fff;}
		
.SideNav ul { 
	list-style:none; 
	margin:-6px 0 0 0; 
	}
	.SideNav li { 
		line-height:35px;
		height:37px;
		padding: 0 0 0 25px; 
		background: url("../../images/sidenav-li-bg.png") no-repeat 0 0;
		}	
		.SideNav li.TwoLines { 
			line-height:16px;
			height:43px;
			padding: 10px 0 0 25px; 
			background: url("../../images/sidenav-li-twolines-bg.png") no-repeat 0 0;
			}
		
		.SideNav .Selected a {font-weight:bold;}	
		

/* -------------------------- Side Bar Callouts */

#SideBar .SideBarCallouts {}
	#SideBar .SideBarCallouts h2 {
		font-size:13px;
		color: #004b8d;
		font-weight: bold;
		line-height:15px;
		padding:7px 75px 1px 10px;
		}
	#SideBar .SideBarCallouts p {padding: 0 0 5px 10px;}
	#SideBar .SideBarCallouts p.Note {padding: 0 10px 5px 0; text-align:right;}
	#SideBar .SideBarCallouts select {margin:0 0 10px 10px; width:200px}
	#SideBar .SideBarCallouts .Submit {margin:0 0 15px 126px;}	
	#SideBar .SideBarCallouts ul {padding: 0 0 5px 10px;}
		#SideBar .SideBarCallouts li {background: url("../../images/link-bullet.png") no-repeat 0 7px;}
				
			#SideBar .SideBarCallouts h2.CheckAvailabilityResidential {
				margin-top:55px; 
				padding-top:0;
				height:63px; 
				background: url("../../images/sidebar-check-availability-residential-bg.jpg") no-repeat 0 top;
				}
			#SideBar .SideBarCallouts h2.CheckAvailabilityBusiness {
				margin-top:55px; 
				padding-top:0;
				height:63px; 
				background: url("../../images/sidebar-check-availability-business-bg.jpg") no-repeat 0 top;
				}
			#SideBar .SideBarCallouts h2.FTTH {
				margin-top:55px; 
				height:60px; 
				background: url("../../images/sidebar-ftth-bg.jpg") no-repeat 0 2px;
				padding-top:0;
				}
			#SideBar .SideBarCallouts h2.AboutWightman {
				margin-top:0; 
				padding-top:34px;
				height:36px; 
				background: url("../../images/sidebar-about-bg.jpg") no-repeat 0 top;
				}
				
			#SideBar .SideBarCallouts h2.WightmanTVGuide {
				margin-top:30px; 
				padding-top:18px;
				padding-bottom:5px;
				height:46px; 
				background: url("../../images/sidebar-tvguide-bg.jpg") no-repeat 0 top;
				}
					
			#SideBar .SideBarCallouts h2.Careers {
				margin-top:30px; 
				padding-top:20px;
				height:35px; 
				background: url("../../images/sidebar-careers-bg.jpg") no-repeat 0 top;
				}
			#SideBar .SideBarCallouts h2.Newsletters {
				margin-top:30px; 
				padding-top:30px;
				height:35px; 
				background: url("../../images/sidebar-newsletter-bg.jpg") no-repeat 0 top;
				}


#SideBar .SocialMedia { margin-bottom:20px;	}
	#SideBar .SocialMedia img {margin-left:5px; vertical-align:middle;}

		

/* ---------------------------------------- Footer*/

#Footer { 
	background: url(../../images/footer-bg.png) repeat-x top left;
	width:940px;
	margin:80px auto 0 auto;
	height:95px;
	overflow:hidden;
	}
			
.FooterLinks {
	margin-top:9px;
	font-size:11px;
	float:left;
	}
	
#Footer .SocialMedia {
	margin-top:19px;
	float:left;
	clear:both;
	}
	#Footer .SocialMedia img {margin-right:5px;}
	
.Copyright {
	margin-top:10px;
	font-size: 9px;
	color:#888888;
	float:right;
	}
	
.SiteByRKD {
	clear:right;
	float:right;
	margin:30px 0 0 0;
	font-size: 9px;
	color:#cccccc;
	}
	.SiteByRKD a:link, .SiteByRKD a:visited {
		color:#cccccc;
		}
	.SiteByRKD a:hover, .SiteByRKD a:active {
		color:#cccccc;
		}
	
	
		
/* ---------------------------------------- Form Elements*/

label {
	display:block;
	width:120px;
	float:left;
	text-align:right;
	padding-right:10px;
	line-height:18px;
	}
	label.Select {
		margin-left:130px;
		width:700px; 
		float:none;
		text-align:left;
		}
	label.CB {
		display:block;
		width:auto;
		float:left;
		text-align:left;
		padding-right:10px;
		line-height:18px;
		}
	label.TWN {
	display:block;
	width:150px;
	float:left;
	text-align:right;
	padding-right:10px;
	line-height:18px;
	}
	
.Field  { 
	width:250px;
	border:1px solid #888;
	font-size:13px;
	color:#444;
	margin:0 10px 20px 0;
	padding:3px;
	float:left;
	}
	.FieldNoBottomMargin  { margin-bottom:0;}
	
.FileInput {
	width:258px;
	font-size:13px;
	color:#444;
	margin:0 10px 3px 0;
	padding:3px;
	}
	
.CBSearchField  { 
	width:250px;
	border:1px solid #888;
	font-size:13px;
	color:#444;
	margin:0 10px 20px 0;
	padding:3px;
	}
	.CBSearchDate  { width:100px;}
	
select {
	width:258px;
	border:1px solid #888;
	font-size:13px;
	color:#444;
	margin:5px 10px 0 130px;
	padding:3px;
	float:left;
	}
	.calendar select {	
		width:auto;
		margin:5px;
		float:none;
		}
		
	

	
.Submit {
	height:29px;
	margin:25px 0 0 313px;
	width:75px;
	}
	.CBSubmit {margin:0 0 0 160px;}
	.TWNSubmit {margin:10px 0 0 343px;}
	
form br {
	clear:both;
	}

.Error, .Required {
	color:#dc0c02;
	font:12px/19px Arial,Helvetica,sans-serif;
	}
	
.PhotoSize {margin:0 0 0 130px;}