body{
    background-color:#F3F3F3;
    background-image:none;
    font-size:14px !important;
}

.content-area{
    padding-bottom:0;
}

.content-area.fr{
    float:none;
}

.content-area p {
    margin-bottom: 0.5em;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
}

a{font-weight:normal !important;}

.contents {
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    position: relative;
    width: 965px;    
}


#header .contents{
    border-bottom-style:none;
    height:0;
}

.section-header{padding-bottom: 48px;}

.bonusAutoOffer {margin-bottom: 24px;}

#topUpPopup #topup-form {
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    width: 511px;
}

.content-area {
    background-color: #FFF;
    padding-bottom: 30px;
    position: relative;
    text-align:left;
    min-height: 630px;
}

.topupNowMenu .section-header p{
    font-size:14px;
    margin-bottom: 16px;
}

.section-header p:nth-child(5) {
    padding: 0;
}

.topupNowMenu .section-header h1{
      font-size: 32px;
      padding: 0 0 32px; /*added*/
      color: #131c35;
      letter-spacing: -0.6px;
}

#section1, #section2{
    border: solid 1px #CDCFD5;
    padding: 32px;
    border-radius: 16px;
}
#section2 {width: auto;}
#section1 h3,#section2 h3{
    font-size:20px !important;
    margin-bottom:1em;
}

#section1 h3, #section2 h3{
    font-size:24px;
}
#section1 h3.ultra, #section2 h3.ultra{
    /* font-family: Arial, Helvetica, sans-serif !important; */
    /* font-weight: bold !important; */
    /* font-size: 14px !important; */
}

#section1 h2.ultra, #section2 h2.ultra{
      font-size: 22px;
      margin-bottom: 24px;
}
#section1 .what-you-need{
    height: auto;
    margin-top: 30px;
}

.content-area.fr #section1 .what-you-need{

}


#section1 .btnHolder{
    /* bottom: 0; */
    margin: 0 auto;
    /* position: absolute; */
    width: 100%;
}
.fr #section1 .btnHolder{

}
#section1 .btnAlign{
    margin:0 auto;
    text-align:center;
}


#section2 .what-you-need{
}

.fr #section2 .what-you-need{

}

#section2 .hot-offer {/*changed*/
    background: url("/assets/icons/ho-red-flame-medium.png") no-repeat scroll 1px 10px;
    padding-left: 35px;
    padding-top: 10px;
}

#section2 .btnHolder{
    /* position:absolute; */
    /* bottom:33px; */
    justify-content: flex-end;
    /* vertical-align: bottom; */
}
.fr #section2 .btnHolder{
     bottom: 20px;
}
#section2 .btnAlign{
    margin:0 auto;
    width:400px;
    text-align:center;
    *
    position:relative;
    *
    left:-300px;
}

#lowbalancetopup .btnHolder {/* position: static; *//* margin-top: 20px; */}
#section2 #lowbalancetopup .btnAlign {text-align: left; width: auto;}
/* section 3 */
#section3 {margin:50px 0 0 0}
#section3 h2 {font-size: 24px;}

#section3 h2{text-transform:none;}
/*step nav */

.step-container{
    width:965px; height:52px; margin-bottom:45px;
}

.step-blue-background{
    background-color:#01AFE2; height:52px; float:left;
}



.step-grey-background{
    background-color:#ececec; width:224px; height:52px; float:left;
}

.step-regular-text{
    text-align:center;  margin-top:16px
}

.step-white-text{
    color:#FFF; text-align:center; margin-top:16px
}

.step-arrow-grey{
    background:url('/assets/images/myaccount/step-arrow-grey.jpg') no-repeat top left transparent; width:52px; height:52px; float:left
}
.step-arrow-blue{
    background:url('/assets/images/myaccount/step-arrow-blue.jpg') no-repeat top left transparent; width:52px; height:52px; float:left
}

.step-arrow-grey-blue{
    background:url('/assets/images/myaccount/step-arrow-grey-blue.jpg') no-repeat top left transparent; width:52px; height:52px; float:left
}


.step-regular-text{
    text-align:center; margin-top:16px
}

.width207{
    width:207px;
}

.width224{
    width:224px;
}

.width254{
    width:254px;
}
/* accordion styles */

