
.dark-mode {
	background-color: var(--darkColor);
	background-color: rgba(10, 20, 30, .75);
	background-color: rgba(10, 14, 18, .65);
	background-color: rgb(28, 33, 38);
	background-color: rgb(15, 20, 25);
}
.dark-mode * {
	color: var(--darkText);
	fill: var(--darkText);
	color: #F2F1EA;
	color: rgb(220, 220, 205);
	color: rgb(235, 235, 220);
	fill: rgb(235, 235, 220) !important;
}
.About .header-logo svg path,
.Words .header-logo svg path,
.Log .header-logo svg path,
.LSlug .header-logo svg path,
.Slug .header-logo svg path {fill:  rgb(220, 220, 205) !important;}

.l-section-head h1 {
	font-size: 2.0rem;
	margin-left: -.095px;
	letter-spacing: .025em;
}
.l-section-head h2 {
	margin-top: .25rem;
	margin-left: .6px;
	opacity: .5;
}

.half {opacity: .5;}

.l-word {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 0 1rem 2rem 0;
}
.l-word .l-line {
	margin-left: calc(-1 * var(--padding));
    margin-bottom: 2.2rem;
}
.l-word .left {width: 75%;}
.l-word .right {
	display: flex;
    align-items: flex-end;
	margin-bottom: -0.5rem;
}
.l-word .date {margin-bottom: .8rem;}

@media screen and (min-width: 720px) {

	.l-section-head h1 {margin-left: -3px;}
	.l-section-head h2 {
		font-size: 1.6rem;
		margin-left: 2px;
	}	
	.l-word .right {margin-bottom: 0;}
	
	.l-word .left h1 {
		width: fit-content;
		position: relative;
	}

	.l-word:hover {opacity: .65;}
	.l-word .left h1::after {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		content: '';
		display: block;
		width: 0;
		height: 1px;
		background-color: var(--backgroundColor);
		transition: 1s cubic-bezier(.6,0,0,.9);
	}
	.l-word:hover .left h1::after {
		width: 100%;
	}

}
