
.ditty-slider {
	display: flex;
	flex-direction: column;
	position: relative;
	width: 100%;
}

.ditty-slider, .ditty-slider * {
	box-sizing: border-box;
}

.ditty-slider__contents {
	order: 1;
	position: relative;
	width: 100%;
}

.ditty-slider__contents:hover .ditty-slider__arrows {
	opacity: 1;
}

.ditty-slider__slides {
	overflow: hidden;
	position: relative;
}

.ditty-slider__slide {
	display: none;
	line-height: 1;
	position: absolute;
	width: 100%;
}

.ditty-slider__bullets {
	align-items: center;
	display: flex;
	flex-direction: row;
	justify-content: center;
	order: 2;
	width: 100%;
}

.ditty-slider__bullet {
	background: #ccc;
	border-radius: 50%;
	display: block;
	flex: 0 0 auto;
	height: 10px;
	margin: 0 1px;
	position: relative;
	transition: background-color .25s ease;
	width: 10px;
	z-index: 9999;
}

.ditty-slider__bullet--active {
	background: #000;
}

.ditty-slider__arrows {
	align-items: center;
	display: flex;
	flex-direction: row;
	height: 100%;
	justify-content: space-between;
	left: 0;
	opacity: 0;
	order: 3;
	position: absolute;
	top: 0;
	transition: opacity .25s ease;
	width: 100%;
}

.ditty-slider__arrows--static {
	opacity: 1;
}

.ditty-slider__next, .ditty-slider__prev {
	align-items: center;
	background: hsla(0, 0%, 100%, .3);
	border-radius: 50%;
	color: #32373c;
	display: flex;
	flex-direction: row;
	height: 30px;
	justify-content: center;
	line-height: 0;
	position: relative;
	text-decoration: none;
	width: 30px;
	z-index: 9999;
}

.ditty-slider__next i, .ditty-slider__prev i {
	display: block;
	line-height: 0;
	vertical-align: middle;
}

.ditty-slider__next:focus, .ditty-slider__prev:focus {
	box-shadow: none;
	outline: none;
}

.ditty {
	display: flex;
	flex: 1;
	flex-direction: row;
	flex-wrap: wrap;
	position: relative;
	width: 100%;
}

.ditty, .ditty * {
	box-sizing: border-box;
}

.ditty__contents, .ditty__title, .ditty__title .ditty__title__contents {
	display: flex;
	flex-direction: row;
}

.ditty__contents {
	align-content: flex-start;
	flex-wrap: wrap;
	justify-content: flex-start;
	width: 100%;
}

.ditty__items {
	overflow: hidden;
	position: relative;
	width: 100%;
}

.ditty[data-title=bottom]>.ditty__title, .ditty[data-title=top]>.ditty__title {
	width: 100%;
}

.ditty[data-title=bottom][data-title_vertical_position=start]>.ditty__title .ditty__title__contents, .ditty[data-title=top][data-title_vertical_position=start]>.ditty__title .ditty__title__contents {
	align-items: flex-start;
}

.ditty[data-title=bottom][data-title_vertical_position=center]>.ditty__title .ditty__title__contents, .ditty[data-title=top][data-title_vertical_position=center]>.ditty__title .ditty__title__contents {
	align-items: center;
}

.ditty[data-title=bottom][data-title_vertical_position=end]>.ditty__title .ditty__title__contents, .ditty[data-title=top][data-title_vertical_position=end]>.ditty__title .ditty__title__contents {
	align-items: flex-end;
}

.ditty[data-title=bottom]>.ditty__title {
	order: 1;
}

.ditty[data-title=bottom]>.ditty__contents {
	order: 0;
}

.ditty[data-title=left], .ditty[data-title=right] {
	align-items: stretch;
	flex-direction: row;
	flex-wrap: nowrap;
}

.ditty[data-title=left]>.ditty__title, .ditty[data-title=right]>.ditty__title {
	flex: 0 0 auto;
}

.ditty[data-title=left]>.ditty__title .ditty__title__contents, .ditty[data-title=right]>.ditty__title .ditty__title__contents {
	display: flex;
	flex-direction: row;
	height: 100%;
}

.ditty[data-title=left][data-title=right]>.ditty__title, .ditty[data-title=right][data-title=right]>.ditty__title {
	order: 1;
}

