@import url(//fonts.googleapis.com/css?family=Open+Sans:400,700);
.Tooltip {
  position: relative;
}
.Tooltip__text::before {
  position: absolute;
  content: "";
}
BODY.light .Tooltip__text::before {
  background-color: rgba(246, 246, 234, 0.5);
  border-color: #e6e600;
}
BODY.dark .Tooltip__text::before {
  background-color: rgba(60, 60, 48, 0.5);
  border-color: #808000;
}
.Tooltip--inline {
  margin: 0 0.25em;
}
.Tooltip--inline .Tooltip__text {
  display: inline-block;
  min-width: 0.85em;
  text-align: center;
}
.Tooltip--inline .Tooltip__text::before {
  top: -0.25em;
  right: -0.25em;
  bottom: -0.25em;
  left: -0.25em;
  border: 1px solid;
  border-radius: 3px;
}
.Tooltip--block .Tooltip__text::before {
  z-index: 2;
  content: "?";
  left: 50%;
  bottom: -0.75em;
  width: 1.4em;
  border: 2px solid;
  border-radius: 50%;
  text-align: center;
  font-weight: bold;
}
BODY.light .Tooltip--block .Tooltip__text::before {
  background-color: #f6f6ea;
}
BODY.dark .Tooltip--block .Tooltip__text::before {
  background-color: #3c3c30;
}
.Tooltip--block .Tooltip__box {
  z-index: 3;
}
.Tooltip__textInner {
  position: relative;
  z-index: 1;
}
.Tooltip__textInner:empty::after {
  content: "?";
}
.Tooltip__box {
  display: none;
  border: 1px solid;
  padding: 1em;
  border-radius: 5px;
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0.5em;
  flex-direction: column;
  min-width: 200px;
  min-height: 50px;
  word-wrap: break-word;
}
div > .Tooltip__box {
  left: 50%;
  transform: translateX(-50%);
}
BODY.light .Tooltip__box {
  border-color: #e4e4e6;
  box-shadow: 2px 2px 5px #e4e4e6;
}
BODY.dark .Tooltip__box {
  border-color: #49494b;
  box-shadow: 2px 2px 5px #49494b;
}
BODY.light .Tooltip__box {
  background-color: #fffff2;
}
BODY.dark .Tooltip__box {
  background-color: #42422e;
}
.Tooltip__title {
  font-weight: 600;
}
.Tooltip:hover .Tooltip__box {
  display: flex;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.Hint {
  margin: 0 -0.25em 1.5em -0.25em;
  border: 1px solid;
  border-radius: 0.5em;
}
BODY.light .Hint {
  border-color: rgba(228, 228, 230, 0.25);
  background-color: white;
  box-shadow: -1px 1px 2px #e4e4e6;
}
BODY.dark .Hint {
  border-color: rgba(73, 73, 75, 0.25);
  background-color: #353535;
  box-shadow: -1px 1px 2px #49494b;
}
.Hint__title {
  padding: 0.5em 0.375em;
  color: #d45298;
  cursor: pointer;
}
.Hint__title::after {
  margin-left: 0.25em;
  content: "";
  background-position: -5px -33px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: inline-block;
  width: 15px;
  height: 11px;
}
.Hint__title--opened::after {
  background-position: -5px -96px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: inline-block;
  width: 15px;
  height: 11px;
}
.Hint__content {
  display: none;
  padding: 0 0.5em;
}
.Hint__content::before {
  content: "";
  display: block;
  margin: 0 -0.125em;
  border-top: 1px solid;
  margin-bottom: 1.5em;
}
BODY.light .Hint__content::before {
  border-top-color: #e4e4e6;
  box-shadow: 0 1px 2px #e4e4e6;
}
BODY.dark .Hint__content::before {
  border-top-color: #49494b;
  box-shadow: 0 1px 2px #49494b;
}
.Hint__content--opened {
  display: block;
}

.BlockMathSizer--not-sized * {
  visibility: hidden;
}

div.Histogram {
  display: flex;
  justify-content: center;
}
@media only screen and (max-width: 1280px) {
  div.Histogram {
    justify-content: flex-start;
  }
}
div.Histogram svg.Histogram {
  flex: 0 0 500px;
}
div.HistogramConf {
  margin-top: 30px;
  white-space: nowrap;
  text-align: left;
}
div.HistogramConf div + div {
  margin-top: 0.5em;
}
div.HistogramConf input[type=checkbox] {
  position: relative;
  top: 0.1em;
}
div.HistogramConf select {
  height: auto;
  padding: 0.25em;
}
BODY.light div.HistogramConf select {
  border: 1px solid #e4e4e6;
  background-color: white;
  color: #4d4d4d;
}
BODY.dark div.HistogramConf select {
  border: 1px solid #49494b;
  background-color: #353535;
  color: #bcbcbc;
}
div.HistogramConf select:focus {
  border-color: transparent;
}
svg.Histogram text {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
BODY.light svg.Histogram {
  fill: #4d4d4d;
}
BODY.light svg.Histogram .grid .tick line {
  stroke: #999999;
  stroke-opacity: 0.5;
}
BODY.light svg.Histogram .grid .domain {
  stroke: #999999;
  stroke-opacity: 0.5;
}
BODY.light svg.Histogram .axis .domain {
  stroke: white;
}
BODY.light svg.Histogram .axis .tick line {
  stroke: #999999;
}
BODY.light svg.Histogram .axis .tick text {
  fill: #4d4d4d;
}
BODY.light svg.Histogram .bar {
  fill: #d7e8af;
  stroke: #99c633;
}
BODY.light svg.Histogram .label {
  fill: #4d4d4d;
  font-weight: bold;
}
BODY.light svg.Histogram .parameterLine.median {
  fill: #ffa800;
}
BODY.light svg.Histogram .parameterLine.mean {
  fill: #10b4f2;
}
BODY.light svg.Histogram .parameterLine.mode {
  fill: #e2318b;
}
BODY.light svg.Histogram .draggableParameterLine {
  cursor: move;
}
BODY.light svg.Histogram .draggableParameterBox {
  cursor: move;
  fill: white;
  fill-opacity: 0.01;
}
BODY.dark svg.Histogram {
  fill: #bcbcbc;
}
BODY.dark svg.Histogram .grid .tick line {
  stroke: #999999;
  stroke-opacity: 0.5;
}
BODY.dark svg.Histogram .grid .domain {
  stroke: #999999;
  stroke-opacity: 0.5;
}
BODY.dark svg.Histogram .axis .domain {
  stroke: #353535;
}
BODY.dark svg.Histogram .axis .tick line {
  stroke: #999999;
}
BODY.dark svg.Histogram .axis .tick text {
  fill: #bcbcbc;
}
BODY.dark svg.Histogram .bar {
  fill: #d7e8af;
  stroke: #99c633;
}
BODY.dark svg.Histogram .label {
  fill: #bcbcbc;
  font-weight: bold;
}
BODY.dark svg.Histogram .parameterLine.median {
  fill: #ffa800;
}
BODY.dark svg.Histogram .parameterLine.mean {
  fill: #10b4f2;
}
BODY.dark svg.Histogram .parameterLine.mode {
  fill: #e2318b;
}
BODY.dark svg.Histogram .draggableParameterLine {
  cursor: move;
}
BODY.dark svg.Histogram .draggableParameterBox {
  cursor: move;
  fill: #353535;
  fill-opacity: 0.01;
}
BODY.light svg.Histogram .parameterLabelBox,
BODY.light svg.Histogram .draggableParameterLabelBox {
  fill: white;
  fill-opacity: 0.5;
  stroke: #4d4d4d;
  stroke-opacity: 0.25;
}
BODY.dark svg.Histogram .parameterLabel,
BODY.dark svg.Histogram .draggableParameterLabel {
  fill: white;
}
BODY.dark svg.Histogram .parameterLabelBox,
BODY.dark svg.Histogram .draggableParameterLabelBox {
  fill: #353535;
  fill-opacity: 0.5;
  stroke: #bcbcbc;
  stroke-opacity: 0.5;
}

.FilesTab {
  line-height: 18px;
  font-size: 15px;
}
.FilesTab ul {
  margin: 0;
  padding: 0;
}
.FilesTab__file {
  position: relative;
}
.FilesTab__file > code {
  padding-left: 1.5em;
  white-space: nowrap;
  background: url(/img/exercise/files-tree/el.gif) no-repeat;
}
.FilesTab__file:last-child > code {
  background-image: url(/img/exercise/files-tree/el_last.gif);
}
.FilesTab__main-directory > code {
  padding-left: 1.5em;
  white-space: nowrap;
  background: url(/img/exercise/files-tree/folder.png) 0 100% no-repeat;
}

/* BASICS */
.CodeMirror {
  /* Set height, width, borders, and global font properties here */
  font-family: monospace;
  height: 300px;
  color: black;
  direction: ltr;
}
/* PADDING */
.CodeMirror-lines {
  padding: 4px 0;
  /* Vertical padding around content */
}
.CodeMirror pre {
  padding: 0 4px;
  /* Horizontal padding of content */
}
.CodeMirror-scrollbar-filler,
.CodeMirror-gutter-filler {
  background-color: white;
  /* The little square between H and V scrollbars */
}
/* GUTTER */
.CodeMirror-gutters {
  border-right: 1px solid #ddd;
  background-color: #f7f7f7;
  white-space: nowrap;
}
.CodeMirror-linenumber {
  padding: 0 3px 0 5px;
  min-width: 20px;
  text-align: right;
  color: #999;
  white-space: nowrap;
}
.CodeMirror-guttermarker {
  color: black;
}
.CodeMirror-guttermarker-subtle {
  color: #999;
}
/* CURSOR */
.CodeMirror-cursor {
  border-left: 1px solid black;
  border-right: none;
  width: 0;
}
/* Shown when moving in bi-directional text */
.CodeMirror div.CodeMirror-secondarycursor {
  border-left: 1px solid silver;
}
.cm-fat-cursor .CodeMirror-cursor {
  width: auto;
  border: 0 !important;
  background: #7e7;
}
.cm-fat-cursor div.CodeMirror-cursors {
  z-index: 1;
}
.cm-animate-fat-cursor {
  width: auto;
  border: 0;
  -webkit-animation: blink 1.06s steps(1) infinite;
  -moz-animation: blink 1.06s steps(1) infinite;
  animation: blink 1.06s steps(1) infinite;
  background-color: #7e7;
}
@-moz-keyframes blink {
  50% {
    background-color: transparent;
  }
}
@-webkit-keyframes blink {
  50% {
    background-color: transparent;
  }
}
@keyframes blink {
  50% {
    background-color: transparent;
  }
}
/* Can style cursor different in overwrite (non-insert) mode */
.cm-tab {
  display: inline-block;
  text-decoration: inherit;
}
.CodeMirror-rulers {
  position: absolute;
  left: 0;
  right: 0;
  top: -50px;
  bottom: -20px;
  overflow: hidden;
}
.CodeMirror-ruler {
  border-left: 1px solid #ccc;
  top: 0;
  bottom: 0;
  position: absolute;
}
/* DEFAULT THEME */
.cm-s-default .cm-header {
  color: blue;
}
.cm-s-default .cm-quote {
  color: #090;
}
.cm-negative {
  color: #d44;
}
.cm-positive {
  color: #292;
}
.cm-header,
.cm-strong {
  font-weight: bold;
}
.cm-em {
  font-style: italic;
}
.cm-link {
  text-decoration: underline;
}
.cm-strikethrough {
  text-decoration: line-through;
}
.cm-s-default .cm-keyword {
  color: #708;
}
.cm-s-default .cm-atom {
  color: #219;
}
.cm-s-default .cm-number {
  color: #164;
}
.cm-s-default .cm-def {
  color: #00f;
}
.cm-s-default .cm-variable-2 {
  color: #05a;
}
.cm-s-default .cm-variable-3,
.cm-s-default .cm-type {
  color: #085;
}
.cm-s-default .cm-comment {
  color: #a50;
}
.cm-s-default .cm-string {
  color: #a11;
}
.cm-s-default .cm-string-2 {
  color: #f50;
}
.cm-s-default .cm-meta {
  color: #555;
}
.cm-s-default .cm-qualifier {
  color: #555;
}
.cm-s-default .cm-builtin {
  color: #30a;
}
.cm-s-default .cm-bracket {
  color: #997;
}
.cm-s-default .cm-tag {
  color: #170;
}
.cm-s-default .cm-attribute {
  color: #00c;
}
.cm-s-default .cm-hr {
  color: #999;
}
.cm-s-default .cm-link {
  color: #00c;
}
.cm-s-default .cm-error {
  color: #f00;
}
.cm-invalidchar {
  color: #f00;
}
.CodeMirror-composing {
  border-bottom: 2px solid;
}
/* Default styles for common addons */
div.CodeMirror span.CodeMirror-matchingbracket {
  color: #0f0;
}
div.CodeMirror span.CodeMirror-nonmatchingbracket {
  color: #f22;
}
.CodeMirror-matchingtag {
  background: rgba(255, 150, 0, 0.3);
}
.CodeMirror-activeline-background {
  background: #e8f2ff;
}
/* STOP */
/* The rest of this file contains styles related to the mechanics of
   the editor. You probably shouldn't touch them. */
.CodeMirror {
  position: relative;
  overflow: hidden;
  background: white;
}
.CodeMirror-scroll {
  overflow: scroll !important;
  /* Things will break if this is overridden */
  /* 30px is the magic margin used to hide the element's real scrollbars */
  /* See overflow: hidden in .CodeMirror */
  margin-bottom: -30px;
  margin-right: -30px;
  padding-bottom: 30px;
  height: 100%;
  outline: none;
  /* Prevent dragging from highlighting the element */
  position: relative;
}
.CodeMirror-sizer {
  position: relative;
  border-right: 30px solid transparent;
}
/* The fake, visible scrollbars. Used to force redraw during scrolling
   before actual scrolling happens, thus preventing shaking and
   flickering artifacts. */
.CodeMirror-vscrollbar,
.CodeMirror-hscrollbar,
.CodeMirror-scrollbar-filler,
.CodeMirror-gutter-filler {
  position: absolute;
  z-index: 6;
  display: none;
}
.CodeMirror-vscrollbar {
  right: 0;
  top: 0;
  overflow-x: hidden;
  overflow-y: scroll;
}
.CodeMirror-hscrollbar {
  bottom: 0;
  left: 0;
  overflow-y: hidden;
  overflow-x: scroll;
}
.CodeMirror-scrollbar-filler {
  right: 0;
  bottom: 0;
}
.CodeMirror-gutter-filler {
  left: 0;
  bottom: 0;
}
.CodeMirror-gutters {
  position: absolute;
  left: 0;
  top: 0;
  min-height: 100%;
  z-index: 3;
}
.CodeMirror-gutter {
  white-space: normal;
  height: 100%;
  display: inline-block;
  vertical-align: top;
  margin-bottom: -30px;
}
.CodeMirror-gutter-wrapper {
  position: absolute;
  z-index: 4;
  background: none !important;
  border: none !important;
}
.CodeMirror-gutter-background {
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 4;
}
.CodeMirror-gutter-elt {
  position: absolute;
  cursor: default;
  z-index: 4;
}
.CodeMirror-gutter-wrapper ::selection {
  background-color: transparent;
}
.CodeMirror-gutter-wrapper ::-moz-selection {
  background-color: transparent;
}
.CodeMirror-lines {
  cursor: text;
  min-height: 1px;
  /* prevents collapsing before first draw */
}
.CodeMirror pre {
  /* Reset some styles that the rest of the page might have set */
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  border-width: 0;
  background: transparent;
  font-family: inherit;
  font-size: inherit;
  margin: 0;
  white-space: pre;
  word-wrap: normal;
  line-height: inherit;
  color: inherit;
  z-index: 2;
  position: relative;
  overflow: visible;
  -webkit-tap-highlight-color: transparent;
  -webkit-font-variant-ligatures: contextual;
  font-variant-ligatures: contextual;
}
.CodeMirror-wrap pre {
  word-wrap: break-word;
  white-space: pre-wrap;
  word-break: normal;
}
.CodeMirror-linebackground {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 0;
}
.CodeMirror-linewidget {
  position: relative;
  z-index: 2;
  overflow: auto;
}
.CodeMirror-rtl pre {
  direction: rtl;
}
.CodeMirror-code {
  outline: none;
}
/* Force content-box sizing for the elements where we expect it */
.CodeMirror-scroll,
.CodeMirror-sizer,
.CodeMirror-gutter,
.CodeMirror-gutters,
.CodeMirror-linenumber {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.CodeMirror-measure {
  position: absolute;
  width: 100%;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}
.CodeMirror-cursor {
  position: absolute;
  pointer-events: none;
}
.CodeMirror-measure pre {
  position: static;
}
div.CodeMirror-cursors {
  visibility: hidden;
  position: relative;
  z-index: 3;
}
div.CodeMirror-dragcursors {
  visibility: visible;
}
.CodeMirror-focused div.CodeMirror-cursors {
  visibility: visible;
}
.CodeMirror-selected {
  background: #d9d9d9;
}
.CodeMirror-focused .CodeMirror-selected {
  background: #d7d4f0;
}
.CodeMirror-crosshair {
  cursor: crosshair;
}
.CodeMirror-line::selection,
.CodeMirror-line > span::selection,
.CodeMirror-line > span > span::selection {
  background: #d7d4f0;
}
.CodeMirror-line::-moz-selection,
.CodeMirror-line > span::-moz-selection,
.CodeMirror-line > span > span::-moz-selection {
  background: #d7d4f0;
}
.cm-searching {
  background-color: #ffa;
  background-color: rgba(255, 255, 0, 0.4);
}
/* Used to force a border model for a node */
.cm-force-border {
  padding-right: .1px;
}
@media print {
  /* Hide the cursor when printing */
  .CodeMirror div.CodeMirror-cursors {
    visibility: hidden;
  }
}
/* See issue #2901 */
.cm-tab-wrap-hack:after {
  content: '';
}
/* Help users use markselection to safely style text background */
span.CodeMirror-selectedtext {
  background: none;
}

.exercise-loading {
  text-align: center;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.Tabs {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  font-size: 13px;
  margin-bottom: 1em;
}
.Tabs .table-container {
  margin-bottom: 0;
}
.Tabs .table-container table {
  margin-bottom: 0;
}
.Tabs__tabs {
  font-size: 15px;
}
.Tabs__tab {
  display: inline-block;
  white-space: nowrap;
  position: relative;
  padding-right: 15px;
  line-height: 1;
  top: 3px;
  margin-right: -0.5em;
}
.Tabs__tab > SPAN {
  display: block;
  min-width: 80px;
  padding: 1em 1.5em 0.75em 2em;
  cursor: pointer;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 11px;
  text-align: center;
  border-radius: 5px 0 0 0;
}
BODY.light .Tabs__tab > SPAN {
  background-color: #f6f6f6;
  color: #969696;
}
BODY.dark .Tabs__tab > SPAN {
  background-color: #333237;
  color: #969696;
}
.Tabs__tab > SPAN > SPAN {
  position: relative;
  top: -3px;
}
.Tabs__tab.selected {
  top: 0;
  z-index: 2;
}
BODY.light .Tabs__tab.selected > SPAN {
  background-color: white;
  color: #4d4d4d;
}
BODY.dark .Tabs__tab.selected > SPAN {
  background-color: #353535;
  color: #bcbcbc;
}
.Tabs__tab.selected > SPAN > SPAN {
  top: 0;
}
.Tabs__tab::after {
  position: absolute;
  top: 0;
  right: 0;
  content: "";
  height: 0;
  width: 0;
  border-top: 2.01666667em solid transparent;
}
BODY.light .Tabs__tab::after {
  border-left: 15px solid #f6f6f6;
}
BODY.dark .Tabs__tab::after {
  border-left: 15px solid #333237;
}
BODY.light .Tabs__tab.selected::after {
  border-left-color: white;
}
BODY.dark .Tabs__tab.selected::after {
  border-left-color: #353535;
}
.Tabs__content {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  position: relative;
  z-index: 1;
  border-radius: 0 5px 5px 5px;
  padding: 12px 10px;
}
BODY.light .Tabs__content {
  background: white;
  box-shadow: 0 1px 2px 1px #e4e4e6;
}
BODY.dark .Tabs__content {
  background: #353535;
  box-shadow: 0 1px 2px 1px #49494b;
}
.Tabs__tab > span {
  text-transform: none;
}
BODY.light .Tabs__tab > span {
  background-color: #efefef;
}
BODY.dark .Tabs__tab > span {
  background-color: #404040;
}
BODY.light .Tabs__tab::after {
  border-left-color: #efefef;
}
BODY.dark .Tabs__tab::after {
  border-left-color: #404040;
}

.leaflet-container {
  height: 100%;
}

BODY.light .Result {
  color: #4d4d4d;
}
BODY.dark .Result {
  color: #bcbcbc;
}
.Result__all {
  flex: 1;
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: auto;
}
.Result__all--with-data .Result__output {
  max-height: 35%;
}
.Result__warnings p,
.Result__error p {
  margin-bottom: 0.25em;
  padding: 0.25em;
}
.Result__warnings p:last-child,
.Result__error p:last-child {
  margin-bottom: 0;
}
.Result__warnings p span,
.Result__error p span {
  padding: 0.125em 0.25em;
  font-weight: bold;
  font-size: 14px;
}
.Result__warnings {
  max-height: 100px;
  overflow: auto;
}
.Result__warnings span {
  background-color: rgba(255, 152, 0, 0.25);
  color: #ff9800;
}
.Result__error {
  white-space: pre-line;
}
.Result__error span {
  background-color: rgba(211, 80, 85, 0.3);
  color: #d35055;
}
.Result__spacer:nth-child(n+2) {
  margin: 0.75em 0 1em 0;
  border-top: 1px solid;
}
BODY.light .Result__spacer:nth-child(n+2) {
  border-top-color: #e4e4e6;
}
BODY.dark .Result__spacer:nth-child(n+2) {
  border-top-color: #49494b;
}
.Result__data {
  flex: 1;
  overflow: auto;
}
.Result__plot {
  position: relative;
  flex: 1;
}
.Result__plot img {
  position: absolute;
  max-width: 100%;
  max-height: 100%;
}
.Result__output {
  overflow: auto;
  font-size: 0.8em;
}
.Result__output pre {
  margin-top: 0;
  margin-bottom: 0.625em;
}
.Result__output pre:last-child {
  margin-bottom: 0;
}
.Result__output pre:empty {
  display: none;
}
.Result__output pre.stdout {
  color: gray;
}
.Result__output pre.stderr {
  color: #d35055;
}
.Result .CodeMirror {
  height: auto;
}

.ConsoleEditor .console-div {
  height: 45%;
}
.ConsoleEditor .divider {
  top: 45%;
}
.ConsoleEditor .result-div {
  height: 55%;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.DataSetDownload {
  margin-bottom: 1em;
}
.DataSetDownload .button {
  padding: 0.55em 0.9625em 0.48888889em 0.9625em;
}

.ColorTable__bodyInner {
  display: inline-block;
  border: 1px solid;
  padding: 2px;
}
BODY.light .ColorTable__bodyInner {
  border-color: #e4e4e6;
  background-color: white;
}
BODY.dark .ColorTable__bodyInner {
  border-color: #49494b;
  background-color: #353535;
}
.ColorTable__bodyInner td {
  padding: 0;
}
.ColorTable .color {
  margin: 2px;
  width: 15px;
  height: 15px;
  border: 1px solid;
  overflow: hidden;
  cursor: pointer;
}
BODY.light .ColorTable .color {
  border-color: #4d4d4d;
}
BODY.dark .ColorTable .color {
  border-color: #bcbcbc;
}
BODY.light .ColorTable .color:hover {
  box-shadow: 0 0 1px 2px #4d4d4d;
}
BODY.dark .ColorTable .color:hover {
  box-shadow: 0 0 1px 2px #bcbcbc;
}
.ColorTable__header {
  font-weight: bold;
  margin: 0.5em 0;
}
.ColorTable__colorCode {
  display: none;
}
.ColorTable.scales .color {
  margin: 2px 0;
  width: 24px;
  height: 12px;
  border-left-width: 0;
  border-right-width: 0;
  position: relative;
}
.ColorTable.scales .color:hover {
  z-index: 1;
}
.ColorTable.scales td:first-child .color {
  border-left-width: 1px;
}
.ColorTable.scales td:last-child .color {
  border-right-width: 1px;
}

.AnythingSet__choose select {
  height: auto;
  padding: 0.25em;
}
BODY.light .AnythingSet__choose select {
  border: 1px solid #e4e4e6;
  background-color: white;
  color: #4d4d4d;
}
BODY.dark .AnythingSet__choose select {
  border: 1px solid #49494b;
  background-color: #353535;
  color: #bcbcbc;
}
.AnythingSet__choose select:focus {
  border-color: transparent;
}

BODY.light .Result {
  color: #4d4d4d;
}
BODY.dark .Result {
  color: #bcbcbc;
}
.Result__all {
  flex: 1;
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: auto;
}
.Result__all--with-data .Result__output {
  max-height: 35%;
}
.Result__warnings p,
.Result__error p {
  margin-bottom: 0.25em;
  padding: 0.25em;
}
.Result__warnings p:last-child,
.Result__error p:last-child {
  margin-bottom: 0;
}
.Result__warnings p span,
.Result__error p span {
  padding: 0.125em 0.25em;
  font-weight: bold;
  font-size: 14px;
}
.Result__warnings {
  max-height: 100px;
  overflow: auto;
}
.Result__warnings span {
  background-color: rgba(255, 152, 0, 0.25);
  color: #ff9800;
}
.Result__error {
  white-space: pre-line;
}
.Result__error span {
  background-color: rgba(211, 80, 85, 0.3);
  color: #d35055;
}
.Result__spacer:nth-child(n+2) {
  margin: 0.75em 0 1em 0;
  border-top: 1px solid;
}
BODY.light .Result__spacer:nth-child(n+2) {
  border-top-color: #e4e4e6;
}
BODY.dark .Result__spacer:nth-child(n+2) {
  border-top-color: #49494b;
}
.Result__data {
  flex: 1;
  overflow: auto;
}
.Result__plot {
  position: relative;
  flex: 1;
}
.Result__plot img {
  position: absolute;
  max-width: 100%;
  max-height: 100%;
}
.Result__output {
  overflow: auto;
  font-size: 0.8em;
}
.Result__output pre {
  margin-top: 0;
  margin-bottom: 0.625em;
}
.Result__output pre:last-child {
  margin-bottom: 0;
}
.Result__output pre:empty {
  display: none;
}
.Result__output pre.stdout {
  color: gray;
}
.Result__output pre.stderr {
  color: #d35055;
}
.Result .CodeMirror {
  height: auto;
}

.ConsoleEditor .console-div {
  height: 45%;
}
.ConsoleEditor .divider {
  top: 45%;
}
.ConsoleEditor .result-div {
  height: 55%;
}

.codemirror-terminal-error {
  color: #f00;
}
BODY.light #codemirror-console .CodeMirror {
  color: #4d4d4d;
}
BODY.dark #codemirror-console .CodeMirror {
  color: #bcbcbc;
}

.ConsoleEditor .console-div {
  height: 45%;
}
.ConsoleEditor .divider {
  top: 45%;
}
.ConsoleEditor .result-div {
  height: 55%;
}

.DataSet table {
  width: 100%;
  border-spacing: 0;
  border-collapse: separate;
}
.DataSet th {
  padding: 0.5em 1em;
  font-weight: normal;
  font-size: 0.9375em;
  text-align: left;
}
BODY.light .DataSet th {
  background-color: white;
}
BODY.dark .DataSet th {
  background-color: #353535;
}
BODY.light .DataSet th {
  border-bottom: 2px solid rgba(0, 0, 0, 0.075);
}
BODY.dark .DataSet th {
  border-bottom: 2px solid rgba(255, 255, 255, 0.075);
}
.DataSet td {
  padding: 0.5em 1em;
}
BODY.light .DataSet td {
  border-bottom: 1px solid rgba(0, 0, 0, 0.075);
}
BODY.dark .DataSet td {
  border-bottom: 1px solid rgba(255, 255, 255, 0.075);
}
.DataSet tr:last-child td {
  border-bottom: 0;
}

BODY.light .Result {
  color: #4d4d4d;
}
BODY.dark .Result {
  color: #bcbcbc;
}
.Result__all {
  flex: 1;
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: auto;
}
.Result__all--with-data .Result__output {
  max-height: 35%;
}
.Result__warnings p,
.Result__error p {
  margin-bottom: 0.25em;
  padding: 0.25em;
}
.Result__warnings p:last-child,
.Result__error p:last-child {
  margin-bottom: 0;
}
.Result__warnings p span,
.Result__error p span {
  padding: 0.125em 0.25em;
  font-weight: bold;
  font-size: 14px;
}
.Result__warnings {
  max-height: 100px;
  overflow: auto;
}
.Result__warnings span {
  background-color: rgba(255, 152, 0, 0.25);
  color: #ff9800;
}
.Result__error {
  white-space: pre-line;
}
.Result__error span {
  background-color: rgba(211, 80, 85, 0.3);
  color: #d35055;
}
.Result__spacer:nth-child(n+2) {
  margin: 0.75em 0 1em 0;
  border-top: 1px solid;
}
BODY.light .Result__spacer:nth-child(n+2) {
  border-top-color: #e4e4e6;
}
BODY.dark .Result__spacer:nth-child(n+2) {
  border-top-color: #49494b;
}
.Result__data {
  flex: 1;
  overflow: auto;
}
.Result__plot {
  position: relative;
  flex: 1;
}
.Result__plot img {
  position: absolute;
  max-width: 100%;
  max-height: 100%;
}
.Result__output {
  overflow: auto;
  font-size: 0.8em;
}
.Result__output pre {
  margin-top: 0;
  margin-bottom: 0.625em;
}
.Result__output pre:last-child {
  margin-bottom: 0;
}
.Result__output pre:empty {
  display: none;
}
.Result__output pre.stdout {
  color: gray;
}
.Result__output pre.stderr {
  color: #d35055;
}
.Result .CodeMirror {
  height: auto;
}

.ConsoleEditor .console-div {
  height: 45%;
}
.ConsoleEditor .divider {
  top: 45%;
}
.ConsoleEditor .result-div {
  height: 55%;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.YesNo {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
td .YesNo {
  padding-top: 0.25em;
  padding-bottom: 0.25em;
}
td .YesNo--errorVisible {
  position: relative;
  top: -0.375em;
}
.YesNo__message {
  position: absolute;
  left: 0;
  bottom: -1.25em;
  margin-left: -2px;
  white-space: nowrap;
  font-size: 12px;
}
td .YesNo__message {
  bottom: -1em;
}
.YesNo__message--error {
  color: red;
}
.YesNo__message--success {
  color: green;
}
.YesNo__errorMessage {
  line-height: 1.3333333;
}
.YesNo__options {
  display: block;
  border: 1px solid transparent;
  border-radius: 2px;
  padding: 0.16666667em 0.33333333em;
  font-size: 1.425em;
  line-height: 0.88888887;
  text-align: center;
}
.YesNo__options--success {
  border-color: rgba(0, 128, 0, 0.75);
}
BODY.light .YesNo__options--success {
  background-color: rgba(0, 128, 0, 0.05);
}
BODY.dark .YesNo__options--success {
  background-color: rgba(0, 128, 0, 0.15);
}
.YesNo__options--error {
  border-color: rgba(255, 0, 0, 0.75);
}
BODY.light .YesNo__options--error {
  background-color: rgba(255, 0, 0, 0.05);
}
BODY.dark .YesNo__options--error {
  background-color: rgba(255, 0, 0, 0.15);
}
.YesNo__option {
  position: relative;
  font-size: 0.66666667em;
  border-radius: 50%;
  width: 2em;
  height: 2em;
  cursor: pointer;
  border: 2px solid;
  line-height: 1;
}
.YesNo__option::before {
  font-family: yesno;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
BODY.light .YesNo__option {
  border-color: #e4e4e6;
  background-color: white;
  color: #4d4d4d;
}
BODY.light .YesNo__option:focus {
  outline: none;
  border-color: rgba(77, 77, 77, 0.5);
  box-shadow: 0 0 2px 2px #e4e4e6;
}
BODY.light .YesNo__option:hover {
  box-shadow: 0 0 2px 2px #e4e4e6;
}
BODY.light .YesNo__option--checked,
BODY.light .YesNo__option--checked:focus {
  border-color: #4d4d4d;
}
BODY.dark .YesNo__option {
  border-color: #49494b;
  background-color: #353535;
  color: #bcbcbc;
}
BODY.dark .YesNo__option:focus {
  outline: none;
  border-color: rgba(188, 188, 188, 0.5);
  box-shadow: 0 0 2px 2px #49494b;
}
BODY.dark .YesNo__option:hover {
  box-shadow: 0 0 2px 2px #49494b;
}
BODY.dark .YesNo__option--checked,
BODY.dark .YesNo__option--checked:focus {
  border-color: #bcbcbc;
}
.YesNo__option span {
  display: none;
}
.YesNo__yesOption::before {
  content: "\E801";
}
BODY.light .YesNo__yesOption--checked {
  color: green;
}
BODY.dark .YesNo__yesOption--checked {
  color: green;
}
.YesNo__noOption::before {
  content: "\E802";
}
BODY.light .YesNo__noOption--checked {
  color: #d90000;
}
BODY.dark .YesNo__noOption--checked {
  color: #d90000;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.TextInput {
  position: relative;
  display: inline-flex;
  align-items: center;
  line-height: 1.3333333;
}
td .TextInput {
  padding-top: 0.25em;
  padding-bottom: 0.25em;
}
td .TextInput--errorVisible {
  position: relative;
  top: -0.375em;
}
.TextInput__message {
  position: absolute;
  left: 0;
  bottom: -1.25em;
  margin-left: -2px;
  white-space: nowrap;
  font-size: 12px;
}
td .TextInput__message {
  bottom: -1em;
}
.TextInput__message--error {
  color: red;
}
.TextInput__message--success {
  color: green;
}
.TextInput input {
  padding: 0.25em;
}
BODY.light .TextInput input {
  border: 1px solid #e4e4e6;
  background-color: white;
  color: #4d4d4d;
}
BODY.dark .TextInput input {
  border: 1px solid #49494b;
  background-color: #353535;
  color: #bcbcbc;
}
.TextInput input:focus {
  border-color: transparent;
}
BODY.light .TextInput--success input {
  border-color: green;
}
BODY.dark .TextInput--success input {
  border-color: green;
}
BODY.light .TextInput--error input {
  border-color: red;
}
BODY.dark .TextInput--error input {
  border-color: red;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.MultiOption {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
}
.MultiOption__decor {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 1.75em;
  height: 1.75em;
  border-radius: 50%;
  margin-right: 0.5em;
}
BODY.light .MultiOption__decor {
  border: 2px solid #e4e4e6;
  background-color: white;
  color: #4d4d4d;
}
BODY.dark .MultiOption__decor {
  border: 2px solid #49494b;
  background-color: #353535;
  color: #bcbcbc;
}
.MultiOption__decor::before {
  font-family: yesno;
  content: "";
  position: absolute;
  left: 48.75%;
  top: 50%;
  transform: translate(-50%, -50%);
}
BODY.light .MultiOption--checked .MultiOption__decor {
  border-color: #4d4d4d;
}
BODY.dark .MultiOption--checked .MultiOption__decor {
  border-color: #bcbcbc;
}
.MultiOption--checked .MultiOption__decor::before {
  content: "\E800";
}
.MultiOption input {
  position: absolute;
  left: -10000px;
}
BODY.light .MultiOption input:focus + span .MultiOption__decor {
  border-color: rgba(77, 77, 77, 0.5);
  box-shadow: 0 0 2px 2px #e4e4e6;
}
BODY.dark .MultiOption input:focus + span .MultiOption__decor {
  border-color: rgba(188, 188, 188, 0.5);
  box-shadow: 0 0 2px 2px #49494b;
}
.MultiOption__control {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: 2px;
  padding: 0.25em 0.5em;
}
BODY.light .MultiOption__control:hover .MultiOption__decor {
  box-shadow: 0 0 2px 2px #e4e4e6;
}
BODY.dark .MultiOption__control:hover .MultiOption__decor {
  box-shadow: 0 0 2px 2px #49494b;
}
BODY.light .MultiOption__control--success {
  border-color: rgba(0, 128, 0, 0.25);
  background-color: rgba(0, 128, 0, 0.05);
}
BODY.dark .MultiOption__control--success {
  border-color: rgba(0, 128, 0, 0.5);
  background-color: rgba(0, 128, 0, 0.15);
}
BODY.light .MultiOption__control--error {
  border-color: rgba(255, 0, 0, 0.25);
  background-color: rgba(255, 0, 0, 0.05);
}
BODY.dark .MultiOption__control--error {
  border-color: rgba(255, 0, 0, 0.5);
  background-color: rgba(255, 0, 0, 0.15);
}
.MultiOption__message {
  margin-left: 1em;
  margin-right: 0.5em;
  font-size: 14px;
}
.MultiOption__message--error {
  color: red;
}
.MultiOption__message--success {
  color: green;
}
@media only screen and (max-width: 1366px) {
  .MultiOption__content table {
    font-size: 0.9em;
  }
  .MultiOption__content table td,
  .MultiOption__content table th {
    padding-left: 0.5em;
    padding-right: 0.5em;
  }
}
.compact .MultiOption__content table {
  font-size: 0.9em;
}
.compact .MultiOption__content table td,
.compact .MultiOption__content table th {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.MultiOption__decor {
  border-radius: 33%;
}
.MultiOption--checked .MultiOption__decor::before {
  left: 50%;
  content: "\E801";
}
BODY.light .MultiOption .MultiOption__control--success {
  background-color: transparent;
  border-color: transparent;
}
BODY.dark .MultiOption .MultiOption__control--success {
  background-color: transparent;
  border-color: transparent;
}

.MultiChoice {
  display: inline-flex;
  flex-direction: column;
}
.MultiChoice .MultiOption {
  margin: 1px 0;
}
BODY.light .MultiChoice--success {
  background-color: rgba(0, 128, 0, 0.05);
}
BODY.dark .MultiChoice--success {
  background-color: rgba(0, 128, 0, 0.15);
}
.MultiChoice.cols {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.MultiChoice.cols .MultiOption {
  flex: 0 0 33%;
  flex-direction: column;
}
.MultiChoice.cols .MultiOption__content {
  margin: 0.5em 0.5em 0 0.5em;
  text-align: center;
}
.MultiChoice.cols .MultiOption__message {
  margin: 0.25em 1em 0;
  font-size: 12px;
}
.MultiChoice.cols--2 .MultiOption {
  flex-basis: 50%;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.SingleOption {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
}
.SingleOption__decor {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 1.75em;
  height: 1.75em;
  border-radius: 50%;
  margin-right: 0.5em;
}
BODY.light .SingleOption__decor {
  border: 2px solid #e4e4e6;
  background-color: white;
  color: #4d4d4d;
}
BODY.dark .SingleOption__decor {
  border: 2px solid #49494b;
  background-color: #353535;
  color: #bcbcbc;
}
.SingleOption__decor::before {
  font-family: yesno;
  content: "";
  position: absolute;
  left: 48.75%;
  top: 50%;
  transform: translate(-50%, -50%);
}
BODY.light .SingleOption--checked .SingleOption__decor {
  border-color: #4d4d4d;
}
BODY.dark .SingleOption--checked .SingleOption__decor {
  border-color: #bcbcbc;
}
.SingleOption--checked .SingleOption__decor::before {
  content: "\E800";
}
.SingleOption input {
  position: absolute;
  left: -10000px;
}
BODY.light .SingleOption input:focus + span .SingleOption__decor {
  border-color: rgba(77, 77, 77, 0.5);
  box-shadow: 0 0 2px 2px #e4e4e6;
}
BODY.dark .SingleOption input:focus + span .SingleOption__decor {
  border-color: rgba(188, 188, 188, 0.5);
  box-shadow: 0 0 2px 2px #49494b;
}
.SingleOption__control {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: 2px;
  padding: 0.25em 0.5em;
}
BODY.light .SingleOption__control:hover .SingleOption__decor {
  box-shadow: 0 0 2px 2px #e4e4e6;
}
BODY.dark .SingleOption__control:hover .SingleOption__decor {
  box-shadow: 0 0 2px 2px #49494b;
}
BODY.light .SingleOption__control--success {
  border-color: rgba(0, 128, 0, 0.25);
  background-color: rgba(0, 128, 0, 0.05);
}
BODY.dark .SingleOption__control--success {
  border-color: rgba(0, 128, 0, 0.5);
  background-color: rgba(0, 128, 0, 0.15);
}
BODY.light .SingleOption__control--error {
  border-color: rgba(255, 0, 0, 0.25);
  background-color: rgba(255, 0, 0, 0.05);
}
BODY.dark .SingleOption__control--error {
  border-color: rgba(255, 0, 0, 0.5);
  background-color: rgba(255, 0, 0, 0.15);
}
.SingleOption__message {
  margin-left: 1em;
  margin-right: 0.5em;
  font-size: 14px;
}
.SingleOption__message--error {
  color: red;
}
.SingleOption__message--success {
  color: green;
}
@media only screen and (max-width: 1366px) {
  .SingleOption__content table {
    font-size: 0.9em;
  }
  .SingleOption__content table td,
  .SingleOption__content table th {
    padding-left: 0.5em;
    padding-right: 0.5em;
  }
}
.compact .SingleOption__content table {
  font-size: 0.9em;
}
.compact .SingleOption__content table td,
.compact .SingleOption__content table th {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
BODY.light .SingleOption .SingleOption__control--success {
  background-color: transparent;
  border-color: transparent;
}
BODY.dark .SingleOption .SingleOption__control--success {
  background-color: transparent;
  border-color: transparent;
}
BODY.light .SingleOption--notChecked .SingleOption__control--error {
  background-color: transparent;
  border-color: transparent;
}
BODY.dark .SingleOption--notChecked .SingleOption__control--error {
  background-color: transparent;
  border-color: transparent;
}
.SingleOption--notChecked .SingleOption__message--error {
  display: none;
}
.SingleChoice--nonSuccess .SingleOption .SingleOption__message--success {
  display: none;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.SingleChoice {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  border: 1px solid transparent;
}
.SingleChoice .SingleOption {
  margin: 1px 0;
}
BODY.light .SingleChoice--success {
  background-color: rgba(0, 128, 0, 0.05);
}
BODY.dark .SingleChoice--success {
  background-color: rgba(0, 128, 0, 0.15);
}
.SingleChoice.cols {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.SingleChoice.cols .SingleOption {
  flex: 0 0 33%;
  flex-direction: column;
}
.SingleChoice.cols .SingleOption__content {
  margin: 0.5em 0.5em 0 0.5em;
  text-align: center;
}
.SingleChoice.cols .SingleOption__message {
  margin: 0.25em 1em 0;
  font-size: 12px;
}
.SingleChoice.cols--2 .SingleOption {
  flex-basis: 50%;
}
.SingleChoice--notChecked {
  border: 1px solid red;
}
.SingleChoice__message {
  position: absolute;
  left: 0;
  bottom: -1.25em;
  margin-left: -2px;
  white-space: nowrap;
  font-size: 12px;
}
td .SingleChoice__message {
  bottom: -1em;
}
.SingleChoice__message--error {
  color: red;
}
.SingleChoice__message--success {
  color: green;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.Dropdown {
  position: relative;
  display: inline-flex;
  align-items: center;
  line-height: 1.3333333;
}
td .Dropdown {
  padding-top: 0.25em;
  padding-bottom: 0.25em;
}
td .Dropdown--errorVisible {
  position: relative;
  top: -0.375em;
}
table.fields-grid .Dropdown {
  width: 100%;
}
table.fields-grid .Dropdown select {
  width: 100%;
}
.Dropdown__message {
  position: absolute;
  left: 0;
  bottom: -1.25em;
  margin-left: -2px;
  white-space: nowrap;
  font-size: 12px;
}
td .Dropdown__message {
  bottom: -1em;
}
.Dropdown__message--error {
  color: red;
}
.Dropdown__message--success {
  color: green;
}
.Dropdown select {
  height: auto;
  padding: 0.25em;
}
BODY.light .Dropdown select {
  border: 1px solid #e4e4e6;
  background-color: white;
  color: #4d4d4d;
}
BODY.dark .Dropdown select {
  border: 1px solid #49494b;
  background-color: #353535;
  color: #bcbcbc;
}
.Dropdown select:focus {
  border-color: transparent;
}
BODY.light .Dropdown--success select {
  border-color: green;
}
BODY.dark .Dropdown--success select {
  border-color: green;
}
BODY.light .Dropdown--error select {
  border-color: red;
}
BODY.dark .Dropdown--error select {
  border-color: red;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.GroupMatch {
  position: relative;
  margin: 0 -0.5em 1.5em -0.5em;
  border: 1px solid;
  border-width: 1px 0;
  padding: 1.75em 0.5em;
}
@media only screen and (max-width: 1366px) {
  .GroupMatch {
    padding: 1em 0.25em;
    font-size: 0.9em;
    line-height: 1.2;
  }
}
.compact.GroupMatch {
  padding: 1em 0.25em;
  font-size: 0.9em;
  line-height: 1.2;
}
BODY.light .GroupMatch {
  border-color: #e4e4e6;
}
BODY.dark .GroupMatch {
  border-color: #49494b;
}
.GroupMatch__errorMessage {
  position: absolute;
  left: 50%;
  top: -1.125em;
  padding: 0.25em 1em;
  border: 1px solid;
  border-radius: 0.25em;
  transform: translateX(-50%);
  text-align: center;
  font-size: 12px;
  white-space: nowrap;
  color: red;
}
BODY.light .GroupMatch__errorMessage {
  border-color: #e4e4e6;
  background-color: white;
  box-shadow: 0 1px 1px #a2a2a9;
}
BODY.dark .GroupMatch__errorMessage {
  border-color: #49494b;
  background-color: #353535;
  box-shadow: 0 1px 1px #0a0a0a;
}
.GroupMatch .Box {
  flex: 1 0;
  display: flex;
  flex-direction: column;
  padding: 1em 0.5em 0 0.5em;
  text-align: center;
}
@media only screen and (max-width: 1366px) {
  .GroupMatch .Box {
    padding: 0.5em 0.25em 0 0.25em;
  }
}
.compact.GroupMatch .Box {
  padding: 0.5em 0.25em 0 0.25em;
}
.GroupMatch .Box__header {
  padding: 0.5em;
  font-weight: bold;
}
.GroupMatch .Box__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 0.5em;
  min-height: 4.75em;
  border: 1px solid;
  border-radius: 0.5em;
}
@media only screen and (max-width: 1366px) {
  .GroupMatch .Box__content {
    padding: 0.25em;
    min-height: 3.75em;
  }
}
.compact.GroupMatch .Box__content {
  padding: 0.25em;
  min-height: 3.75em;
}
BODY.light .GroupMatch .Box__content {
  border-color: #e4e4e6;
  background-color: #f6f6f6;
  box-shadow: inset 0 1px 2px #bcbcc1;
  background-color: #fbfbfb;
}
BODY.dark .GroupMatch .Box__content {
  border-color: #49494b;
  background-color: #323232;
  box-shadow: inset 0 1px 2px #232324;
  background-color: #373737;
}
.GroupMatch .Box__content:empty {
  justify-content: center;
}
.GroupMatch .Box__content:empty::before {
  content: "empty";
  opacity: 0.33;
  font-style: italic;
}
.GroupMatch .MatchBox {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -0.5em;
}
.GroupMatch .NoMatchBox {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  flex: 1;
  min-height: 4.75em;
  padding: 0.5em;
  border: 1px solid;
  border-radius: 0.5em;
}
@media only screen and (max-width: 1366px) {
  .GroupMatch .NoMatchBox {
    min-height: 3.75em;
  }
}
.compact.GroupMatch .NoMatchBox {
  min-height: 3.75em;
}
BODY.light .GroupMatch .NoMatchBox {
  border-color: #e4e4e6;
  background-color: #f6f6f6;
  box-shadow: inset 0 1px 2px #bcbcc1;
  background-color: #fbfbfb;
}
BODY.dark .GroupMatch .NoMatchBox {
  border-color: #49494b;
  background-color: #323232;
  box-shadow: inset 0 1px 2px #232324;
  background-color: #373737;
}
.GroupMatch .Item {
  position: relative;
  margin: 0.5em;
  padding: 0.5em 1em;
  border-radius: 0.5em;
  cursor: move;
}
.GroupMatch .Item__errorMessage,
.GroupMatch .Item__successMessage {
  display: none;
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 100%;
  margin-top: 0.25em;
  transform: translateX(-50%);
  min-width: 150px;
  padding: 0.25em 1em;
  border: 1px solid;
  border-radius: 0.25em;
  text-align: center;
  font-size: 12px;
}
.GroupMatch .Item__errorMessage::before,
.GroupMatch .Item__successMessage::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  margin-top: -0.75em;
  margin-left: -0.75em;
  border-left: 0.75em solid transparent;
  border-right: 0.75em solid transparent;
  border-bottom: 0.75em solid;
  opacity: 0.75;
}
BODY.light .GroupMatch .Item__errorMessage,
BODY.light .GroupMatch .Item__successMessage {
  background-color: white;
  box-shadow: 0 1px 1px #a2a2a9;
  box-shadow: 0 0 0.5em 0.75em white;
}
BODY.dark .GroupMatch .Item__errorMessage,
BODY.dark .GroupMatch .Item__successMessage {
  background-color: #353535;
  box-shadow: 0 1px 1px #0a0a0a;
  box-shadow: 0 0 0.5em 0.75em #353535;
}
.GroupMatch .Item__errorMessage {
  color: red;
}
.GroupMatch .Item__successMessage {
  color: green;
}
.GroupMatch .Item:hover .Item__errorMessage,
.GroupMatch .Item:hover .Item__successMessage {
  display: block;
}
@media only screen and (max-width: 1366px) {
  .GroupMatch .Item {
    margin: 0.25em;
    padding: 0.25em 0.5em;
  }
}
.compact.GroupMatch .Item {
  margin: 0.25em;
  padding: 0.25em 0.5em;
}
BODY.light .GroupMatch .Item {
  border: 1px solid #a2a2a9;
  background-color: white;
  box-shadow: 1px 1px 2px #e4e4e6;
}
BODY.dark .GroupMatch .Item {
  border: 1px solid #0a0a0a;
  background-color: #353535;
  box-shadow: 1px 1px 2px #49494b;
}
BODY.light .GroupMatch .Item--success {
  border-color: green;
}
BODY.light .GroupMatch .Item--error {
  border-color: red;
}
BODY.dark .GroupMatch .Item--success {
  border-color: green;
}
BODY.dark .GroupMatch .Item--error {
  border-color: red;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.TableMatch {
  position: relative;
  margin: 0 -0.5em 1.5em -0.5em;
  border: 1px solid;
  border-width: 1px 0;
  padding: 1.75em 0.5em;
}
@media only screen and (max-width: 1366px) {
  .TableMatch {
    padding: 1em 0.25em;
    font-size: 0.9em;
    line-height: 1.2;
  }
}
.compact.TableMatch {
  padding: 1em 0.25em;
  font-size: 0.9em;
  line-height: 1.2;
}
BODY.light .TableMatch {
  border-color: #e4e4e6;
}
BODY.dark .TableMatch {
  border-color: #49494b;
}
.TableMatch__errorMessage {
  position: absolute;
  left: 50%;
  top: -1.125em;
  padding: 0.25em 1em;
  border: 1px solid;
  border-radius: 0.25em;
  transform: translateX(-50%);
  text-align: center;
  font-size: 12px;
  white-space: nowrap;
  color: red;
}
BODY.light .TableMatch__errorMessage {
  border-color: #e4e4e6;
  background-color: white;
  box-shadow: 0 1px 1px #a2a2a9;
}
BODY.dark .TableMatch__errorMessage {
  border-color: #49494b;
  background-color: #353535;
  box-shadow: 0 1px 1px #0a0a0a;
}
.TableMatch .Slot {
  flex: 1;
  text-align: center;
  display: flex;
  flex-direction: column;
  padding: 0.5em;
  min-height: 4.75em;
  border: 1px solid;
  border-radius: 0.5em;
}
@media only screen and (max-width: 1366px) {
  .TableMatch .Slot {
    min-height: 2.75em;
  }
}
.compact.TableMatch .Slot {
  min-height: 2.75em;
}
BODY.light .TableMatch .Slot {
  border-color: #e4e4e6;
  background-color: #f6f6f6;
  box-shadow: inset 0 1px 2px #bcbcc1;
  background-color: #fbfbfb;
}
BODY.dark .TableMatch .Slot {
  border-color: #49494b;
  background-color: #323232;
  box-shadow: inset 0 1px 2px #232324;
  background-color: #373737;
}
.TableMatch .Slot:empty {
  justify-content: center;
}
.TableMatch .Slot:empty::before {
  content: "empty";
  opacity: 0.33;
  font-style: italic;
}
.TableMatch .NoMatchBox {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  flex: 1;
  min-height: 4.75em;
  padding: 0.5em;
  border: 1px solid;
  border-radius: 0.5em;
}
@media only screen and (max-width: 1366px) {
  .TableMatch .NoMatchBox {
    min-height: 3.75em;
  }
}
.compact.TableMatch .NoMatchBox {
  min-height: 3.75em;
}
BODY.light .TableMatch .NoMatchBox {
  border-color: #e4e4e6;
  background-color: #f6f6f6;
  box-shadow: inset 0 1px 2px #bcbcc1;
  background-color: #fbfbfb;
}
BODY.dark .TableMatch .NoMatchBox {
  border-color: #49494b;
  background-color: #323232;
  box-shadow: inset 0 1px 2px #232324;
  background-color: #373737;
}
.TableMatch table.table {
  margin-top: 1em;
  margin-bottom: 0;
  width: 100%;
  table-layout: fixed;
}
BODY.light .TableMatch table.table {
  border: 0;
}
BODY.dark .TableMatch table.table {
  border: 0;
}
.TableMatch table.table th {
  font-size: 1em;
}
BODY.light .TableMatch table.table th {
  background: none;
}
BODY.dark .TableMatch table.table th {
  background: none;
}
.TableMatch table.table td {
  padding: 0.5em;
}
@media only screen and (max-width: 1366px) {
  .TableMatch table.table td {
    padding: 0.25em;
  }
}
.compact.TableMatch table.table td {
  padding: 0.25em;
}
@media only screen and (max-width: 1366px) {
  .TableMatch table.table td:first-child {
    font-size: 0.9em;
  }
}
.compact.TableMatch table.table td:first-child {
  font-size: 0.9em;
}
.TableMatch .Item {
  position: relative;
  margin: 0.5em;
  padding: 0.5em 1em;
  border-radius: 0.5em;
  cursor: move;
}
.TableMatch .Item__errorMessage,
.TableMatch .Item__successMessage {
  display: none;
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 100%;
  margin-top: 0.25em;
  transform: translateX(-50%);
  min-width: 150px;
  padding: 0.25em 1em;
  border: 1px solid;
  border-radius: 0.25em;
  text-align: center;
  font-size: 12px;
}
.TableMatch .Item__errorMessage::before,
.TableMatch .Item__successMessage::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  margin-top: -0.75em;
  margin-left: -0.75em;
  border-left: 0.75em solid transparent;
  border-right: 0.75em solid transparent;
  border-bottom: 0.75em solid;
  opacity: 0.75;
}
BODY.light .TableMatch .Item__errorMessage,
BODY.light .TableMatch .Item__successMessage {
  background-color: white;
  box-shadow: 0 1px 1px #a2a2a9;
  box-shadow: 0 0 0.5em 0.75em white;
}
BODY.dark .TableMatch .Item__errorMessage,
BODY.dark .TableMatch .Item__successMessage {
  background-color: #353535;
  box-shadow: 0 1px 1px #0a0a0a;
  box-shadow: 0 0 0.5em 0.75em #353535;
}
.TableMatch .Item__errorMessage {
  color: red;
}
.TableMatch .Item__successMessage {
  color: green;
}
.TableMatch .Item:hover .Item__errorMessage,
.TableMatch .Item:hover .Item__successMessage {
  display: block;
}
@media only screen and (max-width: 1366px) {
  .TableMatch .Item {
    margin: 0.25em;
    padding: 0.25em 0.5em;
  }
}
.compact.TableMatch .Item {
  margin: 0.25em;
  padding: 0.25em 0.5em;
}
BODY.light .TableMatch .Item {
  background-color: white;
  border: 1px solid #a2a2a9;
  box-shadow: 1px 1px 2px #e4e4e6;
}
BODY.dark .TableMatch .Item {
  background-color: #353535;
  border: 1px solid #0a0a0a;
  box-shadow: 1px 1px 2px #49494b;
}
BODY.light .TableMatch .Item--success {
  border-color: green;
}
BODY.light .TableMatch .Item--error {
  border-color: red;
}
BODY.dark .TableMatch .Item--success {
  border-color: green;
}
BODY.dark .TableMatch .Item--error {
  border-color: red;
}

.TableHistogram {
  margin-bottom: 1.5em;
}
.TableHistogram__error {
  display: inline-block;
  font-size: 12px;
  color: red;
}
.TableHistogram__tableWrapper {
  display: inline-block;
}
.TableHistogram__controls {
  position: relative;
  margin-top: -1em;
  padding: 0.75em;
}
.TableHistogram__controls button {
  margin-right: 1em;
}
BODY.light .TableHistogram__controls {
  border: 1px solid rgba(0, 0, 0, 0.075);
}
BODY.dark .TableHistogram__controls {
  border: 1px solid rgba(255, 255, 255, 0.075);
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.Exercise__all {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
.Exercise__tabs {
  font-size: 15px;
}
.Exercise .tab {
  display: inline-block;
  white-space: nowrap;
  position: relative;
  padding-right: 15px;
  line-height: 1;
  top: 3px;
  margin-right: -0.5em;
}
.Exercise .tab > SPAN {
  display: block;
  min-width: 80px;
  padding: 1em 1.5em 0.75em 2em;
  cursor: pointer;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 11px;
  text-align: center;
  border-radius: 5px 0 0 0;
}
BODY.light .Exercise .tab > SPAN {
  background-color: #f6f6f6;
  color: #969696;
}
BODY.dark .Exercise .tab > SPAN {
  background-color: #333237;
  color: #969696;
}
.Exercise .tab > SPAN > SPAN {
  position: relative;
  top: -3px;
}
.Exercise .tab.selected {
  top: 0;
  z-index: 2;
}
BODY.light .Exercise .tab.selected > SPAN {
  background-color: white;
  color: #4d4d4d;
}
BODY.dark .Exercise .tab.selected > SPAN {
  background-color: #353535;
  color: #bcbcbc;
}
.Exercise .tab.selected > SPAN > SPAN {
  top: 0;
}
.Exercise .tab::after {
  position: absolute;
  top: 0;
  right: 0;
  content: "";
  height: 0;
  width: 0;
  border-top: 2.01666667em solid transparent;
}
BODY.light .Exercise .tab::after {
  border-left: 15px solid #f6f6f6;
}
BODY.dark .Exercise .tab::after {
  border-left: 15px solid #333237;
}
BODY.light .Exercise .tab.selected::after {
  border-left-color: white;
}
BODY.dark .Exercise .tab.selected::after {
  border-left-color: #353535;
}
.Exercise__content {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  position: relative;
  z-index: 1;
  border-radius: 0 5px 5px 5px;
  padding: 12px 10px;
}
BODY.light .Exercise__content {
  background: white;
  box-shadow: 0 1px 2px 1px #e4e4e6;
}
BODY.dark .Exercise__content {
  background: #353535;
  box-shadow: 0 1px 2px 1px #49494b;
}
.Exercise {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.Exercise__all {
  flex: 1;
  min-height: 0;
  position: relative;
}
.Exercise__content {
  overflow: auto;
  padding: 20px;
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  font-size: 16px;
}
BODY.light .Exercise__content {
  color: #4d4d4d;
}
BODY.dark .Exercise__content {
  color: #bcbcbc;
}
.Exercise__content--hidden {
  overflow: hidden;
}
.Exercise__content--hidden > * {
  -webkit-filter: blur(5px);
  filter: blur(5px);
  opacity: 0.2;
}
.Exercise__content--hidden img {
  opacity: 0.1;
}
.Exercise__content ul {
  list-style-type: disc;
}
.Exercise__content ol,
.Exercise__content ul {
  margin: 0 0 1em 0;
  padding: 0 0 0 1em;
}
.Exercise__content ol li,
.Exercise__content ul li {
  margin-bottom: 1.5em;
}
.Exercise__content ol li:first-of-type,
.Exercise__content ul li:first-of-type {
  margin-top: 1em;
}
.Exercise__content li .table-container.noshift {
  margin-left: -1em;
}
.Exercise__content li li .table-container.noshift {
  margin-left: -2em;
}
.Exercise__content p {
  margin-bottom: 1.5em;
}
.Exercise__content p.center {
  text-align: center;
}
.Exercise__content p.border {
  border: 1px solid;
  padding: 0.75em;
}
BODY.light .Exercise__content p.border {
  border-color: #e4e4e6;
  background-color: white;
}
BODY.dark .Exercise__content p.border {
  border-color: #49494b;
  background-color: #353535;
}
.Exercise__content p.with-fields {
  line-height: 3;
}
.Exercise__content p + P.answer {
  margin-top: -0.5em;
}
.Exercise__content .block-math {
  border: 1px solid;
  margin-bottom: 1em;
  padding: 0.125em;
}
BODY.light .Exercise__content .block-math {
  border-color: #c2d5c4;
  background-color: #fcfefc;
}
BODY.dark .Exercise__content .block-math {
  border-color: #3e5140;
  background-color: #343634;
}
.Exercise__content .p {
  display: inline-block;
}
.Exercise__content .p::after {
  content: "-";
}
.Exercise__content .p:last-of-type::after {
  content: none;
}
.Exercise__content .p + .p {
  margin-left: -0.36em;
}
BODY.light .Exercise__content .p + .p {
  background-color: white;
}
BODY.dark .Exercise__content .p + .p {
  background-color: #353535;
}
.Exercise__content .button.flat {
  font-size: 13px;
  padding: 0.75em 1.3125em 0.66666667em 1.3125em;
}
.Exercise__content table {
  text-align: center;
  border-spacing: 0;
  border-collapse: separate;
  margin-bottom: 1em;
}
.Exercise__content table.center {
  margin-left: auto;
  margin-right: auto;
}
BODY.light .Exercise__content table {
  border: 1px solid rgba(0, 0, 0, 0.075);
}
BODY.dark .Exercise__content table {
  border: 1px solid rgba(255, 255, 255, 0.075);
}
.Exercise__content table th {
  padding: 0.5em 1em;
  font-weight: normal;
  font-size: 0.9375em;
}
BODY.light .Exercise__content table th {
  background-color: white;
}
BODY.dark .Exercise__content table th {
  background-color: #353535;
}
BODY.light .Exercise__content table th {
  border-bottom: 2px solid rgba(0, 0, 0, 0.075);
}
BODY.dark .Exercise__content table th {
  border-bottom: 2px solid rgba(255, 255, 255, 0.075);
}
BODY.light .Exercise__content table th .p + .p {
  background-color: white;
}
BODY.dark .Exercise__content table th .p + .p {
  background-color: #353535;
}
.Exercise__content table td {
  padding: 0.5em 1em;
}
BODY.light .Exercise__content table td {
  border-bottom: 1px solid rgba(0, 0, 0, 0.075);
}
BODY.dark .Exercise__content table td {
  border-bottom: 1px solid rgba(255, 255, 255, 0.075);
}
@media only screen and (max-width: 1366px) {
  .Exercise__content table.sm-compact {
    font-size: 0.9em;
  }
  .Exercise__content table.sm-compact td,
  .Exercise__content table.sm-compact th {
    padding-left: 0.5em;
    padding-right: 0.5em;
  }
}
.Exercise__content table.compact {
  font-size: 0.9em;
}
.Exercise__content table.compact td,
.Exercise__content table.compact th {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
BODY.light .Exercise__content table tr:nth-child(2n+2) td {
  background-color: rgba(0, 0, 0, 0.025);
}
BODY.dark .Exercise__content table tr:nth-child(2n+2) td {
  background-color: rgba(255, 255, 255, 0.025);
}
.Exercise__content table tr:last-child td {
  border-bottom: 0;
}
.Exercise__content DIV.tip {
  margin: 0 -0.25em 1.5em -0.25em;
  border: 1px solid;
  border-radius: 0.5em;
  padding: 1.5em 0.5em 0 0.5em;
}
BODY.light .Exercise__content DIV.tip {
  border-color: rgba(228, 228, 230, 0.25);
  box-shadow: -1px 1px 2px #e4e4e6;
}
BODY.dark .Exercise__content DIV.tip {
  border-color: rgba(73, 73, 75, 0.25);
  box-shadow: -1px 1px 2px #49494b;
}
BODY.light .Exercise__content DIV.tip {
  background-color: #fffff2;
}
BODY.dark .Exercise__content DIV.tip {
  background-color: #42422e;
}
.Exercise__content DIV.tip::before {
  content: "Tip:";
  display: block;
  margin-top: -0.5em;
  padding-bottom: 1em;
  font-weight: bold;
}
.Exercise__content DIV.tip[data-title]::before {
  content: attr(data-title);
}
.Exercise__content DIV.tip[data-title=""]::before {
  content: none;
}
.Exercise__showButtonBox {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: -5px;
}
.Exercise__showButton {
  font-size: 13px;
}
BODY.light .Exercise__showButton {
  box-shadow: 0 0 2px 1px #f6f6f6;
}
BODY.dark .Exercise__showButton {
  box-shadow: 0 0 2px 1px #323232;
}
.Exercise__showButton span span {
  display: block;
}
.Exercise__hideButton {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: -4.15em;
  font-size: 11px;
  padding: 0.75em 1.3125em 0.66666667em 1.3125em;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.ExerciseBox {
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  height: 100%;
  padding: 16px 20px;
}
.ExerciseBox__hide {
  display: none;
}
.ExerciseBox__buttons {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding-top: 1em;
  padding-bottom: 2em;
}
@media only screen and (max-width: 1366px) {
  .ExerciseBox__buttons {
    padding-bottom: 0;
  }
}
.ExerciseBox__buttons :nth-child(n+2) {
  margin-left: 1em;
}
.ExerciseBox__buttons .button {
  font-size: 11px;
  font-weight: bold;
  text-transform: uppercase;
  padding: 0.75em 1.3125em 0.66666667em 1.3125em;
}
BODY.light .ExerciseBox__buttons .button.minor {
  background-color: white;
  border-color: white;
  color: #969696;
}
BODY.dark .ExerciseBox__buttons .button.minor {
  background-color: #353535;
  border-color: #353535;
  color: #969696;
}


/* required styles */
.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
  position: absolute;
  left: 0;
  top: 0;
}
.leaflet-container {
  overflow: hidden;
}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}
/* Prevents IE11 from highlighting tiles in blue */
.leaflet-tile::selection {
  background: transparent;
}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
  image-rendering: -webkit-optimize-contrast;
}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
  width: 1600px;
  height: 1600px;
  -webkit-transform-origin: 0 0;
}
.leaflet-marker-icon,
.leaflet-marker-shadow {
  display: block;
}
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg,
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
  max-width: none !important;
  max-height: none !important;
}
.leaflet-container.leaflet-touch-zoom {
  -ms-touch-action: pan-x pan-y;
  touch-action: pan-x pan-y;
}
.leaflet-container.leaflet-touch-drag {
  -ms-touch-action: pinch-zoom;
  /* Fallback for FF which doesn't support pinch-zoom */
  touch-action: none;
  touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
  -ms-touch-action: none;
  touch-action: none;
}
.leaflet-container {
  -webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
  -webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
}
.leaflet-tile {
  filter: inherit;
  visibility: hidden;
}
.leaflet-tile-loaded {
  visibility: inherit;
}
.leaflet-zoom-box {
  width: 0;
  height: 0;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  z-index: 800;
}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
  -moz-user-select: none;
}
.leaflet-pane {
  z-index: 400;
}
.leaflet-tile-pane {
  z-index: 200;
}
.leaflet-overlay-pane {
  z-index: 400;
}
.leaflet-shadow-pane {
  z-index: 500;
}
.leaflet-marker-pane {
  z-index: 600;
}
.leaflet-tooltip-pane {
  z-index: 650;
}
.leaflet-popup-pane {
  z-index: 700;
}
.leaflet-map-pane canvas {
  z-index: 100;
}
.leaflet-map-pane svg {
  z-index: 200;
}
.leaflet-vml-shape {
  width: 1px;
  height: 1px;
}
.lvml {
  behavior: url(#default#VML);
  display: inline-block;
  position: absolute;
}
/* control positioning */
.leaflet-control {
  position: relative;
  z-index: 800;
  pointer-events: visiblePainted;
  /* IE 9-10 doesn't have auto */
  pointer-events: auto;
}
.leaflet-top,
.leaflet-bottom {
  position: absolute;
  z-index: 1000;
  pointer-events: none;
}
.leaflet-top {
  top: 0;
}
.leaflet-right {
  right: 0;
}
.leaflet-bottom {
  bottom: 0;
}
.leaflet-left {
  left: 0;
}
.leaflet-control {
  float: left;
  clear: both;
}
.leaflet-right .leaflet-control {
  float: right;
}
.leaflet-top .leaflet-control {
  margin-top: 10px;
}
.leaflet-bottom .leaflet-control {
  margin-bottom: 10px;
}
.leaflet-left .leaflet-control {
  margin-left: 10px;
}
.leaflet-right .leaflet-control {
  margin-right: 10px;
}
/* zoom and fade animations */
.leaflet-fade-anim .leaflet-tile {
  will-change: opacity;
}
.leaflet-fade-anim .leaflet-popup {
  opacity: 0;
  -webkit-transition: opacity 0.2s linear;
  -moz-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
  opacity: 1;
}
.leaflet-zoom-animated {
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
}
.leaflet-zoom-anim .leaflet-zoom-animated {
  will-change: transform;
}
.leaflet-zoom-anim .leaflet-zoom-animated {
  -webkit-transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.25, 1);
  -moz-transition: -moz-transform 0.25s cubic-bezier(0, 0, 0.25, 1);
  transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1);
}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
  -webkit-transition: none;
  -moz-transition: none;
  transition: none;
}
.leaflet-zoom-anim .leaflet-zoom-hide {
  visibility: hidden;
}
/* cursors */
.leaflet-interactive {
  cursor: pointer;
}
.leaflet-grab {
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: grab;
}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
  cursor: crosshair;
}
.leaflet-popup-pane,
.leaflet-control {
  cursor: auto;
}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
  cursor: move;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: grabbing;
}
/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
  pointer-events: none;
}
.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
  pointer-events: visiblePainted;
  /* IE 9-10 doesn't have auto */
  pointer-events: auto;
}
/* visual tweaks */
.leaflet-container {
  background: #ddd;
  outline: 0;
}
.leaflet-container a {
  color: #0078A8;
}
.leaflet-container a.leaflet-active {
  outline: 2px solid orange;
}
.leaflet-zoom-box {
  border: 2px dotted #38f;
  background: rgba(255, 255, 255, 0.5);
}
/* general typography */
.leaflet-container {
  font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
}
/* general toolbar styles */
.leaflet-bar {
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.65);
  border-radius: 4px;
}
.leaflet-bar a,
.leaflet-bar a:hover {
  background-color: #fff;
  border-bottom: 1px solid #ccc;
  width: 26px;
  height: 26px;
  line-height: 26px;
  display: block;
  text-align: center;
  text-decoration: none;
  color: black;
}
.leaflet-bar a,
.leaflet-control-layers-toggle {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  display: block;
}
.leaflet-bar a:hover {
  background-color: #f4f4f4;
}
.leaflet-bar a:first-child {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.leaflet-bar a:last-child {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom: none;
}
.leaflet-bar a.leaflet-disabled {
  cursor: default;
  background-color: #f4f4f4;
  color: #bbb;
}
.leaflet-touch .leaflet-bar a {
  width: 30px;
  height: 30px;
  line-height: 30px;
}
.leaflet-touch .leaflet-bar a:first-child {
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
}
.leaflet-touch .leaflet-bar a:last-child {
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;
}
/* zoom control */
.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
  font: bold 18px 'Lucida Console', Monaco, monospace;
  text-indent: 1px;
}
.leaflet-touch .leaflet-control-zoom-in,
.leaflet-touch .leaflet-control-zoom-out {
  font-size: 22px;
}
/* layers control */
.leaflet-control-layers {
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4);
  background: #fff;
  border-radius: 5px;
}
.leaflet-control-layers-toggle {
  background-image: url(images/layers.png);
  width: 36px;
  height: 36px;
}
.leaflet-retina .leaflet-control-layers-toggle {
  background-image: url(images/layers-2x.png);
  background-size: 26px 26px;
}
.leaflet-touch .leaflet-control-layers-toggle {
  width: 44px;
  height: 44px;
}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
  display: none;
}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
  display: block;
  position: relative;
}
.leaflet-control-layers-expanded {
  padding: 6px 10px 6px 6px;
  color: #333;
  background: #fff;
}
.leaflet-control-layers-scrollbar {
  overflow-y: scroll;
  overflow-x: hidden;
  padding-right: 5px;
}
.leaflet-control-layers-selector {
  margin-top: 2px;
  position: relative;
  top: 1px;
}
.leaflet-control-layers label {
  display: block;
}
.leaflet-control-layers-separator {
  height: 0;
  border-top: 1px solid #ddd;
  margin: 5px -10px 5px -6px;
}
/* Default icon URLs */
.leaflet-default-icon-path {
  background-image: url(images/marker-icon.png);
}
/* attribution and scale controls */
.leaflet-container .leaflet-control-attribution {
  background: #fff;
  background: rgba(255, 255, 255, 0.7);
  margin: 0;
}
.leaflet-control-attribution,
.leaflet-control-scale-line {
  padding: 0 5px;
  color: #333;
}
.leaflet-control-attribution a {
  text-decoration: none;
}
.leaflet-control-attribution a:hover {
  text-decoration: underline;
}
.leaflet-container .leaflet-control-attribution,
.leaflet-container .leaflet-control-scale {
  font-size: 11px;
}
.leaflet-left .leaflet-control-scale {
  margin-left: 5px;
}
.leaflet-bottom .leaflet-control-scale {
  margin-bottom: 5px;
}
.leaflet-control-scale-line {
  border: 2px solid #777;
  border-top: none;
  line-height: 1.1;
  padding: 2px 5px 1px;
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #fff;
  background: rgba(255, 255, 255, 0.5);
}
.leaflet-control-scale-line:not(:first-child) {
  border-top: 2px solid #777;
  border-bottom: none;
  margin-top: -2px;
}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
  border-bottom: 2px solid #777;
}
.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
  box-shadow: none;
}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
  border: 2px solid rgba(0, 0, 0, 0.2);
  background-clip: padding-box;
}
/* popup */
.leaflet-popup {
  position: absolute;
  text-align: center;
  margin-bottom: 20px;
}
.leaflet-popup-content-wrapper {
  padding: 1px;
  text-align: left;
  border-radius: 12px;
}
.leaflet-popup-content {
  margin: 13px 19px;
  line-height: 1.4;
}
.leaflet-popup-content p {
  margin: 18px 0;
}
.leaflet-popup-tip-container {
  width: 40px;
  height: 20px;
  position: absolute;
  left: 50%;
  margin-left: -20px;
  overflow: hidden;
  pointer-events: none;
}
.leaflet-popup-tip {
  width: 17px;
  height: 17px;
  padding: 1px;
  margin: -10px auto 0;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  background: white;
  color: #333;
  box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4);
}
.leaflet-container a.leaflet-popup-close-button {
  position: absolute;
  top: 0;
  right: 0;
  padding: 4px 4px 0 0;
  border: none;
  text-align: center;
  width: 18px;
  height: 14px;
  font: 16px/14px Tahoma, Verdana, sans-serif;
  color: #c3c3c3;
  text-decoration: none;
  font-weight: bold;
  background: transparent;
}
.leaflet-container a.leaflet-popup-close-button:hover {
  color: #999;
}
.leaflet-popup-scrolled {
  overflow: auto;
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd;
}
.leaflet-oldie .leaflet-popup-content-wrapper {
  zoom: 1;
}
.leaflet-oldie .leaflet-popup-tip {
  width: 24px;
  margin: 0 auto;
  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
  filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
}
.leaflet-oldie .leaflet-popup-tip-container {
  margin-top: -1px;
}
.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
  border: 1px solid #999;
}
/* div icon */
.leaflet-div-icon {
  background: #fff;
  border: 1px solid #666;
}
/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
  position: absolute;
  padding: 6px;
  background-color: #fff;
  border: 1px solid #fff;
  border-radius: 3px;
  color: #222;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  pointer-events: none;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}
