/** Custom Fonts **/
@font-face {
	font-family: CircularPro-Black;
	src: url("/2d/css/fonts/CircularPro/CircularPro-Black.otf") format("opentype")
}
@font-face {
	font-family: CircularPro-BlackItalic;
	src: url("/2d/css/fonts/CircularPro/CircularPro-BlackItalic.otf") format("opentype")
}
@font-face {
	font-family: CircularPro-Bold;
	src: url("/2d/css/fonts/CircularPro/CircularPro-Bold.otf") format("opentype")
}
@font-face {
	font-family: CircularPro-BoldItalic;
	src: url("/2d/css/fonts/CircularPro/CircularPro-BoldItalic.otf") format("opentype")
}
@font-face {
	font-family: CircularPro-Book;
	src: url("/2d/css/fonts/CircularPro/CircularPro-Book.otf") format("opentype")
}
@font-face {
	font-family: CircularPro-BookItalic;
	src: url("/2d/css/fonts/CircularPro/CircularPro-BookItalic.otf") format("opentype")
}
@font-face {
	font-family: CircularPro-Medium;
	src: url("/2d/css/fonts/CircularPro/CircularPro-Medium.otf") format("opentype")
}
@font-face {
	font-family: CircularPro-MediumItalic;
	src: url("/2d/css/fonts/CircularPro/CircularPro-MediumItalic.otf") format("opentype")
}

/** Class for Credit Card Autopay Addons page **/

.twod_visa {
	content: url("../images/store/card/visa.png");
}
.twod_masters {
	content: url("../images/store/card/masters.png");
}
.twod_amex {
	content: url("../images/store/card/amex.png");
}
.twod_diners {
	content: url("../images/store/card/diners.png");
}
.twod_default_card {
	content: url("../images/store/card/default-card.png");
}
/** Mozilla CSS */
.twod_visa:after {
	content: url("../images/store/card/visa.png");
}
.twod_masters:after {
	content: url("../images/store/card/masters.png");
}
.twod_amex:after {
	content: url("../images/store/card/amex.png");
}
.twod_diners:after {
	content: url("../images/store/card/diners.png");
}
.twod_default_card:after {
	content: url("../images/store/card/default-card.png");
}

/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media only screen and (min-width: 1281px) {
  
  //CSS
  
}

/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/

@media only screen and (min-width: 1025px) and (max-width: 1280px) {
  
  //CSS
  
}

/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/

@media only screen and (min-width: 768px) and (max-width: 1024px) {
  
  //CSS
  
}

/* 
  ##Device = Low Resolution Tablets, Mobiles
  ##Screen = B/w 481px to 767px
*/

@media  only screen and  (min-width: 481px) and (max-width: 767px) {
  
  //CSS
  
}

/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/

@media  only screen and  (min-width: 320px) and (max-width: 480px) {
  
  .cardNumber {
  	margin-left: -10px!important;
    font-size: 0.8rem;
  }
  
}
/** Class for Addons Autopay **/

@media only screen and (max-width: 498px) {
 	.twod-loader--block {
        left: 1%!important;
    }
    .twod-loader--heading {
        left: 20%;
        font-size: 1rem;
    }
}

@media only screen and (max-width: 500px) and (min-width: 321px) {
 	.twod-loader--block {
        left: 15%!important;
    }
    .twod-loader--heading {
        left: 20%;
        font-size: 1rem;
    }
}

@media only screen and (max-width: 599px) and (min-width: 500px) {
 	.twod-loader--block {
        left: 30%!important;
    }
    .twod-loader--heading {
        left: 28%;
        font-size: 1rem;
    }
}
@media only screen and (max-width: 799px) and (min-width: 600px) {
 	.twod-loader--block {
        left: 34%!important;
    }
    .twod-loader--heading {
        top: 60%;
        left: 33%;
        font-size: 1rem;
    }
}
@media only screen and (min-width: 800px) {
 	.twod-loader--block {
       top: 30%;
       left: 43%;
    }
    .twod-loader--heading {
        top: 59%;
        left: 41%;
    }
}
.amex {
    background: url(../images/sprite-icons-retina.png) no-repeat 0 -1px;
}
/* .visa {
    background: url(../images/sprite-icons-retina.png) no-repeat 0 -1362px;
}
 */
