/**
This file includes rules that are used in the RTE-editor in MODX to make it look and feel the same as the site. The following CSS is loaded into the TinyMCE in the following order:

  -Custom fonts (if applicable)
  -Font Awesome
  -bootstrap-custom.min.css
  -rte.ccs

Keep this file simple. Include only rules that are needed to keep a consistent look and feel in RTE, such as font-familiy, sizes, bullets, tables, etc.
The files above, including rte.css will also be loaded into the site as a basis, before site.css
**/

:root {
}
html,body {
}
img, video, picture, iframe {
    max-width: 100%;
    height: auto;
    border-radius: var(--bs-border-radius-xl);
}
table {
    border-collapse: collapse;
	width: 100% !important;
	height: auto !important;
	border: none;
	margin-bottom: 1.5rem;
}
table tr {
	border-top: 1px solid var(--bs-border-color);
	width: auto !important;
	height: auto !important;
}
table tr:first-child {
	border-top: none;
}
table tr:hover td {
	filter: brightness(0.97)
}
table td {
    background-color: white;
	padding: .5rem;
	width: auto !important;
	height: auto !important;
	vertical-align: top;
}
table td:first-child {
    padding-left: 0;
}
table td > *:last-child {
    margin-bottom: 0;
}
table thead tr {
	border-bottom: 1px solid var(--bs-primary);
	font-weight: 700;
}
table thead tr td {
    vertical-align: bottom;
}
table tfoot tr td {
	font-weight: 600;
	border-top: 1px solid var(--bs-primary);
	border-bottom: 1px solid var(--bs-primary);
}
table tr.row-subheading {}
table tr.row-summary {}
table td.cell-highlighted {
    background-color: var(--bs-light);
}
blockquote {
    border-left: .25rem solid var(--bs-primary);
    padding-left: .5rem;
    font-size: 1.2rem;
    font-weight: 600;
}
.caption {
    font-style: italic;
}
li::marker {
  color: var(--bs-primary);
}

/* Styles only applied inside Rich text editor */
#tinymce .btn-light,
#tinymce .btn-outline-light {
    filter: brightness(80%);
}
a:hover {
    text-decoration: none;
}
h6, .h6 {
    font-size: .8rem;
    text-transform: uppercase;
}
.btn {
    font-family: "IBM Plex Sans Condensed", sans-serif;
    font-weight: 700;
    text-transform: uppercase;
}

/** ################################################## MEDIA QUERIES ################################################## **/

/** Small devices (landscape phones, 576px and up) **/
/** Bootstrap: -sm **/
@media (min-width: 576px) {
	html,body {
	}
}

/** Medium devices (tablets, 768px and up) **/
/** Bootstrap: -md **/
@media (min-width: 768px) {
	html,body {
	}
}

/** Large devices (desktops, 992px and up) **/
/** Bootstrap: -lg **/
@media (min-width: 992px) {
	html,body {
	}
}

/** Extra large devices (large desktops, 1200px and up) **/
/** Bootstrap: -xl **/
@media (min-width: 1200px) {
	html,body {
	}
}

/** Extra Extra large devices (extra large desktops, 1400px and up) **/
/** Bootstrap: -xxl **/
@media (min-width: 1400px) {
	html,body {
	    font-size: 18px;
	}
    h1, .h1 {
        font-size: 3rem;
    }
    
}