/**
 * MUI Colors module
 */
/* dancing-script-regular - latin */
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/dancing-script-v8-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Dancing Script Regular"), local("DancingScript-Regular"), url("../fonts/dancing-script-v8-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/dancing-script-v8-latin-regular.woff2") format("woff2"), url("../fonts/dancing-script-v8-latin-regular.woff") format("woff"), url("../fonts/dancing-script-v8-latin-regular.ttf") format("truetype"), url("../fonts/dancing-script-v8-latin-regular.svg#DancingScript") format("svg");
  /* Legacy iOS */ }
/* dancing-script-700 - latin */
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/dancing-script-v8-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("Dancing Script Bold"), local("DancingScript-Bold"), url("../fonts/dancing-script-v8-latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/dancing-script-v8-latin-700.woff2") format("woff2"), url("../fonts/dancing-script-v8-latin-700.woff") format("woff"), url("../fonts/dancing-script-v8-latin-700.ttf") format("truetype"), url("../fonts/dancing-script-v8-latin-700.svg#DancingScript") format("svg");
  /* Legacy iOS */ }
/* architects-daughter-regular - latin */
@font-face {
  font-family: 'Architects Daughter';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/architects-daughter-v6-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Architects Daughter"), local("ArchitectsDaughter"), url("../fonts/architects-daughter-v6-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/architects-daughter-v6-latin-regular.woff2") format("woff2"), url("../fonts/architects-daughter-v6-latin-regular.woff") format("woff"), url("../fonts/architects-daughter-v6-latin-regular.ttf") format("truetype"), url("../fonts/architects-daughter-v6-latin-regular.svg#ArchitectsDaughter") format("svg");
  /* Legacy iOS */ }
/* inconsolata-regular - latin */
@font-face {
  font-family: 'Inconsolata';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/inconsolata-v15-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Inconsolata Regular"), local("Inconsolata-Regular"), url("../fonts/inconsolata-v15-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/inconsolata-v15-latin-regular.woff2") format("woff2"), url("../fonts/inconsolata-v15-latin-regular.woff") format("woff"), url("../fonts/inconsolata-v15-latin-regular.ttf") format("truetype"), url("../fonts/inconsolata-v15-latin-regular.svg#Inconsolata") format("svg");
  /* Legacy iOS */ }
/* inconsolata-700 - latin */
@font-face {
  font-family: 'Inconsolata';
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/inconsolata-v15-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("Inconsolata Bold"), local("Inconsolata-Bold"), url("../fonts/inconsolata-v15-latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/inconsolata-v15-latin-700.woff2") format("woff2"), url("../fonts/inconsolata-v15-latin-700.woff") format("woff"), url("../fonts/inconsolata-v15-latin-700.ttf") format("truetype"), url("../fonts/inconsolata-v15-latin-700.svg#Inconsolata") format("svg");
  /* Legacy iOS */ }
/* montserrat-300 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/montserrat-v10-latin-300.eot");
  /* IE9 Compat Modes */
  src: local("Montserrat Light"), local("Montserrat-Light"), url("../fonts/montserrat-v10-latin-300.eot?#iefix") format("embedded-opentype"), url("../fonts/montserrat-v10-latin-300.woff2") format("woff2"), url("../fonts/montserrat-v10-latin-300.woff") format("woff"), url("../fonts/montserrat-v10-latin-300.ttf") format("truetype"), url("../fonts/montserrat-v10-latin-300.svg#Montserrat") format("svg");
  /* Legacy iOS */ }
/* montserrat-regular - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/montserrat-v10-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Montserrat Regular"), local("Montserrat-Regular"), url("../fonts/montserrat-v10-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/montserrat-v10-latin-regular.woff2") format("woff2"), url("../fonts/montserrat-v10-latin-regular.woff") format("woff"), url("../fonts/montserrat-v10-latin-regular.ttf") format("truetype"), url("../fonts/montserrat-v10-latin-regular.svg#Montserrat") format("svg");
  /* Legacy iOS */ }
/* open-sans-condensed-300 - latin */
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/open-sans-condensed-v10-latin-300.eot");
  /* IE9 Compat Modes */
  src: local("Open Sans Cond Light"), local("OpenSans-CondensedLight"), url("../fonts/open-sans-condensed-v10-latin-300.eot?#iefix") format("embedded-opentype"), url("../fonts/open-sans-condensed-v10-latin-300.woff2") format("woff2"), url("../fonts/open-sans-condensed-v10-latin-300.woff") format("woff"), url("../fonts/open-sans-condensed-v10-latin-300.ttf") format("truetype"), url("../fonts/open-sans-condensed-v10-latin-300.svg#OpenSansCondensed") format("svg");
  /* Legacy iOS */ }