.cardImage_addons_span {
	display: inline-block;
	width: 6rem;
	height: 45px;
}
.cardImage_span {
	display: inline-block;
	width: 5rem;
	height: 45px;
}
.cardImage_img {
	max-width: 5rem;margin:0px 0px;
}
.cardImage_addons_img {
	max-width: 4rem;margin:0px 0px;
}
.cards-mobile {
    display: inline-block;
    width: 103px;
    height: 45px;
}

.addons-autopay-modal-submitbutton {
    width: 11rem!important;
    border-radius: 25px;
    text-transform: none;
    font-size: 1rem!important;
}

.addons-autopay-modal-heading {
    color:#009ed8;margin-bottom: unset;
    }

.badge-primary-orange {
    display: inline-block;
    font-size: 0.625rem;
    padding: 0px 6px;
    border: 4px solid transparent;
    min-width: 10px;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    border-radius: 99999px;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    background-color: #fb9f4e;
    text-transform: uppercase;
}

@media screen and (min-width: 769px) {
    .modal-close {
        margin-top: -50px;
        color: #009ed8;
    }

    .modal-close.desktop {
        display: block!important;
        float: right;
        position: absolute;
        top: 60px;
        right: 20px;
        font-size: 15px;
    }
}
.autopay__tooltip{
    position: relative;
    cursor: url(/2d/images/store/help-cursor-1x.png) 10 5,auto;
}
.autopay__tooltip:hover .autopay__tooltip__container {
	display:block;z-index:30;
}
.autopay__tooltip__container{
    position: absolute;
    display: none;
    padding: 1em;
    width: 250px;
    border: 1px solid #c0e4ef;
    font-size: 15px;
    line-height: 1.3125rem;
    box-shadow: 0 0 10px 3px rgba(0,0,0,.2);
    background-color: #fff;
    color: #009ed8;
}
.autopay__tooltip__header {
    font-weight: 600;
    font-size: 15px;
    margin: 0;
    margin-bottom: .5625rem;
    color: #009ed8;
}

