.top-30{margin-top:30px;}
.color-list li{padding-top:10px;}
.card-color-no-display {
  display:none;
}
.label-card-color-selector span.red{background:#f49f9a;}
.label-card-color-selector span.orange{background:#f3be9f;}
.label-card-color-selector span.yellow{background:#fff59e;}
.label-card-color-selector span.green{background:#85e699;}
.label-card-color-selector span.blue{background:#79aed6;}
.label-card-color-selector span.gray{background:#f5f5f5;}
input[type="radio"]:checked + .label-card-color-selector .red{border:2px solid #e98d88;}
input[type="radio"]:checked + .label-card-color-selector .orange{border:2px solid #e4a987;}
input[type="radio"]:checked + .label-card-color-selector .yellow{border:2px solid #e2d881;}
input[type="radio"]:checked + .label-card-color-selector .green{border:2px solid #6cc47e;}
input[type="radio"]:checked + .label-card-color-selector .blue{border:2px solid #669fca;}
input[type="radio"]:checked + .label-card-color-selector .gray{border:2px solid #cacaca;}
.label-card-color-selector {display:inline-block;width:20px;height:20px;cursor:pointer;}
.label-card-color-selector span {
  display:block;width:100%;height:100%;
  transition:transform .8s ease-in-out;border-radius:100%;
}

.card-button-color-red{background:#f49f9a;}
.card-button-color-orange{background:#f3be9f;}
.card-button-color-yellow{background:#fff59e;}
.card-button-color-green{background:#85e699;}
.card-button-color-blue{background:#79aed6;}
.card-button-color-gray{background:#f5f5f5;}