/* reset css start */
@import url("https://fonts.googleapis.com/css2?family=Cabin:wght@400;500;600;700&family=Open+Sans:wght@400;600&display=swap");

html, body {
  margin: 0;
 
  height: 100%;
}

body {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  background-image: linear-gradient(0deg, rgba(44, 109, 234, 0.8), rgba(115, 69, 96, 0.8)), url('https://easy.ebill.xyz/assets/images/track.jpg');
  /* Layered background: gradient + image */
  background-size: cover; /* Ensures the image and gradient cover the entire page */
  background-position: center; /* Ensures the background is centered */
  background-repeat: no-repeat; /* Ensures the image doesn't repeat */
  background-attachment: fixed; /* Keeps the background fixed during scroll */
  min-height: 100%; /* Ensures the body height stretches to fill the entire page */
}




a, a:hover, a:focus { outline: none; color: #1a5b2a; text-decoration: none }


.mobile-view { width: 400px; background-color:#fafafa; opacity: 2;  margin: auto auto auto auto; border-radius: 0px;
-moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-bottom-color: #ddd;    
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-image-outset: 0 0 0 0;
    border-image-repeat: stretch stretch;
    border-image-slice: 100% 100% 100% 100%;
    border-image-source: none;
    border-image-width: 1 1 1 1;
    border-left-color: #ddd;
    border-left-style: solid;
    border-left-width: 1px;
    border-right-color: #ddd;
    border-right-style: solid;
    border-right-width: 1px;
    border-top-color: #ddd;    
    border-top-style: solid;
    border-top-width: 1px;
}
.inner-content { padding: 2px 5px 5px }
.logo { text-align: center; }
.pname-pprice { margin: 2px 0px 5px;  }
.pname-pprice .row { background: #fff; border-radius: 8px;  }
.pname-pprice .col-lg-7, .pname-pprice .col-lg-5 { padding: 10px; color: #565b63; }
.pname-pprice .col-lg-7 { border-right: 2px solid #e6e9ec; }
.pname-pprice .col-lg-7 span { font-size: 12px; }
.pname-pprice .col-lg-5 { font-size: 18px; text-align: right; }
.pname-pprice .col-lg-5 b { font-size: 14px; }

.amountTotal{font-size: 30px;display: inline-block;font-weight: bold;}

.tab-content .tab-pane { background: rgba(192, 192, 192, 0.15); padding: 15px; border-radius: 10px;
    margin-top: 3px;
    padding: 15px; }
.cards .nav-tabs > li { margin-bottom: 0; }
.cards .nav-tabs > li a { font-weight: bold; }
.cards .nav-tabs, .cards .nav-tabs > li.active > a, .cards .nav-tabs > li.active > a:focus, .cards .nav-tabs > li.active > a:hover, .cards .nav-tabs > li > a { border: none; }
.grayscale {   -webkit-transition: -webkit-filter .5s; }
.card-list li a.active .grayscale, .grayscale:hover { -webkit-filter: grayscale(0%); filter: none; -webkit-transition: -webkit-filter .5s; }
.card-list { padding:0; margin: 0; }
.card-list li { list-style: none; display: inline-block; padding: 5px;  }
.card-list li span { display: block; width: 110px; height: 61px; text-indent: -9999px; cursor: pointer; }
 
 
.card-list li .nexus { background: url(../images/imagesallform.png) no-repeat;background-position:-247px -70px;}
.card-list li .nexus:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-247px -9px;} 
.card-list li .nexus:hover, .card-list li .nexus.active{background: url(../images/imagesallform.png) no-repeat;background-position:-247px -9px;}


.card-list li .dbbl_mobile { background: url(../images/imagesallform.png) no-repeat;background-position:-129px -201px;}
.card-list li .dbbl_mobile:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-129px -140px;}
.card-list li .dbbl_mobile:hover, .card-list li .dbbl_mobile.active{background: url(../images/imagesallform.png) no-repeat;background-position:-129px -140px;}

.card-list li .robi { background: url(../images/imagesallform.png) no-repeat;background-position:-9px -201px;}
.card-list li .robi:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-9px -140px;}
.card-list li .robi:hover, .card-list li .robi.active{background: url(../images/imagesallform.png) no-repeat;background-position:-9px -140px;}

.card-list li .qcash { background: url(../images/imagesallform.png) no-repeat;background-position:-248px -333px;}
.card-list li .qcash:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-248px -272px;} 
.card-list li .qcash:hover, .card-list li .qcash.active{ background: url(../images/imagesallform.png) no-repeat;background-position:-248px -272px;} 