/* Classes to make background black when opening pop up window */
.active-overlay {
    position: fixed;
    opacity: .8;
    visibility: visible;
    min-height: 100%!important;
    display: block;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.disabled-overlay {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    min-height: "";
    display: none;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

/* START CUSTOM SPINNER */
.twod-loader--container {
  position: fixed;
  z-index: 100;
  opacity: 0.5;
  width: 0%;
  height: 100%;
  top: 0%;
  left: 0%;
  background: #008CCE;
  -webkit-transition-property: left, width; /* Safari */
  -webkit-transition-duration: 1s; /* Safari */
  transition-property: left, width;
  transition-duration: 0.75s;
}

.twod-loader--block {
  position:absolute;
  z-index: 110;
  top:35%;
  left:35%;
  width: 20rem;
  /*height: 20rem;*/
  display: none;
}



 .twod-loader {
/*  position:absolute; */
/*  z-index: 110; */
/*  top:  30%;*/
/*  left: 15%;*/
  width: 10rem;
  height: 10rem;
  border-radius: 50%;
  transition-duration: 2s ease-out;
}

.hideLoader {
  display: none;
}

@media (min-width: 600px) {

   .twod-loader {
	    width: 10rem;
	    height: 10rem;
	    margin: auto;
  	}

  .twod-loader--block {
    position:absolute;
    z-index: 110;
    top:35%;
    left:35%;
    width: 30rem;
    height: 20rem;
  }
}

/*START Autopay CSS */
.autopaytic_payment_msg_box{
	margin-bottom: 20px;
	margin-top: 20px;
}
.checkmark {
    background: url(../images/store/checkmark.png) no-repeat;
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: 1rem 1rem;
}
@media screen and (max-width: 768px){
	.auto-pay-setup-button {
		margin-bottom: 1rem;
	}
}
@media screen and (max-width: 768px) and (min-width: 768px){
	.autopay__flex_row {
		margin-left: 1rem;
	}
}
@media screen and (min-width: 769px){
	.autopay__flex_row .size4of12:last-child {
		margin-right: 1.4rem;
	}
}
@media screen and  (min-width: 803px) {
	.tab-width{
		width: 22rem;
		margin-right: 1.4rem;
	}
}
@media screen and (max-width: 802px) and (min-width: 760px) {
	.tab-width{
		width: 21rem;
		margin-right: 1.4rem;
	}
}
@media screen and (max-width: 759px) and (min-width: 700px) {
	.tab-width{
		width: 20rem;
		margin-right: 1.4rem;
	}
}
@media screen and (max-width: 699px) and (min-width: 639px) {
	.tab-width{
		width: 17rem;
		margin-right: 1.4rem;
	}
}

@media screen and (max-width: 803px) and (min-width: 600px) {
	.autopay__flex_row, .monthlytopup {
		display:flex;
		flex-wrap: wrap;
	}	
} 
@media screen and (max-width: 1023px) and (min-width: 500px) {
	.my2degrees .block-links li.block-link-wrapper {
		border: 1px solid #e8e9e9;
		border-bottom-width: 2px;
		text-align: center;
	}
	.add-manage-pay-tile{
		width: 13rem;
	}
	.add-card-title{
		margin-right: 1rem;
	}
}
@media screen and  (min-width: 500px) {
	.manage-pay-card-tile{
		display: flex;
		flex-wrap: wrap;
	}
}
@media screen and (min-width: 1023px) {
	.add-card-title{
		width: 21.5rem;
		margin-right: 1rem;
	}
}
@media screen and (max-width: 1023px) and (min-width: 689px) {
	.add-card-title{
		width: 19.5rem;
		margin-right: 1rem;
	}
}	
@media screen and (max-width: 689px) and (min-width: 658px) {
	.add-card-title{
		width: 18.5rem;
		margin-right: 1rem;
	}
}	
@media screen and (max-width: 657px) and (min-width: 626px) {
	.add-card-title{
		width: 17.5rem;
		margin-right: 1rem;
	}
}	
@media screen and (max-width: 625px) and (min-width: 594px) {
	.add-card-title{
		width: 16.5rem;
		margin-right: 1rem;
	}
}	
@media screen and (max-width: 593px) and (min-width: 562px) {
	.add-card-title{
		width: 15.5rem;
		margin-right: 1rem;
	}
}
@media screen and (max-width: 561px) and (min-width: 529px) {
	.add-card-title{
		width: 14.5rem;
		margin-right: 1rem;
	}
}
@media screen and (max-width: 529px) and (min-width: 500px) {
	.add-card-title{
		width: 13.5rem;
		margin-right: 1rem;
	}
}
.auto-pay-setup-button {
   text-align: center;
}
.mobilewrap{
	font-weight: 700;
    color: #666;
}
.cardNumber{
    display: -webkit-inline-box;
    display: -ms-inline-grid;
    display: -moz-inline-box;
    display: inline-block;
    margin-left: 10px;
}
.add-newcard-overlay {
	display: flex;
    justify-content: space-between;
}
.add-newcard-btn {
  border-radius: 2rem;
  margin-bottom: 0px;
}
.span-add-newcard-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    float:  right;
 }
.nobottom_margin {
	margin-bottom: 0px;
}
.autopay__terms-link a:hover{
    text-decoration: none;
    font-size: 1em;
}
.autopay__terms-link a{
    text-decoration: underline;
    color: #00a7e5;
    font-size: 1em;
}
.autpay__default-button {
	border-radius: 2rem;
}
.autopay__primary-button {
	/*text-transform:initial;*/
	/*font-size:1rem;*/
	width:auto;
}
.head-content,.middle-content{
	display: flex; 
	justify-content:  space-between;
}
.bottom-content{
	display: flex;
}

.active__autopay-line{
	width: 100%;
    border: solid 1px #e1e1e1;
    margin: 0.5rem 0;
}
.active-payment-amount{
	color: #009ed8;
}
.diners {
    background: url(../images/sprite-icons-retina.png) no-repeat 0 -1358px;
}
.masters {
    background: url(../images/sprite-icons-retina.png) no-repeat 0 -2225px;
}
.farmsource {
    content: url(../images/store/farmsource.png);    
    display: inline-block;
    width: 60px;    
}
.automatic_payment_button_link a {
	border-radius: 2rem;
}
.default_button_add a {
	border-radius: 2rem;
}
.automatic_payment_button_link {
 float:right;
}

.addons_hyperlinks_p {
	padding-top: 10px;
}
.addons_hyperlinks_p a:hover{
    text-decoration: none;
}
.addons_hyperlinks_p a{
    text-decoration: underline;
    color: #00a7e5;
    font-size: .75rem;
}
.addons_hyperlinks_p a:visited:hover {
	color: #007dc5;
    text-decoration: underline;
}	

/* END Autopay CSS */
input[readonly],
input[readonly="readonly"] {
	cursor : not-allowed;
	background : #eee;
}
/* hamburher issue */ 
@media only screen and (max-width: 1023px) {
 	.ir:before {
 		content: none !important;
 	}
}
/* prepay slice2 styles */
.fieldsetwithoutborder {
	border : none;
}
.termsbuttons{
 margin-bottom : 2rem;
}
.addressSection {
	font-size: 15px;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	line-height : 24px;
}
.form-center {
     max-width: 90%;
     padding: 1rem;
     margin : auto;
}
.form-body-center {
	 max-width: 90%;
     padding: 1rem;
     margin : auto;
}
.form_heading {
     text-align: center;
     margin-top : -1rem;
}
 .form_heading-underline {
     display: block;
     background: #009ed8;
     height: 1px;
     width: 25%;
     margin:auto;
     margin-top: 1rem;
     margin-bottom: 1rem;
}
.button-form {
    border-radius: 25px;
    font-family: ‘circular-pro’, ‘helvetica’, ‘arial’, sans-serif;
    display: block;
    width: 100%;
    text-align: center;
    color: #fff;
    border: none;
    outline: none;
    padding: 0.75rem;
    font-size: 1.25rem;
    background: #009ed8;
    line-height: 1.5rem;
    cursor: pointer;
}

.btn.btn--primary {
	border-radius: 25px;
	border: none;
}

.btn.btn--primary:hover {
    background: #fb9f4e;
}

#form-subheading{
	color: #009ed8;
}
.button-form:hover {
    background: #fb9f4e;

}
.button-form:disabled {
    background: #bae1ed;
} 
 .pin-help-heading {
     display: none;
}
 .wrapper-pin-q-mark {
     display: none;
}
 @media only screen and (min-width: 679px) {
     .form_heading-underline {
         margin-top: 2rem;
    }
    .form-body-center {
	 max-width: 50%;
     padding: 1rem;
     margin : auto;
	}
     .pin-help-heading {
         display: block;
    }
     .wrapper-pin {
         position: relative;
    }
     .wrapper-pin-q-mark {
         font-family: 'circular pro';
         display: block;
         color: #009ed8;
         position: absolute;
         top: 30%;
         right: 4%;
         border: 1px solid #009ed8;
         width: 1.5rem;
         height: 1.5rem;
         box-sizing: border-box;
         padding: 2px 7px;
         border-radius: 50%;
         content: "?";
         cursor: pointer;
    }
     .pin-help-hide {
         display: none;
    }
     .pin-help {
         position: absolute;
         background: #fff;
         padding: 1rem;
         top: -6rem;
         right: -22rem;
         z-index: 1;
         width: 20rem;
         border-radius: 5px;
         box-shadow: 3px 3px 10px 4px rgba(0, 0, 0, 0.1); 
    }
     .pin-help-title {
         position: relative;
    }
     .pin-cross:after {
         position: absolute;
         right: 0px;
         top: 0px;
         content: "\e93a";
         font-family: "icomoon";
         border: 10px solid #009ed8;
         border-radius: 50%;
         box-sizing: border-box;
         color: white;
         background: #009ed8;
         font-size: 16px;
    }
}
/*** Class for Change Plan ***/
@media screen and (min-width: 769px) {
    #change-plan .m-breadcrumbs {
        margin-bottom: 3rem;
        margin-top: 1.5rem;
    } 
}

