.mdc-custom__callout__wrapper--default {
	--co-border-color: var(--primary-color);
	--co-bg-color: hsl(0, 0%, 95%);
}

.mdc-custom__callout__wrapper--info {
	--co-border-color: hsl(190.15deg 89.47% 29.8%);
	--co-bg-color: hsl(191, 88%, 90%);
	--co-font-color: hsl(190, 90%, 20%);
}

.mdc-custom__callout__wrapper--warning {
	--co-border-color: hsl(45, 100%, 81%);
	--co-bg-color: hsl(46, 100%, 90%);
	--co-font-color: hsl(45, 94%, 21%);
}

.mdc-custom__callout__wrapper--danger {
	--co-border-color: hsl(354, 71%, 81%);
	--co-bg-color: hsl(355, 70%, 91%);
	--co-font-color: hsl(354, 61%, 21%);
}

.mdc-custom__callout__wrapper {
	border-left: 0.5rem solid var(--co-border-color);
	background-color: var(--co-bg-color);
	color: var(--co-font-color);
	padding: 1.25rem;
	margin-block: 1.25rem;
}


.mdc-custom__callout__title,
.mdc-custom__callout__item-title {
	margin-top: 0;
	color: var(--co-font-color);
	font-size: 1rem;
	font-weight: bold;
}

.mdc-custom__callout__description {
	display: flow-root;
}

.mdc-custom__callout__image {
	float: left;
	margin: 0 0.5rem 0.5rem 0;
}

.mdc-custom__callout__item {
	margin-top: 1rem;
}