.cui-card {
  padding: 15px;
  background: #ffffff;
  max-width: 320px;
  border-radius: 3px;
  border: solid 1px #c5cdd1;
  transition: box-shadow 200ms ease-in-out; }
  .cui-card.cui-xs {
    padding: 12px; }
  .cui-card.cui-sm {
    padding: 13px; }
  .cui-card.cui-lg {
    padding: 17px; }
  .cui-card.cui-xl {
    padding: 20px; }
  .cui-card.cui-elevation-1 {
    box-shadow: 0px 2px 4px -2px rgba(67, 90, 111, 0.3); }
  .cui-card.cui-elevation-2 {
    box-shadow: 0px 5px 8px -4px rgba(67, 90, 111, 0.3); }
  .cui-card.cui-elevation-3 {
    box-shadow: 0px 8px 10px -4px rgba(67, 90, 111, 0.3); }
  .cui-card.cui-elevation-4 {
    box-shadow: 0px 16px 24px -8px rgba(67, 90, 111, 0.3); }
  .cui-card.cui-card-interactive {
    cursor: pointer; }
    .cui-card.cui-card-interactive:hover, .cui-card.cui-card-interactive:focus {
      box-shadow: 0px 8px 10px -4px rgba(67, 90, 111, 0.3); }
    .cui-card.cui-card-interactive:active {
      box-shadow: 0px 2px 4px -2px rgba(67, 90, 111, 0.3); }
  .cui-card.cui-fluid {
    max-width: none; }