body {
	/* v1, v2, v3, v4 */	
	font-family: "Metropolis"; 
	
	/* v4 */
	/*! overflow: hidden; */
}

a {
	/* v1, v3 */
	color: #0D8894;
}

.h6, h6 {
	/* v2, v4 */
	margin-top: 1.7rem;
	margin-bottom: 1.7rem;
	font-weight: bold;
	font-size: 1.1em;
	line-height: 1.5em;
}



/*
 * wrp is a <div> wrapper around page content.
 *
 * grep in themes/segm/templates/: 
 *     templates/page.html.twig
 *     templates/page--node--6.html.twig
 *     templates/page--node--7.html.twig
 *     templates/page--node--9.html.twig
 *     templates/page--node--17.html.twig
 *     templates/page--node--40.html.twig
 *     templates/page--node--76.html.twig
 *     templates/page--node--77.html.twig
 *     templates/page--node--81.html.twig
 *     templates/page--node--96.html.twig
 *     templates/page--node--102.html.twig
 *     templates/page--node--petition.html.twig
 *     templates/views/views-view-unformatted--new-blog-homepage.html.twig
 */

.wrp {
	/* v1, v2, v3, v4 */
	min-height: calc(100vh - 190px);
	
	/* v4 */
	padding: 4.5em 0;
	font-family: 'Inter', sans-serif;
	line-height: 1.8em;
}

.wrp a {
	/* v4 */
	color: #0d8894;
}



/*
 * <footer> is a tag which for some reason is added in random places. No grep results for foot-brand.
 *
 * grep in themes/segm/templates/: 
 *     templates/page.html.twig
 *     templates/page--front.html.twig
 *     templates/page--node--7.html.twig
 *     templates/page--node--9.html.twig
 *     templates/page--node--17.html.twig
 *     templates/page--node--40.html.twig
 *     templates/page--node--76.html.twig
 *     templates/page--node--77.html.twig
 *     templates/page--node--81.html.twig
 *     templates/page--node--96.html.twig
 *     templates/page--node--102.html.twig
 *     templates/page--user--login.html.twig
 *     templates/node.html.twig
 */

footer {
	/* v1, v2, v3, v4 */
	border-top: 5px solid #0D8894;
	content: " ";
	min-height: 78px;
	background-image: url(../images/footer.png);
	background-size: cover;
	color: #fff;
	padding-top: 1em;
}

footer .foot-brand {
	/* v1, v2, v3, v4 */
	font-size: 42px;
	font-weight: bold;
	margin-top: 0.5em;
}



/*
 * top-shadow is used on <section> to give them a little shadow at the top.
 *
 * grep (top-shadow) in themes/segm/templates/: 
 *     templates/page.html.twig
 *     templates/page--node--6.html.twig
 *     templates/page--node--7.html.twig
 *     templates/page--node--9.html.twig
 *     templates/page--node--17.html.twig
 *     templates/page--node--40.html.twig
 *     templates/page--node--96.html.twig
 *     templates/page--front.html.twig
 *     templates/page--user--login.html.twig
 *
 * grep for the other two returned only dead files (files Max has put _ at the end of)
 */