.leaflet-tooltip.leaflet-clickable {
  cursor: pointer;
  pointer-events: auto;
}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
  position: absolute;
  pointer-events: none;
  border: 6px solid transparent;
  background: transparent;
  content: "";
}
/* Directions */
.leaflet-tooltip-bottom {
  margin-top: 6px;
}
.leaflet-tooltip-top {
  margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
  left: 50%;
  margin-left: -6px;
}
.leaflet-tooltip-top:before {
  bottom: 0;
  margin-bottom: -12px;
  border-top-color: #fff;
}
.leaflet-tooltip-bottom:before {
  top: 0;
  margin-top: -12px;
  margin-left: -6px;
  border-bottom-color: #fff;
}
.leaflet-tooltip-left {
  margin-left: -6px;
}
.leaflet-tooltip-right {
  margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
  top: 50%;
  margin-top: -6px;
}
.leaflet-tooltip-left:before {
  right: 0;
  margin-right: -12px;
  border-left-color: #fff;
}
.leaflet-tooltip-right:before {
  left: 0;
  margin-left: -12px;
  border-right-color: #fff;
}

.clearBefore::before {
  content: "";
  clear: both;
  display: table;
}
.clearAfter::after {
  content: "";
  clear: both;
  display: table;
}
.clearAll::before {
  content: "";
  clear: both;
  display: table;
}
.clearAll::after {
  content: "";
  clear: both;
  display: table;
}
.ScrollbarWidthTest {
  position: absolute;
  height: 0;
  overflow: hidden;
}
.ScrollbarWidthTest div {
  overflow: scroll;
}
.FlexchildChildrenHeightTest {
  position: absolute;
  left: 0;
  top: -10px;
  width: 100%;
  height: 10px;
  display: flex;
  flex-direction: column;
}
.FlexchildChildrenHeightTest > div {
  flex: 1;
}
.FlexchildChildrenHeightTest > div > div {
  height: 100%;
}
.ScrollAreaConfig--active .ScrollArea {
  overflow: hidden !important;
  padding: 0 !important;
}
.ScrollAreaConfig--active .ScrollArea__wrapper {
  height: 100%;
}
.ScrollAreaConfig--active .ScrollArea__content {
  box-sizing: border-box;
  overflow: scroll;
  height: 100%;
}
.ScrollAreaConfig--1.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  1px);
  margin-right: -1px;
  margin-bottom: -1px;
}
.ScrollAreaConfig--2.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  2px);
  margin-right: -2px;
  margin-bottom: -2px;
}
.ScrollAreaConfig--3.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  3px);
  margin-right: -3px;
  margin-bottom: -3px;
}
.ScrollAreaConfig--4.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  4px);
  margin-right: -4px;
  margin-bottom: -4px;
}
.ScrollAreaConfig--5.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  5px);
  margin-right: -5px;
  margin-bottom: -5px;
}
.ScrollAreaConfig--6.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  6px);
  margin-right: -6px;
  margin-bottom: -6px;
}
.ScrollAreaConfig--7.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  7px);
  margin-right: -7px;
  margin-bottom: -7px;
}
.ScrollAreaConfig--8.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  8px);
  margin-right: -8px;
  margin-bottom: -8px;
}
.ScrollAreaConfig--9.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  9px);
  margin-right: -9px;
  margin-bottom: -9px;
}
.ScrollAreaConfig--10.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  10px);
  margin-right: -10px;
  margin-bottom: -10px;
}
.ScrollAreaConfig--11.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  11px);
  margin-right: -11px;
  margin-bottom: -11px;
}
.ScrollAreaConfig--12.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  12px);
  margin-right: -12px;
  margin-bottom: -12px;
}
.ScrollAreaConfig--13.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  13px);
  margin-right: -13px;
  margin-bottom: -13px;
}
.ScrollAreaConfig--14.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  14px);
  margin-right: -14px;
  margin-bottom: -14px;
}
.ScrollAreaConfig--15.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  15px);
  margin-right: -15px;
  margin-bottom: -15px;
}
.ScrollAreaConfig--16.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  16px);
  margin-right: -16px;
  margin-bottom: -16px;
}
.ScrollAreaConfig--17.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  17px);
  margin-right: -17px;
  margin-bottom: -17px;
}
.ScrollAreaConfig--18.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  18px);
  margin-right: -18px;
  margin-bottom: -18px;
}
.ScrollAreaConfig--19.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  19px);
  margin-right: -19px;
  margin-bottom: -19px;
}
.ScrollAreaConfig--20.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  20px);
  margin-right: -20px;
  margin-bottom: -20px;
}
.ScrollAreaConfig--21.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  21px);
  margin-right: -21px;
  margin-bottom: -21px;
}
.ScrollAreaConfig--22.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  22px);
  margin-right: -22px;
  margin-bottom: -22px;
}
.ScrollAreaConfig--23.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  23px);
  margin-right: -23px;
  margin-bottom: -23px;
}
.ScrollAreaConfig--24.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  24px);
  margin-right: -24px;
  margin-bottom: -24px;
}
.ScrollAreaConfig--25.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  25px);
  margin-right: -25px;
  margin-bottom: -25px;
}
.ScrollAreaConfig--26.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  26px);
  margin-right: -26px;
  margin-bottom: -26px;
}
.ScrollAreaConfig--27.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  27px);
  margin-right: -27px;
  margin-bottom: -27px;
}
.ScrollAreaConfig--28.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  28px);
  margin-right: -28px;
  margin-bottom: -28px;
}
.ScrollAreaConfig--29.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  29px);
  margin-right: -29px;
  margin-bottom: -29px;
}
.ScrollAreaConfig--30.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  30px);
  margin-right: -30px;
  margin-bottom: -30px;
}
.ScrollAreaConfig--31.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  31px);
  margin-right: -31px;
  margin-bottom: -31px;
}
.ScrollAreaConfig--32.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  32px);
  margin-right: -32px;
  margin-bottom: -32px;
}
.ScrollAreaConfig--33.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  33px);
  margin-right: -33px;
  margin-bottom: -33px;
}
.ScrollAreaConfig--34.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  34px);
  margin-right: -34px;
  margin-bottom: -34px;
}
.ScrollAreaConfig--35.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  35px);
  margin-right: -35px;
  margin-bottom: -35px;
}
.ScrollAreaConfig--36.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  36px);
  margin-right: -36px;
  margin-bottom: -36px;
}
.ScrollAreaConfig--37.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  37px);
  margin-right: -37px;
  margin-bottom: -37px;
}
.ScrollAreaConfig--38.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  38px);
  margin-right: -38px;
  margin-bottom: -38px;
}
.ScrollAreaConfig--39.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  39px);
  margin-right: -39px;
  margin-bottom: -39px;
}
.ScrollAreaConfig--40.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  40px);
  margin-right: -40px;
  margin-bottom: -40px;
}
.ScrollAreaConfig--41.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  41px);
  margin-right: -41px;
  margin-bottom: -41px;
}
.ScrollAreaConfig--42.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  42px);
  margin-right: -42px;
  margin-bottom: -42px;
}
.ScrollAreaConfig--43.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  43px);
  margin-right: -43px;
  margin-bottom: -43px;
}
.ScrollAreaConfig--44.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  44px);
  margin-right: -44px;
  margin-bottom: -44px;
}
.ScrollAreaConfig--45.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  45px);
  margin-right: -45px;
  margin-bottom: -45px;
}
.ScrollAreaConfig--46.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  46px);
  margin-right: -46px;
  margin-bottom: -46px;
}
.ScrollAreaConfig--47.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  47px);
  margin-right: -47px;
  margin-bottom: -47px;
}
.ScrollAreaConfig--48.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  48px);
  margin-right: -48px;
  margin-bottom: -48px;
}
.ScrollAreaConfig--49.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  49px);
  margin-right: -49px;
  margin-bottom: -49px;
}
.ScrollAreaConfig--50.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  50px);
  margin-right: -50px;
  margin-bottom: -50px;
}
.ScrollAreaConfig--51.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  51px);
  margin-right: -51px;
  margin-bottom: -51px;
}
.ScrollAreaConfig--52.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  52px);
  margin-right: -52px;
  margin-bottom: -52px;
}
.ScrollAreaConfig--53.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  53px);
  margin-right: -53px;
  margin-bottom: -53px;
}
.ScrollAreaConfig--54.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  54px);
  margin-right: -54px;
  margin-bottom: -54px;
}
.ScrollAreaConfig--55.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  55px);
  margin-right: -55px;
  margin-bottom: -55px;
}
.ScrollAreaConfig--56.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  56px);
  margin-right: -56px;
  margin-bottom: -56px;
}
.ScrollAreaConfig--57.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  57px);
  margin-right: -57px;
  margin-bottom: -57px;
}
.ScrollAreaConfig--58.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  58px);
  margin-right: -58px;
  margin-bottom: -58px;
}
.ScrollAreaConfig--59.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  59px);
  margin-right: -59px;
  margin-bottom: -59px;
}
.ScrollAreaConfig--60.ScrollAreaConfig--active .ScrollArea__content {
  height: calc(100% +  60px);
  margin-right: -60px;
  margin-bottom: -60px;
}
.ScrollAreaConfig--active .ScrollArea:hover .scroll,
.ScrollAreaConfig--active .ScrollArea--scrolling .scroll {
  opacity: 1;
}
.ScrollAreaConfig--active .ScrollArea--hscrollable .hscroll {
  visibility: visible;
}
.ScrollAreaConfig--active .ScrollArea--hscrollable .vscroll {
  height: calc(100% -  7px);
}
.ScrollAreaConfig--active .ScrollArea--vscrollable .hscroll {
  width: calc(100% -  7px);
}
.ScrollAreaConfig--active .ScrollArea--vscrollable .vscroll {
  visibility: visible;
}
.ScrollAreaConfig--active .scroll {
  position: relative;
  box-sizing: border-box;
  background-color: #f0f0f0;
  border: 1px solid #c8c8c8;
  border-radius: 3px;
}
.ScrollAreaConfig--active .scroll__thumb {
  position: absolute;
  background-color: #c0c0c0;
  border-radius: 3px;
}
.ScrollAreaConfig--active .hscroll {
  visibility: hidden;
  top: -7px;
  width: 100%;
  height: 6px;
  opacity: 0.25;
  transition: opacity 0.25s;
}
.ScrollAreaConfig--active .hscroll .scroll__thumb {
  height: 100%;
}
.ScrollAreaConfig--active .vscroll {
  visibility: hidden;
  left: calc(100% -  7px);
  top: calc(-100% -  6px);
  width: 6px;
  height: 100%;
  opacity: 0.25;
  transition: opacity 0.25s;
}
.ScrollAreaConfig--active .vscroll .scroll__thumb {
  width: 100%;
}
@font-face {
  font-family: 'yesno';
  src: url('/sqla/26.1.0/css/font/yesno.eot');
  src: url('/sqla/26.1.0/css/font/yesno.eot#iefix') format('embedded-opentype'), url('/sqla/26.1.0/css/font/yesno.woff2') format('woff2'), url('/sqla/26.1.0/css/font/yesno.woff') format('woff'), url('/sqla/26.1.0/css/font/yesno.ttf') format('truetype'), url('/sqla/26.1.0/css/font/yesno.svg#yesno') format('svg');
  font-weight: normal;
  font-style: normal;
}
/**
 * Exercise screen modifications
 */
