/* Start Manage Payment page css*/
.no-padding{
	padding : 0px !important;
}

#managePayment{
	background:#ffffff;
}

#managePayment_info{
   margin-top: 30px;
   margin-left: 80px;
}

#managePayment_Heading{
	padding-top:64px;
	padding-left:90px;
	color:#000000;
	font-size:34px;
	font-family: nhg-text-bold, arial, sans-serif;
}

#billingInfoSection{
	width:412px;
	margin-top: 42px;
	height:190px;
	border:1px solid #D8DADA;
	border-top:7px solid #000000;
	margin-bottom:51px;
	margin-left: 75px;
}
.paddLeft{
	padding-left:20px;
}
#billingAddHeading{
	padding-top: 14px;
    padding-left: 17px;
    color: #000000;
    font-size: 16px;
    font-family: nhg-text-bold, arial, sans-serif;
    margin-bottom: 10px;
}

#page_managePayment .billingInnerText{
	color:#000000;
	font-size:14px;
	font-family: nhg-text-roman, arial, sans-serif;
	padding-left:17px;
}

#page_managePayment .billingDivider{
	border: 1px solid #D8DADA;
	margin-top: 15px !important;
    margin-bottom: 14px !important;
}

#page_managePayment .changePayment_btn{
	width: 188px;
	color: white;
	height:44px;
	background-color: #000000;
	border : 1px solid black;
	padding: 5px;
	text-align: center;
	line-height: 2px;
}

.cardImagePadding{
	padding-top:20px;
}

#changePayment_btnSection{
	margin-top:160px;
}

#page_managePayment .updateMPayment_btn{
	color: white;
	/*background-color: #000000;*/
}
 
#page_managePayment .cancelMPayment_btn{
	color: #000;
	background-color: #fff;
}

#page_managePayment .cancelMPayment_btn, #page_managePayment .updateMPayment_btn{
	margin-top: 20px !important;
	width: 108px;
	height:44px;
	border : 1px solid black;
	padding: 5px;
	text-align: center;
	line-height: 2px;
}

#page_managePayment .managePayment_divider{
	border: 4px solid #000;
    margin: 0 auto;
}

#managePayment_card_container{
    width:100%;
}

#page_managePayment label{
    color: #747676; 
    font-size:12px
}
#page_managePayment input, #page_managePayment select{ 
    padding:0px;
    color: black;
    height:37px;
    border : 1px solid #D8DADA;
    border-bottom: 1px solid #000000;
    padding: 5px;
}

#payment_info > p, #mPayment_address_info > p{
    margin-top: 20px;
    margin-bottom:0px;
    font-size: 16px;
    font-family: nhg-text-roman, arial, sans-serif;
    font-weight: normal;
    color: #000000;
    align-items: left;
}

#page_managePayment button.btn.btn-primary{
color:#fff; 
}
div#mPayment_card_name,div#mPayment_address_info1{
    display: inline-block;
}
#page_managePayment label{
    font-family: nhg-text-roman, arial, sans-serif;
    font-size: 12px;
    align-items: left;
    color: #747676;
}

div#mPayment_card_fName{
    float: left;
}
div#mPayment_card_fName > label,div#mPayment_card_lName > label{
    float: left;

}
div#mPayment_card_fName > input,div#mPayment_card_lName > input{
    float: left;
    clear:left;
}
div#mPayment_card_lName{
    float: left;
}
#page_managePayment .verticalSpace{
    margin-top:38px;
}
#mPayment_card_name{
     margin-top:36px;
}
#terms-and-conditions,#submit_btn{
    margin-top:63px;
    padding-left: 30px;
}
#mPayment_card_info > div{
    display: inline-block;
    padding: 0px;
}
/* #mPayment_card_info div label{
    float: left;
} */
iframe#mPayment_myframe{
    border: none;
    /*float: left;*/
    height: 74px;
    /*width: 400px;*/
}
.orange{
    border-color: orange !important;
}
#page_managePayment .selectDiv{
    float:left;
    position:relative;
}

#page_managePayment .selectDiv>label{
    float:left;
}
#page_managePayment .selectDiv label:after{
    content: url('../../images/down_arrow.svg');
    font: 17px "Consolas", monospace;
    color: #333;
    right:11px;
    pointer-events: none;
    position: absolute;
    top: 27px;
    right: -3px;
}
#mPayment_expiryMonthMain > select,#mPayment_expiryYearMain  > select{
    float: left;
    clear: both;
    width: 95px;
    font-family: nhg-display-roman, arial, sans-serif !important; 
}