/* pangolin-regular - latin */
@font-face {
  font-family: 'Pangolin';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/pangolin-v1-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Pangolin Regular"), local("Pangolin-Regular"), url("../fonts/pangolin-v1-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/pangolin-v1-latin-regular.woff2") format("woff2"), url("../fonts/pangolin-v1-latin-regular.woff") format("woff"), url("../fonts/pangolin-v1-latin-regular.ttf") format("truetype"), url("../fonts/pangolin-v1-latin-regular.svg#Pangolin") format("svg");
  /* Legacy iOS */ }
/* roboto-mono-regular - latin */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/roboto-mono-v4-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Roboto Mono"), local("RobotoMono-Regular"), url("../fonts/roboto-mono-v4-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-mono-v4-latin-regular.woff2") format("woff2"), url("../fonts/roboto-mono-v4-latin-regular.woff") format("woff"), url("../fonts/roboto-mono-v4-latin-regular.ttf") format("truetype"), url("../fonts/roboto-mono-v4-latin-regular.svg#RobotoMono") format("svg");
  /* Legacy iOS */ }
/* amatic-sc-regular - latin */
@font-face {
  font-family: 'Amatic SC';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/amatic-sc-v9-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Amatic SC Regular"), local("AmaticSC-Regular"), url("../fonts/amatic-sc-v9-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/amatic-sc-v9-latin-regular.woff2") format("woff2"), url("../fonts/amatic-sc-v9-latin-regular.woff") format("woff"), url("../fonts/amatic-sc-v9-latin-regular.ttf") format("truetype"), url("../fonts/amatic-sc-v9-latin-regular.svg#AmaticSC") format("svg");
  /* Legacy iOS */ }
