@charset "UTF-8";
/* CSS Document */

.pmpro_thead-name { margin-bottom: 40px; }

.pmpro_level .text-muted { display: none; }

.pmpro_advanced_levels-bootstrap .pmpro_level { margin-bottom: 30px; }

.pmpro_checkout ul { font-size: 0.9em; }

.pmpro_checkout h2 { 
  font-size: 14px;
}

.pmpro_confirmation_wrap h3 { display: none; }

#pmpro_account .pmpro_box h3 { margin-bottom: 20px; }

/** Set text size of Membership Account links such as Renew, Cancel, etc.) **/
.pmpro_actionlinks {
  font-size: 1.1em;
  color: #00b9f7;
  margin-top: 20px;
}

/** Register fields same length **/
form.pmpro_form .input[type=text], form.pmpro_form .input[type=password], form.pmpro_form textarea,
form.pmpro_form select.input, form.pmpro_form select {
  width: 226px;
}
form.pmpro_form .pmpro_payment-expiration select {
  width: auto;
}
@media (max-width: 768px) {
  body form.pmpro_form select.input, body form.pmpro_form select, form.pmpro_form .input[type=email] {
    width: 90%;
    /*max-width: 90%;*/
  }
  body form.pmpro_form .pmpro_payment-expiration select {
    width: auto;
  }
}

/**
 * The following CSS code will alter the "Renew" link of your
 * Paid Memberships Pro Account page and make it into a 
 * button. 
 *
 * If you do not have an expiration date set for
 * your membership level and thus no "Renew" link, the first
 * link will be affected by the CSS. In most cases, this
 * will then be the "Change" membership link.
 *
 * https://www.paidmembershipspro.com/increase-renewals-by-changing-the-renew-text-link-into-a-button-on-your-membership-account-page/
 * 
 * Code Recipe written by Paul Barthmaier
 * https://gist.github.com/pbrocks
 */

#pmpro_account-membership > table > tbody > tr >
td.pmpro_account-membership-levelname > div > a:nth-child(1) {
  background: #00C755;
  border: none;
  border-radius: 5px;
  box-shadow: 0px 1px 3px rgba( 0, 0, 0, 0.3 );
  color: #FFF;
  font-weight: 700;
  margin-right: 1rem;
  padding: .3rem 1rem;
  text-decoration: none;
  transition: all .4s;
}

#pmpro_account-membership > table > tbody > tr >
td.pmpro_account-membership-levelname > div > a:nth-child(1):hover {
  background: rgba( 250, 128, 114, .3 );
  box-shadow: 0px 1px 3px rgba( 0, 0, 0, 0.5 );
  color: rgb( 250, 128, 114 );
}