.card-list li .bkash { background: url(../images/imagesallform.png) no-repeat;background-position:-370px -70px;}
.card-list li .bkash:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-370px -9px;}
.card-list li .bkash:hover, .card-list li .bkash.active{ background: url(../images/imagesallform.png) no-repeat;background-position:-370px -9px;}


.card-list li .islami_bank_mCash { background: url(../images/imagesallform.png) no-repeat;background-position:-247px -201px;}
.card-list li .islami_bank_mCash:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-247px -140px;}
.card-list li .islami_bank_mCash:hover, .card-list li .islami_bank_mCash.active{ background: url(../images/imagesallform.png) no-repeat;background-position:-247px -140px;}

.card-list li .mycash { background: url(../images/imagesallform.png) no-repeat;background-position:-9px -333px;}
.card-list li .mycash:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-9px -272px;}
.card-list li .mycash:hover, .card-list li .mycash.active{ background: url(../images/imagesallform.png) no-repeat;background-position:-9px -272px;}

.card-list li .ificmobile { background: url(../images/imagesallform.png) no-repeat;background-position:-129px -333px;}
.card-list li .ificmobile:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-129px -272px;}
.card-list li .ificmobile:hover, .card-list li .ificmobile.active{ background: url(../images/imagesallform.png) no-repeat;background-position:-129px -272px;}


.card-list li .ibblnetbank { background: url(../images/imagesallform.png) no-repeat;background-position:-369px -201px;}
.card-list li .ibblnetbank:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-369px -140px;}
.card-list li .ibblnetbank:hover, .card-list li .ibblnetbank.active{background: url(../images/imagesallform.png) no-repeat;background-position:-369px -140px;}

.card-list li .visa { background: url(../images/imagesallform.png) no-repeat;background-position:-9px -70px;}
.card-list li .visa:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-9px -9px;}
.card-list li .visa:hover, .card-list li .visa.active{background: url(../images/imagesallform.png) no-repeat;background-position:-9px -9px;}

.card-list li .mastercard { background: url(../images/imagesallform.png) no-repeat;background-position:-129px -70px;}
.card-list li .mastercard:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-129px -9px;}
.card-list li .mastercard:hover, .card-list li .mastercard.active{background: url(../images/imagesallform.png) no-repeat;background-position:-129px -9px;}
 
.card-list li .surecash { background: url(../images/imagesallform.png) no-repeat;background-position:-369px -333px;}
.card-list li .surecash:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-369px -272px;}
.card-list li .surecash:hover, .card-list li .surecash.active{background: url(../images/imagesallform.png) no-repeat;background-position:-369px -272px;}

.card-list li .jcb { background: url(../images/imagesallform.png) no-repeat;background-position:-9px -465px;}
.card-list li .jcb:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-9px -404px;}
.card-list li .jcb:hover, .card-list li .jcb.active{background: url(../images/imagesallform.png) no-repeat;background-position:-9px -404px;}

.card-list li .amex { background: url(../images/imagesallform.png) no-repeat;background-position:-129px -465px;}
.card-list li .amex:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-129px -404px;}
.card-list li .amex:hover, .card-list li .amex.active{background: url(../images/imagesallform.png) no-repeat;background-position:-129px -404px;}