@media screen and (min-width: 1024px) {
    #change-plan .m-breadcrumbs {
        margin-bottom: 3rem;
        margin-top: 3.5rem;
    } 
}

.cards-mobile {
    display: inline-block;
    width: 103px;
    height: 45px;
}

/*** Changes for sIM listing Page ***/
.flex-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: flex-start;
    max-width: 100%;
}
.sim-flex-item {
	margin:10px 20px 10px 0;
    width: 23.285%;
    padding: 1.5rem 1.0625rem;
    border: solid 1px lightblue;
    background: #fff;
}
.sim-flex-item-title {
    font-size: 16px;
    margin: 30px 0 10px;
    font-family: CircularPro-Medium;
    line-height: 19px;
}

.sim-desc {
    letter-spacing: normal;
    color: #676767;
    font-size: 14px;
   	line-height: 20px;
}
.sim-desc ul{
    font-weight: 500;
    line-height: 22px;
    color: #009ED8;
}
.sim-desc span{
	font-size: 12px;	
}
.bottom-row {
	align-items: center;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
}
.bottom-row-circle {
    border-radius: 100%;
    background-color: #d7f2ff;
    height: 50px;
    width: 50px;
    text-align: center;
    line-height: 50px;
	margin-right: 15px;
    font-family: CircularPro-Medium;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: -0.23px;
}