.accordion {border-top: 1px dotted #ccc; padding-bottom: 25px; margin-top: 20px;}
.accordion .ui-widget-content {}
.accordion li {padding: 20px 0 10px 0; border-bottom: 1px dotted #ccc;}
.accordion a {text-decoration: none;}
.accordion a.ui-state-active {background: url("/assets/images/accordion-close.png") no-repeat top left !important; height: 35px !important; line-height: 20px; padding-left: 35px; display: block; color: #333; font-weight: bold; font-size:14px;}
.accordion a.ui-state-hover {color: #2390B8 !important;}
.accordion a.ui-state-default {background: url("/assets/images/accordion-open.png") no-repeat top left; height: 35px; line-height: 20px; padding-left: 35px; display: block; color: #333; font-weight: bold !important; font-size:14px;}
.accordion li.ui-accordion-li-fix div.ui-accordion-content {padding: 0 36px; margin: 25px 0 10px 0; font-size:14px;}
.ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active{margin-top:-5px}
.ui-dialog-titlebar { display: none; }

.accordion ul.standard-list li {border-bottom: none; padding: 0 0 0 3px; margin-bottom: 10px;}
.column1, .column2, .column3 {width: 210px; border-right: 1px solid #ccc; float: left;}
.column2, .column3 {padding-left: 35px;}
.column3 {border-right: none;}
.accordion ul.phones {padding-top: 10px;}
.accordion ul.phones li {border-bottom: none; padding: 2px 0;}

.topUp-content-area{
    /*background-color: #F3F3F3;*/
    min-height:610px;
}

.main-content-area{
    margin-bottom: 48px;
    background-color:#FFF;
    position:relative;
}

.topUp-area{
    background-color: #FFFFFF;
    border-top-color: #E0E0E0;
    border-top-style: solid;
    border-top-width: 7px;
    float: left;
    height: auto;
    padding-bottom: 63px;
    width: 641px;
}

#topUp-card{
    border-right:solid thin #dadada;
    float:left;
    padding: 0;
    padding-bottom: 10px;
    /* height: 553px; */
    position: relative;
    width: 263px;
    padding: 0 24px 0 0;
}

.fr #topUp-card{
    height:490px;
}

#credit-card{
    width: 263px;
    border-right: 1px solid #CDCFD5;
    float:left;
    padding: 0 24px;
    margin-bottom:10px;
    position: relative;
}
.fr #credit-card{
    height:490px;
}
#interac-topup{
    width: 263px;
    float:left;
    padding: 0 0 0 24px;
    margin-bottom:10px;
    height:510px;
    position: relative;
}
.fr #interac-topup{
    height:490px;
}
#preauthorized, #auto-topup {
  padding-right: 32px;
}
#auto-topup{
    border-right: solid thin #CDCFD5;
    width: auto;
    padding-top: 5px;
}

#preauthorized{
    padding: 5px 0 0 32px;
    width: auto;    
}
.fr #auto-topup, .fr #preauthorized {
 	/*** To fix height from bottom button ***/
    /*height: 530px;*/
}
.how-to-do{
   padding-top: 16px;
   /*** To fix height from bottom button ***/
   display: flex;
   flex-direction: column;
   height: 172px;   
}


.ultra{/* text-transform:uppercase; */}


.red{
    color:#C00;
}

ol{
  list-style: decimal inside;


}

ol li{
    list-style: decimal inside;
  font-size: 14px;
  color: inherit;
  margin: 0 0 .5em 2em;
  line-height: 1.2em;
  list-style-position: outside;
    /*list-style-type:decimal;
    list-style-position:outside;
    margin-left:20px;
    margin-bottom:3px;
    font-weight:bold;*/
}

ol li span{
    font-weight:normal;

}

ol.confirm{
    border:solid thin #c9c9c9;
    margin:20px 0;
}

ol.confirm li{
    padding:7px 0;
    margin-left:50px !important;
}



ul.standard-list li{
    /* margin-bottom:0; */
    /* width:100%; */
}
#accordion3 .numbered-list > li {
    font-weight: normal;
}
.myAccount-nav{background-color:#F3F3F3;}

/*
.copyright{width:965px; margin:0 auto; text-align:right; color:#999; border-top:solid thin #d3d3d3; margin-top:30px;}
*/
table.price-data{border:solid 1px #d1d1d1; width:821px; background-color:#FFF; margin-top:20px;}
table.price-data td {
    border-bottom: 1px solid #D1D1D1;
    font-size: 14px;
    padding: 20px;
    text-align: center;
}
td.ultra {
    background-color: #D1D1D1;
    color: #3F3F3F;
    font-size: 18px !important;
}

table{text-align:left;}


form input[type='text']{
    width: 273px;
    margin-top: 7px;
    line-height: 32px;
    border-radius: 4px 4px 0px 0px;
    background: #F3F2F0;
    padding: 5px 15px 5px 10px;
    color: #444D63;
    height: 34px;
    border-style: none none solid none;
}

form input[type="password"] {
   width: 273px;
    margin-top: 7px;
    line-height: 32px;
    border-radius: 4px 4px 0px 0px;
    background: #F3F2F0;
    padding: 5px 15px 5px 10px;
    color: #444D63;
    height: 34px;
    border-style: none none solid none;
    margin-top: 7px;
}

.inputWrapper{
    margin-bottom:20px;
}

.forgotPassword{
    margin-left:10px;
}

#mdn{
    width:166px;
}

#pin{
    width:166px;
}

