/**
 * CSS variables.
 *
 * The apigee_kickstart theme uses CSS Variables for some rules, which are
 * also available to customize in the UI via Customizer. The color fields are
 * defined in `THEME.customizer.yml`, and their default values (which should
 * mirror the values you set below) are defined in
 * `config/install/apigee_kickstart_customizer.theme.THEME.yml`.
 *
 * By default, the variables point to other CSS variable values, which originate
 * from the Bootstrap build. See the partials linked in the "CSS Variables"
 * section in apigee_kickstart/src/sass/apigee-kickstart.style.scss for more
 * details.
 *
 * :root {
 *   --ak-header-color-bg: var(--dark);
 *   --ak-header-color: var(--white);
 *   --ak-footer-color-bg: var(--dark);
 *   --ak-footer-color: var(--white);
 *   --ak-accent-color: var(--blue);
 *   --ak-accent-color-light: var(--white);
 *   --ak-accent-color-dark: var(--blue-dark);
 * }
 */

/**
 * Add custom CSS here.
 */


.form-check-input[type=checkbox] {
  background-image: none;
}

.form-check .form-check-input {
  display: inline;
}
.form-check-input:checked {
  background-color: #2196f3;
  border-color: #2196f3;
}
.form-check-input[type=checkbox] {
  border-radius: 0.25em;
}
.form-check .form-check-input {
  float: none;
  margin-left: 0;
}
.page-content input {
}
[type=checkbox], [type=radio] {

}
.form-check-input {

}




.nnh-api-price-plan-subscribe-button a {
  display: flex;
  justify-content: center;
  text-justify-trim: center;
  background-color: var(--color-blau-low);
  color: black;
  font-size: 0.6rem;
  border-radius: 12px;
  padding: 0.5rem 0.8rem;
}
.nnh-api-price-plan-subscribe-button a:hover{
  background-color: var(--color-blau);
  color: white;

}


.nnh-api-price-plan-table{
  tr th{
    background-color: transparent;
    min-width: 300px;
    border: none;
  }
  td {
    border: none;
  }
}

/* General */

.nnh-inline {
  display: flex;
}

.nnh-red {
  border: red 1px solid;
}

.nnh-test,
.nnh-test > div {
  border: red 1px solid;
}

.max-with-400 {
  max-width: 400px;
}

.left-50 {
  padding-left: 50px;
}


/* Body Content */
.widgets__field-api-product div.field__label,
.apidoc__field-api-product div.field__label {
  margin: 15px;
}

.widgets__field-pricing-clarification,
.apidoc__field-pricing-clarification {
  margin-bottom: 20px;
  margin-left: 22px;
}

.widgets__field-api-product,
.apidoc__field-api-product {
  margin: 15px 0;
}

.widgets__field-image,
.apidoc__field-image {
  /*  border: 1px solid #dbdbdb;*/
  /*  border-radius: 10px;*/
}

.widgets__field-image img,
.apidoc__field-image img {
  border-radius: 10px;
}


/* Endpoints */

.nnh-endpoints .field__label {
  min-width: 70px;
}


/* API Price Plan */

.nnh-price-plan-container {
}

.nnh-api-product-name {
  font-weight: bold;
  margin: 7px 0 0;
}

.nnh-api-price-plan-subscribe-button {
  display: flex;
}

.nnh-api-price-plan-subscribe-button a {
  margin-right: 0;
  margin-left: auto;
}

.nnh-api-price-plan-table th,
.nnh-api-price-plan-table td {
  display: inline-block;
  vertical-align: top;
  margin: 0;
  padding: 3px;
  min-width: 220px;
  max-width: 400px;
}

.nnh-btn-price {
}

/* Same height on Featured APIs Card on Home  */
div.paragraph .card-deck .card-body {
  height: 220px;
  overflow: hidden;
}


article.apigee-entity--view-mode-card {
  height: 100%;
}

.user-not-allowed {
  padding: 10px 0 0 0;
}

.container_demo {
  margin: 16px 0;
  padding: 20px;
  background-color: rgb(249, 249, 249);
  border: rgba(0, 0, 0, 0.125) 1px solid;
  border-radius: 5px;
}

.nnh-col-cover {
  margin-left: 15px;
  margin-bottom: 15px;
}

.nnh-col-cover img {
}

.card-body p {
  font-size: 1rem;
  letter-spacing: 0.4px;
  line-height: 1.5;
}

.secret__copy {
  margin-left: 0;
}

.badge {
  color: rgb(60, 60, 60);
}