html,
body {
  height: 100%;
  background-color: white;
  overflow: hidden;
}
#header_wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
#header {
  max-width: none;
  border-bottom: 1px solid;
}
BODY.light #header {
  border-bottom-color: #e4e4e6;
  background: #eeeef0;
  color: #969696;
}
BODY.light #header .navi-return-div A {
  color: #969696;
}
BODY.light #header .hmenu .hmenu_item {
  color: #969696;
}
BODY.light #header .hmenu .hmenu_item > A {
  color: #969696;
}
BODY.dark #header {
  border-bottom-color: #49494b;
  background: #3c3c40;
  color: #969696;
}
BODY.dark #header .navi-return-div A {
  color: #969696;
}
BODY.dark #header .hmenu .hmenu_item {
  color: #969696;
}
BODY.dark #header .hmenu .hmenu_item > A {
  color: #969696;
}
#header .mainmenu {
  float: left;
}
#header .profile {
  float: right;
  margin: 0;
  background: transparent;
  padding: 0;
  border-radius: 0;
}
#header .profile .my_profile {
  position: static;
}
#header .profile .hamburger {
  right: -2.5em;
}
#header .profile .hmenu {
  margin: 0 -8px;
}
#header .header__all {
  padding: 10px 40px 0 10px;
  min-height: 60px;
  background: none;
}
#header .hmenu .hmenu_item > A.title {
  margin: 0;
  width: 140px;
  height: 38.11881188px;
  background-size: 104.95049505%;
  background-position: -3.46534653px -763.76237624px;
}
BODY.light #header .hmenu .hmenu_item > A.title {
  background-position: -5px -1370px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 202px;
  height: 55px;
  width: 140px;
  height: 38.11881188px;
  background-size: 104.95049505%;
  background-position: -3.46534653px -949.5049505px;
}
#header .header__top {
  padding: 0;
}
#header .header__top::after {
  content: none;
}
#header .header__decor {
  display: none;
}
#header .header__main {
  position: static;
  margin: 0;
  padding: 0;
  min-height: 0;
}
#header .header__main::before {
  content: none;
}
.exercise-header {
  font-size: 16px;
  text-align: center;
}
.exercise-header::after {
  content: "";
  clear: both;
  display: table;
}
.navi-return-div {
  float: left;
  line-height: 40px;
}
.navi-return-div A {
  margin-left: 1em;
  border-left: 1px solid;
}
.navi-return-div A::before {
  content: "";
  background-position: -5px -117px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 0.5em;
  margin-left: 1em;
  opacity: 0.5;
}
.trial-information {
  margin: 0 10px;
  display: inline-block;
  border-radius: 5px;
  padding: 2px 15px;
}
BODY.light .trial-information {
  background-color: white;
  box-shadow: 0 1px 2px #e4e4e6;
  color: #4d4d4d;
}
BODY.dark .trial-information {
  background-color: #353535;
  box-shadow: 0 1px 2px #49494b;
  color: #bcbcbc;
}
.trial-information span {
  vertical-align: middle;
}
.trial-information span:first-child {
  line-height: 37px;
}
.trial-information .button {
  font-size: 0.9em;
  margin-left: 0.5em;
  padding: 0.2em 0.49em 0.17777778em 0.49em;
}
.excercise-menu {
  float: right;
  line-height: 40px;
}
.theme-switch::after {
  content: "";
  padding-right: 1em;
  border-right: 1px solid;
  margin-right: 1em;
  opacity: 0.5;
}
.theme-switch .light {
  font-weight: bold;
}
.theme-switch .light,
.theme-switch .dark {
  text-transform: uppercase;
}
BODY.dark .theme-switch .light {
  font-weight: normal;
}
BODY.dark .theme-switch .dark {
  font-weight: bold;
}
.switch {
  display: inline-block;
  margin: 0 5px;
}
.switch #onoffswitch {
  position: absolute;
  margin-left: -9999px;
  visibility: hidden;
}
.switch #onoffswitch + label {
  display: block;
  position: relative;
  cursor: pointer;
  outline: none;
  user-select: none;
  padding: 2px;
  background-color: #dedde2;
  border-radius: 20px;
  transition: color 0.4s ease 0s;
  width: 30px;
  height: 13px;
}
.switch #onoffswitch + label:before,
.switch #onoffswitch + label:after {
  display: block;
  position: absolute;
  content: "";
}
.switch #onoffswitch + label:before {
  top: 2px;
  left: 2px;
  bottom: 2px;
  right: 2px;
  background-color: #dedde2;
  border-radius: 60px;
  transition: background 0.4s;
}
.switch #onoffswitch + label:after {
  top: 4px;
  left: 4px;
  bottom: 4px;
  width: 5px;
  border-radius: 52px;
  transition: margin 0.4s ease 0s, color 0.4s ease 0s;
  background-color: #d45298;
}
.switch #onoffswitch:checked + label {
  background-color: #bbbbbc;
}
.switch #onoffswitch:checked + label:before {
  background-color: #3c3c40;
}
.switch #onoffswitch:checked + label:after {
  margin-left: 17px;
  background-color: #bbbbbc;
}
#content_wrapper {
  height: 100%;
  padding-top: 60px;
}
#footer {
  display: none;
}
/**
 *
 */
