.naTextBox input,
.naTextBox button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    border-style: none;
}

.naTextBox input.naTextBoxInput.invalid {
    border: 0 !important;
}

.naTextBox input:-webkit-autofill {
    -webkit-text-fill-color: #333;
    transition: background-color 100000000s;
    -webkit-animation: 1ms void-animation-out;
}

.StripeElement--webkit-autofill {
    background: transparent !important;
}

.naTextBox input,
.naTextBox button {
    -webkit-animation: 1ms void-animation-out;
}

.naTextBox {
    display: inline-block;
    position: relative;
    width: 100%;
    height: 50px;
    margin-bottom: 12px;
}

.naTextBox input.naTextBoxInput {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    padding: 0 0 7px 0;
    background-color: transparent;
    color: #333;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    margin: 0;
    height: 30px;
}

.naTextBox input.naTextBoxInput,
.naTextBox label.naTextBoxLabel {
    font-size: 18px;
}

.naTextBox .naTextBoxBaseline {
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0;
    bottom: 0;
    background-color: #cfd7df;
    transition: background-color 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.naTextBox .naTextBoxError
{
    display: none;
    color: #de4b39;
    height: 50px;
    margin-top: 50px;
    padding-top: 4px;
    font-weight: 400;
    font-size: 15px;
}

.naTextBox label.naTextBoxLabel {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 2px;
    color: #999;
    height: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transform-origin: 0 50%;
    cursor: text;
    padding: 0 0 7px 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left;
    transition-property: color, transform;
    transition-duration: 0.3s;
    transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}

.naTextBox .naTextBoxInput::-webkit-input-placeholder {
    color: transparent;
    transition: color 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.naTextBox .naTextBoxInput::-moz-placeholder {
    color: transparent;
    transition: color 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.naTextBox .naTextBoxInput:-ms-input-placeholder {
    color: transparent;
    transition: color 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.naTextBox .naTextBoxInput.StripeElement {
    opacity: 0;
    transition: opacity 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    will-change: opacity;
}

.naTextBox .naTextBoxInput.focused,
.naTextBox .naTextBoxInput:not(.empty) {
    opacity: 1;
}

.naTextBox .naTextBoxInput.focused::-webkit-input-placeholder,
.naTextBox .naTextBoxInput:not(.empty)::-webkit-input-placeholder {
    color: #cfd7df;
}

.naTextBox .naTextBoxInput.focused::-moz-placeholder,
.naTextBox .naTextBoxInput:not(.empty)::-moz-placeholder {
    color: #cfd7df;
}

.naTextBox .naTextBoxInput.focused:-ms-input-placeholder,
.naTextBox .naTextBoxInput:not(.empty):-ms-input-placeholder {
    color: #cfd7df;
}

.naTextBox .naTextBoxInput.focused+label,
.naTextBox .naTextBoxInput:not(.empty)+label {
    color: #999;
    transform: scale(0.85) translateY(-26px);
    cursor: default;
}

.naTextBox .naTextBoxInput.focused+label {
    color: #0bafc2;
}

.naTextBox .naTextBoxInput.invalid+label {
    color: #de4b39;
}

.naTextBox .naTextBoxInput.focused+label+.naTextBoxBaseline {
    background-color: #0bafc2;
    height: 2px;
}

.naTextBox .naTextBoxInput.invalid+label+.naTextBoxBaseline {
    background-color: #de4b39;
}

.naTextBox .naTextBoxInput.invalid+label+.naTextBoxBaseline+.naTextBoxError
{
    display: block;
}

.naTextBox .naTextBoxErrorIcon
{
    display: none;
    width: 24px;
    height: 24px;
    position: absolute;
    background: none;
    right: 0;
    bottom: 10px;
    border: 1px solid red;
    border-radius: 50%;
    text-align: center;
    color: red;
    font-weight: 400;
    font-size: 21px;
    line-height: 24px;
}

.naTextBox .naTextBoxErrorIcon::before
{
    content: '!';
}

.naTextBox .naTextBoxInput.invalid+label+.naTextBoxBaseline+.naTextBoxError+.naTextBoxErrorIcon::before,
.naTextBox .naTextBoxInput.invalid+label+.naTextBoxBaseline+.naTextBoxError+.naTextBoxErrorIcon
{
    display: block;
}

.naTextBox input.naTextBoxInput.invalid,
.naTextBox input.naTextBoxInput.invalid:focus,
.naTextBox input.naTextBoxInput.invalid:active
{
    border: 0;
}

.naTextBox .naTextBoxShowPass
{
    background: url(file/app/1/editor/icon/view.svg?color1=r51g51b51);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
    width: 24px;
    height: 24px;
    opacity: 0.5;
    position: absolute;
    right: 0;
    top: 20px;
    cursor: pointer;
}

.naTextBox .naTextBoxShowPass:active
{
    opacity: 1;
}

.naTextBox.naTextBoxPassword .naTextBoxInput
{
    padding-right: 50px;
}

.naTextBox input[type=password]::-ms-reveal,
.naTextBox input[type=password]::-ms-clear
{
    display: none;
}