.top-shadow, .top-shadow-light {
	/* v1, v2, v3, v4 */
	background-image: url(../images/shadow.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100% auto;
	border-top: 1px solid #575757;
}

.top-shadow.last {
	/* v1, v2, v3, v4 */
	background-image: url(../images/shadow.png), url(../images/shadow-light_end.png);
	background-position: center top, center bottom;
	
	/* v2, v4 */
	min-height: 590px;
}

.top-shadow-light {
	/* v1, v2, v3, v4 */
	background-image: url(../images/shadow-light.png);
}



/* 
 * content-1 is a <section> class used all over the place.
 * Think of it as "main content".
 *
 * grep (content-1) in themes/segm/templates/: 
 *     templates/page.html.twig
 *     templates/page--node--6.html.twig
 *     templates/page--node--7.html.twig
 *     templates/page--node--9.html.twig
 *     templates/page--node--17.html.twig
 *     templates/page--node--40.html.twig
 *     templates/page--node--96.html.twig
 *     templates/page--front.html.twig
 *     templates/page--user--login.html.twig
 */
 
section.content-1 {
	/* v1, v2, v3, v4 */
	padding-top: 50px;
	padding-bottom: 5px;
	color: #4D4D4D;
}

section.content-1 strong {
	/* v1, v2, v3, v4 */
	color: #000;
}

section.content-1 h2 {
	/* v1, v2, v3, v4 */
	font-size: 25px;
	font-weight: bolder;
	text-align: center;
	margin-bottom: 1em;
}

section.content-1 h2.about-c-title {
	/* v1, v2, v3, v4 */
	margin-bottom: 2.5em;
	font-size: 30px;
	font-weight: bolder;
	color: #000;
}

section.content-1 p {
	/* v1, v2, v3, v4 */
	font-size: 16.7px;
	line-height: 1.9em;
	margin-bottom: 1.5em;
}

section.content-1 ul li {
	/* v1, v2, v3, v4 */
	position: relative;
	list-style: outside none;
	
	/* v2, v4 */
	margin-bottom: 1em;
}



/* Split from a combined selector with (the legacy?) "section.list-blk ul li:before" */

section.content-1 ul li:before {
	/* v1, v2, v3, v4 */
	content: " ";
	display: inline-block;
	width: 0.5em;
	height: 0.7em;
	position: absolute;
	background-image: url(/themes/segm/images/disc.svg);
	left: -1.1em;
	background-size: contain;
	background-repeat: no-repeat;
	
	/* v1, v3 */
	top: 0.4em;
	
	/* v2, v4 */
	top: 0.7em;
}

section.content-1 ul li::before {
	/* v2, v4 */
	top: 0.4em;
}

section.content-1 ul li>ul>li {
	/* v4 */
	font-size: 90%;
	margin-bottom: 0.8em
}

section.content-1 ul li>ul>li:first-of-type {
	/* v4 */
	margin-top: 0.6em
}

/* No grep hits for smallest-text */

section.content-1 p.smallest-text {
	/* v1, v2, v3, v4 */
	font-size: 11px;
	line-height: 1.3em;
	padding-top: 3em;
}

/* blog-full (as well as blog-full-date) appears in node--blog-text--full.html.twig */

section.content-1 h2.blog-full {
	/* v1, v2, v3, v4 */
	text-align: left;
	font-weight: normal;
	font-size: 36px;
	margin-bottom: 10px;
}

section.content-1 h2.blog-full~div h3 {
	/* v1, v2, v3, v4 */
	color: #0D8894 !important;
}

section.content-1:first-of-type {
	/* v4 */
	padding-top: 0;
	padding-bottom: 5px;
	color: #4D4D4D;
	background-image: none;
	border-top: 0;
}

section.content-1 img {
	/* v4 */
	max-width: 100%;
	height: auto !important;
}

section.content-1.last {
	/* v4 */
	background-color: #f6f4f0;
	padding-top: 4em;
	color: #4f4e4e;
	padding-bottom: 6em;
}

/* No grep hits for dtblock, nor archived front page. */

section.content-1.last .dtblock {
	/* v4 */
	background: #fff;
	padding: 2em;
	box-shadow: 0 0 14px 0px #DDD;
	text-align: center;
}

section.content-1.last progress {
	/* v4 */
	width: 90%;
	margin: 0.5em 0;
}

section.content-1.last progress::-webkit-progress-value {
	/* v4 */
	background: red;
}

section.content-1.last progress::-moz-progress-bar {
	/* v4 */
	background: #0d8894;
}

.content-1.whitebl {
	/* v4 */
	padding: 4rem 0;
}

.content-1.whitebl .container.hwidth {
	/* v4 */
	/*! max-width: 1450px; */
}



/* 
 * Pers being person. This will all be under about_us.
 *
 * grep (about_pers) in themes/segm/templates/: 
 *     templates/paragraph--crew.html.twig
 */

.about_pers {
	/* v1, v2, v3, v4 */
	position: relative;
	padding-bottom: 5em;
}

.about_pers:after {
	/* v1, v2, v3, v4 */
	display: block;
	content: "";
	position: relative;
	width: 40%;
	border-bottom: 3px solid #0D8894;
	padding-top: 1.5em;
	margin: auto;
}

.about_pers:last-of-type:after {
	/* v1, v2, v3, v4 */
	border-bottom: none;
	padding-top: 0;
}

.about_pers .row {
	/* v1, v2, v3, v4 */
	flex-direction: row;
}

.about_pers:nth-child(2n) .row {
	/* v1, v2, v3, v4 */
	flex-direction: row-reverse;
}

.about_pers .picts {
	/* v2 */
}

.about_pers .picts img {
	/* v1, v2, v3, v4 */
	width: 95%;
	height: auto;
}

.about_pers .texts {
	/* v3 */
}

.about_pers .texts p {
	/* v1, v2, v3, v4 */
	line-height: 2.1em;
	text-align: justify !important;
	text-justify: distribute;
}

.about_pers .texts h2 {
	/* v1, v2, v3, v4 */
	text-align: left;
	font-weight: normal;
}

.about_pers:nth-child(2n) .texts h2 {
	/* v1, v2, v3, v4 */
	text-align: right;
}

.about_pers .texts h2 strong {
	/* v3 */
}

@media (max-width:767px) {
	
	.about_pers .texts p {
		/* v1, v2, v3, v4 */
		text-align: initial !important;
	}
}

@media (max-width: 991px) {
	
	.about_pers .picts {
		/* v1, v2, v3, v4 */
		padding-bottom: 1.5em;
		text-align: center;
	}
}



/* 
 * As it's only found on node 6, which is about_us, this'll be to style the header that says "2024 Advisors".
 *
 * grep (top-page-s) in themes/segm/templates/: 
 *     templates/page--node--6.html.twig
 */

section.top-page-s {
	/* v1, v2, v3, v4 */
	/* background-color: #FBFBFB; */
	border-bottom: 5px solid #0D8894;
}

section.top-page-s p {
	/* v1, v2, v3, v4 */
	text-align: justify !important;
	line-height: 1.5em;
	font-size: 17.5px;
}

@media (max-width:767px) {
	
	section.top-page-s p {
		/* v1, v2, v3, v4 */
		text-align: initial !important;
	}
}



/* 
 * 7 and 9 are related to contact-forms. Wrappers. -cont holds the text at the top, -form holds the form.
 *
 * grep (contact-cont) in themes/segm/templates/: 
 *     templates/page--node--7.html.twig
 *     templates/page--node--9.html.twig
  *
 * grep (contact-form) in themes/segm/templates/: 
 *     templates/page--node--7.html.twig
 *     templates/page--node--9.html.twig
 */

section.contact-cont {
	/* v1, v2, v3, v4 */
	border-top: none;
}

section.contact-form {
	/* v1, v2, v3, v4 */
	border-top: none;
}

section.contact-cont p {
	/* v1, v2, v3, v4 */
	line-height: 1.4em;
	font-size: 27px;
	margin-bottom: 0.7em;
}

section.contact-cont p em {
	/* v1, v2, v3, v4 */
	font-size: 20.3px;
	color: #4D4D4D;
	font-weight: bold;
}



/* 
 * No clue, and no grep hits.
 */

a[href*="pop"] {
	/* v1, v2, v3, v4 */
	position: relative;
	color: #0D8894;
	font-weight: bold;
	text-decoration: none;
}

a span.pop {
	/* v1, v2, v3, v4 */
	display: none;
	position: absolute;
	font-size: 10px;
	line-height: 1.3em;
	width: 24.3em;
	bottom: 2.5em;
	background: #fff;
	color: #4D4D4D;
	padding: 1em;
	left: 3em;
	overflow: visible;
	border: 3px solid #0D8894;
	border-radius: 1.1em 1.1em 1.1em 0;
	z-index: 1000;
	text-align: left;
}

a:hover span.pop {
	/* v1, v2, v3, v4 */
	display: block;
}



/* own-text appears in themes/segm/js/script.js and in a form-element--field-group-own.html.twig */

.own-text {
	/* v1, v2, v3, v4 */
	position: relative;
	top: -2em;
}



/*
 * This class is used both by the Spotlight list (the "...Read More" text) and the Zotero page, for different purposes.
 */

.read-more {
	/* v1, v2, v3, v4 */
	width: max-content;
	text-transform: uppercase;
	color: #0D8894;
	font-weight: bold;
	margin: 1em auto;
	text-transform: capitalize;
	border: 1px solid #0D8894;
	padding: 0em 0.6em;
	line-height: 2.3em;
	border-radius: 0.3em;
	cursor: pointer;
	font-size: 130%;
}

.read-more:hover {
	/* v1, v2, v3, v4 */
	background-color: #0D8894;
	color: #fff;
}



/* This also appears to be a screen-width dependent part of the Zotero library */

@media (max-width: 991px) {
	
	/* No grep hits for tab-mob */

	table.tab-mob {
		/* v3 */
	}

	table.tab-mob td {
		/* v1, v2, v3, v4 */
		display: block;
		width: 100% !important;
		padding: 0 !important;
	}
}



/* 
 * These all seem to be form-related things.
 *
 * grep (contact-message) in /: 
 *     no hits
 *
 * grep (webform-submission) in /: 
 *     modules/webform/ - too many to list
 */

form#contact-message-register-form {
	/* v1, v2, v3, v4 */
	padding-bottom: 3em;
}

