.card-header {
  align-items: stretch;
  box-shadow: 0 1px 2px hsla(0, 0%, 4%, .1);
  display: flex;
  min-height: 40px
}

.card-header-title {
  align-items: flex-start;
  color: #363636;
  display: flex;
  flex-grow: 1;
  font-weight: 700;
  padding: 10px
}

.card-header-icon {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: center;
  width: 40px
}

.card-image {
  display: block;
  position: relative
}

.card-content {
  padding: 20px
}

.card-content .title+.subtitle {
  margin-top: -20px
}

.card-footer {
  border-top: 1px solid #dbdbdb;
  align-items: stretch;
  display: flex
}

.card-footer-item {
  align-items: center;
  display: flex;
  flex-grow: 1;
  justify-content: center;
  padding: 10px
}

.card-footer-item:not(:last-child) {
  border-right: 1px solid #dbdbdb
}

.card {
  background-color: #fff;
  box-shadow: 0 2px 3px hsla(0, 0%, 4%, .1), 0 0 0 1px hsla(0, 0%, 4%, .1);
  color: #4a4a4a;
  max-width: 100%;
  position: relative;
  width: 300px
}

.card .media:not(:last-child) {
  margin-bottom: 10px
}

.card.is-fullwidth {
  width: 100%
}

.card.is-rounded {
  border-radius: 5px
}


.card-header-title {
  font-weight: 500
}

.collapse-item .card-header {
  cursor: pointer
}

.collapse-item .card-content {
  padding: 0 20px
}

.collapse-item .card-content .content {
  padding: 20px 0
}

.collapse-item .card-header-icon {
  transition: transform .377s ease
}

.collapse-item.is-active>.card-header .card-header-icon {
  transform: rotate(90deg)
}