.custom-btn {
    position: relative;
    background: #BF312E !important;
    color: #FFF !important;
    padding: 10px 15px;
    border-radius: 8px;
    display: inline-flex;
    text-decoration: none;
    font-size: 16px;
    cursor: default;
}

.ck-custom-iframe {
    cursor: default !important;
}
.ck-custom-iframe * {
    pointer-events: none !important;
}


/* reset font styles in tinymce formatting dropdown, because we can't control the styles and they're wrong by default */
/*.tox-collection__item-label > * {*/
/*    font-size: 1rem !important;*/
/*    font-weight: normal !important;*/
/*    font-style: normal !important;*/
/*}*/




.text-bunny {
   font-size: 17px;
   font-weight: 700;
}

.text-cat, .prose h3, .mce-content-body h3 {
    font-size: 21px;
    font-weight: 700;
}

.text-dog, .prose h2, .mce-content-body h2 {
    font-size: 26px;
    font-weight: 700;
}

.text-cheetah, .prose h1, .mce-content-body h1 {
    font-size: 32px;
    font-weight: 600;
}

.text-donkey {
    font-size: 45px;
    font-weight: 600;
}

.text-elephant {
    font-size: 60px;
    font-weight: 600;
}

.text-block-quote {
    position: relative;
    background: rgba(220, 220, 255, .2);
    border-radius: 12px;
    font-size: 19px;
    font-style: italic;
    line-height: 2;
    font-weight: 300;
    padding: 45px 24px;

    @media (min-width: theme('screens.sm')) {
        padding: 24px 72px;
    }

    &::before {
        content: '';
        position: absolute;
        background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg"><path fill="white" d="M36,34l-6,0l-4,-8l0,-12l12,0l0,12l-6,0l4,8Zm-16,0l-6,0l-4,-8l0,-12l12,0l0,12l-6,0l4,8Z"/></svg>'),
        url('data:image/svg+xml;utf8,<svg viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg"><path fill="white" d="M12 34h6l4-8v-12h-12v12h6zm16 0h6l4-8v-12h-12v12h6z"/></svg>');
        background-repeat: no-repeat;
        background-position: top left, bottom right;
        background-size: 34px;
        opacity: .2;
        inset: 6px;

        @media (min-width: theme('screens.sm')) {
            inset: 10px;
            background-size: 48px;
        }
    }
}
