/* --------------- Scottish Power Savings Challenge */
/* ---- Global Styles --*/


















body { font: 0.7em Arial, Helvetica, sans-serif; color: #666; text-decoration: none; background: #FFFFFF; margin: 0px; padding: 0px; }
.clearB { clear: both; overflow: hidden; }
.clear { clear: both; overflow: hidden; }


a:link, a:visited, a:active { color: #5A00AD; text-decoration: none; font-weight: bold; }
a:hover { color: #5A00AD; text-decoration: underline; font-weight: bold; }
.headerCntr { height: 124px; width: 100%; background: url(../images/headerBg.jpg) repeat-x left top; }
.logoCntr { margin: 0px; padding: 0px; float: left; height: 124px; width: 270px; }

.commonSense4reasons { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; float: left; height: 39px; width: 771px; display: inline; background: transparent url(../images/img_commonSensetxt.gif) no-repeat 20px 12px; }
.strapCntr { margin: 0px; padding: 0px; float: left; height: 124px; width: 530px; }
.strapImage { margin: 0px 0px 0px 55px; padding: 0px; float: left; height: 118px; width: 335px; display: inline; }
.strapWrapperMSSCH { width: 558px; margin: 0px; padding: 0px 0px 0px 0px; float: left; background: transparent url(../images/strapNEW.gif) no-repeat left bottom; height: 85px; }
.strapWrapperMSEM1 { width: 558px; margin: 0px; padding: 0px 0px 0px 0px; float: right; background: transparent url(../images/img_fourreasons_strap2.gif) no-repeat left bottom; height: 85px; }

.leftColCntr { width: 225px; margin: 0px; padding: 0px; float: left; }
.toastImage { margin: 0px 0px 10px; padding: 0px; float: left; height: 150px; width: 225px; }
.quotePurple { font-size: 1.2em; color: #5A00AD; text-decoration: none; margin: 0px 0px 0px 25px; padding: 0px; font-weight: bold; }
.phoneNumberPurple { font-size: 1.8em; color: #5A00AD; text-decoration: none; margin: 0px 0px 15px 25px; padding: 0px; font-weight: bold; }
.quoteGrey { font-size: 1.2em; color: #3F3F3F; text-decoration: none; margin: 0px 0px 50px 25px; padding: 0px; font-weight: bold; }
.phoneNumberGrey { font-size: 1.8em; color: #3F3F3F; text-decoration: none; margin: 0px 0px 55px 0px; padding: 0px; font-weight: bold; }
.rightColCntr { width: 515px; margin: 0px; padding: 40px 0px 55px 60px; float: left; }
.footerGreenLine { font-size: 5px; line-height: 5px; background: #C0DD1A; margin: 0px; padding: 0px; float: left; height: 5px; width: 100%;}
.footerLinks { margin: 0px; padding: 20px 0px 0px 5px; float: left; width: 265px; }
.footerVeriSign { margin: 0px; padding: 10px 25px 0px 0px; float: left; width: 505px; text-align: right; }


.footer { float: left; width: 150%; border-top: solid 5px #FF7900; }
.footerContent { margin: 0px; padding: 20px 20px 30px 10px; float: left; width: 770px; }
.veriSign { float: right; width: 100px; height: 59px; display: block; }
.footer p { margin-top: 10px; }
.errors { font-size: 1.2em; color: red; }
.purple { color: #5A00AD; }
.spacer { padding: 2px 0px; }

.mainWrapper { margin: 0px; padding: 0px; width: 100%; }
.headerWrapper { height: 124px; width: 100%; background: url(../images/headerBg.jpg) repeat-x left top; }
.headerRow1 { margin: 0px 0px 0px 0px; padding: 0px; float: left; height: 85px; width: 771px; display: inline; background: transparent; }
.commonSense { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; float: left; height: 39px; width: 771px; display: inline; background: transparent url(../images/img_commonSensetxt.gif) no-repeat 20px 12px; }
.spLogo { width: 213px; margin: 0px; padding: 0px 0px 0px 0px; float: left; background: transparent url(../images/logo_scottishPower.gif) no-repeat 20px 30px; height: 85px; }
.strapWrapper { width: 558px; margin: 0px; padding: 0px 0px 0px 0px; float: right; background: transparent url(../images/strap.gif) no-repeat left bottom; height: 85px; }
.strapWrapper2 { width: 558px; margin: 0px; padding: 0px 0px 0px 0px; float: right; background: transparent; height: 85px; }

.strapWrapper2 h1 { color:#727272; font-family:"Trebuchet MS",Arial,sans-serif; font-size: 2em; font-weight:normal; margin: 15px 0px 0px 0px; padding:0px; text-indent: 0px; text-align: center;}
.spLogo4reasons { width: 213px; margin: 0px; padding: 0px 0px 0px 0px; float: left; background: transparent url(../images/logo_scottishPower.gif) no-repeat;  height: 85px; }

.leftWrapper { width: 210px; margin: 0px 0px 0px 0px; padding: 0px; float: left; }
.leftWrapperImage { width: 210px; margin: 25px 0px 0px 0px; padding: 0px; float: left; background: transparent; }
.leftWrapperImage img { width: 210px; margin: 0px 0px 0px 0px; padding: 0px; float: left; }
.leftWrapperImage2 { width: 170px; margin: 0px 0px 0px 0px; padding: 20px; float: left; background: transparent; }
.leftWrapperImage2 h1 { color:#999; font-family:"Trebuchet MS",Arial,sans-serif; font-size:1.6em; font-weight:normal; margin:0px 0px 0px 0px; padding:0px; text-indent: 0px; text-align: left;}

.leftWrapperImage2 img { width: 210px; margin: 0px 0px 0px 0px; padding: 0px; float: left; background: transparent; }

.rightWrapper { width: 558px; margin: 0px; padding: 0px; float: left; }
.rightWrapperTop { width: 558px; margin: 0px; padding: 0px; float: left; background: transparent url(../images/curveTop.gif) repeat-x left bottom; }
.rightWrapperMid { width: 558px; height: 22px; margin: 0px; padding: 0px; float: left; background: transparent url(../images/curve.gif) repeat-x left top; }
.rightWrapperMidPanel1 { width: 558px; height: 110px; margin: 0px; padding: 0px; float: left; }
.rightWrapperBottom { width: 558px; margin: 0px; padding: 0px; float: left; background: transparent url(../images/curveBottom.gif) repeat-x left top; }
.footerVeriSignNew { margin: 0px; padding: 10px 0px 0px 0px; float: left; width: 490px; text-align: right; }

.rightPanel { width: 98px; height: 140px; margin: 0px; padding: 20px 20px 0px 20px; float: left; position: relative; }
.rightPanel:hover { border: 0; }
.rightPanel .bubble { display: none; z-index: 1000; }
.rightPanel:hover .bubble { width: 200px; margin: 0px; padding: 0px; position: absolute; top: 155px; left: -40px; z-index: 1000; display: block; }

.rightPanel h1 { margin: 0px; padding: 0px 0px 0px 0px; font-size: 1.8em; font-weight: bold; font-family:"Trebuchet MS",Arial,sans-serif; }
.rightPanel p { margin: 0px; padding: 0px 0px 10px 0px; font-size: 1.2em; color: #666; font-weight: bold; line-height: 1.1em; font-family:"Trebuchet MS",Arial,sans-serif; }

.rightPanelLink { margin: 0px; padding: 0px 0px 0px 0px; position: absolute; bottom: 10px; left: 20px; z-index: 999; }
.rightPanelLink a { color: #333 !important; }

.rightPanel .bubbleTop { margin: 0px 0px 0px 0px; padding: 0px; background: transparent url(../images/bubbleNewTop.gif) no-repeat left top; width: 204px; height: 20px; overflow: hidden; }
.rightPanel .bubbleMid { margin: 0px 0px 0px 0px; padding: 20px; background: transparent url(../images/bubbleNewMid.gif) repeat-y left top; width: 164px; overflow: hidden; }
.rightPanel .bubbleBottom { margin: 0px 0px 0px 0px; padding: 0px; background: transparent url(../images/bubbleNewBottom.gif) no-repeat left top; width: 204px; height: 8px; overflow: hidden; }
.rightPanel .bubbleMid h1 { color: #fff; text-decoration: none; text-align: left; margin: 0px 0px 10px 0px; padding: 0px; font-size: 1em; font-weight: bold; font-family: Arial,sans-serif; }
.rightPanel .bubbleMid p { color: #fff; text-decoration: none; text-align: left; margin: 0px; padding: 0px; font-size: 1em; font-weight: bold; font-family: Arial,sans-serif; }


.rightPanelImage { margin: 0px 0px 0px 0px; padding: 0px; display: block; z-index: 0; position: absolute; top: 20px; left: 20px; }
.rightPanelImage img { margin: 0px 0px 0px 0px; padding: 0px; display: block; z-index: 0; position: absolute; top: 0px; left: 0px; }
.rightPanelDivider { width: 2px; height: 110px; margin: 20px 0px 0px 0px; padding: 0px 0px 0px 0px; float: left; background: transparent url(../images/dottedRepeaterYGreen.gif) repeat-y left top; }

.rightWrapperMainContentLeft { width: 217px; margin: 0px 0px 30px 0px; padding: 0px 0px 0px 0px; float: left; background: transparent; }

.rightWrapperMainContentLeft h1, .rightWrapperMainContentRight h1 { margin: 0px; padding: 0px 0px 0px 0px; background: transparent; color:#5A00AD; font-family:"Trebuchet MS",Arial,sans-serif; font-size: 2em; font-weight:normal; }

.rightWrapperMainContentLeftMSSCH { width: 217px; margin: 34px 0px 0px 0px; padding: 0px 0px 0px 0px; float: left; background: transparent; }
.rightWrapperMainContentRight { width: 185px; margin: 0px; padding: 0px 0px 0px 0px; float: right; background: transparent; }
.rightWrapperMainContent { width: 478px; margin: 0px; padding: 30px 40px 0px 40px; float: left;  }

.rightPurple { color: #5A00AD; margin: 30px 0px 10px 0px; padding: 0px; font-weight: normal; font-size: 1em; }

.phoneGreyTop { color: #666; margin: 0px 0px 0px 0px; padding: 0px; font-weight: bold; font-size: 2.2em; text-decoration: none; }
.phoneGreyBottom { color: #666; margin: 0px 0px 0px 0px; padding: 0px; font-weight: bold; font-size: 2.2em; text-decoration: none; }
.keywordCenterGrey { margin: 0px 0px 0px 60px; font-size: 1.2em; }

.imageSpacer { margin: 0px 0px 0px 0px; padding: 0px; height: 1px; border-top: solid 2px #fff; font-size: 1px; }

.red { color: #FF3333; }
.blue { color: #3399CC; }
.grape { color: #C93092; }
.orange { color: #F7931D; }

.hidden { display: none !important; }

.rightWrapperMainContentFooterLinks { width: 478px; margin: 0px 0px 0px 0px; padding: 20px 0px 30px 0px; float: left; clear: both; background: transparent url(../IMAGES/dottedRepeaterXGreen.gif) repeat-x left top; }

em { margin: 0px 0px 10px 0px; padding: 0px; float: left; width: 217px; font-style: normal; }
em.nextBtn { margin: 20px 0px 0px 0px; padding: 0px; float: left; width: 217px; font-style: normal; }

/* ---- Form Style Update  --*/

.form { margin: 20px 0px 10px 0px; padding: 0px; float: left; background: transparent; width: 217px; }
.form label { margin: 0px; padding: 2px 0px 0px 0px; float: left; background: transparent; width: 100px; }
.p.option { margin: 0px; padding: 2px 0px 10px 0px; float: left; background: transparent; width: 217px; color: #666; font-weight: bold; }
.formBottom { margin: 0px 0px 0px 0px; padding: 0px; float: left; background: transparent; width: 217px; }


.formBottom label { margin: 0px; padding: 2px 5px 0px 0px; float: left; background: transparent; width: 167px; }
.form select { margin: 0px 0px 0px 3px; padding: 0px; float: left; background: transparent; width: 95px; font-family: Arial, Helvetica, sans-serif; border: solid 1px #ccc; font-size: 1em; }
.form option { margin: 0px; padding: 0px; background: #fff; font-family: Arial, Helvetica, sans-serif; font-size: 1em; }
.form input { margin: 0px 0px 0px 0px; padding: 2px; background: transparent; width: 91px; border: solid 1px #ccc; font-size: 1em; }
.form input:hover,.form input:active, .form input:focus { border: solid 1px #5A00AD; }
.formBottom input { margin: 5px 0px 0px 0px; padding: 0px; float: left; background: transparent; width: 15px; height: 15px; border: 0; }
.form input.postcode1 { margin: 0px 5px 0px 0px; padding: 2px; float: left; background: transparent; width: 40px; border: solid 1px #ccc; }
.form input.postcode1:hover { margin: 0px 5px 0px 0px; padding: 2px; float: left; background: transparent; width: 40px; border: solid 1px #5A00AD; }
.postcode1 { margin: 0px 5px 0px 0px; padding: 2px; background: transparent; width: 40px; border: solid 1px #ccc; }
.form input.postcode2 { margin: 0px 5px 0px 0px; padding: 2px; background: transparent; width: 40px; border: solid 1px #ccc; }
.form input.postcode2:hover { margin: 0px 5px 0px 0px; padding: 2px; background: transparent; width: 40px; border: solid 1px #5A00AD; }

.postcode1:hover { margin: 0px 5px 0px 0px; padding: 2px; background: transparent; width: 40px;  border: solid 1px #ccc; }
.postcode2 { margin: 0px 5px 0px 0px; padding: 2px;  background: transparent; width: 40px; border: solid 1px #ccc;}
.postcode2:hover { margin: 0px 5px 0px 0px; padding: 2px;  background: transparent; width: 40px;  border: solid 1px #ccc; }


.formDivider { width: 100%; height: 10px; background: transparent; font-size: 10px; line-height: 10px; margin: 0px; padding: 0px; float: left; display: block; clear: both; }
.formDivider40 { width: 100%; height: 40px; background: transparent; font-size: 40px; line-height: 40px; margin: 0px; padding: 0px; float: left; display: block; clear: both; }


/* ---- Layout --*/
.wrapper { margin: 0px; padding: 0px; background: transparent; width: 100%; overflow: hidden; }
.header { margin: 0px; padding: 0px; width: 100%; height: 124px; background: transparent url(../images/imgHeaderBg.jpg) repeat-x left top; }

.logoWrapper { margin: 0px; padding: 0px; float: left; background: transparent; width: 265px; height: 124px; }
.logo { margin: 0px; padding: 0px; width: 265px; height: 85px; float: left; background: transparent url(../images/imgScottishPowerLogo.gif) no-repeat 20px 30px; }
.commonSenseThanks { margin: 0px; padding: 0px; width: 265px; height: 39px; float: left; background: transparent url(../images/imgCommonSensetxt.gif) no-repeat 20px 11px; }

.headerImage { margin: 0px; padding: 0px; width: 331px; height: 124px; float: left; background: transparent url(../images/imgHeaderImage.jpg) no-repeat left top; }

.hotline { margin: 0px; padding: 20px 0px 0px 20px; float: left; background: transparent; }
.hotline p { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; background: transparent; }
.hotline span { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; background: transparent; font-size: 2.1em; font-weight: bold; }

.bodyContentLeft { margin: 0px 0px 0px 0px; padding: 35px 20px 45px 25px; float: left; background: transparent; width: 185px; }
.bodyContentLeft h1 { margin: 0px 0px 25px 0px; padding: 0px; background: transparent; font-size: 1.9em; color: #5A00AD; line-height: 1.2em; }
.bodyContentLeft h3 { margin: 0px 0px 15px 0px; padding: 0px; background: transparent; font-size: 1em; font-weight: normal; }


.knowMore { margin: 0px 0px 10px 0px; padding: 0px 0px 0px 0px; float: left; background: transparent url(../images/btnKnowMore.gif) no-repeat left top; display: block; width: 159px; height: 37px; position: relative; a {text-decoration: none};}
.knowMore:hover { border: 0; }
.knowMore .bubble { display: none; z-index: 999; }
.knowMore:hover .bubble { width: 414px; margin: 0px; padding: 0px; position: absolute; bottom: 0px; left: 182px; z-index: 1000; display: block; }

.knowMore .bubbleTop { margin: 0px 0px 0px 0px; padding: 0px; float: left; background: transparent url(../images/bubbleTop.gif) no-repeat left top; width: 414px; height: 6px; overflow: hidden; }
.knowMore .bubbleMid {text-decoration margin: 0px 0px 0px 0px; padding: 20px 30px 0px 50px; float: left; background: transparent url(../images/bubbleMid.gif) repeat-y left top; width: 334px; overflow: hidden; }
.knowMore .bubbleBottom { margin: 0px 0px 0px 0px; padding: 0px; float: left; background: transparent url(../images/bubbleBottom.gif) no-repeat left top; width: 414px; height: 29px; overflow: hidden; }
.knowMore .bubbleMid h1 { color: #fff; text-decoration: none; text-align: left; margin: 0px 0px 20px 0px; padding: 0px; font-size: 1.2em; font-weight: bold; line-height: 1.6em; }
.knowMore .bubbleMid p { color: #fff; text-decoration: none; text-align: left; margin: 0px; padding: 0px; font-size: 1em; font-weight: bold; line-height: 1.4em; }

.hotlineLeft { margin: 0px; padding: 0px 0px 0px 0px; float: left; width: 185px; background: transparent; }
.hotlineLeft p { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; background: transparent; }
.hotlineLeft span { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; background: transparent; font-size: 2.1em; font-weight: bold; }

.bodyContentRight { margin: 0px 0px 0px 0px; padding: 35px 0px 20px 0px; float: left; background: transparent; width: 570px; }
.bodyContentRight h1 { margin: 0px 0px 0px 0px; padding: 10px; background: #5A00AD; font-size: 1.2em; color: #fff; line-height: 1.2em; }
.bodyContentRightContent { margin: 0px 0px 0px 0px; padding: 40px 50px 0px 0px; float: left; background: transparent; width: 520px; }
.bodyContentRightContent p { margin: 0px 0px 20px 0px; padding: 0px; background: transparent; }




.bodyContentLeft a:link  {text-decoration: none}
.bodyContentLeft a:visited  {text-decoration: none}
.bodyContentLeft a:active  {text-decoration: none}
.bodyContentLeft a:hover  {text-decoration: none}
.headerBanner {float:right;}
.rightWrapperMainContenttemp { width: 478px; margin: 0px; padding: 30px 40px 0px 40px; float: left; background: transparent url(../images/or.gif) no-repeat 257px 30px; }

/* ---- Virgin Wine Styles  --*/
.leftWrapperHeader { margin: 10px 0px 30px 0px; padding: 0px 0px 0px 0px; float: left; background: transparent; width: 210px; color:#999; font-family:"Trebuchet MS",Arial,sans-serif; font-size: 1.6em; text-align: center; }
.leftWrapperVirgin { margin: 0px 0px 0px 13px; padding: 0px 0px 0px 0px; float: left; display: inline; background: transparent url(../images/imgVirginWines.jpg) no-repeat scroll left top; width: 184px; height: 300px; position: relative; }
.leftWrapperLarry { margin: 0px 0px 0px 13px; padding: 0px 0px 0px 0px; float: left; display: inline; background: transparent url(../images/larry.jpg) no-repeat scroll left top; width: 184px; height: 300px; position: relative; }
.leftWrapperVirgin em { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; background: transparent; width: 185px; top:340px;position: absolute; bottom: 0px; right: 0px; z-index: 999; font-size: 0.8em; color:#ffffff text-align: center; }