#mPayment_address_info1 > label,#mPayment_address_info2 > label{
    float:left
}

#mPayment_address_info1 > input{
    float: left;
    clear: both;
    width: 100%;
}
#mPayment_address_info2{
   clear:both;
  /* position:relative;
   top:34px;*/
}
#mPayment_address_city{
    display: inline-block;
    float: left;
}
#mPayment_address_city > label{
    float: left;
}
#mPayment_address_city > input{
    float: left;
    clear: both;
}
#mPayment_address_state,#mPayment_address_zipcode{
     display: inline-block;
}
#mPayment_address_state >label,#mPayment_address_zipcode>label{
     float: left;
}
#mPayment_address_state >select{
    font-family: nhg-display-roman, arial, sans-serif !important; 
}
#mPayment_address_state >select,#mPayment_address_zipcode >input{
     clear:both;
     float: left;
}
#mPayment_address_zipcode > label{
     position:relative;
     
}

#mPayment_myframe input#selected_card{
    width:120%
}
#page_managePayment input.checkbox-custom{
   opacity: 0;
   z-index: 100;
}

#page_managePayment label.checkbox-custom-label{
    color: #333;
    line-height: 1.5;
    letter-spacing: 0.5px;
    cursor: pointer;
    width: 1%;
}
.width99Per{
	width: 99%;
}
#page_managePayment label.checkbox-custom-label:before{
    height: 24px;
    background: #fff none repeat scroll 0 0;
    border: 1px solid #959595;
    content: "";
    display: inline-block;
    margin-right: 1px;
    padding: 0px;
    text-align: center;
    vertical-align: middle;
    width: 24px;
    position: relative;
    top: -2px;
    right: 31px;
    z-index: 99;
    font-size: 14px;
}
#page_managePayment .checkbox-custom + .checkbox-custom-label:hover:before{
     border: 2px solid #000;
}
#page_managePayment .checkbox-custom:checked + .checkbox-custom-label:before{
    content: "\f00c";
    font-family: 'FontAwesome';
    background: #000;
    color: #fff;
    border: 2px solid #000;
    font-size: 15px;
    top: -2px;
    right: 31px;
}
#terms-and-conditions{
    display: inline-block;
  /*  margin-top: 40px;
    margin-bottom:60px;*/
}

#page_managePayment .form-group {
     margin-bottom: 0px;
}
#page_managePayment input.ng-touched.ng-invalid,#page_managePayment select.ng-touched.ng-invalid{
   border: 1px solid #ED7000;
   border-bottom: 2px solid #ED7000;
}
#page_managePayment .modal-header{
    color:black;
}
#page_managePayment select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

#page_managePayment #termsAndConditionOTT{
	padding-top: 57px !important;
    padding-left: 30px !important;
    padding-bottom: 47px !important;
    font-family: nhg-text-roman, arial, sans-serif;
    font-size: 14px;
}

/* Style the buttons that are used to open and close the accordion panel */
#page_managePayment .accordion {
    background-color: #fff;
    cursor: pointer;
    padding:top: 10px;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
}

.obickContainer{
	width: 100%;
    float: left;
}
.cardPicContainer{
	float: right;
    width: 43%;
    line-height: 20px;
    padding-top: 22px;
}
.cardPicContainer img{
    padding-top: 22px;
}

.obickContainer .col-sm-3{
	padding-left: 3px !important;
	padding-right: 3px !important;
}

.wrapAroundHere{
	word-wrap: break-word;
    white-space: normal !important;
}

@media screen and (min-width: 1024px){
    #mPayment_card_name,#mPayment_card_name input,#mPayment_address_info input,#mPayment_address_info select{
        width: 100%;
    }
    #mPayment_address_city{
        width: 40%;
        padding-right: 13px;
    }
    #mPayment_address_state{
        width: 35%;
        margin-right: 13px;
        margin-left: 13px;
    }
     #mPayment_address_zipcode{
        width: 20%;
        padding-left: 11px;
    }
    div#mPayment_card_fName{
        width: 50%;
        padding-right: 13px;
    }
    div#mPayment_card_lName{
        width: 50%;
        padding-left: 13px;
    }
    #managePayment_card_container{
        width:60%;
    }
    .horizontalSpace{
        margin-left:26px;
    }
    .fullWidth{
        width:100%
    }
}

@media screen and (min-width: 768px) and (max-width: 991px){
	.paddLeft{
		padding-left:15px !important;
	}
}

