html {
  height: 100%;
}
body {
  height: 100%;
  background: #919396;
  font-family: 'Open Sans', sans-serif;
  margin: 0;
  padding: 0;
  color: #000;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
code {
  font-family: Courier, monospace;
  background-color: #ececec;
/* Code types */
}
code.lang-html {
  background-color: #ffd0bc;
}
code.lang-css {
  background-color: #bce9ff;
}
code.lang-js {
  background-color: #ffe9ac;
}
code.lang-HTML {
  background-color: #ffd0bc;
}
code.lang-CSS {
  background-color: #bce9ff;
}
code.lang-JS {
  background-color: #ffe9ac;
}
.description {
  display: none;
}
main > div[ng-controller] {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-positive: 1;
  -webkit-flex-grow: 1;
  flex-grow: 1;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
h1 {
  font-size: 2em;
  color: #9c213b;
  font-weight: 400;
  margin: 0;
  margin-left: -0.5em;
}
h2 {
  margin-left: -0.25em;
}
h3 {
  font-weight: 400;
  margin-left: -0.25em;
}
img {
  border: none;
  max-width: 100%;
}
main {
  padding: 1rem;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-positive: 1;
  -webkit-flex-grow: 1;
  flex-grow: 1;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
main > article,
main > section {
  -ms-flex: 1 0 auto;
  -webkit-flex: 1 0 auto;
  flex: 1 0 auto;
  background: #fff;
  color: #000;
  border-radius: 1rem;
  padding: 1rem 2rem;
  box-shadow: 0.2rem 0.2rem 0.5rem #555;
}
button {
  box-sizing: border-box;
  width: auto;
  height: 2em;
  background: #004481;
  border: 3px solid #004481;
  color: #fff;
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  font-size: inherit;
  line-height: 1.5;
  overflow: hidden;
}
button:hover,
button:focus {
  background: #0058a1;
  border-color: #0058a1;
  box-shadow: 0 0 0.3em #002f63;
}
button:active {
  background: #002f63;
  border-color: #002f63;
}
button:disabled {
  background: #919396;
  border-color: #919396;
  box-shadow: none;
}
button.toggle.inactive {
  border-color: #004481;
  background-color: #fff;
  color: #004481;
}
button.toggle.inactive:hover,
button.toggle.inactive:focus {
  border-color: #0058a1;
}
button.toggle.inactive:active {
  border-color: #002f63;
}
.checkmark {
  display: inline-block;
  background-color: #86c557;
  color: #fff;
  border-radius: 100%;
  width: 1.33em;
  height: 1.33em;
  text-align: center;
  line-height: 1.33em;
  font-size: 1.5em;
  position: absolute;
  margin: 0 0.2em;
}
.checkmark:before {
  content: '\2713';
}
main ul {
  list-style-type: none;
  padding-left: 2em;
}
main ul> li::before {
  display: inline-block;
  content: "\25BA";
  font-size: 0.7em;
  width: 1.4em;
  margin-left: -1.5em;
}
main ul> li > p {
  margin: 0.5em 0;
}
main ul> li > p:first-child {
  display: inline;
}
main div.bluebox,
main div.greybox,
main div.redbox {
  margin: 1rem;
  border-radius: 1rem;
  padding-bottom: 0.5rem;
  box-shadow: 0.5rem 0.5rem 0.5rem #808080;
  position: relative;
}
main div.bluebox h2,
main div.greybox h2,
main div.redbox h2,
main div.bluebox h3,
main div.greybox h3,
main div.redbox h3,
main div.bluebox p.admonition-title,
main div.greybox p.admonition-title,
main div.redbox p.admonition-title {
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  position: relative;
  box-shadow: 0 0 1rem #004481;
  z-index: 100;
  color: #fff;
  padding-left: 0.75rem;
  margin: 0;
  font-weight: 400;
}
main div.bluebox p.admonition-title,
main div.greybox p.admonition-title,
main div.redbox p.admonition-title {
  font-size: 1.2rem;
}
main div.bluebox p,
main div.greybox p,
main div.redbox p {
  margin: 1rem;
}
main div.bluebox {
  border-color: #004481;
  background-color: #e8ecf7;
}
main div.bluebox h2,
main div.bluebox h3,
main div.bluebox p.admonition-title {
  background-color: #004481;
  box-shadow: 0 0 1rem #004481;
}
main div.bluebox ul > li::before {
  color: #004481;
}
main div.redbox {
  border-color: #9c213b;
  background-color: #f6e6ea;
}
main div.redbox h2,
main div.redbox h3,
main div.redbox p.admonition-title {
  background-color: #9c213b;
  box-shadow: 0 0 1rem #9c213b;
}
main div.redbox ul > li::before {
  color: #9c213b;
}
main div.greybox {
  border-color: #919396;
  background-color: #ececec;
}
main div.greybox h2,
main div.greybox h3,
main div.greybox p.admonition-title {
  background-color: #919396;
  box-shadow: 0 0 1rem #919396;
}
main div.greybox ul > li::before {
  color: #919396;
}
main .codeerror {
  font-family: Courier, monospace;
  color: #b32945;
}
main span.warning {
  font-weight: 600;
  color: #9c213b;
}
table {
  border-collapse: collapse;
  margin: 1rem auto;
  width: 85%;
}
table td,
table th {
  border: 2px solid #004481;
  padding: 0.5em;
  text-align: left;
}
table td>p:first-child {
  margin-top: 0;
}
table td>p:last-child {
  margin-bottom: 0;
}
table th {
  background-color: #bce9ff;
  white-space: nowrap;
}
table.sortable th {
  cursor: pointer;
}
table.sortable th:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after {
  content: " \25bf";
}
table.sortable tbody tr:nth-child(even) {
  background-color: #ececec;
}
span.first-use {
  font-weight: 600;
  color: #7a1229;
}
span.built-in {
  font-weight: 600;
  color: #002f63;
}
figure {
  display: table;
/*max-width: 48% */
  max-width: 100%;
  text-align: left;
  margin: auto;
  padding: 0.5rem;
}
figure img {
  max-width: 100%;
}
figure figcaption p:last-child {
  margin-bottom: 0;
}
figure.float-left {
  float: left;
}
figure.float-right {
  float: right;
}
hr {
  clear: both;
  visibility: hidden;
  margin: 0;
}
hr + p {
  margin: 0;
}
span.copyright {
  font-size: 0.7em;
  font-style: italic;
  color: #919396;
}
header {
  -ms-flex: none;
  -webkit-flex: none;
  flex: none;
  background: #004481;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  color: #fff;
  position: relative;
  z-index: 100;
  box-shadow: 0 0 0.5rem 0.2rem rgba(0,0,0,0.5);
  font-size: 1.5rem;
  height: 2em;
}
header.course-header {
  background: #9c213b;
}
header img {
  height: 2em;
}
header .to-right {
  margin-left: auto;
}
header a {
  color: inherit;
  text-decoration: none;
  padding: 0.1em 0.5em;
}
header a.logo-link {
  padding: 0;
  height: 2em;
}
#skiptocontent a {
  padding: 0.5rem;
  position: absolute;
  top: -80px;
  left: 0px;
  color: #fff;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-bottom-right-radius: 1rem;
  background: transparent;
  -webkit-transition: top 1s ease-out, background 1s linear;
  transition: top 1s ease-out, background 1s linear;
  z-index: 1000;
  text-decoration: none;
}
#skiptocontent a:focus {
  position: absolute;
  left: 0px;
  top: 0px;
  background: #004481;
  outline: 0;
  -webkit-transition: top 0.1s ease-in, background 0.5s linear;
  transition: top 0.1s ease-in, background 0.5s linear;
}
nav {
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  li: a;
}
nav ul {
  margin: 0;
}
nav li,
nav a {
  display: inline;
  margin-left: 0.1em;
  margin-right: 0.1em;
}
nav a {
  color: inherit;
  text-decoration: none;
  border-radius: 1.5em;
  padding: 0.1em 0.5em;
}
nav a:hover {
  background: #0058a1;
}
nav a:active {
  background: #004481;
}
.course-header nav a:hover {
  background: #b32945;
}
.course-header nav a:active {
  background: #7a1229;
}
nav.breadcrumb {
  -ms-flex: none;
  -webkit-flex: none;
  flex: none;
  box-shadow: 0 0 0.5rem 0.2rem rgba(0,0,0,0.5);
  background: #002f63;
  color: #919396;
  font-size: 1rem;
  padding: 0.5rem;
  z-index: 99;
}
nav.breadcrumb a {
  color: #fff;
}
nav.breadcrumb a:hover {
  background: #004481;
}
nav.breadcrumb a:active {
  background: #002f63;
}
nav.breadcrumb.course-header {
  background: #7a1229;
}
nav.breadcrumb.course-header a:hover {
  background: #9c213b;
}
nav.breadcrumb.course-header a:active {
  background: #7a1229;
}
.module-selector {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-flow: row wrap;
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  -ms-flex-pack: start;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
}
.module-selector a.module {
  display: block;
  text-decoration: none;
  color: inherit;
  position: relative;
  -ms-flex: none;
  -webkit-flex: none;
  flex: none;
  width: 12rem;
  margin: 1rem;
  padding: 0.5em 1em 1em 1em;
  border: 3px solid #919396;
  border-radius: 1em;
  overflow: hidden;
  -ms-text-overflow: clip;
  -o-text-overflow: clip;
  text-overflow: clip;
}
.module-selector a.module:hover,
.module-selector a.module:focus {
  box-shadow: 0 0 0.3em #919396;
}
.module-selector a.module:active {
  box-shadow: 0 0 0.3em #ccc;
}
.module-selector a.module h2 {
  font-size: 1.7rem;
  margin-top: 0.15rem;
  margin-bottom: 0.1rem;
  color: #919396;
}
.module-selector a.module .top-right {
  position: absolute;
  top: 0.3rem;
  right: 0.3rem;
}
.module-selector a.module img {
  width: 100%;
  margin: 0.1rem auto 0.1em auto;
}
.module-selector a.module .checkmark {
  display: none;
}
.module-selector a.module .module-icon {
  background-color: #919396;
  border-radius: 1rem;
  overflow: hidden;
  width: 12rem;
}
.module-selector a.module.completed {
  border-color: #004481;
  cursor: pointer;
}
.module-selector a.module.completed h2 {
  color: #004481;
}
.module-selector a.module.completed .checkmark {
  display: inline-block;
}
.module-selector a.module.completed .module-icon {
  background-color: #004481;
}
.module-selector a.module.video {
  border-color: #004481;
  cursor: pointer;
}
.module-selector a.module.video h2,
.module-selector a.module.video h3 {
  color: #004481;
}
.module-selector a.module.video .checkmark {
  display: inline-block;
}
.module-selector a.module.video .module-icon {
  background-color: #004481;
}
.unit-index {
  position: relative;
}
.unit-index .top-right {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
}
.unit-selector {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-flow: column;
  -webkit-flex-flow: column;
  flex-flow: column;
  -ms-flex-pack: start;
  -webkit-justify-content: start;
  justify-content: start;
}
.unit-selector a.unit {
  box-sizing: content-box;
  display: block;
  text-decoration: none;
  color: inherit;
  position: relative;
  -ms-flex: none;
  -webkit-flex: none;
  flex: none;
  margin: 0.25rem;
  padding: 0;
  border: 3px solid #919396;
  border-radius: 1em;
  overflow: hidden;
  -ms-text-overflow: clip;
  -o-text-overflow: clip;
  text-overflow: clip;
  min-height: 6rem;
}
.unit-selector a.unit:hover,
.unit-selector a.unit:focus {
  box-shadow: 0 0 0.3em #919396;
}
.unit-selector a.unit:active {
  box-shadow: 0 0 0.3em #ccc;
}
.unit-selector a.unit .unit-title {
  font-size: 1.2rem;
  margin: 0.5rem;
  margin-left: 7rem;
  color: #919396;
}
.unit-selector a.unit .unit-title h2 {
  margin: 0;
}
.unit-selector a.unit .top-right {
  position: absolute;
  top: 1rem;
  right: 0.3rem;
}
.unit-selector a.unit .checkmark {
  display: none;
  font-size: 3rem;
}
.unit-selector a.unit .unit-icon {
  position: absolute;
  margin: 0.5rem;
  background-color: #919396;
  border-radius: 1rem;
  overflow: hidden;
  height: 5rem;
  width: rem;
  text-align: center;
}
.unit-selector a.unit .unit-icon img {
  height: 100%;
}
.unit-selector a.unit.completed {
  border-color: #004481;
  cursor: pointer;
}
.unit-selector a.unit.completed .unit-title {
  margin-right: 5.5rem;
}
.unit-selector a.unit.completed h2,
.unit-selector a.unit.completed h3 {
  color: #004481;
}
.unit-selector a.unit.completed .checkmark {
  display: inline-block;
}
.unit-selector a.unit.completed .unit-icon {
  background-color: #004481;
}
.unit-selector a.unit.video {
  border-color: #004481;
  cursor: pointer;
}
.unit-selector a.unit.video h2,
.unit-selector a.unit.video h3 {
  color: #004481;
}
.unit-selector a.unit.video .checkmark {
  display: inline-block;
}
.unit-selector a.unit.video .unit-icon {
  background-color: #004481;
}
@media (min-width: 80rem) {
  .unit-selector {
    -ms-flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
  }
  .unit-selector a.unit {
    width: 48%;
  }
}
.progress-nav {
  -webkit-order: 0;
  order: 0;
  background: #fff;
  border-radius: 1rem;
  height: 1rem;
  -ms-flex: none;
  -webkit-flex: none;
  flex: none;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-flow: row nowrap;
  -webkit-flex-flow: row nowrap;
  flex-flow: row nowrap;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  margin: 0;
  padding: 1rem;
  box-shadow: 0.2rem 0.2rem 0.5rem #555;
}
.progress-nav .prev-step {
  margin-right: auto;
  -webkit-order: 0;
  order: 0;
}
.progress-nav .next-step {
  margin-left: auto;
  -webkit-order: 10;
  order: 10;
}
.progress-nav button {
  margin-left: 0.2em;
  margin-right: 0.2em;
}
.progress-nav button.prev-slide {
  -webkit-order: 1;
  order: 1;
}
.progress-nav button.next-slide {
  -webkit-order: 3;
  order: 3;
}
.progress-nav button.dot {
  -webkit-order: 2;
  order: 2;
  width: 2em;
  padding: 0;
  background-image: radial-gradient(circle, #919396, #919396 40%, #fff 50%, #fff);
  color: #000;
  border: solid 3px #fff;
}
.progress-nav button.dot:hover,
.progress-nav button.dot:focus {
  border-color: #0058a1;
}
.progress-nav button.dot:active {
  border-color: #002f63;
}
.progress-nav button.dot.fail {
  background-image: radial-gradient(circle, #004481, #004481 40%, #fff 50%, #fff);
}
.progress-nav button.dot.success {
  background-image: radial-gradient(circle, #539224, #539224 40%, #fff 50%, #fff);
}
.progress-nav button.dot.active {
  border-color: #004481;
}
div[uw-slide-show],
uw-slide-show {
  -ms-flex: 1;
  -webkit-flex: 1;
  flex: 1;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
.progress-content {
  -webkit-order: 10;
  order: 10;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction: row;
  -webkit-flex-direction: row;
  flex-direction: row;
  -ms-flex: 1 0 auto;
  -webkit-flex: 1 0 auto;
  flex: 1 0 auto;
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.progress-content .slide-wrapper {
  box-sizing: border-box;
  max-width: 100%;
  padding: 1rem;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  -ms-flex: 6 0 0px;
  -webkit-flex: 6 0 0px;
  flex: 6 0 0px;
  margin-left: 1rem;
  overflow: hidden;
  background-color: #fff;
  border-radius: 1rem;
  box-shadow: 0.2rem 0.2rem 0.5rem #555;
}
.progress-content .slide-wrapper:first-child {
  margin-left: 0;
  overflow: visible;
  -ms-flex-positive: 4;
  -webkit-flex-grow: 4;
  flex-grow: 4;
}
.progress-content .instructions {
  margin-bottom: 1rem;
}
.uw-slide {
  -ms-flex: 1;
  -webkit-flex: 1;
  flex: 1;
  padding: 0 1rem;
}
.uw-slide li > p {
  margin: 0.5em 0;
}
.uw-slide .notes h2 {
  font-size: 1em;
  font-weight: 400;
  margin: -0.4em 0;
}
.uw-slide ul {
  margin: 0.5em 0;
}
.uw-slide pre {
  margin-left: 1rem;
  margin-right: 1rem;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid;
  -webkit-column-break-before: avoid;
  page-break-before: avoid;
  break-before: avoid;
}
.uw-slide pre > code {
  display: block;
}
.uw-slide img {
  max-width: 100%;
}
.uw-slide .notes {
  padding: 0.5rem;
  margin-top: 1em;
  border: 3px solid #004481;
  border-radius: 0.75rem;
}
.uw-slide .notes.hint {
  border-color: #004481;
}
.uw-slide .notes.feedback {
  border-color: #9c213b;
}
@-moz-document url-prefix() {
  .uwslide img {
    width: 100%;
  }
}
.code-wrapper {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
.buttons {
  -ms-flex: none;
  -webkit-flex: none;
  flex: none;
  font-size: 1.2rem;
  -ms-flex-item-align: left;
  -webkit-align-self: left;
  align-self: left;
  text-align: left;
  margin-top: 1rem;
}
.code-input {
  -ms-flex-positive: 1;
  -webkit-flex-grow: 1;
  flex-grow: 1;
  border: 3px solid #004481;
  border-radius: 0.75rem;
  overflow: hidden;
  font-size: 1rem;
  font-family: Courier, monospace;
  min-height: 1.2em;
}
.code-output,
.web-console {
  overflow: auto;
  font-family: Courier, monospace;
  font-size: inherit;
  margin: 0.2rem;
  padding: 0.3rem;
  width: 100%;
}
.code-output .error-text {
  color: #b32945;
}
.rounded-box {
  -ms-flex-positive: 1;
  -webkit-flex-grow: 1;
  flex-grow: 1;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  border: 3px solid #004481;
  border-radius: 0.75rem;
  min-height: 2em;
  overflow: hidden;
}
.code-wrapper .user-input {
  border: solid 2px #9c213b;
  border-radius: 0.75em;
}
.code-wrapper .user-input:disabled {
  border-color: #808080;
}
.uw-question {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction: row;
  -webkit-flex-direction: row;
  flex-direction: row;
  -ms-flex: 1 1 auto;
  -webkit-flex: 1 1 auto;
  flex: 1 1 auto;
  margin: 0;
  padding: 0;
}
.uw-question .uw-slide {
  padding: 1rem 2rem;
  margin-left: 1rem;
  background-color: #fff;
  border-radius: 1rem;
  box-shadow: 0.2rem 0.2rem 0.5rem #555;
}
.uw-question .uw-slide img {
  width: 100%;
}
.uw-question .uw-slide:first-child {
  margin-left: 0;
}
input {
  box-sizing: border-box;
  height: 3em;
  border: 2px solid #004481;
  border-radius: 1.5em;
  display: block;
  padding: 0.5em 1.5em;
  font: inherit;
  margin-bottom: 0.5rem;
}
ul[combo-list] {
  padding: 0;
  margin: 0;
  list-style: outside none none;
  display: inline-block;
}
ul[combo-list] li {
  margin-bottom: 0.5em;
  position: relative;
}
ul[combo-list] li::before {
  display: none;
}
ul[combo-list] li input {
  opacity: 0;
  position: absolute;
  left: 1rem;
  margin: 0;
}
ul[combo-list] li input + label {
  box-sizing: border-box;
  position: relative;
  min-height: 3em;
  border: 2px solid #919396;
  border-radius: 1.5em;
  display: block;
  padding: 0.5em 1.5em 0.5em 3.5em;
}
ul[combo-list] li input + label:before {
  font-size: 2em;
  box-sizing: border-box;
  display: block;
  border: 2px solid #919396;
  border-radius: 100%;
  height: 1.1em;
  width: 1.1em;
  position: absolute;
  left: 0.125em;
  top: 0.125em;
  line-height: 1;
  text-align: center;
  content: '';
}
ul[combo-list] li input + label:hover,
ul[combo-list] li input + label:focus {
  border-color: #0058a1;
  box-shadow: 0 0 0.3em #002f63;
}
ul[combo-list] li input + label:hover:before,
ul[combo-list] li input + label:focus:before {
  background-image: radial-gradient(circle, #0058a1, #0058a1 10%, #fff 40%, #fff);
  border-color: #0058a1;
}
ul[combo-list] li input:focus + label {
  border-color: #0058a1;
  box-shadow: 0 0 0.3em #002f63;
}
ul[combo-list] li input:focus + label:before {
  background-image: radial-gradient(circle, #0058a1, #0058a1 10%, #fff 40%, #fff);
  border-color: #0058a1;
}
ul[combo-list] li input:focus:checked + label {
  border-color: #0058a1;
  background-color: #0058a1;
}
ul[combo-list] li input:active + label {
  background-color: #ccc;
  border-color: #002f63;
}
ul[combo-list] li input:active:checked + label {
  background-color: #002f63;
}
ul[combo-list] li input:checked + label {
  background-color: #004481;
  color: #fff;
  border-color: #004481;
}
ul[combo-list] li input:checked + label code {
  background-color: inherit;
}
ul[combo-list] li input:checked + label:before {
  background: #fff;
  border-color: #0058a1;
}
ul[combo-list] li input[type=radio]:checked + label:before {
  background-image: radial-gradient(circle, #004481, #004481 40%, #fff 50%, #fff);
}
ul[combo-list] li input[type=checkbox] + label {
  border-radius: 0.5em 1.5em 1.5em 0.5em;
}
ul[combo-list] li input[type=checkbox] + label:before {
  border-radius: 0.15em;
}
ul[combo-list] li input[type=checkbox] + label:hover:before {
  background-image: none;
  color: #919396;
  padding-top: -2px;
  content: '\2713';
}
ul[combo-list] li input[type=checkbox]:checked + label:before {
  content: '\2713';
  color: #000;
}
div.slide-wrapper div.buttons {
  -webkit-order: 10;
  order: 10;
}
div.slide-wrapper div[layout] {
  -webkit-order: 0;
  order: 0;
}
pre {
  white-space: pre-wrap;
}
.buttons {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
.buttons button {
  -ms-flex: none;
  -webkit-flex: none;
  flex: none;
  margin-left: 0.5rem;
}
.buttons button:first-child {
  margin-left: 0;
}
.buttons div.progress-bar {
  -ms-flex: auto;
  -webkit-flex: auto;
  flex: auto;
  margin-left: 0.5rem;
  box-sizing: border-box;
  border: 2px solid #004481;
  border-radius: 1rem;
  width: 10rem;
  height: 2em;
  display: inline-block;
  overflow: hidden;
}
.buttons div.progress-bar .progress-indicator {
  height: 100%;
  background-color: #539224;
  transition: width 0.1s ease-in-out;
}
@media (max-width: 50rem) {
  .progress-content {
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
  }
  .progress-content .slide-wrapper {
    -ms-flex: 6 0 auto;
    -webkit-flex: 6 0 auto;
    flex: 6 0 auto;
    margin: 1rem 0 0;
  }
  .progress-content .slide-wrapper:first-child {
    margin-top: 0;
  }
  .uw-question {
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
  }
  .uw-question .uw-slide {
    margin: 1rem 0 0;
  }
  .uw-question .uw-slide:first-child {
    margin: 0;
  }
}
div.slide-wrapper .preview {
  position: relative;
}
div.slide-wrapper .preview button.popout {
  color: #048;
  cursor: pointer;
  position: absolute;
  top: 1rem;
  right: 1rem;
  font-size: 2em;
  background: none;
  border: none;
  border-radius: 0;
  padding: 0.4rem 0.1rem;
  height: 2rem;
  width: 2rem;
}
div.slide-wrapper .preview button.popout .popout-square {
  border-style: double;
  display: block;
  width: 1.5rem;
  height: 1.5rem;
  line-height: 0;
  box-sizing: border-box;
  border-radius: 0.4rem;
  padding-left: 0.05em;
  text-shadow: 2px 2px 0px #fff, -2px -2px 0px #fff;
}
div.slide-wrapper .preview button.popout .popout-square::before {
  content: "\2924";
}
div.slide-wrapper .preview button.popout:hover,
div.slide-wrapper .preview button.popout:focus {
  box-shadow: 0 0 0.3em rgba(0,47,99,0.5);
  background-color: rgba(0,47,99,0.2);
}
div.slide-wrapper .preview button.popout:hover .popout-square,
div.slide-wrapper .preview button.popout:focus .popout-square {
  border-style: solid;
  text-shadow: 2px 2px 0px #ccd5e0, -2px -2px 0px #ccd5e0;
}
span.wc-type {
  color: #004481;
}
span.wc-string {
  color: #b35900;
}
span.wc-string:before {
  content: '"';
}
span.wc-string:after {
  content: '"';
}
span.wc-number {
  color: #3a790b;
}
span.wc-key {
  color: #800080;
}
span.wc-block {
  display: none;
}
div[layout] {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  -ms-flex: 1 0 auto;
  -webkit-flex: 1 0 auto;
  flex: 1 0 auto;
}
div[layout] div.controls {
  position: relative;
  -ms-flex: none;
  -webkit-flex: none;
  flex: none;
}
div[layout] div.layout {
  min-height: 20rem;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex: 1 1 0px;
  -webkit-flex: 1 1 0px;
  flex: 1 1 0px;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
div[layout] div.layout div[pane] {
  -ms-flex: 6 1 0px;
  -webkit-flex: 6 1 0px;
  flex: 6 1 0px;
  overflow: auto;
  border: 3px solid #004481;
  border-radius: 0.75rem;
}
div[layout] div.layout div.flex-divider {
  -ms-flex: none;
  -webkit-flex: none;
  flex: none;
  height: 1rem;
  cursor: row-resize;
}
div[layout] div.tabs {
  position: relative;
  left: 1em;
  bottom: -0.1em;
  display: inline-block;
}
div[layout] div.tabs button.toggle {
  margin: 0;
  position: relative;
  z-index: 100;
  border-left: 0.1em solid #004481;
  border-right: 0.1em solid #004481;
  border-radius: 0;
}
div[layout] div.tabs button.toggle:hover {
  z-index: 101;
}
div[layout] div.tabs button.toggle:first-child {
  border-top-left-radius: 1em;
  border-left: 0.2em solid #004481;
}
div[layout] div.tabs button.toggle:first-child:hover,
div[layout] div.tabs button.toggle:first-child:focus {
  border-color: #0058a1;
}
div[layout] div.tabs button.toggle:first-child:active {
  border-color: #002f63;
}
div[layout] div.tabs button.toggle:last-child {
  border-top-right-radius: 1em;
  border-right: 0.2em solid #004481;
}
div[layout] div.tabs button.toggle:last-child:hover,
div[layout] div.tabs button.toggle:last-child:focus {
  border-color: #0058a1;
}
div[layout] div.tabs button.toggle:last-child:active {
  border-color: #002f63;
}
div.preview {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
div.preview iframe {
  border: none;
  box-sizing: border-box;
  width: 100%;
  -ms-flex: 1 1 0px;
  -webkit-flex: 1 1 0px;
  flex: 1 1 0px;
}