#this-is-paid-exercise .modal_dialog {
  width: 500px;
}
#this-is-paid-exercise .modal_body {
  padding: 2em;
}
#this-is-paid-exercise .modal_body::after {
  content: "";
  clear: both;
  display: table;
}
#this-is-paid-exercise .modal_body h3 {
  float: left;
  margin-bottom: 0;
}
#this-is-paid-exercise .modal_body h3 span {
  vertical-align: middle;
}
#this-is-paid-exercise .modal_body .price {
  position: relative;
  cursor: default;
}
#this-is-paid-exercise .modal_body .price_value {
  float: right;
  font-size: 1.33333333em;
}
#this-is-paid-exercise .modal_body .price_value span {
  vertical-align: middle;
}
#this-is-paid-exercise .modal_body .price_value::after {
  content: " ?";
  font-size: 0.6em;
  background: rgba(255, 255, 255, 0.75);
  border-radius: 50%;
  width: 1.4em;
  display: inline-block;
  vertical-align: middle;
  color: #d45298;
  text-align: center;
  margin-left: 0.5em;
}
#this-is-paid-exercise .modal_body .price_info {
  clear: both;
  text-align: left;
}
#this-is-paid-exercise .modal_body .price_info div {
  display: none;
  position: absolute;
  left: 0;
  width: 100%;
  margin-top: 0.25em;
  padding: 1em;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 1px 2px #62348e;
  font-size: 14px;
  color: #4d4d4d;
}
#this-is-paid-exercise .modal_body .price:hover .price_info div {
  display: block;
}
#this-is-paid-exercise .modal_footer {
  padding: 2em;
  text-align: left;
  background-color: white;
  color: #4d4d4d;
}
#this-is-paid-exercise .info p {
  margin-bottom: 0.5em;
  font-weight: bold;
}
#this-is-paid-exercise .info ul {
  margin: 0;
  padding-left: 0.25em;
}
#this-is-paid-exercise .info ul li {
  padding-left: 15px;
}
#this-is-paid-exercise .info ul li::before {
  content: "";
  position: absolute;
  background-position: -5px -5px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 4px;
  height: 4px;
  margin-left: -15px;
  margin-top: 7px;
}
/**
 * Socials FF fix
 */