form#contact-message-register-form p.small-form-deskr {
	/* v1, v2, v3, v4 */
	font-size: 14px;
	font-style: italic;
}

form.webform-submission-contact-us-new-form label, form#contact-message-register-form label {
	/* v1, v2, v3, v4 */
	margin: 0;
	font-weight: bolder;
	font-size: 23.2px;
	line-height: 1.3em;
	padding-bottom: 0.5em;
}


form.webform-submission-contact-us-new-form label .group-field, form#contact-message-register-form label.group-field {
	/* v1, v2, v3, v4 */
	font-size: 23.2px;
	text-align: justify;
	padding-bottom: 0.9em;
}

form.webform-submission-contact-us-new-form .stay-body label, form#contact-message-register-form .stay-body label {
	/* v1, v2, v3, v4 */
	font-size: 14px;
	font-weight: normal;
}


form.webform-submission-contact-us-new-form .col-lg-6>div, form#contact-message-register-form .col-lg-6>div {
	/* v1, v2, v3, v4 */
	margin-bottom: 3em;
}

form#contact-message-register-form .col-lg-6>div:last-of-type {
	/* v1, v2, v3, v4 */
	margin-bottom: 0.5em;
}

form#contact-message-register-form #edit-preview {
	/* v1, v2, v3, v4 */
	display: none;
}

form.webform-submission-contact-us-new-form #edit-actions-submit, form#contact-message-register-form #edit-submit {
	/* v1, v2, v3, v4 */
	background: #0D8894;
	padding: 0.7em 2em;
	color: #fff;
	border: none;
	border-radius: 0.5em;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 19.8px;
}

form.webform-submission-contact-us-new-form #edit-actions-submit {
	/* v1, v2, v3, v4 */
	margin-top: 1.5em;
}