/* open-sans-300 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/open-sans-v13-latin-300.eot");
  /* IE9 Compat Modes */
  src: local("Open Sans Light"), local("OpenSans-Light"), url("../fonts/open-sans-v13-latin-300.eot?#iefix") format("embedded-opentype"), url("../fonts/open-sans-v13-latin-300.woff2") format("woff2"), url("../fonts/open-sans-v13-latin-300.woff") format("woff"), url("../fonts/open-sans-v13-latin-300.ttf") format("truetype"), url("../fonts/open-sans-v13-latin-300.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-300italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300;
  src: url("../fonts/open-sans-v13-latin-300italic.eot");
  /* IE9 Compat Modes */
  src: local("Open Sans Light Italic"), local("OpenSansLight-Italic"), url("../fonts/open-sans-v13-latin-300italic.eot?#iefix") format("embedded-opentype"), url("../fonts/open-sans-v13-latin-300italic.woff2") format("woff2"), url("../fonts/open-sans-v13-latin-300italic.woff") format("woff"), url("../fonts/open-sans-v13-latin-300italic.ttf") format("truetype"), url("../fonts/open-sans-v13-latin-300italic.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/open-sans-v13-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Open Sans"), local("OpenSans"), url("../fonts/open-sans-v13-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/open-sans-v13-latin-regular.woff2") format("woff2"), url("../fonts/open-sans-v13-latin-regular.woff") format("woff"), url("../fonts/open-sans-v13-latin-regular.ttf") format("truetype"), url("../fonts/open-sans-v13-latin-regular.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/open-sans-v13-latin-italic.eot");
  /* IE9 Compat Modes */
  src: local("Open Sans Italic"), local("OpenSans-Italic"), url("../fonts/open-sans-v13-latin-italic.eot?#iefix") format("embedded-opentype"), url("../fonts/open-sans-v13-latin-italic.woff2") format("woff2"), url("../fonts/open-sans-v13-latin-italic.woff") format("woff"), url("../fonts/open-sans-v13-latin-italic.ttf") format("truetype"), url("../fonts/open-sans-v13-latin-italic.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-600 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url("../fonts/open-sans-v13-latin-600.eot");
  /* IE9 Compat Modes */
  src: local("Open Sans Semibold"), local("OpenSans-Semibold"), url("../fonts/open-sans-v13-latin-600.eot?#iefix") format("embedded-opentype"), url("../fonts/open-sans-v13-latin-600.woff2") format("woff2"), url("../fonts/open-sans-v13-latin-600.woff") format("woff"), url("../fonts/open-sans-v13-latin-600.ttf") format("truetype"), url("../fonts/open-sans-v13-latin-600.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-600italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 600;
  src: url("../fonts/open-sans-v13-latin-600italic.eot");
  /* IE9 Compat Modes */
  src: local("Open Sans Semibold Italic"), local("OpenSans-SemiboldItalic"), url("../fonts/open-sans-v13-latin-600italic.eot?#iefix") format("embedded-opentype"), url("../fonts/open-sans-v13-latin-600italic.woff2") format("woff2"), url("../fonts/open-sans-v13-latin-600italic.woff") format("woff"), url("../fonts/open-sans-v13-latin-600italic.ttf") format("truetype"), url("../fonts/open-sans-v13-latin-600italic.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-700 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/open-sans-v13-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("Open Sans Bold"), local("OpenSans-Bold"), url("../fonts/open-sans-v13-latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/open-sans-v13-latin-700.woff2") format("woff2"), url("../fonts/open-sans-v13-latin-700.woff") format("woff"), url("../fonts/open-sans-v13-latin-700.ttf") format("truetype"), url("../fonts/open-sans-v13-latin-700.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-700italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 700;
  src: url("../fonts/open-sans-v13-latin-700italic.eot");
  /* IE9 Compat Modes */
  src: local("Open Sans Bold Italic"), local("OpenSans-BoldItalic"), url("../fonts/open-sans-v13-latin-700italic.eot?#iefix") format("embedded-opentype"), url("../fonts/open-sans-v13-latin-700italic.woff2") format("woff2"), url("../fonts/open-sans-v13-latin-700italic.woff") format("woff"), url("../fonts/open-sans-v13-latin-700italic.ttf") format("truetype"), url("../fonts/open-sans-v13-latin-700italic.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-800 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 800;
  src: url("../fonts/open-sans-v13-latin-800.eot");
  /* IE9 Compat Modes */
  src: local("Open Sans Extrabold"), local("OpenSans-Extrabold"), url("../fonts/open-sans-v13-latin-800.eot?#iefix") format("embedded-opentype"), url("../fonts/open-sans-v13-latin-800.woff2") format("woff2"), url("../fonts/open-sans-v13-latin-800.woff") format("woff"), url("../fonts/open-sans-v13-latin-800.ttf") format("truetype"), url("../fonts/open-sans-v13-latin-800.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-800italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 800;
  src: url("../fonts/open-sans-v13-latin-800italic.eot");
  /* IE9 Compat Modes */
  src: local("Open Sans Extrabold Italic"), local("OpenSans-ExtraboldItalic"), url("../fonts/open-sans-v13-latin-800italic.eot?#iefix") format("embedded-opentype"), url("../fonts/open-sans-v13-latin-800italic.woff2") format("woff2"), url("../fonts/open-sans-v13-latin-800italic.woff") format("woff"), url("../fonts/open-sans-v13-latin-800italic.ttf") format("truetype"), url("../fonts/open-sans-v13-latin-800italic.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* pt-sans-regular - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/pt-sans-v8-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("PT Sans"), local("PTSans-Regular"), url("../fonts/pt-sans-v8-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/pt-sans-v8-latin-regular.woff2") format("woff2"), url("../fonts/pt-sans-v8-latin-regular.woff") format("woff"), url("../fonts/pt-sans-v8-latin-regular.ttf") format("truetype"), url("../fonts/pt-sans-v8-latin-regular.svg#PTSans") format("svg");
  /* Legacy iOS */ }
/* pt-sans-700 - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/pt-sans-v8-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("PT Sans Bold"), local("PTSans-Bold"), url("../fonts/pt-sans-v8-latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/pt-sans-v8-latin-700.woff2") format("woff2"), url("../fonts/pt-sans-v8-latin-700.woff") format("woff"), url("../fonts/pt-sans-v8-latin-700.ttf") format("truetype"), url("../fonts/pt-sans-v8-latin-700.svg#PTSans") format("svg");
  /* Legacy iOS */ }
/* pt-sans-italic - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/pt-sans-v8-latin-italic.eot");
  /* IE9 Compat Modes */
  src: local("PT Sans Italic"), local("PTSans-Italic"), url("../fonts/pt-sans-v8-latin-italic.eot?#iefix") format("embedded-opentype"), url("../fonts/pt-sans-v8-latin-italic.woff2") format("woff2"), url("../fonts/pt-sans-v8-latin-italic.woff") format("woff"), url("../fonts/pt-sans-v8-latin-italic.ttf") format("truetype"), url("../fonts/pt-sans-v8-latin-italic.svg#PTSans") format("svg");
  /* Legacy iOS */ }
/* pt-sans-700italic - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 700;
  src: url("../fonts/pt-sans-v8-latin-700italic.eot");
  /* IE9 Compat Modes */
  src: local("PT Sans Bold Italic"), local("PTSans-BoldItalic"), url("../fonts/pt-sans-v8-latin-700italic.eot?#iefix") format("embedded-opentype"), url("../fonts/pt-sans-v8-latin-700italic.woff2") format("woff2"), url("../fonts/pt-sans-v8-latin-700italic.woff") format("woff"), url("../fonts/pt-sans-v8-latin-700italic.ttf") format("truetype"), url("../fonts/pt-sans-v8-latin-700italic.svg#PTSans") format("svg");
  /* Legacy iOS */ }
/* pt-serif-regular - latin */
@font-face {
  font-family: 'PT Serif';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/pt-serif-v8-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("PT Serif"), local("PTSerif-Regular"), url("../fonts/pt-serif-v8-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/pt-serif-v8-latin-regular.woff2") format("woff2"), url("../fonts/pt-serif-v8-latin-regular.woff") format("woff"), url("../fonts/pt-serif-v8-latin-regular.ttf") format("truetype"), url("../fonts/pt-serif-v8-latin-regular.svg#PTSerif") format("svg");
  /* Legacy iOS */ }
/* pt-serif-italic - latin */
@font-face {
  font-family: 'PT Serif';
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/pt-serif-v8-latin-italic.eot");
  /* IE9 Compat Modes */
  src: local("PT Serif Italic"), local("PTSerif-Italic"), url("../fonts/pt-serif-v8-latin-italic.eot?#iefix") format("embedded-opentype"), url("../fonts/pt-serif-v8-latin-italic.woff2") format("woff2"), url("../fonts/pt-serif-v8-latin-italic.woff") format("woff"), url("../fonts/pt-serif-v8-latin-italic.ttf") format("truetype"), url("../fonts/pt-serif-v8-latin-italic.svg#PTSerif") format("svg");
  /* Legacy iOS */ }
/* pt-serif-700 - latin */
@font-face {
  font-family: 'PT Serif';
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/pt-serif-v8-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("PT Serif Bold"), local("PTSerif-Bold"), url("../fonts/pt-serif-v8-latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/pt-serif-v8-latin-700.woff2") format("woff2"), url("../fonts/pt-serif-v8-latin-700.woff") format("woff"), url("../fonts/pt-serif-v8-latin-700.ttf") format("truetype"), url("../fonts/pt-serif-v8-latin-700.svg#PTSerif") format("svg");
  /* Legacy iOS */ }
/* pt-serif-700italic - latin */
@font-face {
  font-family: 'PT Serif';
  font-style: italic;
  font-weight: 700;
  src: url("../fonts/pt-serif-v8-latin-700italic.eot");
  /* IE9 Compat Modes */
  src: local("PT Serif Bold Italic"), local("PTSerif-BoldItalic"), url("../fonts/pt-serif-v8-latin-700italic.eot?#iefix") format("embedded-opentype"), url("../fonts/pt-serif-v8-latin-700italic.woff2") format("woff2"), url("../fonts/pt-serif-v8-latin-700italic.woff") format("woff"), url("../fonts/pt-serif-v8-latin-700italic.ttf") format("truetype"), url("../fonts/pt-serif-v8-latin-700italic.svg#PTSerif") format("svg");
  /* Legacy iOS */ }
body {
  font-family: 'PT Sans', sans-serif;
  min-height: 740px;
  background: -webkit-radial-gradient(white, rgba(156, 165, 33, 0.07));
  background: -moz-radial-gradient(white, rgba(156, 165, 33, 0.07));
  background: -ms-radial-gradient(white, rgba(156, 165, 33, 0.07));
  background: -o-radial-gradient(white, rgba(156, 165, 33, 0.07));
  background: radial-gradient(white, rgba(156, 165, 33, 0.07)); }

.bubble {
  padding: 20px;
  background: #FFCC80;
  -webkit-border-radius: 19px;
  -moz-border-radius: 19px;
  border-radius: 19px;
  font-family: "Architects Daughter", cursive; }

.bubble:after {
  content: '';
  position: absolute;
  border-style: solid;
  border-width: 15px 15px 15px 0;
  border-color: transparent #FFCC80;
  display: block;
  width: 0;
  z-index: 1;
  left: -15px;
  top: 60px; }

/*some general things*/
sub, sup {
  /* Specified in % so that the sup/sup is the
     right size relative to the surrounding text */
  font-size: 70% !important;
  /* Zero out the line-height so that it doesn't
     interfere with the positioning that follows */
  line-height: 0;
  /* Where the magic happens: makes all browsers position
     the sup/sup properly, relative to the surrounding text */
  position: relative;
  /* Note that if you're using Eric Meyer's reset.css, this
     is already set and you can remove this rule */
  vertical-align: baseline; }

sup {
  /* Move the superscripted text up */
  top: -0.5em; }

sub {
  /* Move the subscripted text down, but only
     half as far down as the superscript moved up */
  bottom: -0.25em; }

.red {
  color: #D50000; }

.green {
  color: #00C853; }

.blue {
  color: #2962FF; }

.emph {
  font-style: italic; }

.fontlarger {
  font-size: larger; }

.textright {
  text-align: right; }

.textlarge {
  font-size: 52px; }

.title {
  font-size: 70px; }
  .title small {
    font-size: 45px;
    margin-left: 15px; }
    .title small i.fa {
      font-size: 69%;
      margin-right: 7px; }

.step {
  font-size: 30px; }

.step h1 {
  font-size: 72px; }

.step h2 {
  font-style: italic;
  font-size: 40px; }

.xpath {
  font-family: 'Inconsolata', monospace;
  font-weight: 700; }

ul ul {
  margin-left: 20px;
  list-style: circle !important; }

.boxshadow {
  box-shadow: 3px 3px 3px #333333; }

/*Now the CSS*/
* {
  margin: 0;
  padding: 0; }

.tree ul {
  padding-top: 20px;
  position: relative;
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s; }

.tree li {
  float: left;
  text-align: center;
  list-style-type: none;
  position: relative;
  padding: 20px 5px 0 5px;
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s; }

/*We will use ::before and ::after to draw the connectors*/
.tree li::before, .tree li::after {
  content: '';
  position: absolute;
  top: 0;
  right: 50%;
  border-top: 2px solid #757575;
  width: 50%;
  height: 20px; }

.tree li::after {
  right: auto;
  left: 50%;
  border-left: 2px solid #757575; }

/*We need to remove left-right connectors from elements without 
any siblings*/
.tree li:only-child::after, .tree li:only-child::before {
  display: none; }

/*Remove space from the top of single children*/
.tree li:only-child {
  padding-top: 0; }

/*Remove left connector from first child and 
right connector from last child*/
.tree li:first-child::before, .tree li:last-child::after {
  border: 0 none; }

/*Adding back the vertical connector to the last nodes*/
.tree li:last-child::before {
  border-right: 2px solid #757575;
  border-radius: 0 5px 0 0;
  -webkit-border-radius: 0 5px 0 0;
  -moz-border-radius: 0 5px 0 0; }

.tree li:first-child::after {
  border-radius: 5px 0 0 0;
  -webkit-border-radius: 5px 0 0 0;
  -moz-border-radius: 5px 0 0 0; }

/*Time to add downward connectors from parents*/
.tree ul ul::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  border-left: 2px solid #757575;
  width: 0;
  height: 20px; }

.tree li a {
  border: 2px solid #424242;
  padding: 5px 10px;
  text-decoration: none;
  color: #666;
  /*font-family: arial, verdana, tahoma;*/
  font-family: "Inconsolata";
  font-size: 30px;
  display: inline-block;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  z-index: 20; }

/*step 12*/
.step.userwishes.past, .step.userwishes.future {
  opacity: 0;
  transition: opacity 1s; }

.bubble.wishes {
  left: 295px;
  top: 94px;
  position: relative;
  width: 500px;
  height: 272px; }
  .bubble.wishes ol {
    list-style: lower-alpha;
    margin-left: 40px; }

div#lookatdom p, #lookatdom img {
  box-shadow: 2px 2px 2px #333333;
  border: 1px solid #333333;
  opacity: 0.9; }

/*lookatdom*/
#lookatdomimg {
  background-image: url(img/lebowskistarsdom.png);
  height: 500px;
  width: 100%;
  top: 213px;
  left: -199px;
  /*position: absolute;*/ }

#lookatdom img {
  width: 100%;
  margin-top: 35px; }

#lookatdom {
  text-align: center; }

#lookatdom.future {
  opacity: 0; }

#lookatdom p {
  background-color: rgba(255, 255, 255, 0.7);
  padding-bottom: 20px;
  padding-top: 20px; }

#lookatdom img {
  opacity: 0.9; }

