/* Siema CSS
//--------------------------------------------------------------------- */
div.dots-container {
	text-align: center;
	padding: 7px 0;
}

div.dots-container span {
	display: inline-block;
	width: 26px;
	height: 26px;
	position: relative;
	cursor: pointer;
}

div.dots-container span::after {
	content: '';
	display: block;
	width: 12px;
	height: 12px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	border-radius: 50%;
	border: 2px solid var(--color-gris-azulado-claro);
}

div.dots-container span:hover::after { background: var(--color-gris-azulado-claro); }

div.dots-container span.active::after {
	background: var(--color-teal);
	border-color: var(--color-teal);
}