/*-----------Lists-----------*/
.list-reset { list-style: none; padding: 0; margin: 0; }
ul, ol { margin: 0 0 1.000em 1.778em; padding: 0; }

/* using .main and the :not([class]) to target only regular ul's in page content. This approach avoids adding unwanted css to things like the main nav and responsive tabs */
.main ul:not([class]) { list-style: none; margin: 0 0 1.000em 0; padding: 0; overflow: hidden; }
.main ul:not([class]) li { list-style: none; margin: 0 0 1.125em 0; padding: 0 0 0 1.250em; position: relative; }
.main ul:not([class]) li:before { font-family: var(--icon-family); display: block; position: absolute; top: 0; left: 0; color: var(--primary); }
.main ul:not([class]) li:before { font-size: 1em; content: "\e915"; top: -0.0625em;}
.main ul:not([class]) ul { margin: 1.250em 0 0 0.667em; }

/* this targets the sitemap list, currently used on the 404 page */
.main ul[class^="wsp"] { list-style: none; margin: 0 0 1.000em 0; padding: 0; overflow: hidden; }
.main ul[class^="wsp"] li { list-style: none; margin: 0 0 .125em 0; padding: 0 0 0 1.250em; position: relative; }
.main ul[class^="wsp"] li:before { font-family: var(--icon-family); display: block; position: absolute; top: 0; left: 0; color: var(--primary); }
.main ul[class^="wsp"] li:before { font-size: 1em; content: "\e915"; top: -0.0625em;}
.main ul[class^="wsp"] ul { margin: .250em 0 0 0.667em; }

ul.two-columns { list-style: none; margin: 0 0 1.000em 0; padding: 0; overflow: hidden; }
ul.two-columns li { list-style: none; margin: 0 0 1.125em 0; padding: 0 0 0 1.250em; position: relative; }
ul.two-columns li:before { font-family: var(--icon-family); display: block; position: absolute; top: 0; left: 0; color: var(--primary); }
ul.two-columns li:before { font-size: 1em; content: "\e915"; top: -0.0625em;}
ul.two-columns ul { margin: 1.250em 0 0 0.667em; }

ul.three-columns { list-style: none; margin: 0 0 1.000em 0; padding: 0; overflow: hidden; }
ul.three-columns li { list-style: none; margin: 0 0 1.125em 0; padding: 0 0 0 1.250em; position: relative; }
ul.three-columns li:before { font-family: var(--icon-family); display: block; position: absolute; top: 0; left: 0; color: var(--primary); }
ul.three-columns li:before { font-size: 1em; content: "\e915"; top: -0.0625em;}
ul.three-columns ul { margin: 1.250em 0 0 0.667em; }

ol, li { line-height: 1.5; }
ol { counter-reset: section; list-style-type: none; margin: 0 0 1.000em 0; padding: 0; }
ol li { counter-increment: section; position: relative; padding: 0 0 0 1.125em; margin-bottom: 1.250em; }
ol li:before { font-weight: 700; content: counters(section, ".") "."; display: inline-block; color: var(--primary); margin-right: 0.5em; }
ol ol { margin: 1.778em 0; }
ol ol li { font-size: 0.875em; }
ol ol li { padding-left: 2.1429em; }
ul.bullets, ul.checkmarks { list-style: none; margin: 0 0 1.000em 0; padding: 0; overflow: hidden; }
ul.bullets li, ul.checkmarks li { list-style: none; margin: 0 0 1.125em 0; padding: 0 0 0 1.250em; position: relative; }
ul.bullets li:before, ul.checkmarks li:before { font-family: var(--icon-family); display: block; position: absolute; top: 0; left: 0; color: var(--primary); }
ul.bullets li:before { font-size: 1em; content: "\e915"; top: -0.0625em;}
ul.checkmarks li:before { font-size: 1em; content: "\e94b"; top: -0.0625em;}
.main ul.checkmarks ul { margin: 1.250em 0 0 0.667em }
.main ul.checkmarks ul li:before { font-size: 1em; content: "\e94b"; top: -0.0625em;}
ul.bullets ul, ul.checkmarks ul { margin: 1.250em 0 0 0.667em; }
ul.two-columns { column-count: 2; column-gap: 40px; }
ul.three-columns { column-count: 3; column-gap: 40px; }
ul.no-bullets {list-style: none; margin-left: 0;}
ul.no-bullets li { margin: 0 0 1.125em 0; padding-left: 0; }
ul.no-bullets li:before { content: none; }

.main .center ul, .main .center ul.bullets, .main .center ul.checkmarks { width: fit-content; margin: 0 auto 1.000em; text-align: left; }


@media (max-width: 800px) {
	ul.two-columns { column-count: 2; column-gap: 40px; }
	ul.three-columns { column-count: 2; column-gap: 40px; }
}
@media (max-width: 479px) {
	ul.two-columns { column-count: 1; column-gap: 0px; }
	ul.three-columns { column-count: 1; column-gap: 0px; }
}