
/*  Breadcrum */
.breadcrumb {background-color: #f5f5f5; padding-block: 8px; --_c-grey-600: #6c757d;}
.breadcrumb li {display: inline-flex; align-items: center;}
.breadcrumb li:not(:last-child)::after {margin-inline: 8px; content: '/';}
.breadcrumb li a {color: var(--c-tertiary);}
.breadcrumb li a:hover {color: var(--c-primary);}
.breadcrumb li a svg {margin-right: 3px;}
.breadcrumb li .active {color: var(--_c-grey-600);}
.breadcrumb * {transition: var(--transition);}


.single {padding-block: 40px;}
.single .content > :first-child {font-size: calc(var(--fs-lg, 30px) - 2px); font-weight: 700; color: var( --c-secondary); margin-bottom: 20px;}
.single .content :where(h1,h2, h3, h4, h5, h6) {color: var(--c-secondary); margin-bottom: 10px;}
.single .content p:not(:last-child) {margin-bottom: 30px;}
.single .content p a{display:inline-block;color:var( --c-secondary);}
.single .content ul {margin-bottom: 10px}
.single .content li {list-style: disc; list-style-position: inside;}
:where(.single, .single :where(.content , .content *)) {transition: var(--transition);}


@media only screen and (max-width: 767px) {
.single {padding-block: 20px;}
}

@media only screen and (max-width: 475px) {
.single .content > :first-child {margin-bottom: 10px;}
.single .content :is(h3, h4, h5, h6, ul) {margin-bottom: 5px;}
.single .content p:not(:last-child) {margin-bottom: 15px;}
}