/*lookatdomoutro*/
#lookatdomoutro.future {
  opacity: 0; }

#lookatdomoutro {
  box-shadow: 5px 5px 5px #888888;
  border: 1px solid gray;
  background-color: rgba(255, 255, 255, 0.7); }

/*julianne example*/
#julianneexample.future, #julianneexample.past {
  opacity: 0; }

#julianneexample {
  text-align: center; }

#julianneexample small {
  font-size: 30px;
  font-style: italic; }

#example3 {
  width: 219px;
  height: 43px;
  position: absolute;
  top: -114px;
  left: 48px;
  opacity: 0.7; }

#julianneexample i {
  font-family: "Dancing Script", cursive;
  font-weight: bolder; }

#twoexamples i {
  font-family: "Dancing Script", cursive;
  font-weight: bolder; }

/*sleeping*/
#sleeping {
  background-image: url(../img/addon-sleeping-800px.png);
  width: 400px;
  height: 400px;
  position: absolute;
  left: 277px;
  top: -39px;
  z-index: -1; }

#firstproblemgettingthere ul {
  margin-top: 182px; }

#firstproblemgettingthere i.fa {
  display: none; }

#usexpathssteps.future .characters .c {
  opacity: 0; }

#usexpathssteps.active .characters .c {
  transition-duration: 0s;
  transition-property: opacity;
  opacity: visible;
  opacity: 1; }