#contact-message-subscribe-form {
	/* v1, v2, v3, v4 */
	padding: 1.3em 0.1em;
}

#contact-message-subscribe-form div {
	/* v1, v2, v3, v4 */
	display: inline;
}

#contact-message-subscribe-form div.row {
	/* v1, v2, v3, v4 */
	display: none;
}

#contact-message-subscribe-form input {
	/* v1, v2, v3, v4 */
	max-width: 50%;
}

form#user-login-form {
	/* v1, v2, v3, v4 */
	width: 15em;
	max-width: 100%;
}



/* 
 * blog-title is a <div> which pops up here and there, presumably mostly in the spotlights (blog).
 * blog-subtilte appears in the exact same divs.
 * blog-list is an <article>.
 * hide-text had one dead result.
 *
 * (identical results for the following)
 * grep (blog-title) in themes/segm/templates/: 
 * grep (blog-subtilte) in themes/segm/templates/:
 *     templates/node--blog-post--full.html.twig
 *     templates/node--blog-post--teaser.html.twig
 *     templates/node--petition-new.html.twig
 *     templates/node--petition.html.twig
 *     templates/node--blog-text--full.html.twig
 *     templates/node--blog-text--teaser.html.twig
 *     templates/node--who-representatives.html.twig
 *     templates/field/field--field-subtitle.html.twig
 *
 * grep (blog-summary) in themes/segm/templates/:
 * grep (read-more-blog) in themes/segm/templates/:
 * grep (blog-text-body) in themes/segm/templates/:
 *     no hits
 *
 * grep (blog-list) in themes/segm/templates/: 
 * grep (readmore) in themes/segm/templates/: 
 * grep (article-teaser) in themes/segm/templates/: 
 *     templates/node--blog-post--teaser.html.twig
 *
 * grep (article-content) in themes/segm/templates/: 
 *     templates/node.html.twig
 *     templates/node--blog-post--full.html.twig
 *     templates/node--blog-post--teaser.html.twig
 *     templates/node--blog-text--full.html.twig
 *     templates/node--blog-text--teaser.html.twig
 *     templates/node--83.html.twig
 *
 * grep (blog-date) in themes/segm/templates/: 
 *     templates/node--blog-post--teaser.twig
 *     templates/node--blog-text--teaser.twig
 */

.blog-title {
	/* v1, v2, v3, v4 */
	font-size: 28px;
	text-align: left;
	margin-bottom: 0.7em;
	color: #0D8894;
}

.blog-title.blog-subtilte {
	/* v1, v2, v3, v4 */
	font-style: italic;
	margin-bottom: 1.5em;
	color: #7C7676;
	font-size: 25px;
}

.blog-title.blog-subtilte.blog-subtilte-sm {
	/* v1, v2, v3, v4 */
	margin-bottom: 0.7em;
}

.blog-summary {
	/* v3 */
}

.blog-summary p:last-of-type {
	/* v1, v2, v3, v4 */
	margin-bottom: 0.5em;
}

article.blog-list {
	/* v1, v2, v3, v4 */
	margin-bottom: 3em;
}

article.blog-list h2 {
	/* v1, v2, v3, v4 */
	text-align: left;
	margin-bottom: 0.1em;
}

article.blog-list h2 a {
	/* v1, v2, v3, v4 */
	color: inherit;
}

article.blog-list div.readmore {
	/* v1, v2, v3, v4 */
	text-align: right;
}

article.blog-list div.readmore .read-more {
	/* v1, v2, v3, v4 */
	opacity: 0.8;
	border: none;
	font-size: 100%;
}

article.blog-list div.readmore .read-more:hover {
	/* v1, v2, v3, v4 */
	background: initial;
	color: #0D8894;
	text-decoration: none;
}

.article-teaser>p {
	/* v1, v2, v3, v4 */
	display: inline;
}

.article-teaser>div.readmore {
	/* v1, v2, v3, v4 */
	display: inline;
}

.article-content a {
	/* v1, v2, v3, v4 */
	color: #0D8894;
}

.read-more-blog {
	/* v1, v2, v3, v4 */
	font-size: 14px;
}

.read-more-blog a {
	/* v3 */
}

.blog-date {
	/* v1, v2, v3, v4 */
	padding-bottom: 1.5em;
}

.blog-full-date {
	/* v1, v2, v3, v4 */
	padding-bottom: 2.5em;
}

.blog-text-body .hide-text {
	/* v1, v2, v3, v4 */
	margin: 2em 0em;
}

.blog-text-body .col.text-right {
	/* v1, v2, v3, v4 */
	margin: 0.5em 0 1em;
}

.blog-text-body li {
	/* v1, v2, v3, v4 */
	line-height: 1.9em;
}

.hide-text {
	/* v1, v2, v3, v4 */
	display: none;
}

.hide-text.show {
	/* v1, v2, v3, v4 */
	display: block;
}



/* eapps is the social media sharing widget on blog posts. However, this selector doesn't seem to exist. */

#eapps-social-share-buttons-1 {
	/* v1, v2, v3, v4 */
	width: auto;
}



