NewsBlur/media/css/pages/payments.css

/* ========== */
/* = Paypal = */
/* ========== */

.NB-paypal-return {
  margin: 176px 0 0;
  background-color: #D3E7BA;
  border-top: 1px solid #A0A0A0;
  border-bottom: 1px solid #A0A0A0;
  padding: 24px 0;
  background-image: linear-gradient(bottom, rgb(188,214,167) 0%, rgb(223,247,212) 100%);
  background-image: -moz-linear-gradient(bottom, rgb(188,214,167) 0%, rgb(223,247,212) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(188,214,167) 0%, rgb(223,247,212) 100%);
  background-image: -ms-linear-gradient(bottom, rgb(188,214,167) 0%, rgb(223,247,212) 100%);
  text-align: center;
}

.NB-paypal-return .NB-paypal-return-title {
  font-size: 36px;
  margin: 0 0 12px;
  color: #303030;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, .5);
}

.NB-paypal-return .NB-paypal-return-subtitle {
  font-size: 24px;
  color: #324A15;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, .5);
}

.NB-paypal-return .NB-paypal-return-loading {
  margin: 18px auto 0;
  height: 16px;
  width: 300px;
}

/* ========== */
/* = Stripe = */
/* ========== */

.NB-static-form-wrapper {
  margin: 48px 0 18px;
  background-color: #D3E7BA;
  border-top: 1px solid #A0A0A0;
  border-bottom: 1px solid #A0A0A0;
  padding: 24px 0;
  background-image: linear-gradient(bottom, rgb(188,214,167) 0%, rgb(223,247,212) 100%);
  background-image: -moz-linear-gradient(bottom, rgb(188,214,167) 0%, rgb(223,247,212) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(188,214,167) 0%, rgb(223,247,212) 100%);
  background-image: -ms-linear-gradient(bottom, rgb(188,214,167) 0%, rgb(223,247,212) 100%);
}
.NB-static-form {
    margin: 0 auto;
    width: 360px;
}

.NB-stripe-form {
    overflow: hidden;
}

.NB-static-form input,
.NB-static-form select {
    font-size: 14px;
    padding: 2px;
    margin: 6px 4px;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 1px;
    -moz-box-shadow: inset 0 2px 2px rgba(50, 50, 50, 0.15);
    box-shadow: inset 0 2px 2px rgba(50, 50, 50, 0.15);

    width: 200px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.NB-static-oauth .NB-static-form .controls input,
.NB-stripe-form.NB-static-form .controls input {
    width: 180px;
}
.NB-static-form .NB-label-right {
    margin: 0 0 24px 206px;
    width: 200px;    
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.NB-static-form input.error,
.NB-static-form select.error {
    border-color: #830C0C;
}
.NB-static-form button {
    width: 200px;
    margin: 12px 0 4px 150px;
    
    -moz-box-shadow:2px 2px 0 #A0B998;
    -webkit-box-shadow:2px 2px 0 #A0B998;
    box-shadow:2px 2px 0 #A0B998;
}
.NB-static-form .helptext {
    display: none;
}

.NB-static-form #id_card_cvv {
    width: 42px;
}

.NB-static-form .NB-stripe-username {
    margin: 6px 0 12px;
}

.NB-static-form label {
    width: 150px;
    display: block;
    float: left;
    clear: both;
    margin: 6px 0 0;
    padding: 2px 0 0;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
}

.NB-static-form .NB-creditcards {
    margin: 8px 0 0 150px;
    overflow: hidden;
}
.NB-static-form .NB-creditcards img {
    float: left;
    margin-right: 4px;
    width: 32px;
    height: 20px;
}

.NB-static-form input[type=submit] {
    margin-left: 150px;
    width: 200px;
}

.NB-static-form label.error {
    width: 100%;
    margin-left: 150px;
    text-transform: none;
    color: darkred;
}

.NB-static-form #payment-form > div {
    clear: both;
}
.NB-static-form p {
    overflow: hidden;
}

.NB-static-form #id_plan {
    margin: 0;
}
.NB-static-form #id_plan label {
    margin-top: 0;
}
.NB-static-form .NB-stripe-plan-choice {
    float: left;
    width: 200px;
    margin-top: 0px;
    padding: 0 2px;
    font-weight: bold;
}
.NB-static-form .NB-stripe-plan-choice label {
    width: auto;
    float: left;
    margin-top: 0;
    padding-top: 0;
}
.NB-static-form .NB-stripe-plan-choice input {
    width: auto;
    margin-right: 4px;
}

.NB-static-form .NB-small {
    font-size: 10px;
    margin-left: 4px;
    color: #575857;
}
.NB-static-form .payment-errors {
    margin: 8px 0 0 150px;
    color: #600000;
    display: block;
    font-weight: bold;
}
.NB-static-form .payment-notice {
    margin: 8px 0 0 150px;
    color: #606060;
    display: block;
    font-weight: 300;
    font-size: 11px;
}

.NB-static-form .payextra-label {
    clear: none;
    width: 200px;
    text-transform: none;
}
.NB-static-form .payextra-label input {
    width: auto;
    margin: 0 4px 0 0;
}
.NB-static-form input[name=plan] {
    display: none;
}

.NB-static-form .g-recaptcha {
    padding-left: 120px;
}