#usexpathssteps.active .characters .c:nth-child(1) {
  transition-delay: 1.4s; }

#usexpathssteps.active .characters .c:nth-child(2) {
  transition-delay: 1.8s; }

#usexpathssteps.active .characters .c:nth-child(3) {
  transition-delay: 2.2s; }

#usexpathssteps.active .characters .c:nth-child(4) {
  transition-delay: 2.6s; }

#usexpathssteps.active .characters .c:nth-child(5) {
  transition-delay: 3s; }

#usexpathssteps.active .characters .c:nth-child(6) {
  transition-delay: 3.4s; }

#usexpathssteps.active .characters .c:nth-child(7) {
  transition-delay: 3.8s; }

#usexpathssteps.active .characters .c:nth-child(8) {
  transition-delay: 4.2s; }

#usexpathssteps.active .characters .c:nth-child(9) {
  transition-delay: 4.6s; }

#usexpathssteps.active .characters .c:nth-child(10) {
  transition-delay: 5s; }

#usexpathssteps.future .xpath span,
#usexpathssteps.active .xpath span {
  width: 0px;
  opacity: 0; }

#usexpathssteps.active .xpath span {
  -webkit-animation-name: toggle;
  -webkit-animation-duration: 0.1s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards;
  display: inline-block; }

