.atlas-style-section {
	color: hsl(210, 0%, 35%);
	margin: 20px 0 60px;
	position: relative;
}
.atlas-style-section__title {
	font-family: "Arial", "FreeSans", sans-serif;
	font-size: 25px;
	font-weight: bold;
	letter-spacing: -0.04em;
	margin-bottom: 40px;
}

.atlas-style-columns {
	display: flex;
	flex-wrap: wrap;
}
.atlas-style-columns__item {
	margin-bottom: 20px;
}
.atlas-style-columns__item._bottom {
	align-self: flex-end;
}
.atlas-style-columns._span6 .atlas-style-columns__item {
	width: 16.6666666667%;
}
.atlas-style-columns._span3 .atlas-style-columns__item {
	min-width: 33.3333333333%;
	width: 33.3333333333%;
}
.atlas-style-columns._box {
	align-items: flex-end;
}
.atlas-style-columns._box .atlas-style-columns__item {
	margin: 1px;
}

.atlas-style-palette {
	font-family: "Arial", "FreeSans", sans-serif;
	text-align: center;
}
.atlas-style-palette__swatch {
	width: 100%;
}
.atlas-style-palette__text {
	font-size: 32px;
}
.atlas-style-palette__caption {
	font-family: "Consolas", "Monaco", "Andale Mono", "Ubuntu Mono", monospace;
	font-size: 11px;
}

.atlas-style-scale {
	align-items: center;
	display: flex;
	justify-content: space-between;
	margin-bottom: 0.5em;
	width: 100%;
}
.atlas-style-scale__text {
	line-height: 1.2;
	overflow: hidden;
	position: relative;
}
.atlas-style-scale__text-content {
	overflow: hidden;
	text-indent: 70px;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%;
}
.atlas-style-scale__text-content::after {
	content: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris.";
}
.atlas-style-scale__name {
	font-family: "Consolas", "Monaco", "Andale Mono", "Ubuntu Mono", monospace;
	font-size: 11px;
	min-width: 200px;
	padding-left: 20px;
	width: 200px;
}

.atlas-style-font {
	margin-right: 20px;
}
.atlas-style-font__caption {
	border-top: 1px solid hsl(0, 0%, 70%);
	display: flex;
	font-family: "Consolas", "Monaco", "Andale Mono", "Ubuntu Mono", monospace;
	font-size: 11px;
	margin-top: 10px;
	padding-top: 10px;
}
.atlas-style-font__name {
	margin-bottom: 10px;
	margin-right: 10px;
	white-space: nowrap;
}
.atlas-style-font__name::after {
	content: ":";
}
.atlas-style-font__example._logo {
	font-size: 64px;
	line-height: 1;
}
.atlas-style-font__example._logo::before {
	content: "Aa";
}
.atlas-style-font__example._characters {
	overflow: hidden;
	white-space: nowrap;
}
.atlas-style-font__example._characters::before {
	content: "a b c d e f g h i j k l m n o p q r s t u v w x y z";
}
.atlas-style-font__example._characters-capital {
	overflow: hidden;
	white-space: nowrap;
}
.atlas-style-font__example._characters-capital::before {
	content: "A B C D E F G H I J K L M N O P Q R S T U V W X Y Z";
}
.atlas-style-font__example._digits::before {
	content: "1 2 3 4 5 6 7 8 9 0";
}

.atlas-style-layer {
	padding-bottom: 100%;
	position: relative;
	width: 100%;
}
.atlas-style-layer__box {
	align-items: center;
	display: flex;
	font-family: "Consolas", "Monaco", "Andale Mono", "Ubuntu Mono", monospace;
	font-size: 11px;
	height: 100%;
	justify-content: center;
	position: absolute;
	text-align: center;
	width: 100%;
}

.atlas-style-motion {
	display: flex;
}
.atlas-style-motion__caption {
	font-family: "Consolas", "Monaco", "Andale Mono", "Ubuntu Mono", monospace;
	font-size: 11px;
	line-height: 20px;
	min-width: 200px;
	width: 200px;
}
.atlas-style-motion__frame {
	height: 20px;
	position: relative;
	width: 100%;
}
.atlas-style-motion__ball {
	animation-play-state: paused !important; /* stylelint-disable-line */
	background-color: #263740;
	border-radius: 100%;
	height: 10px;
	left: 0;
	position: absolute;
	top: 0;
	transform: translateY(50%);
	width: 10px;
}
.atlas-style-motion:hover .atlas-style-motion__ball {
	animation-play-state: initial !important; /* stylelint-disable-line */
}