.hid {
  height: 0;
  overflow: hidden;
}
/**
 * Styling
 */
BODY.light  .hscroll,
BODY.light  .vscroll {
  border: 0;
  border-radius: 0;
  background-color: #eeeef0;
}
BODY.light  .hscroll .scroll__thumb,
BODY.light  .vscroll .scroll__thumb {
  background-color: #cecece;
}
BODY.dark  .hscroll,
BODY.dark  .vscroll {
  border: 0;
  border-radius: 0;
  background-color: #3c3c40;
}
BODY.dark  .hscroll .scroll__thumb,
BODY.dark  .vscroll .scroll__thumb {
  background-color: #1e1e1e;
}
.CodeMirror {
  overflow: hidden !important;
}
DIV.CodeMirror {
  font-family: "Courier New", Courier, monospace;
  font-size: 16px;
  line-height: 1;
}
BODY.light .CodeMirror {
  background-color: white;
}
BODY.dark .CodeMirror {
  background-color: #353535;
}
BODY.dark .CodeMirror div.CodeMirror-cursor {
  border-color: white;
}
BODY.light .CodeMirror-gutters {
  border-right-color: #e4e4e6;
  background-color: #f6f6f6;
}
BODY.dark .CodeMirror-gutters {
  border-right-color: #49494b;
  background-color: #323232;
}
BODY.dark  .cm-s-default .cm-keyword {
  color: #D45298;
}
BODY.dark  .cm-s-default .cm-comment {
  color: #A9BAE6;
}
BODY.dark  .cm-s-default .cm-string {
  color: #BDEF5D;
}
BODY.dark  .cm-s-default .cm-number {
  color: #BDEF5D;
}
BODY.dark  .cm-s-default .cm-variable-2 {
  color: #7891CF;
}
BODY.dark  .cm-s-default .cm-variable-3 {
  color: #7891CF;
}
BODY.dark  .cm-s-default .cm-atom {
  color: #FFD887;
}
BODY.dark  .cm-s-default .cm-builtin {
  color: #FFD887;
}
BODY.dark  .cm-s-default .cm-def {
  color: #a6a6ff;
}
#content {
  max-width: none;
  height: 100%;
  padding: 0;
}
BODY.light #content {
  background-color: #eeeef0;
}
BODY.dark #content {
  background-color: #3c3c40;
}
#tips-div-id {
  display: none;
}
.console-tips,
#tips-div-id {
  position: absolute;
  z-index: 10;
  left: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  padding: 10px;
  white-space: pre-wrap;
}
BODY.light .console-tips,
BODY.light #tips-div-id {
  background-color: white;
}
BODY.dark .console-tips,
BODY.dark #tips-div-id {
  background-color: #353535;
}
.console-tips > DIV,
#tips-div-id > DIV {
  border: 1px solid;
  border-radius: 2px;
  padding: 0.8em 1.2em;
  font-size: 11px;
  font-weight: bold;
}
.error.console-tips > DIV,
.error#tips-div-id > DIV {
  color: #d35055;
  border-color: #d35055;
  background-color: rgba(211, 80, 85, 0.3);
}
.error.console-tips > DIV:before,
.error#tips-div-id > DIV:before {
  content: "";
  background-position: -5px -192px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: inline-block;
  width: 22px;
  height: 22px;
  vertical-align: middle;
  margin-top: -6px;
  margin-bottom: -4px;
  margin-right: 1.2em;
}
.success.console-tips > DIV,
.success#tips-div-id > DIV {
  color: #5F910C;
  border-color: #5F910C;
  background-color: rgba(95, 145, 12, 0.3);
}
.main-divs {
  position: relative;
  height: 100%;
  display: flex;
}
.main-divs:after {
  clear: both;
}
.main-divs > .west {
  width: 27%;
}
.main-divs > .at-west {
  flex: 1;
  min-width: 0;
  display: flex;
}
.main-divs > .at-west > .center {
  flex: 1;
  min-width: 0;
}
.main-divs > .at-west > .east {
  width: 91px;
}
.main-divs.east-expanded > .at-west > .east {
  width: 45%;
}
BODY.wide .main-divs > .west {
  width: 43%;
}
.main-divs > .west {
  height: 100%;
  border-right: 1px solid;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
BODY.light .main-divs > .west {
  border-right-color: #e4e4e6;
}
BODY.dark .main-divs > .west {
  border-right-color: #49494b;
}
.main-divs > .west > .main-part {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
  height: 90%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
.main-divs > .west > .main-part > .content {
  position: relative;
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
  height: 90%;
  overflow: hidden;
}
.main-divs > .west > .main-part #sections-div {
  position: absolute;
  left: -100%;
  width: 100%;
  height: 100%;
  transition: left 0.5s;
}
.main-divs > .west > .main-part #left-div {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  transition: left 0.5s;
  overflow: auto;
}
.main-divs > .west > .main-part.opened #sections-div {
  left: 0;
  overflow: auto;
}
.main-divs > .west > .main-part.opened #left-div {
  left: 100%;
}
.main-divs > .west > .banner-part {
  text-align: center;
}
.main-divs > .west > .banner-part:empty {
  display: none;
}
BODY.light .main-divs > .west > .banner-part {
  background-color: #f6f6f6;
}
BODY.dark .main-divs > .west > .banner-part {
  background-color: #323232;
}
.main-divs > .west > .banner-part P:last-child {
  margin-bottom: 0;
}
.main-divs > .west > .banner-part img {
  max-width: 100%;
  height: auto !important;
  vertical-align: top;
}
.main-divs > .at-west > .center {
  position: relative;
}
.main-divs > .at-west > .center .ConsoleEditor {
  position: relative;
  height: 100%;
}
.main-divs > .at-west > .east {
  -webkit-transition: width 0.5s;
  -moz-transition: width 0.5s;
  transition: width 0.5s;
}
.main-divs > .at-west--resizing .side-bar {
  position: relative;
}
.main-divs > .at-west--resizing .side-bar::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.main-divs > .at-west--resizing > .east {
  -webkit-transition: none;
  -moz-transition: none;
  transition: none;
}
.main-divs .loader-wrapper {
  position: absolute;
  display: none;
  z-index: 899;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0.5;
}
BODY.light .main-divs .loader-wrapper {
  background-color: #fff;
}
BODY.dark .main-divs .loader-wrapper {
  background-color: #000;
}
.main-divs .loader-wrapper > img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
}
/**
 * West
 */