#usexpathssteps.active .xpath span:nth-child(1) {
  -webkit-animation-delay: 6s; }

#usexpathssteps.active .xpath span:nth-child(2) {
  -webkit-animation-delay: 7s; }

#usexpathssteps.active .xpath span:nth-child(3) {
  -webkit-animation-delay: 8s; }

#usexpathssteps.active .xpath span:nth-child(4) {
  -webkit-animation-delay: 9s; }

#usexpathssteps.active .xpath span:nth-child(5) {
  -webkit-animation-delay: 10s; }

@keyframes toggle {
  from {
    width: 0px;
    opacity: 0; }
  to {
    width: initial;
    opacity: 1; } }
/*zoom that mother*/
#zoomthatmother i {
  font-size: 7em;
  color: rgba(0, 230, 118, 0.8);
  /*text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;*/ }

#zoomthatmother span {
  margin-left: -526px; }

#zoomthatmother.future {
  opacity: 0; }

#zoomthatmother .textblock {
  position: absolute;
  text-align: left;
  top: 48px;
  font-size: larger;
  font-family: 'Montserrat';
  width: 500px;
  left: 303px;
  box-shadow: 5px 5px 15px black;
  padding-left: 70px;
  background-color: rgba(0, 230, 118, 0.8);
  padding-top: 20px;
  padding-bottom: 20px;
  border-radius: 12px; }

.notmatchingspanrule {
  color: #E53935; }

.userexampletext {
  color: #76FF03; }

.undesirednodetext {
  color: #EF5350; }

.desirednodetext {
  color: #76FF03; }

.spanparenttext {
  color: #7CB342; }

.divgrandparenttext {
  color: #558B2F; }

/*boldtree1*/
#treestep1.active #boldtree .correspondnode {
  font-weight: bold;
  background-color: #76FF03; }

#treestep1.future {
  opacity: 0; }

/*treestep2*/
#treestep2.future {
  opacity: 0.9; }

#treestep2.active {
  opacity: 1;
  transition: opacity 1s; }

#treestep2.active #boldtree2 .circle {
  background-color: #76FF03;
  font-weight: bold; }

#treestep2 .textbox {
  position: absolute;
  left: 400px;
  width: 250px; }

#treestep2.past .textbox, #treestep2.future .textbox {
  opacity: 0;
  transition: opacity 1s; }

#treestep2.active .textbox {
  opacity: 1;
  transition: opacity 1s; }

#treestep2.past {
  opacity: 1; }

.impress-on-treestep1 #treestep2,
.impress-on-predicateenrichment #treestep2,
.impress-on-predicateenrichment2 #treestep2,
.impress-on-boldstep #treestep2 {
  opacity: 0; }

/*treestep 3*/
#treestep3 .textbox {
  width: 60%;
  margin-left: 50%;
  background-color: lightgray;
  position: absolute;
  top: -222px;
  left: -79px; }

/*first substep for the tree, giving info*/
.treesubstep .textbox {
  margin-left: 200px;
  opacity: 0;
  position: absolute; }

#treesubstep1 .textbox {
  top: -200px; }

/* at treesubstep1, always show treestep2*/
.impress-on-treesubstep1 #treestep2,
.impress-on-treesubstep2 #treestep2,
.impress-on-treesubstep3 #treestep2,
.impress-on-treesubstep4 #treestep2,
.impress-on-treesubstep5 #treestep2,
.impress-on-treesubstep6 #treestep2,
.impress-on-treesubstep7 #treestep2 {
  opacity: 1; }