@keyframes atlas-transition-example {
	0% {
		left: 0;
	}
	100% {
		left: 100%;
	}
}
.atlas-style-space {
	margin: 40px 0;
}
.atlas-style-space__text {
	background-color: hsl(213, 66%, 79%);
	color: hsl(213, 66%, 79%);
}
.atlas-style-space__name {
	left: 0;
	position: absolute;
	right: 0;
	text-align: center;
}
.atlas-style-space__spacer {
	background-color: #e6effa;
	font-family: "Consolas", "Monaco", "Andale Mono", "Ubuntu Mono", monospace;
	font-size: 11px;
	position: relative;
	text-align: center;
}
.atlas-style-space._vertical {
	display: flex;
	overflow: hidden;
	overflow-x: auto;
}
.atlas-style-space._vertical .atlas-style-space__item {
	display: flex;
	text-align: justify;
}
.atlas-style-space._vertical .atlas-style-space__name {
	padding-left: 10px;
	transform: rotate(90deg);
	white-space: nowrap;
}

.atlas-style-space-ruler {
	border-style: solid solid solid none;
	border-width: 1px;
	bottom: 0;
	box-sizing: border-box;
	color: deeppink;
	font-family: "Consolas", "Monaco", "Andale Mono", "Ubuntu Mono", monospace;
	font-size: 11px;
	margin-left: 5px;
	padding-right: 5px;
	position: absolute;
	right: 0;
	top: 0;
	width: 0;
}
.atlas-style-space-ruler span {
	display: block;
	position: absolute;
	right: 13px;
}
.atlas-style-space-ruler._bottom {
	border-style: none solid solid;
	height: 5px;
	left: 0;
	margin: 0;
	padding: 0;
	right: 0;
	top: initial;
	width: 100%;
}
.atlas-style-space-ruler._bottom span {
	display: block;
	position: absolute;
	right: 0;
	top: 13px;
}
.atlas-style-space-ruler._left {
	border-style: solid none solid solid;
	left: 60px;
	right: initial;
}
.atlas-style-space-ruler._left span {
	display: block;
	position: absolute;
	right: 15px;
}
.atlas-style-space-ruler._middle {
	right: 50%;
}

.atlas-style-box {
	background-color: #e6effa;
	box-sizing: border-box;
	position: relative;
}
.atlas-style-box__inner {
	align-items: center;
	background-color: hsl(0, 0%, 100%);
	box-sizing: border-box;
	display: flex;
	font-family: "Consolas", "Monaco", "Andale Mono", "Ubuntu Mono", monospace;
	font-size: 11px;
	height: 100px;
	text-align: center;
	width: 100px;
}

.atlas-style-breaks {
	display: flex;
	font-family: "Consolas", "Monaco", "Andale Mono", "Ubuntu Mono", monospace;
	font-size: 11px;
	margin-bottom: 40px;
}
.atlas-style-breaks__item {
	align-items: center;
	counter-increment: breaks;
	display: flex;
}
.atlas-style-breaks__item::before {
	color: #263740;
	content: counter(breaks);
	display: inline-block;
	font-family: "Arial", "FreeSans", sans-serif;
	font-size: 35px;
	padding-right: 10px;
}
.atlas-style-breaks__item-inner {
	padding-right: 40px;
}
.atlas-style-breaks-graph .atlas-tick-breaks line {
	stroke: deeppink;
	stroke-width: 2px;
}
.atlas-style-breaks-graph .atlas-tick-breaks text {
	fill: deeppink;
	font-family: "Consolas", "Monaco", "Andale Mono", "Ubuntu Mono", monospace;
	font-size: 11px;
}
.atlas-style-breaks-graph .atlas-tick-lines line {
	stroke: hsl(0, 0%, 80%);
}
.atlas-style-breaks-graph .atlas-tick-hints line {
	stroke: hsl(0, 0%, 80%);
}
.atlas-style-breaks-graph .atlas-tick-hints text {
	fill: #263740;
	font-family: "Consolas", "Monaco", "Andale Mono", "Ubuntu Mono", monospace;
}
/*# sourceMappingURL=dev_atlas-style.css.map */