.bottom-row-btn {
    font-size: 15px;
	text-transform: none;
	margin: .75rem 0;
	margin-inline-start: 15px;
    margin-inline-end: 30px;
	padding: 0 .9375rem;
    text-align: center;
    text-decoration: none;
    border: none;
    line-height: 3rem;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
	background: #009ed8;
    color: #fff;
	border-radius: 25px;
    border: none;
	width: 100%;   
}

@media (max-width: 600px){
	.sim-flex-item {
		width: 100%;
	} 
	.flex-container {
		display: unset;
	}
}

.modal-header-wbbm{
	border-bottom: 0px;
}

.modem_msg_div{
	margin-left: 20px;
	margin-right: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size:16px;
	font-family:Helvetica Neue,Helvetica,Arial,sans-serif;
	font-weight:400;
}

/* .bottom-row-btn {
    font-size: 15px;
	text-transform: none;
	margin: .75rem 0;
	margin-inline-start: 15px;
    margin-inline-end: 30px;
    width: 100%;	
}

.bg {
	height: 54px;
	width: 180px;
	border-radius: 3px 0 0 3px;
	background-color: #FFFFFF;
	box-shadow: inset 1px 0 0 0 #C0E4EF, inset 0 -1px 0 0 #C0E4EF, inset 0 1px 0 0 #C0E4EF;
} */

/** Pay Monthly dashboard banner - $5 Data Sidekick Plan changes **/
.mini-banner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 6px;
    padding: 10px;
    color: #fff;
    background-color: #009ed8;
    margin: 0 0 1px;
    box-shadow: 0 5px 20px 0 rgba(0,76,82,.102);
}

.mini-banner-text-wrapper {
    display: flex;
    align-items: center;
}

.mini-banner-text {
    font-weight: bold;
    font-size: 20px;
    line-height: 26px;
    letter-spacing: -0.1px;
    display: block;
    font-size: 20px;	
}

.mini-banner-button {
    cursor: pointer;
    white-space: nowrap;
    font-size: 16px;
}

.btn-secondary {
    padding: 10px 23px;
    background-color: #fff;
    border: 2px solid #009ed8;
    color: #009ed8;
    font-weight: bold;

}

@media only screen and (min-width: 768px) {
	
  .banner-dashboard{
  	width: 66%;
 }
 
}