#treesubstep1 .textbox {
  transition: opacity 1s 1s; }

.impress-on-treesubstep1 #treesubstep1 .textbox,
.impress-on-treesubstep2 #treesubstep2 .textbox,
.impress-on-treesubstep3 #treesubstep3 .textbox,
.impress-on-treesubstep4 #treesubstep4 .textbox,
.impress-on-treesubstep5 #treesubstep5 .textbox,
.impress-on-treesubstep6 #treesubstep6 .textbox,
.impress-on-treesubstep7 #treesubstep7 .textbox {
  opacity: 1;
  /*transition:opacity 2s 0s;*/ }

.impress-on-treesubstep2 #boldtree2 .bodynode {
  background-color: #00B0FF; }

.impress-on-treesubstep3 #boldtree2 .divnode {
  background-color: #00B0FF; }

.impress-on-treesubstep4 #boldtree2 .spannode {
  background-color: #00B0FF; }

.impress-on-treesubstep5 #boldtree2 .bnode {
  background-color: #00B0FF; }

.impress-on-treesubstep6 #boldtree2 .indicatednode {
  background-color: #689F38;
  color: whitesmoke; }

.impress-on-treesubstep6 #boldtree2 .overflownode {
  background-color: #D32F2F;
  color: whitesmoke; }

.impress-on-treesubstep6 #boldtree2 .desirednode {
  background-color: #76FF03;
  color: #333333; }

.impress-on-treesubstep1 #boldtree2 .desirednode {
  background-color: #76FF03;
  transition: background-color 2s;
  color: #333333; }

.impress-on-treesubstep1 #boldtree2 .undesirednode {
  background-color: #EF5350;
  transition: background-color 2s;
  color: #333333; }

.impress-on-treesubstep7 #boldtree2 .desirednode {
  background-color: #76FF03;
  transition: background-color 2s;
  color: #333333; }

.impress-on-treesubstep7 #boldtree2 .spanparent {
  background-color: #7CB342;
  transition: background-color 2s;
  color: whitesmoke; }

.impress-on-treesubstep7 #boldtree2 .divgrandparent {
  background-color: #558B2F;
  transition: background-color 2s;
  color: whitesmoke; }

.impress-on-treesubstep7 #boldtree2 .notmatchingspanrulenode {
  background-color: #E53935;
  transition: background-color 2s;
  color: whitesmoke; }

/*stepping through the generalised xpath*/
.currentxpathstep {
  color: #00B0FF; }

/*this is the color for the text on substep6 */
#treesubstep6 .textbox .desired {
  color: #76FF03;
  font-style: italic; }

#treesubstep6 .textbox .indicated {
  color: #689F38;
  font-style: italic; }

#treesubstep6 .textbox .overflow {
  color: #D32F2F;
  font-style: italic; }

@-webkit-keyframes movietitletranslator {
  0% {
    transform: translate3d(0px, 0px, 0px);
    /*z-index: 0;*/
    opacity: 0; }
  5% {
    /*transform: translate3d(0px, 0px, 0px);*/
    /*z-index: 0;*/
    opacity: 1;
    transform: rotateX(0deg); }
  97% {
    opacity: 1; }
  100% {
    transform: translate3d(0px, 20px, 300px) rotateX(5deg);
    /*z-index: 20;*/
    opacity: 0; } }
.movietitlewrapper {
  position: absolute;
  /*transform: rotateY(-20deg);*/
  transform-origin: top left;
  opacity: 0;
  left: 25%;
  -webkit-animation-name: movietitletranslator;
  -webkit-animation-duration: 10s;
  -webkit-animation-iteration-count: infinite;
  /*-webkit-animation-timing-function: ease-in-out;*/
  -webkit-animation-timing-function: linear;
  width: 400px;
  height: 300px;
  position: absolute; }

.movietitleimg {
  max-width: 100%;
  max-height: 100%;
  /* bottom: 0px; */
  position: absolute;
  margin-right: auto;
  margin-left: auto;
  left: 0;
  right: 0;
  bottom: 0;
  box-shadow: 0px 3px 3px #333333; }

#movietitleswapper {
  width: 100%;
  height: 400px;
  margin-top: 30px; }

#movietitle1 {
  -webkit-animation-delay: 0s; }

#movietitle2 {
  -webkit-animation-delay: -2s; }

#movietitle3 {
  -webkit-animation-delay: -4s; }

#movietitle4 {
  -webkit-animation-delay: -6s; }

#movietitle5 {
  -webkit-animation-delay: -8s; }

.imdbpageimg {
  position: absolute; }

#problem3intro3 {
  text-align: center;
  opacity: 1; }

