/*#kommentform {
  display: grid;
  grid-template-columns: 100%;
  grid-template-areas: "quote" "replyHandle" "komment" "email" "author" "authorsite" "privacy" "button" "tweet";
  grid-column-gap: 10px;
  grid-row-gap: 10px;
}
#kommentform .replyHandleDisplay {
  grid-area: replyHandle;
}
*/
#kommentform #url {
	position: relative;
	left: -200vw;
	height: 0;
}
/*
#kommentform input[name=email] {
  grid-area: email;
}
#kommentform input[name=author] {
  grid-area: author;
}
#kommentform input[type=url] {
  grid-area: authorsite;
}
#kommentform input[type=submit] {
  grid-area: button;
}
#kommentform .share {
  grid-area: tweet;
  align-self: start;
}
#kommentform textarea {
  grid-area: komment;
  width: 100%;
}
#kommentform .visible-quote {
  grid-area: quote;
}
*/
#kommentform .visible-quote.hidden {
	display: none;
}
/*
#kommentform .komment-privacy {
  grid-area: privacy;
  font-size: smaller;
}
#kommentform.spam-indicator {
  grid-area: spamindicator;
  width: 100%;
}
*/
#kommentform .progress {
	transition: width 1s, background 2s, height 0.2s;
	transition-timing-function: linear;
	display: inline-block;
	width: 0%;
	height: 5px;
	background: red;
}
#kommentform .progress.orange {
	background: orange;
}
#kommentform .progress.yellow {
	background: yellowgreen;
}
#kommentform .progress.green {
	background: green;
}
#kommentform .progress.done {
	background: green;
	height: 0;
}
#kommentform .form-feedback {
	padding: 10px;
}
#kommentform .form-feedback.error {
	background: orange;
	color: white;
}
#kommentform .form-feedback.moderation-note {
	background: green;
	color: white;
}
#kommentform .lds-ellipsis {
	display: inline-block;
	position: relative;
	width: 80px;
	height: 80px;
}
#kommentform .lds-ellipsis div {
	position: absolute;
	top: 33px;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	background: #fff;
	animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

#kommentform .sk-cube-grid {
	width: 40px;
	height: 40px;
	margin: 0 auto;
}
#kommentform .loading-invisible {
	display: none;
}
#kommentform .sk-cube-grid .sk-cube {
	width: 33%;
	height: 33%;
	background-color: var(--color-card-text);
	float: left;
	-webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
	animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
}
#kommentform .sk-cube-grid .sk-cube1 {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}
#kommentform .sk-cube-grid .sk-cube2 {
	-webkit-animation-delay: 0.3s;
	animation-delay: 0.3s;
}
#kommentform .sk-cube-grid .sk-cube3 {
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;
}
#kommentform .sk-cube-grid .sk-cube4 {
	-webkit-animation-delay: 0.1s;
	animation-delay: 0.1s;
}
#kommentform .sk-cube-grid .sk-cube5 {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}
#kommentform .sk-cube-grid .sk-cube6 {
	-webkit-animation-delay: 0.3s;
	animation-delay: 0.3s;
}
#kommentform .sk-cube-grid .sk-cube7 {
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}
#kommentform .sk-cube-grid .sk-cube8 {
	-webkit-animation-delay: 0.1s;
	animation-delay: 0.1s;
}
#kommentform .sk-cube-grid .sk-cube9 {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}

#kommentsWebmentions .single-komment {
	display: grid;
	width: calc(100% - (var(--padding) * 2));
	grid-template-columns: min-content 40px 1fr min-content;
	grid-template-areas: "icon avatar avatar date" "icon nothing content content";
	gap: calc(var(--padding) / 2);

	@media (max-width: 400px) {
		grid-template-columns: min-content 40px 1fr;
		grid-template-areas: "icon avatar avatar" "icon date date" "icon content content";
	}

	&:not(:last-child) {
		margin-bottom: var(--padding);
	}
}
#kommentsWebmentions .type-of {
	grid-area: icon;
	line-height: 40px;
}
#kommentsWebmentions .author-avatar {
	grid-area: avatar;
	position: relative;
	font-weight: bold;
}
#kommentsWebmentions .author-avatar img {
	max-width: 40px;
	border-radius: 3px;
	vertical-align: middle;
	margin-right: calc(var(--padding) / 2);
}

#kommentsWebmentions .date {
	grid-area: date;
	@media (min-width: 600px) {
		white-space: nowrap;
	}
}

#kommentsWebmentions .author-action {
	grid-area: action;
	line-height: 40px;
	font-weight: bold;
	& span {
		font-size: 0.8em;
	}
}
#kommentsWebmentions .mention-content {
	grid-area: content;
	padding-bottom: 20px;
}
#kommentsWebmentions .komment-text {
	padding: 20;
	line-height: 1.5;
}

.splitted-komments .list-reposts,
.splitted-komments .list-mentions,
.splitted-komments .list-likes {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(30px, 60px));
	grid-column-gap: 10px;
	grid-row-gap: 10px;
}
/*
.splitted-komments .single-komment {
  display: block;
}
.splitted-komments .single-komment .author-avatar img {
  max-width: 60px;
}
.splitted-komments .single-komment .author-action,
.splitted-komments .single-komment .type-of {
  display: none;
}
*/
.splitted-komments .list-replies {
	list-style-type: none;
	padding-left: 0;
	margin-left: 0;
	& ul {
		margin-left: 0;
		border-left: var(--padding) solid var(--lt-color-overlay-transparent);
		& li {
			padding-left: calc(var(--padding) * 2);
		}
	}
}
.splitted-komments .list-replies .single-komment .author-action,
.splitted-komments .list-replies .single-komment .type-of {
	display: block;
}
.splitted-komments .kommentReply {
	display: block;
	float: right;
}

@-webkit-keyframes sk-cubeGridScaleDelay {
	0%,
	70%,
	100% {
		-webkit-transform: scale3D(1, 1, 1);
		transform: scale3D(1, 1, 1);
	}
	35% {
		-webkit-transform: scale3D(0, 0, 1);
		transform: scale3D(0, 0, 1);
	}
}
@keyframes sk-cubeGridScaleDelay {
	0%,
	70%,
	100% {
		-webkit-transform: scale3D(1, 1, 1);
		transform: scale3D(1, 1, 1);
	}
	35% {
		-webkit-transform: scale3D(0, 0, 1);
		transform: scale3D(0, 0, 1);
	}
}