.mainContentContainer #pin{
    width:auto !important;
}

.errorMessage{
    background-color:#eee;
    padding:10px;
    margin-bottom:20px;
}

.errorMessage p.icon{
    background:url('/assets/icons/icon-error-red.png') no-repeat top left transparent;

}
.errorMessage p span{
    margin-left:19px;
}

.errorMessage ul li{
    list-style:disc outside;
    margin-left:30px;
    color:#c00;
}

.errorMessage ul li span{
    color:black;
}

.error{
    color:#C00;
}

p.underline{
    border-bottom:solid thin #dbdbdb;
    margin-bottom:20px;
    padding-bottom:20px;
}

.fieldTitle{
    font-weight:bold;
    margin-bottom:3px;
    clear:left;
}

.fieldTitle.editRow{
    float:left;
    margin-right:50px;
    margin-bottom:10px;
}

.editTitle{
    color:#2390B8;
}

.left-content{
    float:left;
    width:455px;
}

.right-content{
    width:455px;
    float:left;
}

.floatL{float:left}
.floatR{float:right}


.box {border: 10px solid #eaeaea;}
#sectionPromo { margin-bottom: 42px; margin-top:75px;}
#sectionPromo .box {width: 294px; float:left; height:333px;}
#sectionPromo .box1{margin-right:10px;}
#sectionPromo .box2{margin-right:10px;}
#sectionPromo .box .boxContent h2 {font-size: 23px;color:#c00 !important; line-height:26px; border-bottom: solid 1px #CCC; padding-bottom:12px;}
#sectionPromo .box .boxContent{padding:10px;}
#sectionPromo .box .boxContent p{padding-top:15px;}

/*style for top up mdn check*/
.modalOverlay{
    text-align:left;
}

#topUpPopup{
    margin-left: 15px;
    width:550px;
}

#topUpPopup #topup-form{
    width:511px;
    margin:0 auto;
    padding:20px;
}

#topup-form #txtOtherAmt{
    width:100px ;
}

/*.subcopy{
    margin:20px 0;
}*/


.subcopy {
    margin-bottom: 20px;
    margin-left: 0;
    margin-right: 0;
    margin-top: 20px;
}

#headerArea{
    background-color:#2D2D2D;
    background-attachment: scroll;
    background-clip: border-box;
    background-image: none;
    background-origin: padding-box;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto auto;
    clear: both;
    float: none;
    height: 100px;
    min-width: 954px;
    text-align: center;
}
.top-links{float:right}
ul.top-links li {
    background-color: #202020;
    float: left;
    height: 22px;
    margin-left: 2px;
    padding-left: 7px;
    padding-right: 7px;
    padding-top: 5px;
    width: auto;
}
ul.top-links li a{color:#FFF; font-size:11px;}
ul.top-links li a:hover{color:#34A8D6}

ul.top-links li.last{margin-top:0px\9}

.members-lounge.last > img{
    position:relative;
    top:1px;
}


.account-footer{margin:0 auto; width:965px; margin-top:-14px;}
.account-footer .floatL{padding-left:20px;}
#footerContianer{width:965px;}
#footerNav{display:none;}

.field2, .field3, .field4, .field5{display:none}

.btnBlock{font-weight:normal;}

.showField {
    margin-left: 10px;
}

.hideField {
    margin-left: 10px;
}

.fieldValue {
    margin-bottom: 10px;
    margin-top: 10px;
}


/* Feez Back Css Start here */


.do-not-suvey {
    bottom: 3px;
    margin-left: 3px;
    margin-right: 4px;
    position: relative;
}
.fizzback {
    cursor: pointer;
}
.row-fields.fizzback {
position: relative; top: -14px; left: 16px; font-size: 12px;
}

/* Feez Back Css Ends here */

#topUp-card .btnBasic {
    background: #cc0000 none repeat scroll 0 0;
    border-color: #cc0000;
    color: #fff !important;
}
    #topUp-card .btnBasic:hover {
        background: #eb0000 none repeat scroll 0 0;
        border-color: #eb0000;
        color: #fff !important;
    }


