/*
 * These styles are outputted both of the frontend and backend of the site - they are used specifically for styles set in the formatter menu
 * Please note any changes you do make may also make changes to the WP backend default styles.
 * Edit with caution
 */


/* WYSIWYG Formats */
ul.toast-boxed-list { background: var(--brand-8); padding: 2rem 2rem 1rem 2rem; list-style: inside; border-radius: var(--border-radius); }
p.toast-alert-paragraph { display: flex; align-items: top; background: var(--brand-1); color: #fff; padding: 2rem; margin: 4rem 0; position: relative; border-radius: var(--border-radius); }
p.toast-alert-paragraph:before { content: ""; display: block; background: transparent url('/wp-content/themes/toast/assets/images/warning.svg') center center no-repeat; background-size: contain; height: 5rem; width: 10rem; margin-right: 2rem; border-radius: var(--border-radius); animation: shake 2.5s ease-in-out infinite; }
@keyframes shake {
    0%, 20%, 100% { transform: translateX(0); }
    2%, 6% { transform: translateX(-3px); }
    4%, 8% { transform: translateX(3px); }
}
img.toast-round-image { border-radius: 100%; }
p.small-para { font-size: 80%; }
img.toast-image-shadow { box-shadow: rgba(0, 0, 0, 0.25) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px; }