/* 
 * feed-icon is <a href="https://segm.org/blog/feed" class="feed-icon">Subscribe to Drupal blog posts</a> injected into the spotlight list (https://segm.org/news). It is a part of the theme segm inherits from.
 */

.feed-icon {
	/* v1, v2, v3, v4 */
	display: none;
}



/*
 * StripeElement appears on the home page and the donate page, and comes from the Stripe module.
 * It's a div around an iframe which loads the credit card box.
 */

.StripeElement {
	/* v1, v2 */
	height: 32px;
	
	/* v3 */	
	border: 1px solid #ccc;
	margin: 2px 0;
	max-width: 100%;
	box-sizing: border-box;
	
	/* v4 */	
	height: auto;
	font-size: 100%;
	transform: scale(1.7,1.7);
	width: 59%;
	transform-origin: left;
	padding: 0rem;
	padding: 4px 0 !important;
}

.StripeElement iframe {
	/* v4 */
	/*! height: 40px !important; */
	background-color: #fff;
	padding: 0.5em 0 !important;
	transform: scale(2) !important;
}

.StripeElement iframe *
{
	/* v4 */
	font-size: 200% !important;
}



/* No grep hits for no-mobile, but mobile-nojust appears a couple times. */

@media (max-width:767px) {
	
	span.no-mobile {
		/* v1, v2, v3, v4 */
		display: none;
	}

	.mobile-nojust {
		/* v1, v2, v3, v4 */
		text-align: initial !important;
	}
}



/* No grep hits. */

@media (max-width: 991px) {

	.col-lg-6.mobile-pad {
		/* v1, v2, v3, v4 */
		margin-top: 3em;
	}
}



/* The following is a bit complicated, so I'll do them a bit different. These are the three different versions of this. */

.donate-top, #stripe-examples-simple-checkout input[type="submit"] {
	/* v1 */
	background: #0D8894;
	color: #fff;
	font-size: 19px;
	padding: 0.2em 1em;
	margin: 0 0 0 1.4em;
	border-radius: 0.5em;
	box-shadow: 0px 0 0 5px #fff, 0 0 0 10px #EBECEC;
	border: none;
	text-transform: uppercase;
	font-weight: bolder;
}

.donate-top, [id^='stripe'] input[type="submit"],#stripe-examples-simple-checkout input[type="submit"] {
	/* v2 */
	border: 2px solid #0d8894;
	border-radius: 3em;
	color: #0d8894 !important;
	font-weight: 600;
	padding: 0.5em 1.7em;
	margin-left: 1.5em;
	background-color: transparent;
	text-transform: none;
	margin-right: 0;
	margin-top: 0;
	margin-bottom: 0;
	box-shadow: none;
	font-size: 14pt;
	clear: both;
}

.donate-top, #stripe-examples-simple-checkout input[type="submit"] {
	/* v3, v4 */
	/*! background: #0D8894; */
	/*! color: #fff; */
	/*! font-size: 19px; */
	/*! padding: 0.2em 1em; */
	/*! margin: 0 0 0 1.4em; */
	/*! border-radius: 0.5em; */
	/*! box-shadow: 0px 0 0 5px #fff, 0 0 0 10px #EBECEC; */
	/*! border: none; */
	/*! text-transform: uppercase; */
	/*! font-weight: bolder; */
}



/* In addition, v2 has the following */

[id^='stripe'] input[type="submit"],#stripe-examples-simple-checkout input[type="submit"]:hover{	background: #0d8894;
	/* v2 */
	color: #fff !important;
	border-color: #0d8894;
}

[id^='stripe'] input[type="submit"] {
	/* v2 */
}



/* v1, v3, and v4 have the following */

#stripe-examples-simple-checkout input[type="submit"] {
	/* v1, v3, v4 */
	margin: 2em 0.5em 0.5em;
	float: right;
}

#stripe-examples-simple-checkout label {
	/* v1, v3, v4 */
	padding-top: 1em;
}



/* v2 has added some more selectors */

[id^='stripe'] input[type="submit"], #stripe-examples-simple-checkout input[type="submit"] {
	/* v2 */
	margin: 3em 0.5em 0.5em;
	float: none;
}

[id^='stripe'] label, #stripe-examples-simple-checkout label {
	/* v2 */
	padding-top: 1em;
}



.stripe-examples-simple-checkout .form-item-email input {
	/* v4 */
	display: block;
	width: 100%;
	height: calc(1.5em + .75rem + 2px);
	padding: .375rem .75rem;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: .25rem;
	transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}


/* grep hits for block4 in the core module called "block" */

h2 .block4-title {
	
	/* v2, v4 */
	font-size: 25px;
	font-weight: bolder;
	text-align: center;
	margin-bottom: 1em;
}



/* No grep hits for item-list-home blog */

.item-list-home-blog {
	/* v2, v4 */
	padding-top: 2em;
	padding-bottom: 0em;
	margin-bottom: 0;
}

.item-list-home-blog>ul {
	/* v2, v4 */
	padding-left: 0;
	margin-bottom: 0;
}



