.amplify-card {
  background-color: var(--amplify-components-card-background-color);
  border-radius: var(--amplify-components-card-border-radius);
  border-width: var(--amplify-components-card-border-width);
  border-style: var(--amplify-components-card-border-style);
  border-color: var(--amplify-components-card-border-color);
  box-shadow: var(--amplify-components-card-box-shadow);
  display: block;
  padding: var(--amplify-components-card-padding);
  &--outlined {
    background-color: var(--amplify-components-card-outlined-background-color);
    border-radius: var(--amplify-components-card-outlined-border-radius);
    border-width: var(--amplify-components-card-outlined-border-width);
    border-style: var(--amplify-components-card-outlined-border-style);
    border-color: var(--amplify-components-card-outlined-border-color);
    box-shadow: var(--amplify-components-card-outlined-box-shadow);
  }

  &--elevated {
    background-color: var(--amplify-components-card-elevated-background-color);
    border-radius: var(--amplify-components-card-elevated-border-radius);
    border-width: var(--amplify-components-card-elevated-border-width);
    border-style: var(--amplify-components-card-elevated-border-style);
    border-color: var(--amplify-components-card-elevated-border-color);
    box-shadow: var(--amplify-components-card-elevated-box-shadow);
  }
}