.topupNowMenu .section-header h1 {font-size: 32px !important; padding: 0 0 24px; color: #131c35; letter-spacing: -0.6px; margin: 0;}
.topupNowMenu .section-header p {font-size: 14px; margin-bottom: 16px; padding: 0;}
.topupNowMenu #section1 h2.ultra, #section2 h2.ultra {font-size: 22px; margin-bottom: 24px;}
.topupNowMenu .plancolumns a.underline-links-paragraph {color: #4e4ae4;}
.topupNowMenu #lowbalancetopup .how-to-do {height: auto;}
.topupNowMenu #topUp-card .how-to-do, #credit-card .how-to-do, #interac-topup .how-to-do {height: 290px;}
.topupNowMenu #topUp-card .what-you-need, #credit-card .what-you-need, #interac-topup .what-you-need {height: 170px;}
.topupNowMenu .nonLoggedIn {width: 100%;}
.topupNowMenu .nonLoggedIn .combBox {display: flex; margin-bottom: 32px;}
.topupNowMenu .nonLoggedIn .combBox .columns {flex-basis: 50%;position: relative;}
.fancybox-wrap .fancybox-inner {height: auto !important;}
#cc_msg h1.ultra {padding-top: 32px; color: #131c35;}



@media screen and (max-width: 1023px){
    #section1, #section2 {
      padding: 25px !important;
    }
    #section2 {
        width: auto;
    }
    #topUp-card, #credit-card, #interac-topup, #auto-topup, #preauthorized, .fr #topUp-card, .fr #credit-card, .fr #interac-topup, .fr #auto-topup, .fr #preauthorized{
      width: auto;
      border-right: none;
      float: none;
      padding: 0;
      margin-bottom: 10px;
      height: auto;
      position: relative;
      border-bottom: solid thin #dadada;
    }
    #topUp-card, #credit-card, .fr #topUp-card, .fr #credit-card{
        margin-bottom:20px;
    }
    #interac-topup, #preauthorized, .fr #interac-topup, .fr #preauthorized{
        border-bottom: none;
    }
    .how-to-do {
      padding-top: 0;
      margin-bottom: 25px;
    }
#section1 .what-you-need, #section2 .what-you-need, .content-area.fr #section1 .what-you-need, .content-area.fr #section2 .what-you-need{
      height: auto;
      position: relative;
      top: inherit;
      width: auto;
    }
#section1 .btnAlign, #section2 .btnAlign {
      margin: 0 auto;
      width: auto;
    }
    #section1 .btnHolder, #section2 .btnHolder, .fr #section1 .btnHolder, .fr #section2 .btnHolder{
        margin: 0 0 0 0;
        position: relative;
        bottom: inherit;
    }
    #topUp-card, #credit-card, #interac{
    width:auto;
    }
}

/*** To handle the height and width AUTO MONTHLY PAYMENT and Bank IT ***/
.nonLoggedIn .combBox {
    display: flex;
    margin-bottom: 48px;    
}



/***** BUTTON CLASSES *****/
/* basic buttton - red */
.btnBasic {
    display: inline-block;
    padding: 12px 17px;
    border-radius: 3px;
    border: 2px solid #000;
    background-image: none;
    font-weight: bold;
    font-size: 16px;
    text-decoration: none;
    color: #000 !important;
    background: transparent;
}
    .btnBasic:hover {
        color: #fff;
        border-color: #999;
        background-color: #999;
    }

#topUp-card .btnBasic {
    background: #cc0000 none repeat scroll 0 0;
    border-color: #cc0000;
    color: #fff !important;
}
    #topUp-card .btnBasic:hover {
        background: #eb0000 none repeat scroll 0 0;
        border-color: #eb0000;
        color: #fff !important;
    }

@media screen and (max-width:800px) {
    .btnBasic {
        padding: 11px 57px;
        font-size: 15px;
    }
	.topupNowMenu #topUp-card .how-to-do, #credit-card .how-to-do, #interac-topup .how-to-do {height: auto;}
	.topupNowMenu #topUp-card .what-you-need, #credit-card .what-you-need, #interac-topup .what-you-need {height: auto;}
	#topUp-card, #credit-card, #interac {padding: 32px 0; margin-bottom: 0; border-bottom: solid 1px #CDCFD5;}
	.topupNowMenu .nonLoggedIn .combBox {padding-bottom: 0; }
	#section1 h3.ultra, #section2 h3.ultra {padding-bottom: 16px;}
	#section1 .btnAlign, #section2 .btnAlign {text-align: left;}
	#interac-topup {padding-top: 32px;}
	#interac-topup #interac {padding: 11px 57px; border: 2px solid #000;}
}