BODY.light .main-part {
  background-color: #f6f6f6;
  color: #4d4d4d;
}
BODY.dark .main-part {
  background-color: #323232;
  color: #c2c2c2;
}
.main-part .navi-exercise-num-div {
  height: 60px;
  line-height: 60px;
  padding: 0 40px;
  border-bottom: 1px solid;
  cursor: pointer;
}
BODY.light .main-part .navi-exercise-num-div {
  border-bottom-color: #e4e4e6;
  color: #5d3188;
}
BODY.dark .main-part .navi-exercise-num-div {
  border-bottom-color: #49494b;
  color: white;
}
.main-part .navi-exercise-num-div > .name {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: normal;
}
.main-part .navi-exercise-num-div > .name::before {
  content: "";
  margin-right: 15px;
}
BODY.light .main-part .navi-exercise-num-div > .name::before {
  background-position: -5px -54px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: inline-block;
  width: 15px;
  height: 11px;
}
BODY.dark .main-part .navi-exercise-num-div > .name::before {
  background-position: -5px -75px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: inline-block;
  width: 15px;
  height: 11px;
}
.main-part .navi-exercise-num-div > .num {
  float: right;
  margin-left: 0.5em;
  font-size: 1.06666667em;
  font-weight: normal;
}
BODY.light .main-part.opened .navi-exercise-num-div {
  color: white;
  border-bottom-color: #734c9b;
  background-color: #5d3188;
}
BODY.light .main-part.opened .navi-exercise-num-div > .name::before {
  background-position: -5px -75px;
}
BODY.light .main-part.opened .navi-exercise-num-div > .num {
  color: #966eb7;
}
BODY.dark .main-part.opened .navi-exercise-num-div {
  color: white;
  border-bottom-color: #734c9b;
  background-color: #5d3188;
}
BODY.dark .main-part.opened .navi-exercise-num-div > .name::before {
  background-position: -5px -75px;
}
BODY.dark .main-part.opened .navi-exercise-num-div > .num {
  color: #966eb7;
}
.main-part #left-div {
  padding: 0 40px;
}
.ScrollAreaConfig--active .main-part #left-div.ScrollArea .ScrollArea__content {
  padding: 0 40px;
}
.main-part #left-div .instruction-div > .header H2,
.main-part #left-div .content-hints-div > .header H2 {
  margin: 1em 0;
  font-family: Roboto, sans-serif;
  font-size: 1.22222222em;
  font-weight: normal;
}
.main-part .content-hints-div > .header {
  border-top: 1px solid;
}
BODY.light .main-part .content-hints-div > .header {
  border-top-color: #e4e4e6;
}
BODY.dark .main-part .content-hints-div > .header {
  border-top-color: #49494b;
}
.main-part .hints-div > .header {
  cursor: pointer;
  color: #d45298;
}
BODY.light .main-part .hints-div > .header {
  border-top: 1px solid #e4e4e6;
}
BODY.dark .main-part .hints-div > .header {
  border-top: 1px solid #49494b;
}
.main-part .hints-div > .header H3::before {
  float: right;
  margin-left: 0.5em;
  content: "";
  background-position: -5px -33px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 15px;
  height: 11px;
}
.main-part .hints-div > .content {
  display: none;
}
.main-part .hints-div.opened > .content {
  display: block;
}
.main-part .hints-div.opened H3::before {
  background-position: -5px -96px;
}
.main-part #sections-div {
  color: white;
}
BODY.light .main-part #sections-div {
  background-color: #5d3188;
}
BODY.dark .main-part #sections-div {
  background-color: #5d3188;
}
.main-part .section > .header {
  position: relative;
  display: block;
  padding: 1em 40px 1em 90px;
  border-top: 1px solid;
  cursor: pointer;
}
BODY.light .main-part .section > .header {
  border-top-color: #734c9b;
}
BODY.dark .main-part .section > .header {
  border-top-color: #734c9b;
}
.main-part .section > .header::before {
  content: "";
  position: absolute;
  left: 40px;
  top: 50%;
  margin-top: -13px;
  width: 23px;
  height: 23px;
  border: 2px solid;
  border-radius: 50%;
  line-height: 27px;
  text-align: center;
}
BODY.light .main-part .section > .header::before {
  border-color: #734c9b;
}
BODY.dark .main-part .section > .header::before {
  border-color: #734c9b;
}
.main-part .section > .header::after {
  margin-left: 0.5em;
  content: "";
  background-position: -5px -104px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite.png?v=20190215");
  overflow: hidden;
  display: inline-block;
  width: 15px;
  height: 11px;
}
.main-part .section:first-child > .header {
  border-top: none;
}
BODY.light .main-part .section.done > .header {
  color: #966eb7;
}
BODY.dark .main-part .section.done > .header {
  color: #966eb7;
}
.main-part .section.done > .header::before {
  background-color: #92c248;
  border-color: #92c248;
  color: white;
  background-position: -5px -432px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 23px;
  height: 23px;
}
.main-part .section.opened > .header::after {
  background-position: -5px -83px;
}
.main-part .section.opened + .section > .header {
  border-top: none;
}
BODY.light .main-part .section .section-exercise-list,
BODY.light .main-part .section .current-section-exercise-list {
  background-color: #64388f;
}
BODY.dark .main-part .section .section-exercise-list,
BODY.dark .main-part .section .current-section-exercise-list {
  background-color: #64388f;
}
.main-part .section .section-exercise-list {
  display: none;
}
.main-part .section .section-exercise {
  border-top: 1px solid;
}
BODY.light .main-part .section .section-exercise {
  border-top-color: #734c9b;
}
BODY.dark .main-part .section .section-exercise {
  border-top-color: #734c9b;
}
.main-part .section .section-exercise:first-child {
  border-top: none;
}
.main-part .section .section-exercise A {
  position: relative;
  display: block;
  padding: 1em 40px 1em 140px;
}
BODY.light .main-part .section .section-exercise A {
  color: white;
}
BODY.dark .main-part .section .section-exercise A {
  color: white;
}
.main-part .section .section-exercise A::before {
  content: "";
  position: absolute;
  left: 40px;
  top: 50%;
  margin-top: -13px;
  width: 23px;
  height: 23px;
  border: 2px solid;
  border-radius: 50%;
  line-height: 27px;
  text-align: center;
}
BODY.light .main-part .section .section-exercise A::before {
  border-color: #734c9b;
}
BODY.dark .main-part .section .section-exercise A::before {
  border-color: #734c9b;
}
.main-part .section .section-exercise A::before {
  left: 90px;
}
.main-part .section .section-exercise A:hover {
  text-decoration: none;
}
BODY.light .main-part .section .section-exercise.done A {
  color: #966eb7;
}
BODY.dark .main-part .section .section-exercise.done A {
  color: #966eb7;
}
.main-part .section .section-exercise.done A::before {
  background-color: #92c248;
  border-color: #92c248;
  color: white;
  background-position: -5px -432px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 23px;
  height: 23px;
}
BODY.light .main-part .section .section-exercise.selected A {
  color: white;
}
BODY.light .main-part .section .section-exercise.selected A::before {
  border-color: white;
}
BODY.dark .main-part .section .section-exercise.selected A {
  color: white;
}
BODY.dark .main-part .section .section-exercise.selected A::before {
  border-color: white;
}
.main-part .section .section-exercise A:hover SPAN {
  text-decoration: underline;
}
BODY.light .main-part .section .section-exercise A:hover SPAN {
  color: white;
}
BODY.dark .main-part .section .section-exercise A:hover SPAN {
  color: white;
}
.main-part .section .section-exercise A:hover::after {
  position: absolute;
  content: ">";
  margin-left: 0.5em;
}
/**
 * Center
 */