.ditty[data-title=left][data-title=right]>.ditty__contents, .ditty[data-title=right][data-title=right]>.ditty__contents {
	order: 0;
}

.ditty[data-title=left][data-title_vertical_position=start]>.ditty__title .ditty__title__contents, .ditty[data-title=right][data-title_vertical_position=start]>.ditty__title .ditty__title__contents {
	align-items: flex-start;
}

.ditty[data-title=left][data-title_vertical_position=center]>.ditty__title .ditty__title__contents, .ditty[data-title=right][data-title_vertical_position=center]>.ditty__title .ditty__title__contents {
	align-items: center;
}

.ditty[data-title=left][data-title_vertical_position=end]>.ditty__title .ditty__title__contents, .ditty[data-title=right][data-title_vertical_position=end]>.ditty__title .ditty__title__contents {
	align-items: flex-end;
}

.ditty[data-title_position=start]>.ditty__title {
	align-items: flex-start;
	justify-content: flex-start;
}

.ditty[data-title_position=center]>.ditty__title {
	align-items: center;
	justify-content: center;
}

.ditty[data-title_position=end]>.ditty__title {
	align-items: flex-end;
	justify-content: flex-end;
}

.ditty[data-title_horizontal_position=start]>.ditty__title .ditty__title__contents {
	align-items: flex-start;
	height: 100%;
	justify-content: flex-start;
}

.ditty[data-title_horizontal_position=center]>.ditty__title .ditty__title__contents {
	align-items: center;
	justify-content: center;
}

.ditty[data-title_horizontal_position=end]>.ditty__title .ditty__title__contents {
	align-items: flex-end;
	justify-content: flex-end;
}

.ditty__edit-links {
	align-items: center;
	background: hsla(0, 0%, 100%, .5);
	border-radius: 25px;
	box-shadow: 0 0 4px rgba(0, 0, 0, .2);
	display: flex;
	flex-wrap: nowrap;
	gap: 10px;
	height: 35px;
	left: 5px;
	max-width: 35px;
	overflow: hidden;
	padding: 10px;
	position: absolute;
	top: 5px;
	transition: all .25s ease;
	z-index: 99999;
}

.ditty__edit-links:hover {
	max-width: 200px;
}

.ditty__edit-links svg {
	display: block;
	flex: 0 0 auto;
	width: 15px;
	fill: #19bf7c;
}

.ditty__edit-links a {
	flex: 0 0 auto;
	font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Helvetica Neue, sans-serif;
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}

.ditty__edit-links a:hover {
	text-decoration: underline;
}

.ditty-item__elements {
	box-sizing: border-box;
	max-width: 100%;
	overflow: hidden;
}

.ditty-item__elements * {
	box-sizing: border-box;
}

.ditty-item__elements img {
	height: auto;
	max-width: 100%;
}

.ditty-item__wrapper {
	overflow: hidden;
	position: relative;
}

.ditty-item__icon {
	display: block;
	height: auto;
	line-height: 0;
	width: 1em;
}

.ditty-item__media img, .ditty-item__media video {
	display: block;
	line-height: 0;
	max-width: 100%;
}

.ditty-ticker__items {
	overflow: hidden;
	position: relative;
	width: 100%;
}

.ditty-ticker .ditty-item {
	display: none;
	line-height: 1;
	position: absolute;
}

.ditty-ticker .ditty-item__elements {
	-moz-text-size-adjust: 100%;
	text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

.ditty-ticker .ditty-playPause {
	all: unset;
	align-items: center;
	background: hsla(0, 0%, 100%, .3);
	border-radius: 50%;
	color: #32373c;
	cursor: pointer;
	display: flex;
	flex-direction: row;
	height: 30px;
	justify-content: center;
	line-height: 0;
	position: relative;
	text-decoration: none;
	width: 30px;
	z-index: 9999;
}

.ditty-ticker .ditty-playPause svg {
	color: currentColor;
	height: 15px;
	width: 15px;
}

.ditty-list {
	position: relative;
}

.ditty-list, .ditty-list * {
	box-sizing: border-box;
}

.ditty-list .ditty-item {
	display: block;
	max-width: 100%;
	position: relative;
}