.card-list li .dinersclub { background: url(../images/imagesallform.png) no-repeat;background-position:-248px -465px;}
.card-list li .dinersclub:hover{ background: url(../images/imagesallform.png) no-repeat;background-position:-248px -404px;}
.card-list li .dinersclub:hover, .card-list li .dinersclub.active{background: url(../images/imagesallform.png) no-repeat;background-position:-248px -404px;}

.card-list.mobile-card li {float: left;/*display:inline-block*/}

.btn-groups { margin-top:10px;margin-bottom: 10px; }
.help { padding: 0 0 10px; float: left; color: #fff}
.help:hover{color: #fff}
.powered-by { text-align: right; padding: 0 15px 15px; }
.gift_card { display: table; padding: 10px 0 0; }
.bottom-btn { margin: 0; background: #fff; padding: 0 15px 15px; text-align: center; }
.payment-msg { margin: 0 15px 15px; font-size: 12px; color: #fff}
.btn-primary, .pay-color, .pay-color:hover, .pay-color:focus { background: #2aa637; border: 1px solid #bdc3cb; }
#cancel-btn { border: none; }
.cancel-btn, .cancel-btn:hover { color: #1a5b2a; text-decoration: none; font-size: 14px; }
.form-control { box-shadow: none; }


.cards .nav-tabs > li a img { max-width: 100%; } 
 


@media(max-width:480px) { .mobile-view { width: 325px; } .cards .nav-tabs > li a { width: 65px; } }
@media(max-width:360px) { .mobile-view { width: 325px; } .cards .nav-tabs > li a { width: 65px; } }

@media only screen and (min-width :0px) and (max-width : 319px){
.mobile-view { width: 290px; }
.new_cards, .new_mobile, .net_bank, .brac_bank, .city_bank, .dbbl_bank{width:60px !important;height:50px !important;}
.card-list li{margin:0 auto;width:200px;}
.card-list li span{margin:0 auto}

	#tab .new_cards:focus, #tab li.active .new_cards {background: #fff url("../images/imagesallform.png") no-repeat scroll -347px -548px !important;} 
	#tab .new_cards {background: #fff url("../images/imagesallform.png") no-repeat scroll -430px -548px !important;}
	
	#tab .new_mobile {background: #fff url("../images/imagesallform.png") no-repeat scroll -10px -550px !IMPORTANT;}
	#tab .new_mobile:focus, #tab li.active .new_mobile {background: #fff url("../images/imagesallform.png") no-repeat scroll -85px -550px !important;}
	
	#tab .net_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -162px -548px !important;}
	#tab .net_bank:focus, #tab li.active .net_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -253px -548px !important;}
	
   
	#tab .brac_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -130px -615px !important;}
	#tab .brac_bank:focus, #tab li.active .brac_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -14px -615px !important;}
	
        
	#tab .dbbl_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -387px -607px !important;}
	#tab .dbbl_bank:focus, #tab li.active .dbbl_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -258px -607px !important;} 
	
        
	#tab .city_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -391px -473px !important;}
	#tab .city_bank:focus, #tab li.active .city_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -388px -412px !important;} 
 
         
 
	.top_section iframe{width: 290px !important}
	.Instruction > h1{width:270px;font-size:20px;}
	.modal-content{width:290px;}
	.amountTotal{font-size:20px;} 
	.net_bank {width: 67px !important;}
}

@media only screen and (min-width : 320px) and (max-width : 480px){
	
	.amountTotal{font-size: 20px;}
	.container.bkash_width {  width: 304px;} 
	 .modal_width {margin: 0 auto;width: 300px !important;}
	 .new_cards, .new_mobile, .net_bank, .my_cash, .brac_bank, .city_bank, .dbbl_bank{width:76px !important;}
	 .card-list.mobile-card li { margin: 0 auto; }
	 
	 
	#tab .new_cards{background:#fefefe url("../images/imagesallform.png") no-repeat scroll -422px -545px !important;}  
	#tab .new_cards:focus, #tab li.active .new_cards {background: #fff url("../images/imagesallform.png") no-repeat scroll -339px -545px !important;}
	 
	#tab .new_mobile:focus, #tab li.active .new_mobile {background: #fff url("../images/imagesallform.png") no-repeat scroll -80px -545px !important;}
	#tab .new_mobile {background: #fff url("../images/imagesallform.png") no-repeat scroll -3px -545px !important;}
	
	#tab .net_bank:focus, #tab li.active .net_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -251px -545px !important;}
	#tab .net_bank {  background: #fff url("../images/imagesallform.png") no-repeat scroll -159px -546px !important; }
        
        #tab .brac_bank:focus, #tab li.active .brac_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -10px -610px !important;}
	#tab .brac_bank {  background: #fff url("../images/imagesallform.png") no-repeat scroll -126px -610px !important; }
        
        #tab .dbbl_bank:focus, #tab li.active .dbbl_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -253px -607px !important;}
	#tab .dbbl_bank {  background: #fff url("../images/imagesallform.png") no-repeat scroll -382px -607px !important; }
        
        #tab .city_bank:focus, #tab li.active .city_bank {background: #fff url("../images/imagesallform.png") no-repeat scroll -383px -410px !important;}
	#tab .city_bank {  background: #fff url("../images/imagesallform.png") no-repeat scroll -386px -471px !important; }
	
	.card-list li span{margin:0 auto}


  	}



/*-----------------------------------Bkash css-------------------------------------------*/
/*.bkash_width{width: 900px;}*/
.bksh-BG{background: none}
.bkash_width .row .col-sm-4 {  margin-bottom: 20px;}
.bkash_width .row .col-sm-4 p{height: 40px;}
@media only screen and (min-width : 320px) and (max-width : 479px){
  /*.bkash_width{width: 870px !important;}*/
  .iframe_bkash{}
  .top_section iframe{width: 290px !important}
  .modal_width {width: 300px !important; }
  .top_head_bkash h1 {font-size: 23px;}
  .Instruction > h1{font-size: 26px !important;}
  
  
}

@media only screen and (min-width : 480px) and (max-width : 767px){
  
  .iframe_bkash {
  width: 598px;
}
}
@media only screen and (min-width : 768px) and (max-width : 1023px){
  .bkash_width{width: 870px !important;}
}
@media only screen and (min-width : 1024px) and (max-width : 1200px){
  .bkash_width{width: 870px !important;}
}


.Instruction > h1 {  background: none repeat scroll 0 0 green;  color: #fff;  padding: 10px 0;  text-align: center;}
.bks_list.span12 {  margin-left: 15px;}
.binsturc{background: transparent;border: medium none;color: #1a5b2a;margin-bottom: 10px;padding: 0;text-decoration: underline;}
.binsturc:hover{color: #1a5b2a;background: none;}
.binsturc:focus{color: #1a5b2a;}
.col-md-4 > p {  min-height: 40px;}
.fa-times{margin:10px 10px 0 0 }

.modal_width{width: 560px;}

.new_cards, .new_mobile, .net_bank, .my_cash,.brac_bank, .city_bank, .dbbl_bank{width:95px;height:59px;}

#tab .new_cards{background:#fff url(../images/imagesallform.png) no-repeat;display:block; border-bottom:2px solid #364944;background-position:-415px -545px}
#tab .new_cards:focus, #tab li.active .new_cards{background:#fff url(../images/imagesallform.png) no-repeat;background-position:-332px -545px;display:block; border-bottom:4px solid #2AA637}
 

#tab .new_mobile{background:#fff url("../images/imagesallform.png") no-repeat scroll 7px -545px;display:block;border-bottom:2px solid #364944}
#tab .new_mobile:focus, #tab li.active .new_mobile{background:#fff url(../images/imagesallform.png) no-repeat -70px -545px;display:block; border-bottom:4px solid #2AA637}


#tab .net_bank{background:#fff url(../images/imagesallform.png) no-repeat -151px -542px;display:block; border-bottom:2px solid #364944}
#tab .net_bank:focus, #tab li.active .net_bank{background:#fff url(../images/imagesallform.png) no-repeat -243px -541px;display:block; border-bottom:4px solid #2AA637}


#tab .brac_bank{background:#fff url(../images/imagesallform.png) no-repeat -116px -610px;display:block; border-bottom:2px solid #364944}
#tab .brac_bank:focus, #tab li.active .brac_bank{background:#fff url(../images/imagesallform.png) no-repeat -0px -610px;display:block; border-bottom:4px solid #2AA637}

#tab .dbbl_bank{background:#fff url(../images/imagesallform.png) no-repeat -373px -605px;display:block; border-bottom:2px solid #364944}
#tab .dbbl_bank:focus, #tab li.active .dbbl_bank{background:#fff url(../images/imagesallform.png) no-repeat -244px -605px;display:block; border-bottom:4px solid #2AA637}

#tab .city_bank{background:#fff url(../images/imagesallform.png) no-repeat -375px -470px;display:block; border-bottom:2px solid #364944}
#tab .city_bank:focus, #tab li.active .city_bank{background:#fff url(../images/imagesallform.png) no-repeat -372px -409px;display:block; border-bottom:4px solid #2AA637}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance:textfield;
}


    
.alert-danger, .alert-error {
		font-size: 12px;
    border-bottom-color: #eed3d7;
    border-left-color: #eed3d7;
    border-right-color: #eed3d7;
    border-top-color: #eed3d7;
    color: #b94a48;
}

.form-group {
 margin-bottom: 5px;
}

.amount-msg {
    font-size: 12px;
    margin-top: 0;
}                         

.categoryItemNote {
    border-bottom-left-radius: 4px;
    font-size: 10px;
    font-weight: bold;
    padding-bottom: 2px;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 2px;
    position: absolute;
    right: 15px;
    text-align: center;
    text-transform: uppercase;
    top: 120px;
    
}


.bkash_ins {
    border-bottom-left-radius: 4px;
    font-size: 15px;
    font-weight: bold;
    padding-bottom: 5px;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 5px;
    text-align: center;
    }


.red {
    background-color: rgb(230, 70, 0) !important;
    border-bottom-color: rgb(200, 50, 0) !important;
    border-left-color: rgb(200, 50, 0) !important;
    border-right-color: rgb(200, 50, 0) !important;
    border-top-color: rgb(200, 50, 0) !important;
    color: #fff !important;
}

.green {
    background-color: rgb(0, 70, 0) !important;
    border-bottom-color: rgb(200, 50, 0) !important;
    border-left-color: rgb(200, 50, 0) !important;
    border-right-color: rgb(200, 50, 0) !important;
    border-top-color: rgb(200, 50, 0) !important;
    color: #fff !important;
}

.logo-dpdc {
    background: url("../images/dpdc.png") no-repeat scroll 0 0 / 200px auto rgba(0, 0, 0, 0);
    display: inline-block;
    height: 90px;
    width: 90px;
}
.logo-desco {
    background: url("../images/desco.png") no-repeat scroll 0 0 / 200px auto rgba(0, 0, 0, 0);
    display: inline-block;
    height: 90px;
    width: 90px;
}

.logo-wzpdcl {
    background: url("../images/wzpdcl.png") no-repeat scroll 0 0 / 200px auto rgba(0, 0, 0, 0);
    display: inline-block;
    height: 90px;
    width: 90px;
}

.logo-dwasa {
    background: url("../images/dwasa.png") no-repeat scroll 0 0 / 200px auto rgba(0, 0, 0, 0);
    display: inline-block;
    height: 90px;
    width: 90px;
}

.btn-utility {
 background-color:#FFF;
 height: 50px; 
 }
 
 .blink {
  animation: blinker 1s linear infinite;
  color: #DC005A;
  
}

@keyframes blinker {  
  50% { opacity: 0; }
}