/* grep hits for home-blog-item in views-view-list--homepage_blog.html.twig */

.home-blog-item {
	/* v2, v4 */
	list-style: none;
}

.home-blog-item h2 {
	/* v2, v4 */
	font-size: 160%;
}

.home-blog-item .blog-subtilte {
	/* v2, v4 */
	font-size: 120%;
}



#block-readmorenews {
	/* v2, v4 */
	padding-bottom: 2em;
	margin-top: -3em;
}

#block-views-block-before-of-dots-block-block-1 {
	/* v2, v4 */
	padding-bottom: 1em;
}

#block-views-block-end-of-dots-block-block-1 {
	/* v2, v4 */
	padding-top: 1em
}

blockquote {
	/* v2, v4 */
	margin: auto 3.5rem;
}



/* However, there are differences here as well */

#edit-stripe-card-element {
	/* v2, v4 */
	/*! height: calc(1.5em + .75rem + 5px); */
	padding: 0.675rem .75rem .375rem .75rem;
	border-radius: .25rem;
	line-height: 1.5em;
	
	/* v4 */
	background-color: #fff;
}



/* Everything from here on is v4 only, with a twist down the line. */

/* No clue what tags are. Could be Zotero tags, or a hundred other things. */

.tags {
	/* v4 */
	padding-bottom: 2em;
}

.tags>div {
	/* v4 */
	display: block;
	padding: 0.2em 1em;
}

.tags div div {
	/* v4 */
	display: inline-block;
}

.tags div a {
	/* v4 */
	font-size: 112%;
	padding-top: 0.3em;
	padding-bottom: 0.1em;
	padding-left: 0.5em;
	padding-right: 0.5em;
	background-color: #0D8894;
	color: #fff;
	margin-right: 0.3em;
	transition: all 0.3s;
}

.tags div a:hover {
	/* v4 */
	font-size: 112%;
	text-decoration: underline;
	color: #0D8894;
	background: transparent;
}

.tags div aa:after {
	/* v4 */
	content: ",";
	margin-right: 0.3em;
}

.tags div div:last-of-type a::after {
	/* v4 */
	content: "";
}



/* https://segm.org/faq, presumably */

.faq-top {
	/* v4 */
	font-family: 'Inter', sans-serif;
}

.faq-top>h1 {
	/* v4 */
	font-size: 2.5rem;
	margin-bottom: 1.1em;
	font-weight: bold;
	text-align: center;
	font-family: 'Poppins', sans-serif;
}

.faq-top>h5 {
	/* v4 */
	color: #0d8894;
	margin-bottom: 0.5em;
	font-weight: 600;
	text-align: center;
	font-family: 'Poppins', sans-serif;
}



/* 
 * g-recaptcha is from the recaptcha module.
 */

fieldset .captcha__title {
	/* v4 */
	display: none;
}

.g-recaptcha {
	/* v4 */
	display: inline-block;
	text-align: center;
	padding: 1.1em 0 0 0;
}



/* no hits on red-text, but red-more-news has one. mar50 has one on the same template. */

.red-text {
	/* v4 */
	color:red;
}

.red-more-news
{
	/* v4 */
	border: 2px solid #0d8894;
	border-radius: 3em;
	color: #0d8894 !important;
	font-weight: 600;
	padding: 0.6em 1.7em;
	margin-left: 1.5em;
	background-color: transparent;
	text-transform: none;
	margin-right: 0;
	margin-top: 0;
	margin-bottom: 0;
	box-shadow: none;
	font-size: 14pt;
	line-height: 1rem;
}

.mar50{
	/* v4 */
	padding-top: 6em;
}



/* Don't know what these are. No grep hits. */

.spn-form-left {
	/* v4 */
	padding-right: 2rem;
}

.spn-form-right {
	/* v4 */
	padding-left: 2rem;
}

@media (max-width:576px) {
	
	.spn-form-left {
		/* v4 */
		padding-right: 15px;
	}

	.spn-form-right {
		/* v4 */
		padding-left: 15px;
	}
}



/* no grep hits for sign-email */

input.sign-email {
	/* v4 */
	border: 2px solid #08494f;
	border-radius: 0.3em;
	/*! color: #fff; */
	font-weight: 600;
	/*! padding: 0.7em 2.1em; */
	margin-left: 0.1em;
	/*! background-color:	#08494f !important; */
	/*! text-transform: none; */
	/*! margin-right: 0; */
	/*! margin-top: 0; */
	/*! margin-bottom: 0; */
	/*! box-shadow: none; */
	font-size: 1.5rem;
	transition: 0.5s;
	display: inline-block;
	/*! box-shadow: 3px 3px 5px 3px rgba(0,0,0,0.1); */
	height: 4rem;
}

input.sign-email:focus {
	/* v4 */
	border: 2px solid #08494f;
	box-shadow: none;
	background-color: #fdffff;
}

form .confirm-signup {
	/* v4 */
	padding-top: 2.5rem;
}



/* 
 * No clue. No grep hits for home-sub.
 */

.home-subscribe-fset {
	/* v4 */
	text-align: center;
}