.console-reset-btn-div {
  position: relative;
  cursor: pointer;
}
.console-run-btn-div {
  position: relative;
  cursor: pointer;
}
.console-next-btn-div {
  position: relative;
  text-decoration: none;
  float: right;
}
/**
 * East
 */
.side-bar {
  height: 100%;
}
.side-bar > .header {
  float: right;
  height: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 91px;
  position: relative;
  z-index: 1;
}
BODY.light .side-bar > .header {
  border-left: 1px solid #e4e4e6;
  background-color: #f6f6f6;
}
BODY.dark .side-bar > .header {
  border-left: 1px solid #49494b;
  background-color: #323232;
}
.side-bar > .header LI {
  height: 100px;
  cursor: pointer;
}
BODY.light .side-bar > .header LI {
  border-bottom: 1px solid #e4e4e6;
  color: #969696;
}
BODY.dark .side-bar > .header LI {
  border-bottom: 1px solid #49494b;
  color: #969696;
}
.side-bar > .header LI > SPAN {
  display: block;
  margin: 0;
  font-size: 11px;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
  line-height: 1;
}
.side-bar > .header LI > SPAN::before {
  content: "";
  clear: both;
  display: table;
}
.side-bar > .header LI .img {
  display: block;
  width: 50px;
  height: 40px;
  margin: 15px auto;
  background-position: center center;
  background-repeat: no-repeat;
}
.side-bar > .header LI img,
.side-bar > .header LI object,
.side-bar > .header LI svg {
  display: block;
  width: 40px;
  height: 40px;
  margin: 15px auto;
}
.side-bar > .header LI svg {
  display: block;
  width: 40px;
  margin: 15px auto;
}
BODY.light .side-bar > .header LI svg path {
  stroke: #9a9a9a !important;
  fill: #9a9a9a !important;
}
BODY.dark .side-bar > .header LI svg path {
  stroke: #898989 !important;
  fill: #898989 !important;
}
.side-bar > .header LI.loaded object {
  display: none;
}
.side-bar > .header LI.selected {
  position: relative;
}
BODY.light .side-bar > .header LI.selected svg path {
  stroke: #c046a1 !important;
  fill: #c046a1 !important;
}
BODY.dark .side-bar > .header LI.selected svg path {
  stroke: white !important;
  fill: white !important;
}
BODY.light .side-bar > .header LI.selected {
  color: #5d3188;
}
BODY.dark .side-bar > .header LI.selected {
  color: white;
}
.side-bar > .header LI.selected::before {
  content: "";
  position: absolute;
  left: -1px;
  height: 100%;
}
BODY.light .side-bar > .header LI.selected::before {
  border-left: 1px solid #f6f6f6;
}
BODY.dark .side-bar > .header LI.selected::before {
  border-left: 1px solid #323232;
}
BODY.light .side-bar > .header LI.discuss .img {
  background-position: -5px -970px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 50px;
  height: 40px;
}
BODY.light .side-bar > .header LI.discuss.selected .img {
  background-position: -5px -1020px;
}
BODY.dark .side-bar > .header LI.discuss .img {
  background-position: -5px -770px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 50px;
  height: 40px;
}
BODY.dark .side-bar > .header LI.discuss.selected .img {
  background-position: -5px -820px;
}
BODY.light .side-bar > .header LI.articles .img {
  background-position: -5px -670px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 50px;
  height: 40px;
}
BODY.light .side-bar > .header LI.articles.selected .img {
  background-position: -5px -720px;
}
BODY.dark .side-bar > .header LI.articles .img {
  background-position: -5px -1270px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 50px;
  height: 40px;
}
BODY.dark .side-bar > .header LI.articles.selected .img {
  background-position: -5px -1170px;
}
BODY.light .side-bar > .header LI.database .img,
BODY.light .side-bar > .header LI.datasets .img {
  background-position: -5px -1220px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 50px;
  height: 40px;
}
BODY.light .side-bar > .header LI.database.selected .img,
BODY.light .side-bar > .header LI.datasets.selected .img {
  background-position: -5px -1320px;
}
BODY.dark .side-bar > .header LI.database .img,
BODY.dark .side-bar > .header LI.datasets .img {
  background-position: -5px -570px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 50px;
  height: 40px;
}
BODY.dark .side-bar > .header LI.database.selected .img,
BODY.dark .side-bar > .header LI.datasets.selected .img {
  background-position: -5px -620px;
}
BODY.light .side-bar > .header LI.calculator .img {
  background-position: -5px -870px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 50px;
  height: 40px;
}
BODY.light .side-bar > .header LI.calculator.selected .img {
  background-position: -5px -920px;
}
BODY.dark .side-bar > .header LI.calculator .img {
  background-position: -5px -520px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 50px;
  height: 40px;
}
BODY.dark .side-bar > .header LI.calculator.selected .img {
  background-position: -5px -470px;
}
BODY.light .side-bar > .header LI.files .img {
  background-position: -5px -1070px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 50px;
  height: 40px;
}
BODY.light .side-bar > .header LI.files.selected .img {
  background-position: -5px -1120px;
}
BODY.dark .side-bar > .header LI.files .img {
  background-position: -5px -370px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 50px;
  height: 40px;
}
BODY.dark .side-bar > .header LI.files.selected .img {
  background-position: -5px -420px;
}
.side-bar > .content {
  display: none;
  height: 100%;
  margin-right: 91px;
}
.east-expanded .side-bar > .content,
.expanded.side-bar > .content {
  display: block;
}
BODY.light .side-bar > .content {
  border-left: 1px solid #e4e4e6;
  background-color: #f6f6f6;
}
BODY.dark .side-bar > .content {
  border-left: 1px solid #49494b;
  background-color: #323232;
}
.side-bar > .content > .section {
  height: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
BODY.light .side-bar > .content > .section {
  color: #4d4d4d;
}
BODY.dark .side-bar > .content > .section {
  color: #c2c2c2;
}
.side-bar > .content > .section > .header {
  padding: 2em 30px;
}
.side-bar > .content > .section > .header H2 {
  margin: 0;
  font-family: Roboto, sans-serif;
  font-size: 1.22222222em;
  font-weight: normal;
}
.side-bar > .content > .section > .content {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
  overflow: auto;
  position: relative;
  padding: 0 30px;
}
.side-bar > .content > .section > .content > .content {
  position: absolute;
  min-width: calc(100% - 60px);
}
.ScrollAreaConfig--active .side-bar > .content > .section > .content.ScrollArea .ScrollArea__content {
  padding: 0 30px;
}
/* ----------------------------------- */
.tabs {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
.tabs > .content > DIV.result-tab-block,
.tabs > .content > DIV.CodeMirror {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
  overflow: auto;
}
BODY.light .tabs > .content > DIV.result-tab-block,
BODY.light .tabs > .content > DIV.CodeMirror {
  color: #4d4d4d;
}
BODY.dark .tabs > .content > DIV.result-tab-block,
BODY.dark .tabs > .content > DIV.CodeMirror {
  color: #bcbcbc;
}
.tabs > .content > #map-result {
  overflow: hidden;
}
.tabs > .content > TEXTAREA {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
  vertical-align: top;
  resize: none;
  border: none;
  overflow-y: auto;
}
BODY.light .tabs > .content > TEXTAREA {
  background-color: white;
  color: #4d4d4d;
}
BODY.dark .tabs > .content > TEXTAREA {
  background-color: #353535;
  color: #bcbcbc;
}
.tabs > .header {
  font-size: 15px;
}
.tabs > .header > SPAN {
  display: inline-block;
  white-space: nowrap;
  position: relative;
  padding-right: 15px;
  line-height: 1;
  top: 3px;
  margin-right: -0.5em;
}
.tabs > .header > SPAN > SPAN {
  display: block;
  min-width: 80px;
  padding: 1em 1.5em 0.75em 2em;
  cursor: pointer;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 11px;
  text-align: center;
  border-radius: 5px 0 0 0;
}
BODY.light .tabs > .header > SPAN > SPAN {
  background-color: #f6f6f6;
  color: #969696;
}
BODY.dark .tabs > .header > SPAN > SPAN {
  background-color: #333237;
  color: #969696;
}
.tabs > .header > SPAN > SPAN > SPAN {
  position: relative;
  top: -3px;
}
.tabs > .header > SPAN.selected {
  top: 0;
  z-index: 2;
}
BODY.light .tabs > .header > SPAN.selected > SPAN {
  background-color: white;
  color: #4d4d4d;
}
BODY.dark .tabs > .header > SPAN.selected > SPAN {
  background-color: #353535;
  color: #bcbcbc;
}
.tabs > .header > SPAN.selected > SPAN > SPAN {
  top: 0;
}
.tabs > .header > SPAN::after {
  position: absolute;
  top: 0;
  right: 0;
  content: "";
  height: 0;
  width: 0;
  border-top: 2.01666667em solid transparent;
}
BODY.light .tabs > .header > SPAN::after {
  border-left: 15px solid #f6f6f6;
}
BODY.dark .tabs > .header > SPAN::after {
  border-left: 15px solid #333237;
}
BODY.light .tabs > .header > SPAN.selected::after {
  border-left-color: white;
}
BODY.dark .tabs > .header > SPAN.selected::after {
  border-left-color: #353535;
}
.tabs > .content {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  position: relative;
  z-index: 1;
  border-radius: 0 5px 5px 5px;
  padding: 12px 10px;
}
BODY.light .tabs > .content {
  background: white;
  box-shadow: 0 1px 2px 1px #e4e4e6;
}
BODY.dark .tabs > .content {
  background: #353535;
  box-shadow: 0 1px 2px 1px #49494b;
}
.result-tab-block__messages {
  margin-bottom: 1em;
}
.result-tab-block__messages p {
  margin-bottom: 0.25em;
  padding: 0.25em;
}
.result-tab-block__messages p:last-child {
  margin-bottom: 0;
}
.result-tab-block__messages p span:first-child {
  padding: 0.125em 0.25em;
  font-weight: bold;
  font-size: 14px;
  background-color: rgba(128, 128, 128, 0.25);
  color: #808080;
}
.result-tab-block__messages p.error span:first-child {
  background-color: rgba(211, 80, 85, 0.3);
  color: #d35055;
}
.result-tab-block__messages p.warning span:first-child {
  background-color: rgba(255, 152, 0, 0.25);
  color: #ff9800;
}
.result-tab-block__messages p.notice span:first-child {
  background-color: rgba(20, 199, 20, 0.25);
  color: #14c714;
}
.console-div {
  top: 0;
  height: 50%;
}
.result-div {
  bottom: 0;
  height: 50%;
}
.console-div,
.result-div {
  position: absolute;
  left: 0;
  right: 0;
  padding: 16px 20px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
.console-div > .header,
.result-div > .header {
  display: none;
}
.console-div > .content,
.result-div > .content {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
.console-div > .content > .tabs,
.result-div > .content > .tabs {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
}
.console-div > .footer,
.result-div > .footer {
  padding-top: 1em;
}
.console-div > .footer > .buttons::before {
  content: "";
  clear: both;
  display: table;
}
.console-div > .footer > .buttons::after {
  content: "";
  clear: both;
  display: table;
}
.console-div > .footer > .buttons:last-child {
  margin-bottom: 1em;
}
.console-div > .footer > .buttons > .button,
.console-div > .footer > .buttons > SPAN > .button {
  white-space: nowrap;
  font-size: 11px;
  font-weight: bold;
  text-transform: uppercase;
  padding: 0.75em 1.3125em 0.66666667em 1.3125em;
}
BODY.light .console-div > .footer > .buttons > .button.minor,
BODY.light .console-div > .footer > .buttons > SPAN > .button.minor {
  background-color: white;
  border-color: white;
  color: #969696;
}
BODY.dark .console-div > .footer > .buttons > .button.minor,
BODY.dark .console-div > .footer > .buttons > SPAN > .button.minor {
  background-color: #353535;
  border-color: #353535;
  color: #969696;
}
.console-div > .footer > .buttons > .button.next,
.console-div > .footer > .buttons > SPAN > .button.next {
  float: right;
}
.divider {
  height: 1px;
  position: absolute;
  left: 0 !important;
  width: 100%;
  margin-top: -11px;
  cursor: pointer;
}
BODY.light .divider {
  background-color: #e4e4e6;
}
BODY.dark .divider {
  background-color: #49494b;
}
BODY.light .divider:hover,
BODY.light .divider.ui-draggable-dragging {
  background-color: #d45298;
}
BODY.dark .divider:hover,
BODY.dark .divider.ui-draggable-dragging {
  background-color: #d45298;
}
.divider div {
  position: absolute;
  left: 50%;
  margin-top: -11px;
  margin-left: -15px;
  padding: 0 8px;
}
.divider div:after {
  content: "";
}
BODY.light .divider div:after {
  background-position: -5px -224px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 15px;
  height: 23px;
}
BODY.dark .divider div:after {
  background-position: -5px -257px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 15px;
  height: 23px;
}
.hdivider {
  width: 1px;
  position: absolute;
  z-index: 1;
  top: 0;
  height: 100%;
  margin-left: -1px;
  cursor: pointer;
}
.hdivider:hover,
.hdivider.ui-draggable-dragging {
  background-color: #d45298;
}
.hdivider div {
  position: absolute;
  top: 50%;
  margin-top: -15px;
  margin-left: -11px;
  padding: 8px 0;
}
.hdivider div:after {
  content: "";
}
BODY.light .hdivider div:after {
  background-position: -5px -142px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 23px;
  height: 15px;
}
BODY.dark .hdivider div:after {
  background-position: -5px -167px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 23px;
  height: 15px;
}
/**
 * Formatka tekstu
 */
p.article {
  text-align: center;
  margin: 0 10%;
  padding: 1em;
  line-height: 1.25;
  overflow: hidden;
}
BODY.light p.article {
  border: 1px solid #e4e4e6;
  background: white;
}
BODY.dark p.article {
  border: 1px solid #49494b;
  background: #353535;
}
p.article + p.article {
  margin-top: 1em;
}
p.article img {
  display: block;
  margin-bottom: 1em;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
  height: auto !important;
}
.table-container {
  margin-bottom: 1em;
}
.table-container > table {
  margin-bottom: 0;
  width: 100%;
}
.katex .mathrm,
.katex .textstyle .mathbf {
  font-family: 'Open Sans', KaTeX_Main, 'Times New Roman', serif;
}
.formatted {
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  font-size: 13px;
}
.formatted H2 {
  margin: 1em 0;
  font-family: Roboto, sans-serif;
  font-size: 1.22222222em;
  font-weight: normal;
}
.formatted H3 {
  margin: 1em 0;
  font-size: 1.15384615em;
}
.formatted .header {
  margin: 2em 0;
}
.formatted .content {
  margin: 1em 0;
}
BODY.query .formatted img {
  max-width: 100%;
}
.formatted code {
  white-space: pre-wrap;
  letter-spacing: 1px;
  border: 1px solid;
  padding: 0 2px;
}
BODY.light .formatted code {
  border-color: #e4e4e6;
  background-color: white;
}
BODY.dark .formatted code {
  border-color: #666666;
  background-color: #353535;
}
.formatted code .math {
  display: inline-block;
  border: 1px solid;
  margin: 0 -3px;
  padding: 0.25em 0.5em;
}
BODY.light .formatted code .math {
  border-color: #e4e4e6;
  background-color: white;
}
BODY.dark .formatted code .math {
  border-color: #49494b;
  background-color: #353535;
}
.formatted .block-math,
.formatted P.aka-math {
  border: 1px solid;
  margin-bottom: 1.5em;
  padding: 0.125em;
}
BODY.light .formatted .block-math,
BODY.light .formatted P.aka-math {
  border-color: #c2d5c4;
  background-color: #fcfefc;
}
BODY.dark .formatted .block-math,
BODY.dark .formatted P.aka-math {
  border-color: #3e5140;
  background-color: #343634;
}
.formatted P.aka-math {
  text-align: center;
  padding-top: 0.8em;
  padding-bottom: 0.8em;
  font-size: 1.25em;
}
.formatted span.run-button {
  display: inline-block;
  color: #D45298;
  background-color: rgba(212, 82, 152, 0.1);
  padding: 2px 5px;
  border-radius: 4px;
}
.formatted p {
  margin-bottom: 1.5em;
}
.formatted p.img-erd {
  text-align: center;
}
.formatted p.img-erd > SPAN {
  display: inline-block;
  padding: 15px;
  background-color: #f6f6f8;
}
.formatted p.img-erd > SPAN > IMG {
  vertical-align: top;
}
.formatted p.center {
  text-align: center;
}
.formatted p.border {
  border: 1px solid;
  padding: 0.75em;
}
BODY.light .formatted p.border {
  border-color: #e4e4e6;
  background-color: white;
}
BODY.dark .formatted p.border {
  border-color: #49494b;
  background-color: #353535;
}
.formatted pre {
  border: 1px solid rgba(212, 82, 152, 0.5);
  background-color: rgba(212, 82, 152, 0.25);
  padding: 2px 4px;
  white-space: pre-wrap;
}
.formatted #storedProceduresMetaInfo pre {
  border-color: rgba(84, 186, 212, 0.5);
  background-color: rgba(84, 186, 212, 0.25);
}
.formatted .func_name {
  font-weight: bold;
}
.formatted .func_return_type {
  font-style: italic;
}
.formatted ol {
  padding: 0 15px;
}
.formatted ul li,
.formatted ol li {
  padding: 3px 0;
}
.formatted ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0.25em;
}
.formatted ul li {
  padding-left: 15px;
  position: relative;
}
.formatted ul li::before {
  content: "";
  position: absolute;
  margin-left: -15px;
  margin-top: 7px;
}
BODY.light .formatted ul li::before {
  background-position: -5px -5px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 4px;
  height: 4px;
}
BODY.dark .formatted ul li::before {
  background-position: -5px -19px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 4px;
  height: 4px;
}
.formatted table {
  margin-bottom: 1em;
}
BODY.light .formatted table {
  border: 1px solid #e4e4e6;
  background-color: white;
}
BODY.dark .formatted table {
  border: 1px solid #49494b;
  background-color: #353535;
}
BODY.light .formatted table thead tr > th,
BODY.light .formatted table thead tr > td,
BODY.light .formatted table tbody:first-child tr:nth-of-type(1) > th,
BODY.light .formatted table tbody:first-child tr:nth-of-type(1) > td {
  border-bottom: 2px solid rgba(0, 0, 0, 0.025);
}
BODY.light .formatted table tbody:first-child tr:nth-of-type(2n+3) > td,
BODY.light .formatted table tbody:first-child tr:nth-of-type(2n+3) > th {
  background-color: rgba(0, 0, 0, 0.025);
}
BODY.light .formatted table thead + tbody tr:nth-of-type(2n+2) > td,
BODY.light .formatted table thead + tbody tr:nth-of-type(2n+2) > th {
  background-color: rgba(0, 0, 0, 0.025);
}
BODY.dark .formatted table thead tr > th,
BODY.dark .formatted table thead tr > td,
BODY.dark .formatted table tbody:first-child tr:nth-of-type(1) > th,
BODY.dark .formatted table tbody:first-child tr:nth-of-type(1) > td {
  border-bottom: 2px solid rgba(255, 255, 255, 0.025);
}
BODY.dark .formatted table tbody:first-child tr:nth-of-type(2n+3) > td,
BODY.dark .formatted table tbody:first-child tr:nth-of-type(2n+3) > th {
  background-color: rgba(255, 255, 255, 0.025);
}
BODY.dark .formatted table thead + tbody tr:nth-of-type(2n+2) > td,
BODY.dark .formatted table thead + tbody tr:nth-of-type(2n+2) > th {
  background-color: rgba(255, 255, 255, 0.025);
}
.formatted table td,
.formatted table th {
  padding: 7px 15px;
}
.formatted table th {
  text-align: left;
  font-size: 11px;
}
BODY.light .formatted table th {
  color: #9a9a9a;
  text-shadow: 1px 1px 1px white;
}
BODY.dark .formatted table th {
  color: #969696;
  text-shadow: 1px 1px 1px #353535;
}
.formatted table td {
  font-size: 13px;
}
.formatted table COLGROUP.yes COL:nth-child(even) {
  background-color: rgba(0, 255, 0, 0.3);
}
.formatted table COLGROUP.yes COL:nth-child(odd) {
  background-color: rgba(128, 255, 0, 0.3);
}
.formatted table COLGROUP.no COL:nth-child(even) {
  background-color: rgba(255, 0, 0, 0.3);
}
.formatted table COLGROUP.no COL:nth-child(odd) {
  background-color: rgba(255, 128, 128, 0.3);
}
.formatted table COLGROUP.other COL:nth-child(even) {
  background-color: rgba(128, 128, 255, 0.3);
}
.formatted table COLGROUP.other COL:nth-child(odd) {
  background-color: rgba(0, 0, 255, 0.3);
}
.formatted table TR:not(.yes) + TR.yes > TD {
  border-top: 2px solid green;
}
.formatted table TR.yes + TR:not(.yes) > TD {
  border-top: 2px solid green;
}
.formatted table TR.yes:last-child > TD {
  border-bottom: 2px solid green;
}
.formatted table TR.yes > TD:first-child {
  border-left: 2px solid green;
}
.formatted table TR.yes > TD:last-child {
  border-right: 2px solid green;
}
.formatted table TR.yes:nth-child(even) {
  background-color: rgba(0, 255, 0, 0.3);
}
.formatted table TR.yes:nth-child(odd) {
  background-color: rgba(128, 255, 0, 0.3);
}
.formatted table TR:not(.no) + TR.no > TD {
  border-top: 2px solid red;
}
.formatted table TR.no + TR:not(.no) > TD {
  border-top: 2px solid red;
}
.formatted table TR.no:last-child > TD {
  border-bottom: 2px solid red;
}
.formatted table TR.no > TD:first-child {
  border-left: 2px solid red;
}
.formatted table TR.no > TD:last-child {
  border-right: 2px solid red;
}
.formatted table TR.no:nth-child(even) {
  background-color: rgba(255, 0, 0, 0.3);
}
.formatted table TR.no:nth-child(odd) {
  background-color: rgba(255, 128, 128, 0.3);
}
.formatted table TR:not(.other) + TR.other > TD {
  border-top: 2px solid #0000ff;
}
.formatted table TR.other + TR:not(.other) > TD {
  border-top: 2px solid #0000ff;
}
.formatted table TR.other > TD:first-child {
  border-left: 2px solid #0000ff;
}
.formatted table TR.other:last-child > TD {
  border-bottom: 2px solid #0000ff;
}
.formatted table TR.other > TD:last-child {
  border-right: 2px solid #0000ff;
}
.formatted table TR.other:nth-child(even) {
  background-color: rgba(128, 128, 255, 0.3);
}
.formatted table TR.other:nth-child(odd) {
  background-color: rgba(0, 0, 255, 0.3);
}
.formatted blockquote {
  position: relative;
  margin: 0 -0.25em 1.5em -0.25em;
  border: 1px solid;
  padding: 1.5em 0.5em 0 3em;
  background-origin: border-box;
  background-image: -webkit-linear-gradient(left, rgba(128, 128, 128, 0.125) 0, rgba(128, 128, 128, 0.125) 2.25em, transparent 2.25em);
  background-image: linear-gradient(to right, rgba(128, 128, 128, 0.125) 0, rgba(128, 128, 128, 0.125) 2.25em, transparent 2.25em);
}
BODY.light .formatted blockquote {
  border-color: rgba(228, 228, 230, 0.25);
  box-shadow: -1px 1px 2px #e4e4e6;
}
BODY.dark .formatted blockquote {
  border-color: rgba(73, 73, 75, 0.25);
  box-shadow: -1px 1px 2px #49494b;
}
BODY.light .formatted blockquote {
  background-color: white;
}
BODY.dark .formatted blockquote {
  background-color: #3a3a3a;
}
.formatted blockquote::before {
  position: absolute;
  left: 0;
  top: 1em;
  content: "";
  opacity: 0.5;
}
BODY.light .formatted blockquote::before {
  background-position: -5px -330px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 26px;
  height: 30px;
}
BODY.dark .formatted blockquote::before {
  background-position: -5px -290px;
  background-repeat: no-repeat;
  background-image: url("/sqla/26.1.0/img/sprite-exercise.png?v=20190215");
  overflow: hidden;
  display: block;
  width: 26px;
  height: 30px;
}
.formatted blockquote > P:last-child {
  margin-top: -0.5em;
  font-style: italic;
  font-size: 0.8em;
}
.formatted blockquote > P:last-child::before {
  content: "- ";
}
.formatted blockquote > P:last-child:empty {
  margin-top: 0;
}
.formatted blockquote > P:last-child:empty::before {
  content: none;
}
.formatted DIV.tip {
  margin: 0 -0.25em 1.5em -0.25em;
  border: 1px solid;
  border-radius: 0.5em;
  padding: 1.5em 0.5em 0 0.5em;
}
BODY.light .formatted DIV.tip {
  border-color: rgba(228, 228, 230, 0.25);
  box-shadow: -1px 1px 2px #e4e4e6;
}
BODY.dark .formatted DIV.tip {
  border-color: rgba(73, 73, 75, 0.25);
  box-shadow: -1px 1px 2px #49494b;
}
BODY.light .formatted DIV.tip {
  background-color: #fffff2;
}
BODY.dark .formatted DIV.tip {
  background-color: #42422e;
}
.formatted DIV.tip.achieve,
.formatted DIV.tip.design,
.formatted DIV.tip.highlight,
.formatted DIV.tip.describe {
  padding-left: 1.25em;
  background-origin: border-box;
  border-radius: 0;
}
BODY.light .formatted DIV.tip.achieve,
BODY.light .formatted DIV.tip.design,
BODY.light .formatted DIV.tip.highlight,
BODY.light .formatted DIV.tip.describe {
  background-color: white;
}
BODY.dark .formatted DIV.tip.achieve,
BODY.dark .formatted DIV.tip.design,
BODY.dark .formatted DIV.tip.highlight,
BODY.dark .formatted DIV.tip.describe {
  background-color: #3a3a3a;
}
BODY.light .formatted DIV.tip.achieve {
  background-image: -webkit-linear-gradient(left, rgba(192, 0, 0, 0.5) 0, rgba(192, 0, 0, 0.5) 0.5em, transparent 0.5em);
  background-image: linear-gradient(to right, rgba(192, 0, 0, 0.5) 0, rgba(192, 0, 0, 0.5) 0.5em, transparent 0.5em);
}
BODY.dark .formatted DIV.tip.achieve {
  background-image: -webkit-linear-gradient(left, rgba(192, 0, 0, 0.5) 0, rgba(192, 0, 0, 0.5) 0.5em, transparent 0.5em);
  background-image: linear-gradient(to right, rgba(192, 0, 0, 0.5) 0, rgba(192, 0, 0, 0.5) 0.5em, transparent 0.5em);
}
BODY.light .formatted DIV.tip.design {
  background-image: -webkit-linear-gradient(left, rgba(128, 0, 128, 0.5) 0, rgba(128, 0, 128, 0.5) 0.5em, transparent 0.5em);
  background-image: linear-gradient(to right, rgba(128, 0, 128, 0.5) 0, rgba(128, 0, 128, 0.5) 0.5em, transparent 0.5em);
}
BODY.dark .formatted DIV.tip.design {
  background-image: -webkit-linear-gradient(left, rgba(128, 0, 128, 0.5) 0, rgba(128, 0, 128, 0.5) 0.5em, transparent 0.5em);
  background-image: linear-gradient(to right, rgba(128, 0, 128, 0.5) 0, rgba(128, 0, 128, 0.5) 0.5em, transparent 0.5em);
}
BODY.light .formatted DIV.tip.highlight {
  background-image: -webkit-linear-gradient(left, rgba(0, 128, 192, 0.5) 0, rgba(0, 128, 192, 0.5) 0.5em, transparent 0.5em);
  background-image: linear-gradient(to right, rgba(0, 128, 192, 0.5) 0, rgba(0, 128, 192, 0.5) 0.5em, transparent 0.5em);
}
BODY.dark .formatted DIV.tip.highlight {
  background-image: -webkit-linear-gradient(left, rgba(0, 128, 192, 0.5) 0, rgba(0, 128, 192, 0.5) 0.5em, transparent 0.5em);
  background-image: linear-gradient(to right, rgba(0, 128, 192, 0.5) 0, rgba(0, 128, 192, 0.5) 0.5em, transparent 0.5em);
}
BODY.light .formatted DIV.tip.describe {
  background-image: -webkit-linear-gradient(left, rgba(0, 128, 0, 0.5) 0, rgba(0, 128, 0, 0.5) 0.5em, transparent 0.5em);
  background-image: linear-gradient(to right, rgba(0, 128, 0, 0.5) 0, rgba(0, 128, 0, 0.5) 0.5em, transparent 0.5em);
}
BODY.dark .formatted DIV.tip.describe {
  background-image: -webkit-linear-gradient(left, rgba(0, 128, 0, 0.5) 0, rgba(0, 128, 0, 0.5) 0.5em, transparent 0.5em);
  background-image: linear-gradient(to right, rgba(0, 128, 0, 0.5) 0, rgba(0, 128, 0, 0.5) 0.5em, transparent 0.5em);
}
.formatted DIV.tip::before {
  content: "Tip:";
  display: block;
  margin-top: -0.5em;
  padding-bottom: 1em;
  font-weight: bold;
}
.formatted DIV.tip[data-title]::before {
  content: attr(data-title);
}
.formatted DIV.tip[data-title=""]::before {
  content: none;
}
.Index__name {
  font-weight: bold;
}
.Index__table {
  font-style: italic;
}
.Index__definition {
  white-space: pre-wrap;
}