.grid-mq-demo {
  color: #5f5405;
}
.s-page .grid-mq-demo {
  height: 100%;
  padding-bottom: var(--base-6);
}
.theme-dark .grid-mq-demo {
  color: #625918;
}
@media screen and (min-width: 600px) {
  .grid-mq-demo {
    color: #552e02;
  }
  .theme-dark .grid-mq-demo {
    color: #5c380f;
  }
}
@media screen and (min-width: 840px) {
  .grid-mq-demo {
    color: #faecec;
  }
  .theme-dark .grid-mq-demo {
    color: #3a1515;
  }
}
@media screen and (min-width: 960px) {
  .grid-mq-demo {
    color: #faecf0;
  }
  .theme-dark .grid-mq-demo {
    color: #391521;
  }
}
@media screen and (min-width: 1280px) {
  .grid-mq-demo {
    color: #f7edf9;
  }
  .theme-dark .grid-mq-demo {
    color: #391d3d;
  }
}
@media screen and (min-width: 1800px) {
  .grid-mq-demo {
    color: #f1f6fc;
  }
  .theme-dark .grid-mq-demo {
    color: #23374e;
  }
}
.grid-mq-demo__hint {
  top: var(--base-2);
  left: var(--base-2);
}
.grid-mq-demo__title {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* @media screen and (min-width: @size-2x+1) {
		&::after {
			.iconLarge;
			content: @ui-resize-horizontal;
		}
	} */
}
.grid-mq-demo__title::after {
  background-color: #202020;
  color: #FFFFFF;
  border-radius: var(--radius);
  line-height: 1;
  padding: 4px 8px;
  font-size: 85%;
  content: "Výchozí";
  opacity: 0.8;
}
.theme-dark .grid-mq-demo__title::after {
  background-color: #202020;
}
.theme-dark .grid-mq-demo__title::after {
  color: #FFFFFF;
}
@media screen and (min-width: 600px) {
  .grid-mq-demo__title::after {
    content: "S";
  }
}
@media screen and (min-width: 840px) {
  .grid-mq-demo__title::after {
    content: "M";
  }
}
@media screen and (min-width: 960px) {
  .grid-mq-demo__title::after {
    content: "L";
  }
}
@media screen and (min-width: 1280px) {
  .grid-mq-demo__title::after {
    content: "XL";
  }
}
@media screen and (min-width: 1800px) {
  .grid-mq-demo__title::after {
    content: "XXL";
  }
}
.grid-mq-demo__content {
  height: calc(24 * var(--base));
  width: 100%;
  border-radius: var(--radius-2);
  transition: all 0.2s ease-out;
  transition: all 0.15s ease-out;
  background-color: hsl(53, 90%, 49%);
}
.s-page .grid-mq-demo__content {
  height: 100%;
}
.grid-mq-demo__content:active {
  transition-duration: 0.1s;
}
.theme-dark .grid-mq-demo__content {
  background-color: hsl(53, 90%, 60%);
}
@media screen and (min-width: 600px) {
  .grid-mq-demo__content {
    background-color: hsl(32, 95%, 50%);
  }
  .theme-dark .grid-mq-demo__content {
    background-color: hsl(32, 95%, 57%);
  }
}
@media screen and (min-width: 840px) {
  .grid-mq-demo__content {
    background-color: hsl(0, 65%, 48%);
  }
  .theme-dark .grid-mq-demo__content {
    background-color: hsl(0, 78%, 62%);
  }
}
@media screen and (min-width: 960px) {
  .grid-mq-demo__content {
    background-color: hsl(340, 66%, 47%);
  }
  .theme-dark .grid-mq-demo__content {
    background-color: hsl(340, 72%, 61%);
  }
}
@media screen and (min-width: 1280px) {
  .grid-mq-demo__content {
    background-color: hsl(293, 52%, 48%);
  }
  .theme-dark .grid-mq-demo__content {
    background-color: hsl(293, 61%, 63%);
  }
}
@media screen and (min-width: 1800px) {
  .grid-mq-demo__content {
    background-color: hsl(212, 76%, 46%);
  }
  .theme-dark .grid-mq-demo__content {
    background-color: hsl(212, 72%, 65%);
  }
}
.breakpoint-table {
  font-size: 16px;
}
.breakpoint-table .card-header > * {
  font-weight: 500;
}
.breakpoint-table .card-body {
  padding-right: 0;
}

/*# sourceMappingURL=docs-responsive.css.map */