.home-subscribe-fset .fieldset-wrapper {
	/* v4 */
	text-align: center;
	display: flex;
	width: min-content;
	margin: auto;
	margin-top: 0.5rem;
	margin-bottom: 1rem;
}

.home-subscribe-fset .fieldset-wrapper .home-sub-email {
	/* v4 */
	display: inline-block;
}

.home-subscribe-fset .fieldset-wrapper .home-sub-email input {
	/* v4 */
	width: auto;
	position: relative;
	border-radius: 1.5rem;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-right-width: 0;
	z-index: 2;
	padding: 0.5rem 0 0.5rem 2rem;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	border-color: #08494f;
}

.home-subscribe-fset .fieldset-wrapper .home-sub-email input:focus {
	/* v4 */
	box-shadow: none;
	border-color: #08494f;
}

.home-subscribe-fset .fieldset-wrapper .home-sub-send {
	/* v4 */
	font-weight: 400;
	line-height: 1.5;
	color: #fff;
	text-align: center;
	/*! vertical-align: middle; */
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	background-color: #08494f;
	border: 1px solid #08494f;
	padding: 0.3rem 1.5rem 0.1rem 0.8rem;
	font-size: 1rem;
	border-radius: 1.5rem;
	transition: background-color .15s ease-in-out;
	position: relative;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	border-left-width: 0;
	/*! box-sizing: border-box; */
}

@media (max-width:600px) {
	
	.home-subscribe-fset .fieldset-wrapper .home-sub-send {
		/* v4 */
		padding-left: 0.6rem;
		padding-right: 0.5rem;
	}
}

@media (max-width:800px){
	
	.home-subscribe-fset .fieldset-wrapper .home-sub-email input {
		/* v4 */
		max-width: 13em;
	}
}



/* 
 * These were grouped, presumably for a reason. Most of them are explicitly named contact.
 * I think all of them bar form-text might be dead.
 * Legacy?
 *
 * grep (form-text) in /: 
 *     none in themes/segm/, but tons of hits elsewhere.
 *
 * grep (send-us-label) in /: 
 *     no hits.
 *
 * grep (contact-us) in /: 
 *     no hits.
 */

.form-text {
	/* v4 */
	margin-top: 0;
}

.send-us-label {
	/* v4 */
	margin: 0;
	font-weight: bolder;
	font-size: 23.2px;
	line-height: 1.3em;
	padding-bottom: 0.5em;
}

.contact-us-block-01 {
	/* v4 */
	margin-bottom: 2.5rem;
}

.cnt-us-submit-btn {
	/* v4 */
	margin-top: 3.1rem;
}

.cnt-us-submit-btn input {
	/* v4 */
	background: #0D8894;
	padding: 0.7rem 2rem;
	color: #fff;
	border: none;
	border-radius: 0.5em;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.6rem;
}

.contct-us-text {
	/* v4 */
	font-size: 2rem;
}

.contct-us-text * {
	/* v4 */
	font-size: 1.7rem;
}

.contct-us-text em {
	/* v4 */
	font-size: 1.3rem;
}



/* 
 * grep (field-sep) in /: 
 *     modules/custom/NYC2023/templates/login-form.html.twig
 *     modules/spn/templates/spn-result--block.html.twig
 *     modules/spn/templates/spn--form.html.twig
 */

.field-sep {
	/* v4 */
	padding-bottom: 0.5rem;
}

.field-sep .sign-cb {
	/* v4 */
	padding-left: 1.4rem;
	padding-top: 1.2rem;
}

.field-sep .sign-cb label {
	/* v4 */
	color: red;
}

.field-sep .sign-cb input[type='checkbox'] {
	/* v4 */
	width: 1.5rem;
	height: 1.5rem;
}

.field-sep label {
	/* v4 */
	margin-bottom: 0;
	font-size: 1.4rem;
	font-weight: bold;
}

.field-sep label[for="edit-anonymous-sign"] {
	/* v4 */
	font-size: 1.5rem;
	margin-top: 0rem;
	margin-left: 1rem;
	font-weight: normal;
}

.field-sep input.button--primary-loginform {
	/* v4 */
	border: 2px solid #0d8894;
	border-radius: 3em;
	color: #0d8894 !important;
	font-weight: 600;
	padding: 0.5em 1.7em;
	margin-left: 1.5em;
	background-color: transparent;
	text-transform: none;
	margin-right: 0;
	margin-top: 0;
	margin-bottom: 0;
	box-shadow: none;
	font-size: 14pt;
}

.field-agree {
	/* v4 */
	padding: 0 1.6rem;
}

.field-agree input {
	/* v4 */
	font-size: 2rem;
	margin-top: 0.5rem;
	margin-left: -1.8rem;
}

.field-agree label {
	/* v4 */
	margin-bottom: 0;
	font-weight: bold;
}

.field-agree .description {
	/* v4 */	
}


/* 
 * No grep hits for block-twitterblock. The other one belongs to a module, although I don't know if it's in use.
 * No hits in view source on the home page. Legacy? 
 *
 * grep (field-sep) in /: 
 *     modules/twitter_block/src/Plugin/Block/TwitterBlock.php
 */

