span, strong, a {font-size: 1em;}
.grey {display: block; width: 100%; background: #f8f8f8;}
.inner20 {display: block; margin: 0 20px; padding-top: 20px;}
#plan_showcase .expander {margin: 0 !important;}
#plan_showcase h3, #choose_term h3, #plan_configure h3 {font-size: 18px; font-weight: bold; margin-bottom: 15px; margin-top: 15px;}
#plan_showcase .sevenColAccordion .title h3 {font-size: 12px; margin-top: 0; line-height: 1em; padding-top: 6px;}
#choose_term p, #choose_term li, #choose_term label, #choose_term {font-size: 13px;}
#choose_term .title {float: left; width: 100px; text-align: right; margin-right: 35px;}
.radioList {float: left; margin-top: 3px;}
.radioList li {float: left; margin-right: 20px;}
.radioList li input {float: left; margin-left: 0;}
.radioList li label {float: left; margin-top: 2px;}
#term_length {border-bottom: 1px solid #ccc; width: 100%; padding-bottom: 5px;}
#term_benefits {float: left; margin-top: 15px;}
#term_benefits ul {float: left; margin-top: 5px; width: 350px;}
#term_benefits li {/* Changed by IBM,To match with new terms and conditions,To make Get extra value in single value width has been increased */width: 274px;/* End of Changed by IBM */float: left; margin-bottom: 8px; /* Changed by IBM to fix 42715 */padding-left: 3px;/* End of Changed by IBM to fix 42715 */}
#term_benefits li.even {width: 160px;}
#plan_showcase .plan {overflow:hidden; margin:0 0 40px 0; width:555px; /*margin:40px 0 100px 0;*/}
#plan_showcase .plan h4.planTitle {font-size: 16px; margin-bottom: 10px; color: #333;}
#plan_showcase .planGrid {border-top: 1px solid #DBDBDB; border-bottom: 1px solid #DBDBDB; height: 160px; /* Changed by IBM */margin-bottom: 3px;/* End of Changed by IBM */}
#plan_showcase .planGrid110 {height: 110px;}
#plan_showcase .planGrid120 {height: 120px;}
#plan_showcase .planGrid130 {height: 130px;}
#plan_showcase .planGrid140 {height: 140px;}
#plan_showcase .planGrid150 {height: 150px;}
#plan_showcase .planGrid160 {height: 160px;}
#plan_showcase .planGrid170 {height: 170px;}
#plan_showcase .planGrid div {display: block; height: 100%; float: left; text-align: center; border-right: 1px solid #DBDBDB;}
.fourValues div {width: 95px;}
.threeValues div {width: 126px;}
.twoValues div {width: 190px;}
#plan_showcase .value {font-weight: bold; margin: 20px 0 0 0;} 	
#plan_showcase .termPrice12Months {display: none;}
#plan_showcase .businessPlan .value {margin-top: 32px;}
.fourValues .value {font-size: 22px;}
.threeValues .value {font-size: 26px;}
.twoValues .value {font-size: 30px;}
#plan_showcase .value .sub, #plan_showcase .value .subCents, #plan_showcase .value .subChar {position: relative;}
#plan_showcase .value .subCents {top: -4px;}
#plan_showcase .value .subChar {top: -6px;}
.fourValues .value .sub {font-size: 16px;}
.fourValues .value .subCents {font-size: 16px;}
.fourValues .value .subChar {font-size: 16px;}
.threeValues .value .sub {font-size: 20px;}
.threeValues .value .subCents {font-size: 20px;}
.threeValues .value .subChar {font-size: 20px;}
.twoValues .value .sub {font-size: 24px;}
.twoValues .value .subCents {font-size: 24px;}
.twoValues .value .subChar {font-size: 24px;}
#plan_showcase .desc {padding: 0 4px; margin: 0; font-weight: normal; line-height: 1.3em;}
#plan_showcase .planGrid .active {background: #ebebeb;}
#plan_showcase .planGrid .extras {width: 165px; text-align: left; border-right: none; position: relative;}
#plan_showcase .planGrid .extras .title {font-weight: bold; font-size: 12px; color: #AD44AF; margin: 10px;}
#plan_showcase .planGrid .extras ul {margin-left: 10px; width: 160px;}
#plan_showcase .planGrid .extras ul.headline li {font-size: 15px; font-weight: bold;}
#plan_showcase .planGrid .extras ul.handsetDiscount {position: absolute; bottom: 10px;}
.planActions{margin:10px 0; clear:both; overflow:hidden;}
.planActions .termLengthTitle {float: left; font-weight: bold; margin: 3px 25px 3px 3px;} 
.planActions .pickPlan {float: right; margin-right: 10px; *width:145px;}
.planActions .pickPlan .hide {display: none;}
.planActions .comparePlan {clear: both; float: right; margin-top: 10px; margin-right: 10px;}
.sevenColAccordion {margin-bottom: 3px;}
/* plan details table */
.planDetailsTable thead th {font-size: 14px; padding: 20px 2px 8px 2px;}
.planDetailsTable tbody td {font-size: 13px; line-height: 18px; padding: 0 30px 10px 0;}
.planDetailsTable td.alignRight {text-align: right;}
.planInfo ul.thingsToKnow li {margin-bottom: 10px; font-size: 13px; list-style: decimal outside none;}
/* Configure my plan page */
.progression ul li {width: 133px;}
.progression ul li a {padding: 0 0 0 15px;}
#plan_configure .plan {margin-bottom: 35px;}
#plan_configure .planGrid {margin-bottom: 0; border-bottom: none;}
#plan_configure .fourValues div {width: 145px;}
#plan_configure .threeValues div {width: 190px;}
#plan_configure .twoValues div {width: 290px;}
#plan_configure .planGrid .price {background-color: #fff;}
#plan_configure .fourValues .desc {padding: 0 30px;}
#plan_configure .threeValues .desc {padding: 0 50px;}
#plan_configure .twoValues .desc {padding: 0 90px;}
#plan_configure .introInfo {padding-bottom: 25px; margin-bottom: 30px; border-bottom: 1px solid #ccc;}
#plan_configure .introInfo h3.infoIconTitle {padding: 7px 0 7px 30px; background: url(/vf-apps/shop/css/1.2/img/buttons/tooltip-icon-20x20.png) no-repeat left center; margin-bottom: 10px;}
#plan_configure .introInfo .bulletSmall {margin-left: 30px;}
#plan_configure .introInfo .bulletSmall li {font-size: 13px; margin-bottom: 6px;}
#plan_configure .sevenColAccordion .modCopy {width: 720px;}
/* NEW NUMBER CHOSEN */
#new_number_selected {}
#new_number_selected .purpleBG {height: auto;}
#new_number_selected a {margin-left: 20px; margin-bottom: 10px; display: block;}
/* select number overrides */
#ddNewPhoneNumbers, #divNewNumberNotHappy {padding-left: 0;}
.divNewPhoneNumbersWrap {width: 100%;}
.divNewPhoneNumbersWrap li.newLine {width: 145px;}
.divNewPhoneNumbersWrap li {width: 145px; background: #f8f8f8; margin: 1px 5px; padding: 2px 0; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.divNewPhoneNumbersWrap label {font-size: 13px;}
.divNewPhoneNumbersWrap li.newLine input, .divNewPhoneNumbersWrap input {margin: 0 5px 0 10px;}
.siteOverlay .purpleBG {height: 145px; width: 620px; margin-left: 30px;}
.siteOverlay .purpleBG div.paging {float: left; width: auto; margin-right: 10px; margin-top: 20px; margin-left: 5px;}
#divNewNumberNotHappy {margin-top: 27px;}
.siteOverlay .purpleBG .buttonGreen input {margin-top: 0;}
.optionsnumber .column1_2 {margin: 0 0 10px 8px;}
.optionsnumber .column1_2 li {line-height: 1.5em !important; margin: 0 0 10px 0;}
.optionsnumber .column1_2 label, .divNewPhoneNumbersWrap label {position: relative; top: 2px;}
#divCurrentVodNumInputs input, #divCurrentVodNumInputs label, #divCurrentVodNumInputs .lightGreyText {float: left;}
#divCurrentVodNumInputs label {width: 125px; margin-top: 5px;}
#divCurrentVodNumInputs input#txtCurrentVodNum {margin-right: 10px; margin-bottom: 5px;}
#divCurrentVodNumInputs input#txtCurrentPIN {margin-right: 10px;}
#divCurrentVodNumInputs div.lightGreyText {margin-top: 5px;}
#current_num_cta {margin-left: 125px; margin-top: 10px;}
#current_num_cta .buttonGreen {margin-top: 15px;}
a.tip {background: url(/vf-apps/shop/css/1.2/img/buttons/tooltip-icon-14x14.png) no-repeat left center; display: inline-block; height: 14px; width: 14px; position: relative;	top: 3px;}
#cartmobile.siteOverlay .portingnumber .column2_2 {width: 410px;}
/* ADD-ONS styles */
.addOnGroup {margin: 20px 0 20px 30px; padding-bottom: 15px; border-bottom: 1px solid #f8f8f8;}
.sevenColAccordion .addOnGroup {margin-left: 10px;}
.addOnGroup h4 {font-size: 15px;}
.addOnControl {clear: both; margin: 8px 0;}
.addOnControl label {vertical-align: middle;}
.addOnControl .nestedAddOnControls {margin-left: 25px; margin-bottom: 10px;}
.addOnControl .addOnControl label {margin-right: 10px;}
.addOnControl .addOnControl .lightGreyText {display: inline; margin-left: 5px;}
/* bestmates */
.addOnGroupActions .addBestMate {padding: 8px 10px; background: #f8f8f8; width: 500px; height: 45px; margin-bottom: 5px;}
.addOnGroupActions .addBestMate p, .addOnGroupActions .addBestMate input {float: left; margin: 0 5px 5px 5px;}
.addOnGroupActions .addBestMate p {width: 120px;}
#add_extra_bestmate {margin-left: 5px; display: inline-block; margin-bottom: 10px; text-decoration: underline;}
/* summary */
#add_ons_summary {background: #f8f8f8; padding: 5px 0;}
#add_ons_summary div {float: left; padding: 0 15px; border-right: 1px solid #ddd; min-height: 55px;}
#add_ons_summary ul {margin-top: 0.5em;}
#add_ons_summary p {margin-bottom: 0;}
#add_ons_summary div.summaryOverview {width: 155px;}
#add_ons_summary div.summaryOverview ul li {display: inline;}
#add_ons_summary div.summarySubtotal {width: 120px;}
#add_ons_summary div.summaryUpfront {width: 120px;}
#add_ons_summary div.summaryExtraInfo {width: 225px; padding-right: 0; border-right: none;}
#add_ons_summary div.summaryExtraInfo p {margin-top: 10px;}
#save_plan_details {float: right; margin-top: 20px; margin-bottom: 40px;}
/* ERROR MESSAGES */
.aboveBoxErrorMessage {background: #fef2ea; display: block; clear: both; margin-bottom: 2px;}
.aboveBoxErrorMessage p {color: #bd0000; padding: 9px 10px 8px 15px; display: inline-block; margin: 0;}
#add_bestmate_error {width: 520px;}
#vodafone_number_error {width: 640px; margin-left: 30px;}
input.hasError {border: 1px solid #aaa; background-color: #FFF2F2;}
span.required {margin-right: 0;}
a.buttonGreen span {background: url(/vf-apps/shop/css/1.2/img/buttons/btn_green.png) no-repeat scroll left top transparent !important;}
a.buttonGreen:hover span {background: url(/vf-apps/shop/css/1.2/img/buttons/btn_green.png) no-repeat scroll left -126px transparent !important;}
/* VFNZ new button style override */
.formButtons input {font-weight: bold;text-align: left;width: auto;}
div.formButtons div {display: block;float: left;margin-left: 4px;padding-right: 4px;}
div.formButtons div span {display: block;float: left;font-weight: bold;height: 20px;line-height: 20px;margin-left: -4px;padding: 5px 14px 5px 15px;}
div.formButtons div span input {background: none repeat scroll 0 0 transparent;border: medium none;color: #FFFFFF;cursor: pointer;font-size: 13px;height: 20px;line-height: 20px;position: relative;}
div.formButtons div.buttonLight {background: url(/vf-apps/shop/css/1.2/img/buttons/btn_lightgrey.png) no-repeat scroll right top transparent;}
div.formButtons div.buttonLight span {background: url(/vf-apps/shop/css/1.2/img/buttons/btn_lightgrey.png) no-repeat scroll left top transparent;}
div.formButtons div.buttonLight span input {color: #333333;text-shadow: 1px 1px 1px #FFFFFF;}
div.formButtons div.buttonLight:hover span input {color: #E60000;}
div.formButtons div.buttonDark {background: url(/vf-apps/shop/css/1.2/img/buttons/btn_darkgrey.png) no-repeat scroll right top transparent;}
div.formButtons div.buttonDark span {background: url(/vf-apps/shop/css/1.2/img/buttons/btn_darkgrey.png) no-repeat scroll left top transparent;}
div.formButtons div.buttonDark span input {text-shadow: -1px -1px 1px #333333;}
/* Changed by IBM,as we are mentaining single folder for images,path also changed to point to that folder */
div.formButtons div.buttonGreen {background: url(/vf-apps/shop/css/1.2/img/buttons/btn_green.png) no-repeat scroll right top transparent;}
div.formButtons div.buttonGreen span {background: url(/vf-apps/shop/css/1.2/img/buttons/btn_green.png) no-repeat scroll left top transparent;}
/* End of Changed by IBM */
div.formButtons div.buttonGreen span input {text-shadow: -1px -1px 1px #3A5F29;}
/* button tweaks */
div.formButtons div.buttonGreen span input {margin-right: 0;font-size: 12px;}
div.formButtons div span {padding: 4px 3px 5px 7px;}
/* ACCORDION TO ATG CONVERSION */
.showDetails {width:100%; border:1px solid #dbdbdb; margin-left:10px; margin-bottom:20px; background-color:#dbdbdb; height:36px; cursor:pointer;}
.showDetails p {font-weight: bold; margin-left: 8px; display: inline-block;}
/* Changed by IBM,as we are mentaining single folder for images,path also changed to point to that folder */
.showDetails span {display:block; float:left; height: 20px; width:20px; overflow:hidden; /*******to make the arrow button to work********/margin-left:-27px; margin-top:8px; background: url(/vf-apps/shop/css/1.2/img/buttons/down.png) no-repeat scroll left top transparent;}.showDetails.selected span {background: url(/vf-apps/shop/css/1.2/img/buttons/up.png) no-repeat scroll left top transparent;}
/********End of Changed by IBM*********/
.showDetails span:hover {background-position:left bottom;}
/* Changd by IBM, PlanDetails class is used in JS file,so we retained this class instead of using sevenColAccordion */
.planDetails {border-right: 1px solid #DBDBDB; border-bottom: 1px solid #DBDBDB; border-left: 1px solid #DBDBDB; padding: 10px 19px; /* margin:-55px 0; _margin:0 0 -10px 0;*/}
/* Changd by IBM */
/* VFNZ Seven Col Accordion module override */
.sevenColAccordion .accordionSectionTitle {width:528px; border:1px solid #DBDBDB; margin-left:10px; margin-bottom:20px;}
.sevenColAccordion .modBody {width:528px;}
.sevenColAccordion .modCopy	{padding:10px 10px 10px 40px; width:478px;}
.sevenColAccordion .title {height:36px; background-color:#dbdbdb; cursor:pointer;}
.sevenColAccordion .title h3 {line-height: 35px; padding-left:40px;}
.sevenColAccordion .title span {display:block; float:left; height: 20px; width:20px; margin-left:10px; margin-top:8px; background: url(/vf-apps/shop/css/1.2/img/buttons/down.png) no-repeat scroll left top transparent;}
.sevenColAccordion .selected .title span {background: url(/vf-apps/shop/css/1.2/img/buttons/tabs/up.png) no-repeat scroll left top transparent; }
.sevenColAccordion .title:hover span {background-position:left bottom;}
.sevenColAccordion ul.greyArrowList li {padding-left:0;}
.sevenColAccordion img {padding:7px 20px 20px 0; float: left;} 
/* OVERRIDES & TWEAKS */
.sevenColAccordion .accordionSection, .sevenColAccordion .accordionSectionTitle {margin: 0; width: 100%; border-color: #f8f8f8;}
.sevenColAccordion .modBody {width: 100%;}
.sevenColAccordion .modCopy {padding: 0; width: 100%;}
.sevenColAccordion .title span {margin-top: 3px; margin-left: 5px;}
.sevenColAccordion .title {background-color: #f8f8f8; height: 26px;}
.sevenColAccordion .modCopy {margin: 20px; width: 515px;}
.sevenColAccordion .title p {padding-left: 35px; padding-top: 5px; margin: 0;}
.sevenColAccordion .title {margin: 0; cursor: pointer;}
/* HTML container - tabbed info header styles */
#plans_tabbed_info {background: #EFEFEF; height: 190px;}
#plans_tabbed_info .selectors div {-moz-box-shadow: #ccc 2px 3px 5px; -webkit-box-shadow: #ccc 2px 3px 5px; box-shadow: #ccc 2px 3px 5px; -moz-border-radius: 3px 0 0 3px; -webkit-border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px;}
#plans_tabbed_info .selections {-moz-box-shadow: #ccc 5px 3px 5px; -webkit-box-shadow: #ccc 5px 3px 5px; box-shadow: #ccc 5px 3px 5px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
#plans_tabbed_info .selectors {float: left; width: 160px; margin-top: 10px;}
#plans_tabbed_info .selectors div {background: #f8f8f8; height: 36px; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; border-left: 1px solid #ddd; margin-left: 10px; text-align: right;}
#plans_tabbed_info .selectors div.selector-1 {border-top: 1px solid #ddd;}
#plans_tabbed_info .selectors div.activeSelector {background: #fff; margin-left: 0; padding-left: 10px; border-right-color: #fff;}
#plans_tabbed_info .selectors a {padding: 9px; display: inline-block; text-decoration: none; text-shadow: #fff 0 1px 0;}
#plans_tabbed_info .selectors div.activeSelector a {font-weight: bold; color: #7B2077;}
#plans_tabbed_info .selections {float: left; width: 390px; height: 170px; background: #fff; border-top: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;}
#plans_tabbed_info .selections div {margin: 15px 20px;}
#plans_tabbed_info .selections h5 {font-weight: bold;}
#plans_tabbed_info .selections img {float: right; margin: 15px 10px;}
#plans_tabbed_info .selections span.fontSmall {font-size: 11px; display: inline-block; width: 240px;}
/* Added by IBM, after clicking on "what are the details of this plan" ajax call is happening,so we are reatining this functionality from old one,as we are using many classes of plandetails section in JS file */
.plan #showDetails a{width:93%; font-size:12px; font-weight:bold; line-height:36px; margin:0; padding:0 0 0 35px; text-decoration:none;}
#plan_showcase .planInfoX .expander{margin-left:0px !important;}
.plan .planDetails .clearfix .modCopy{width:515px; padding-left:0;}
.plansPrepay #plan_showcase .plan{margin-top:-22px;margin-bottom:68px !important;}
#onAccountPlans{float:right;margin-top:28px;}
#onAccountPlans  a{text-decoration:none;margin-right:14px !important;}
.plan  td.hr{margin-left:-10px !important;}
.planInfoX  .expander a{background-image:none !important;}