@media screen and (min-width: 320px) and (max-width: 991px) {
	.container {
        padding-right: 0px; 
        padding-left: 0px; 
    }
    .verticalSpace{
        margin-top: 10px; 
    }
    
    .cardImagePadding{
   		padding-top:48px !important; 
   		padding-left:15px !important;
    }
    .paddLeft{
		padding-left:0px;
	}
    #page_managePayment .verticalSpace{
    	margin-top:25px;
	}
	
    input,select,textarea{
        width:inherit;
    }
    .fullWidthXS{
        width:100%
    }
    #managePayment #managePayment_Heading{
		font-size: 26px;
	    margin: 37px 0px 37px 0px;
	    line-height: .95;
	    padding:0;	    
	}	
	#managePayment{
		background-color: transparent;
	}
	#managePayment #billingInfoSection, #managePayment #managePayment_info{
		width: 94%;
		margin: 0;
		height: auto !important;
		padding-bottom: 15px;
		margin-bottom: 15px;
	}
	#managePayment #billingAddHeading{
		padding: 22px 17px 12px 17px;
	}
	#managePayment #billingAddress{
		padding: 0px 17px 0px 17px;
		width: 100% !important;
		white-space: normal;
		word-wrap: break-word;
	    overflow-wrap: break-word;
	}
	#managePayment #changePayment_btnSection{
		margin-top: 25px;
		margin-bottom: 27px;
	}
	#managePayment #changePayment_btnSection .changePayment_btn{
		padding-top: 2px;
		padding-bottom: 2px;
	}
	#managePayment #managePayment_info h2{
		margin-top: 17px;
		font-size: 14px;
		margin-bottom: 6px;
	}
	#page_managePayment #termsAndConditionOTT {
	    padding-top: 39px !important;
	    padding-bottom: 39px !important;
	}
	#mPayment_iframe_container .form-group .control-label{
		margin-top: 25px;
	}
	#mPayment_expiry_container{
		display: block;width: 100%;
	}
	#managePayment  #managePayment_card_container, 
	#mPayment_address_info2 div input, 
	#mPayment_address_info2 div select, 
	#mPayment_card_info div select, 
	#mPayment_myframe,
	#mPayment_card_name{
		width:100%; 
	}
	#mPayment_card_lName{
		margin-top: 25px;
	}
	#mPayment_address_info1{
		/* margin-top: 15px; */
	}
	#mPayment_address_info2{
		margin-top: 0;
	}
	
	#mPayment_address_info2 div, #mPayment_iframe_container, #mPayment_expiry_container{
		float: left !important;
		/* margin-top: 25px; */
	}
	#mPayment_address_state{
		width: 64%;
    	margin-right: 1%;
    	 margin-top: 25px; 
	}
	#mPayment_address_zipcode{
		width: 35%;
		 margin-top: 25px; 
	}	
	
	#mPayment_iframe_container div{
		float: left !important;
		/* margin-top: 25px; */
		/*width: 100%;*/
	}
	.cardNum{
		width:100%; 
	}
	#mPayment_expiry_container div{
		width: 100%;
		float: left !important;
		padding:0;
	}
	#mPayment_expiry_container div.col-sm-7 div{
		width: 26%;
		float: left !important;
	}
	#mPayment_expiry_container div div#mPayment_expiryYearMain{
		margin-left: 9%;
	}
	#mPayment_expiry_container div.col-sm-5 div{
		width: 38%;
		float: left !important;
		/* margin-top:49px; */
	}	
	
	#page_managePayment .managePayment_divider{
    	margin-right: 20px;
	}
	
}
@media screen and (min-width: 481px) and (max-width: 991px) {
	#managePayment #managePayment_Heading{		
	    padding-left:15px !important;
	}	
}

#mPayment_iframe_container .form-control, .obick-iframe-field {
    box-shadow: none;
    padding: 18px;
    color: #9e9e9e;
    font-weight: 500;
    font-size: 14px;
    vertical-align: middle;
    height: 14px;
    background: #ffffff;
}

#mPayment_iframe_container .form-control, .obick-input-field {
    padding: 0px;
    color: black;
    height: 37px;
    border: 1px solid #D8DADA;
    border-bottom: 1px solid #000000;
    width:100%;
}

#mPayment_iframe_container .obick-iframe-field {
    padding: 0px;
    color: black;
    height: 37px;
    border: 1px solid #D8DADA;
    border-bottom: 1px solid #000000;
    background-color: #fff !important;
}

#mPayment_iframe_container .form-group .control-label {
    font-family: nhg-text-roman, arial, sans-serif;
    font-size: 12px;
    align-items: left;
    color: #747676;
    font-weight: 400;
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
}