#block-twitterblock {
	/* v4 */
	max-width: 1096px;
	margin: auto;
	padding-bottom: 2em;
}

.twitter-timeline {
	/* v4 */
	margin-bottom: 3em !important;
}



/* No clue, given this naming. No grep hits. No hits in view source on the home page. Legacy? */

#block-views-block-homepage-blog-block-1:before {
	/* v4 */
	width: 100%;
	height: 1px;
	background-color: #CECECE;
	content: " ";
	position: relative;
	display: block;
	margin: auto;
	box-shadow: 0px 5px 5px 0px #CECECE;
}

#block-views-block-homepage-blog-block-1>h2 {
	/* v4 */
	margin: auto;
	max-width: 1140px;
	text-align: center;
	font-size: 25px;
	font-weight: bold;
	padding-top: 2em;
	padding-bottom: 1em;
	width: 100%;
	padding-left: 0.5em;
	padding-right: 0.5em;
}



/*
 * donate-top is a source of much headache.
 */

.donate-top {
	/* v4 */
	border: 2px solid #0d8894;
	border-radius: 3em;
	color: #0d8894 !important;
	font-weight: 600;
	padding: 0.5em 1.7em;
	margin-left: 1.5em;
	background-color: transparent;
	text-transform: none;
	margin-right: 0;
	margin-top: 0;
	margin-bottom: 0;
	box-shadow: none;
	font-size: 14pt;
}

.donate-top:hover {
	/* v1, v2, v3, v4 */
	background-color: #3BB6C2;
	border-color: #0D8894;
}

.donate-top:hover {
	/* v4 */
	background: #0d8894;
	color: #fff !important;
	border-color: #0d8894;
}

.donate-top {
	/* v4 */
	margin: -9em 0 0;
}


@media (max-width:1100px) {
	
	.donate-top {
		/* v4 */
		position: absolute;
	}
}

@media (max-width:800px){
			
	.donate-top {
		/* v4 */
		position: relative;
		margin: 0;
	}
}

@media (max-width: 991px) {

	.donate-top {
		/* v1, v2, v3, v4 */
		display: block;
	}	
}



/* The final thing is the itc-slider. However, we already include /itc-slider.css - there will be conflicts there. */

/* 
 * itcSlider is the carousel, where you click left or right to see more items, tweets, segm-in-media, etc.
 * There are rules defined for it both here and in itc-slider.css
 *
 * This is all very messy, so I'll be outlining the structures from the home page here.
 * 
 * Latest from SEGM ("itc-slider-in-media"), which is under <section class="new-home-blog" .../>
 * <div class="itc-slider itc-slider-in-news">
 *   <div class="itc-slider__wrapper">
 *     <div class="itc-slider__items">
 *       <div class="itc-slider__item itc-slider__item_active" .../>
 *         (specific...)
 *         <div class="itc-slider__item-in-news-wrp">
 *           <div class="itc-slider__item-in-news-content">
 *       <div class="itc-slider__item itc-slider__item_active" .../>
 *       <div class="itc-slider__item" .../>
 *       <div class="itc-slider__item" .../>
 *     </div>
 *     <button class="itc-slider__btn itc-slider__btn_prev itc-slider__btn_hide" .../>
 *     <button class=itc-slider__btn itc-slider__btn_next" .../>
 *   </div>
 * </div>
 *
 * Okay, so this makes sense so far, you have:
 * - an outer wrapper (just "itc-slider"), with a custom class for this specific use ("-in-news")
 * - an inner wrapper (shortened here to "__wrapper")
 * - yet another wrapper around the items ("__items")
 * - a bunch of items ("__item" which, when visible, are marked as "itc-slider__item_active")
 * - a base class for buttons ("__btn"), combined with "_prev/_next" and "_hide" when at either end.
 *
 * SEGM in Media ("itc-slider-in-media") has the same structure, but has a series of round indicators as well. It's under <section class="slider-block" .../>
 *
 * <ol class="itc-slider__indicators">
 *   <li class="itc-slider__indicator itc-slider__indicator_active" .../>
 *   <li class="itc-slider__indicator itc-slider__indicator_active" .../>
 *   <li class="itc-slider__indicator itc-slider__indicator_active" .../>
 *   <li class="itc-slider__indicator" .../>
 *   <li class="itc-slider__indicator" .../>
 *   <li class="itc-slider__indicator" .../>
 * </ol>
 *
 * It also has a different item structure, instead of itc-slider__item-in-news-wrp...
 * <div class="item-media">
 *   <div class="item-media-content">
 *     <div class="slider-item-body">
 * ...and so on.
 *
 * SEGM on Twitter has the same structure, with the indicators.
 * The content classes are "twitter-item views-row", "item-twitter", "item-twitter-content", "slider-item-body", "twitter-tweet twitter-tweet-rendered"...
 *
 * A note when reading CSS below: 
 * .aselector.likethis requires both in one object, e.g. <div class="aselector likethis">
 * .aselector .likethis means a parent and a child, e.g. <div class="aselector"><div class="likethis"></div></div>
 *
 * The main issue here is that... well, itc-slider is defined in a million different places.
 *