/*do the fucked up transition for the imdbpageimgs*/
@-webkit-keyframes imdbpagetranslator {
  0% {
    transform: translate3d(0px, 0px, -400px) rotateY(-22deg);
    z-index: 0;
    opacity: 0; }
  5% {
    opacity: 1; }
  97% {
    opacity: 1; }
  100% {
    transform: translate3d(-80px, 80px, -300px) rotateY(-18deg);
    z-index: 10;
    opacity: 0; } }
#imdbpageswapper {
  height: 400px; }

.imdbpageimg {
  width: 100%;
  transform: rotateY(-20deg);
  transform-origin: top left;
  opacity: 0;
  -webkit-animation-name: imdbpagetranslator;
  -webkit-animation-duration: 15s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out; }

#imdbpage1 {
  -webkit-animation-delay: 0s; }

#imdbpage2 {
  -webkit-animation-delay: -3s; }

#imdbpage3 {
  -webkit-animation-delay: -6s; }

#imdbpage4 {
  -webkit-animation-delay: -9s; }

#imdbpage5 {
  -webkit-animation-delay: -12s; }

#problem3intro4 {
  opacity: 1; }

#steplinks a {
  pointer-events: auto;
  color: gray;
  margin-left: 4px;
  font-size: 12px; }

#steplinks {
  z-index: 9000;
  opacity: 0;
  position: absolute;
  width: 100%;
  top: 0px; }

#steplinks:hover {
  opacity: 1; }

/*first step: header*/
#firststep {
  text-align: center;
  font-family: "Montserrat", sans-serif; }
  #firststep .headertitle {
    font-size: 120%;
    font-weight: 300; }
  #firststep .of {
    font-size: 80%;
    font-weight: 300; }
  #firststep .name {
    font-style: italic;
    font-size: 130%; }
  #firststep .phdtitle {
    font-size: 140%;
    font-family: "Montserrat", sans-serif;
    margin-top: 42px; }

#docluster .card {
  background-color: #1E88E5;
  opacity: 0.8; }

/*two examples step*/
.starhighlight {
  background-color: #EEFF41;
  -webkit-filter: blur(10px);
  -moz-filter: blur(10px);
  -o-filter: blur(10px);
  -ms-filter: blur(10px);
  filter: blur(10px);
  height: 23px;
  position: absolute;
  transition-delay: 20s;
  transition: opacity;
  transition-duration: 2s; }

.impress-on-continuecluster #solution3 li:nth-child(1),
.impress-on-continuecluster #solution3 li:nth-child(3),
.impress-on-continuecluster #solution3 li:nth-child(5),
.impress-on-docluster #solution3 li:nth-child(1),
.impress-on-docluster #solution3 li:nth-child(3),
.impress-on-docluster #solution3 li:nth-child(5) {
  background-color: #81D4FA; }

.impress-on-continuecluster #solution3 li:nth-child(2),
.impress-on-docluster #solution3 li:nth-child(2) {
  background-color: #E6EE9C; }

.impress-on-continuecluster #solution3 li:nth-child(4),
.impress-on-continuecluster #solution3 li:nth-child(6),
.impress-on-docluster #solution3 li:nth-child(4),
.impress-on-docluster #solution3 li:nth-child(6) {
  background-color: #FFCC80; }

#docluster.past, #docluster.future {
  opacity: 0; }

#htmlisbuilt.future, #htmlisbuilt.past {
  opacity: 0; }

#htmlisbuilt.active {
  opacity: 1;
  transition: opacity 2s; }

#continuecluster #curlybracket {
  font-size: 200px;
  position: absolute;
  right: 310px;
  top: -150px;
  color: #333333;
  font-family: 'Open Sans Condensed', sans-serif; }

.impress-on-continuecluster #solution3 {
  opacity: 1; }

#continuecluster .card {
  width: 452px;
  position: absolute;
  top: -85px;
  left: 7px; }

#continuecluster.past, #continuecluster.future {
  opacity: 0; }

#continuecluster.active {
  opacity: 1; }

.xpathhighlight {
  color: #43A047; }

#laststep {
  text-align: center;
  font-family: 'Montserrat'; }
  #laststep p:nth-child(1) {
    font-size: 130%; }
  #laststep img {
    height: 500px;
    margin-top: 10px; }

.impress-on-laststep .step {
  opacity: 0; }

.conclusionstep .problemheader, .conclusionstep .solutionheader {
  float: left;
  margin-right: 10px; }
.conclusionstep .problemheader {
  color: #FFA726; }
.conclusionstep .solutionheader {
  color: #66BB6A; }
.conclusionstep .cardtitle {
  font-size: 150%; }

.conclusionstep, #conclusionstep {
  font-family: 'Montserrat', sans-serif;
  font-weight: 300; }

#mergeresult2 p:first-child {
  font-size: 140%; }
#mergeresult2 > ul > li {
  font-size: 120%; }

/*# sourceMappingURL=pres2.css.map */
