docs/beta/slides/LangFuzzer.slides.html


<!DOCTYPE html>
<html>
<head>

<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="chrome=1" />

<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />


<title>LangFuzzer slides</title>

<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.10/require.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<!-- General and theme style sheets -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.5.0/css/reveal.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.5.0/css/theme/simple.css" id="theme">

<!-- If the query includes 'print-pdf', include the PDF print sheet -->
<script>
if( window.location.search.match( /print-pdf/gi ) ) {
        var link = document.createElement( 'link' );
        link.rel = 'stylesheet';
        link.type = 'text/css';
        link.href = 'https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.5.0/css/print/pdf.css';
        document.getElementsByTagName( 'head' )[0].appendChild( link );
}

</script>

<!--[if lt IE 9]>
<script src="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.5.0/lib/js/html5shiv.js"></script>
<![endif]-->

<!-- Loading the mathjax macro -->
<!-- Load mathjax -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS_HTML"></script>
    <!-- MathJax configuration -->
    <script type="text/x-mathjax-config">
    MathJax.Hub.Config({
        tex2jax: {
            inlineMath: [ ['$','$'], ["\\(","\\)"] ],
            displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
            processEscapes: true,
            processEnvironments: true
        },
        // Center justify equations in code and markdown cells. Elsewhere
        // we use CSS to left justify single line equations in code cells.
        displayAlign: 'center',
        "HTML-CSS": {
            styles: {'.MathJax_Display': {"margin": 0}},
            linebreaks: { automatic: true }
        }
    });
    </script>
    <!-- End of mathjax configuration -->

<!-- Get Font-awesome from cdn -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">

<style type="text/css">
    /*!
*
* Twitter Bootstrap
*
*/
/*!
 * Bootstrap v3.3.7 (http://getbootstrap.com)
 * Copyright 2011-2016 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
body {
  margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
[hidden],
template {
  display: none;
}
a {
  background-color: transparent;
}
a:active,
a:hover {
  outline: 0;
}
abbr[title] {
  border-bottom: 1px dotted;
}
b,
strong {
  font-weight: bold;
}
dfn {
  font-style: italic;
}
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
mark {
  background: #ff0;
  color: #000;
}
small {
  font-size: 80%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
img {
  border: 0;
}
svg:not(:root) {
  overflow: hidden;
}
figure {
  margin: 1em 40px;
}
hr {
  box-sizing: content-box;
  height: 0;
}
pre {
  overflow: auto;
}
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}
button {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],
html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
input {
  line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
input[type="search"] {
  -webkit-appearance: textfield;
  box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
legend {
  border: 0;
  padding: 0;
}
textarea {
  overflow: auto;
}
optgroup {
  font-weight: bold;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th {
  padding: 0;
}
/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */
@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }
  a,
  a:visited {
    text-decoration: underline;
  }
  a[href]:after {
    content: " (" attr(href) ")";
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }
  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }
  thead {
    display: table-header-group;
  }
  tr,
  img {
    page-break-inside: avoid;
  }
  img {
    max-width: 100% !important;
  }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }
  .navbar {
    display: none;
  }
  .btn > .caret,
  .dropup > .btn > .caret {
    border-top-color: #000 !important;
  }
  .label {
    border: 1px solid #000;
  }
  .table {
    border-collapse: collapse !important;
  }
  .table td,
  .table th {
    background-color: #fff !important;
  }
  .table-bordered th,
  .table-bordered td {
    border: 1px solid #ddd !important;
  }
}
@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('../components/bootstrap/fonts/glyphicons-halflings-regular.eot');
  src: url('../components/bootstrap/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../components/bootstrap/fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../components/bootstrap/fonts/glyphicons-halflings-regular.woff') format('woff'), url('../components/bootstrap/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../components/bootstrap/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}
.glyphicon {
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.glyphicon-asterisk:before {
  content: "\002a";
}
.glyphicon-plus:before {
  content: "\002b";
}
.glyphicon-euro:before,
.glyphicon-eur:before {
  content: "\20ac";
}
.glyphicon-minus:before {
  content: "\2212";
}
.glyphicon-cloud:before {
  content: "\2601";
}
.glyphicon-envelope:before {
  content: "\2709";
}
.glyphicon-pencil:before {
  content: "\270f";
}
.glyphicon-glass:before {
  content: "\e001";
}
.glyphicon-music:before {
  content: "\e002";
}
.glyphicon-search:before {
  content: "\e003";
}
.glyphicon-heart:before {
  content: "\e005";
}
.glyphicon-star:before {
  content: "\e006";
}
.glyphicon-star-empty:before {
  content: "\e007";
}
.glyphicon-user:before {
  content: "\e008";
}
.glyphicon-film:before {
  content: "\e009";
}
.glyphicon-th-large:before {
  content: "\e010";
}
.glyphicon-th:before {
  content: "\e011";
}
.glyphicon-th-list:before {
  content: "\e012";
}
.glyphicon-ok:before {
  content: "\e013";
}
.glyphicon-remove:before {
  content: "\e014";
}
.glyphicon-zoom-in:before {
  content: "\e015";
}
.glyphicon-zoom-out:before {
  content: "\e016";
}
.glyphicon-off:before {
  content: "\e017";
}
.glyphicon-signal:before {
  content: "\e018";
}
.glyphicon-cog:before {
  content: "\e019";
}
.glyphicon-trash:before {
  content: "\e020";
}
.glyphicon-home:before {
  content: "\e021";
}
.glyphicon-file:before {
  content: "\e022";
}
.glyphicon-time:before {
  content: "\e023";
}
.glyphicon-road:before {
  content: "\e024";
}
.glyphicon-download-alt:before {
  content: "\e025";
}
.glyphicon-download:before {
  content: "\e026";
}
.glyphicon-upload:before {
  content: "\e027";
}
.glyphicon-inbox:before {
  content: "\e028";
}
.glyphicon-play-circle:before {
  content: "\e029";
}
.glyphicon-repeat:before {
  content: "\e030";
}
.glyphicon-refresh:before {
  content: "\e031";
}
.glyphicon-list-alt:before {
  content: "\e032";
}
.glyphicon-lock:before {
  content: "\e033";
}
.glyphicon-flag:before {
  content: "\e034";
}
.glyphicon-headphones:before {
  content: "\e035";
}
.glyphicon-volume-off:before {
  content: "\e036";
}
.glyphicon-volume-down:before {
  content: "\e037";
}
.glyphicon-volume-up:before {
  content: "\e038";
}
.glyphicon-qrcode:before {
  content: "\e039";
}
.glyphicon-barcode:before {
  content: "\e040";
}
.glyphicon-tag:before {
  content: "\e041";
}
.glyphicon-tags:before {
  content: "\e042";
}
.glyphicon-book:before {
  content: "\e043";
}
.glyphicon-bookmark:before {
  content: "\e044";
}
.glyphicon-print:before {
  content: "\e045";
}
.glyphicon-camera:before {
  content: "\e046";
}
.glyphicon-font:before {
  content: "\e047";
}
.glyphicon-bold:before {
  content: "\e048";
}
.glyphicon-italic:before {
  content: "\e049";
}
.glyphicon-text-height:before {
  content: "\e050";
}
.glyphicon-text-width:before {
  content: "\e051";
}
.glyphicon-align-left:before {
  content: "\e052";
}
.glyphicon-align-center:before {
  content: "\e053";
}
.glyphicon-align-right:before {
  content: "\e054";
}
.glyphicon-align-justify:before {
  content: "\e055";
}
.glyphicon-list:before {
  content: "\e056";
}
.glyphicon-indent-left:before {
  content: "\e057";
}
.glyphicon-indent-right:before {
  content: "\e058";
}
.glyphicon-facetime-video:before {
  content: "\e059";
}
.glyphicon-picture:before {
  content: "\e060";
}
.glyphicon-map-marker:before {
  content: "\e062";
}
.glyphicon-adjust:before {
  content: "\e063";
}
.glyphicon-tint:before {
  content: "\e064";
}
.glyphicon-edit:before {
  content: "\e065";
}
.glyphicon-share:before {
  content: "\e066";
}
.glyphicon-check:before {
  content: "\e067";
}
.glyphicon-move:before {
  content: "\e068";
}
.glyphicon-step-backward:before {
  content: "\e069";
}
.glyphicon-fast-backward:before {
  content: "\e070";
}
.glyphicon-backward:before {
  content: "\e071";
}
.glyphicon-play:before {
  content: "\e072";
}
.glyphicon-pause:before {
  content: "\e073";
}
.glyphicon-stop:before {
  content: "\e074";
}
.glyphicon-forward:before {
  content: "\e075";
}
.glyphicon-fast-forward:before {
  content: "\e076";
}
.glyphicon-step-forward:before {
  content: "\e077";
}
.glyphicon-eject:before {
  content: "\e078";
}
.glyphicon-chevron-left:before {
  content: "\e079";
}
.glyphicon-chevron-right:before {
  content: "\e080";
}
.glyphicon-plus-sign:before {
  content: "\e081";
}
.glyphicon-minus-sign:before {
  content: "\e082";
}
.glyphicon-remove-sign:before {
  content: "\e083";
}
.glyphicon-ok-sign:before {
  content: "\e084";
}
.glyphicon-question-sign:before {
  content: "\e085";
}
.glyphicon-info-sign:before {
  content: "\e086";
}
.glyphicon-screenshot:before {
  content: "\e087";
}
.glyphicon-remove-circle:before {
  content: "\e088";
}
.glyphicon-ok-circle:before {
  content: "\e089";
}
.glyphicon-ban-circle:before {
  content: "\e090";
}
.glyphicon-arrow-left:before {
  content: "\e091";
}
.glyphicon-arrow-right:before {
  content: "\e092";
}
.glyphicon-arrow-up:before {
  content: "\e093";
}
.glyphicon-arrow-down:before {
  content: "\e094";
}
.glyphicon-share-alt:before {
  content: "\e095";
}
.glyphicon-resize-full:before {
  content: "\e096";
}
.glyphicon-resize-small:before {
  content: "\e097";
}
.glyphicon-exclamation-sign:before {
  content: "\e101";
}
.glyphicon-gift:before {
  content: "\e102";
}
.glyphicon-leaf:before {
  content: "\e103";
}
.glyphicon-fire:before {
  content: "\e104";
}
.glyphicon-eye-open:before {
  content: "\e105";
}
.glyphicon-eye-close:before {
  content: "\e106";
}
.glyphicon-warning-sign:before {
  content: "\e107";
}
.glyphicon-plane:before {
  content: "\e108";
}
.glyphicon-calendar:before {
  content: "\e109";
}
.glyphicon-random:before {
  content: "\e110";
}
.glyphicon-comment:before {
  content: "\e111";
}
.glyphicon-magnet:before {
  content: "\e112";
}
.glyphicon-chevron-up:before {
  content: "\e113";
}
.glyphicon-chevron-down:before {
  content: "\e114";
}
.glyphicon-retweet:before {
  content: "\e115";
}
.glyphicon-shopping-cart:before {
  content: "\e116";
}
.glyphicon-folder-close:before {
  content: "\e117";
}
.glyphicon-folder-open:before {
  content: "\e118";
}
.glyphicon-resize-vertical:before {
  content: "\e119";
}
.glyphicon-resize-horizontal:before {
  content: "\e120";
}
.glyphicon-hdd:before {
  content: "\e121";
}
.glyphicon-bullhorn:before {
  content: "\e122";
}
.glyphicon-bell:before {
  content: "\e123";
}
.glyphicon-certificate:before {
  content: "\e124";
}
.glyphicon-thumbs-up:before {
  content: "\e125";
}
.glyphicon-thumbs-down:before {
  content: "\e126";
}
.glyphicon-hand-right:before {
  content: "\e127";
}
.glyphicon-hand-left:before {
  content: "\e128";
}
.glyphicon-hand-up:before {
  content: "\e129";
}
.glyphicon-hand-down:before {
  content: "\e130";
}
.glyphicon-circle-arrow-right:before {
  content: "\e131";
}
.glyphicon-circle-arrow-left:before {
  content: "\e132";
}
.glyphicon-circle-arrow-up:before {
  content: "\e133";
}
.glyphicon-circle-arrow-down:before {
  content: "\e134";
}
.glyphicon-globe:before {
  content: "\e135";
}
.glyphicon-wrench:before {
  content: "\e136";
}
.glyphicon-tasks:before {
  content: "\e137";
}
.glyphicon-filter:before {
  content: "\e138";
}
.glyphicon-briefcase:before {
  content: "\e139";
}
.glyphicon-fullscreen:before {
  content: "\e140";
}
.glyphicon-dashboard:before {
  content: "\e141";
}
.glyphicon-paperclip:before {
  content: "\e142";
}
.glyphicon-heart-empty:before {
  content: "\e143";
}
.glyphicon-link:before {
  content: "\e144";
}
.glyphicon-phone:before {
  content: "\e145";
}
.glyphicon-pushpin:before {
  content: "\e146";
}
.glyphicon-usd:before {
  content: "\e148";
}
.glyphicon-gbp:before {
  content: "\e149";
}
.glyphicon-sort:before {
  content: "\e150";
}
.glyphicon-sort-by-alphabet:before {
  content: "\e151";
}
.glyphicon-sort-by-alphabet-alt:before {
  content: "\e152";
}
.glyphicon-sort-by-order:before {
  content: "\e153";
}
.glyphicon-sort-by-order-alt:before {
  content: "\e154";
}
.glyphicon-sort-by-attributes:before {
  content: "\e155";
}
.glyphicon-sort-by-attributes-alt:before {
  content: "\e156";
}
.glyphicon-unchecked:before {
  content: "\e157";
}
.glyphicon-expand:before {
  content: "\e158";
}
.glyphicon-collapse-down:before {
  content: "\e159";
}
.glyphicon-collapse-up:before {
  content: "\e160";
}
.glyphicon-log-in:before {
  content: "\e161";
}
.glyphicon-flash:before {
  content: "\e162";
}
.glyphicon-log-out:before {
  content: "\e163";
}
.glyphicon-new-window:before {
  content: "\e164";
}
.glyphicon-record:before {
  content: "\e165";
}
.glyphicon-save:before {
  content: "\e166";
}
.glyphicon-open:before {
  content: "\e167";
}
.glyphicon-saved:before {
  content: "\e168";
}
.glyphicon-import:before {
  content: "\e169";
}
.glyphicon-export:before {
  content: "\e170";
}
.glyphicon-send:before {
  content: "\e171";
}
.glyphicon-floppy-disk:before {
  content: "\e172";
}
.glyphicon-floppy-saved:before {
  content: "\e173";
}
.glyphicon-floppy-remove:before {
  content: "\e174";
}
.glyphicon-floppy-save:before {
  content: "\e175";
}
.glyphicon-floppy-open:before {
  content: "\e176";
}
.glyphicon-credit-card:before {
  content: "\e177";
}
.glyphicon-transfer:before {
  content: "\e178";
}
.glyphicon-cutlery:before {
  content: "\e179";
}
.glyphicon-header:before {
  content: "\e180";
}
.glyphicon-compressed:before {
  content: "\e181";
}
.glyphicon-earphone:before {
  content: "\e182";
}
.glyphicon-phone-alt:before {
  content: "\e183";
}
.glyphicon-tower:before {
  content: "\e184";
}
.glyphicon-stats:before {
  content: "\e185";
}
.glyphicon-sd-video:before {
  content: "\e186";
}
.glyphicon-hd-video:before {
  content: "\e187";
}
.glyphicon-subtitles:before {
  content: "\e188";
}
.glyphicon-sound-stereo:before {
  content: "\e189";
}
.glyphicon-sound-dolby:before {
  content: "\e190";
}
.glyphicon-sound-5-1:before {
  content: "\e191";
}
.glyphicon-sound-6-1:before {
  content: "\e192";
}
.glyphicon-sound-7-1:before {
  content: "\e193";
}
.glyphicon-copyright-mark:before {
  content: "\e194";
}
.glyphicon-registration-mark:before {
  content: "\e195";
}
.glyphicon-cloud-download:before {
  content: "\e197";
}
.glyphicon-cloud-upload:before {
  content: "\e198";
}
.glyphicon-tree-conifer:before {
  content: "\e199";
}
.glyphicon-tree-deciduous:before {
  content: "\e200";
}
.glyphicon-cd:before {
  content: "\e201";
}
.glyphicon-save-file:before {
  content: "\e202";
}
.glyphicon-open-file:before {
  content: "\e203";
}
.glyphicon-level-up:before {
  content: "\e204";
}
.glyphicon-copy:before {
  content: "\e205";
}
.glyphicon-paste:before {
  content: "\e206";
}
.glyphicon-alert:before {
  content: "\e209";
}
.glyphicon-equalizer:before {
  content: "\e210";
}
.glyphicon-king:before {
  content: "\e211";
}
.glyphicon-queen:before {
  content: "\e212";
}
.glyphicon-pawn:before {
  content: "\e213";
}
.glyphicon-bishop:before {
  content: "\e214";
}
.glyphicon-knight:before {
  content: "\e215";
}
.glyphicon-baby-formula:before {
  content: "\e216";
}
.glyphicon-tent:before {
  content: "\26fa";
}
.glyphicon-blackboard:before {
  content: "\e218";
}
.glyphicon-bed:before {
  content: "\e219";
}
.glyphicon-apple:before {
  content: "\f8ff";
}
.glyphicon-erase:before {
  content: "\e221";
}
.glyphicon-hourglass:before {
  content: "\231b";
}
.glyphicon-lamp:before {
  content: "\e223";
}
.glyphicon-duplicate:before {
  content: "\e224";
}
.glyphicon-piggy-bank:before {
  content: "\e225";
}
.glyphicon-scissors:before {
  content: "\e226";
}
.glyphicon-bitcoin:before {
  content: "\e227";
}
.glyphicon-btc:before {
  content: "\e227";
}
.glyphicon-xbt:before {
  content: "\e227";
}
.glyphicon-yen:before {
  content: "\00a5";
}
.glyphicon-jpy:before {
  content: "\00a5";
}
.glyphicon-ruble:before {
  content: "\20bd";
}
.glyphicon-rub:before {
  content: "\20bd";
}
.glyphicon-scale:before {
  content: "\e230";
}
.glyphicon-ice-lolly:before {
  content: "\e231";
}
.glyphicon-ice-lolly-tasted:before {
  content: "\e232";
}
.glyphicon-education:before {
  content: "\e233";
}
.glyphicon-option-horizontal:before {
  content: "\e234";
}
.glyphicon-option-vertical:before {
  content: "\e235";
}
.glyphicon-menu-hamburger:before {
  content: "\e236";
}
.glyphicon-modal-window:before {
  content: "\e237";
}
.glyphicon-oil:before {
  content: "\e238";
}
.glyphicon-grain:before {
  content: "\e239";
}
.glyphicon-sunglasses:before {
  content: "\e240";
}
.glyphicon-text-size:before {
  content: "\e241";
}
.glyphicon-text-color:before {
  content: "\e242";
}
.glyphicon-text-background:before {
  content: "\e243";
}
.glyphicon-object-align-top:before {
  content: "\e244";
}
.glyphicon-object-align-bottom:before {
  content: "\e245";
}
.glyphicon-object-align-horizontal:before {
  content: "\e246";
}
.glyphicon-object-align-left:before {
  content: "\e247";
}
.glyphicon-object-align-vertical:before {
  content: "\e248";
}
.glyphicon-object-align-right:before {
  content: "\e249";
}
.glyphicon-triangle-right:before {
  content: "\e250";
}
.glyphicon-triangle-left:before {
  content: "\e251";
}
.glyphicon-triangle-bottom:before {
  content: "\e252";
}
.glyphicon-triangle-top:before {
  content: "\e253";
}
.glyphicon-console:before {
  content: "\e254";
}
.glyphicon-superscript:before {
  content: "\e255";
}
.glyphicon-subscript:before {
  content: "\e256";
}
.glyphicon-menu-left:before {
  content: "\e257";
}
.glyphicon-menu-right:before {
  content: "\e258";
}
.glyphicon-menu-down:before {
  content: "\e259";
}
.glyphicon-menu-up:before {
  content: "\e260";
}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html {
  font-size: 10px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  line-height: 1.42857143;
  color: #000;
  background-color: #fff;
}
input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}
a {
  color: #337ab7;
  text-decoration: none;
}
a:hover,
a:focus {
  color: #23527c;
  text-decoration: underline;
}
a:focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
figure {
  margin: 0;
}
img {
  vertical-align: middle;
}
.img-responsive,
.thumbnail > img,
.thumbnail a > img,
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  display: block;
  max-width: 100%;
  height: auto;
}
.img-rounded {
  border-radius: 3px;
}
.img-thumbnail {
  padding: 4px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 2px;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  display: inline-block;
  max-width: 100%;
  height: auto;
}
.img-circle {
  border-radius: 50%;
}
hr {
  margin-top: 18px;
  margin-bottom: 18px;
  border: 0;
  border-top: 1px solid #eeeeee;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}
[role="button"] {
  cursor: pointer;
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: inherit;
}
h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small,
.h1 small,
.h2 small,
.h3 small,
.h4 small,
.h5 small,
.h6 small,
h1 .small,
h2 .small,
h3 .small,
h4 .small,
h5 .small,
h6 .small,
.h1 .small,
.h2 .small,
.h3 .small,
.h4 .small,
.h5 .small,
.h6 .small {
  font-weight: normal;
  line-height: 1;
  color: #777777;
}
h1,
.h1,
h2,
.h2,
h3,
.h3 {
  margin-top: 18px;
  margin-bottom: 9px;
}
h1 small,
.h1 small,
h2 small,
.h2 small,
h3 small,
.h3 small,
h1 .small,
.h1 .small,
h2 .small,
.h2 .small,
h3 .small,
.h3 .small {
  font-size: 65%;
}
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  margin-top: 9px;
  margin-bottom: 9px;
}
h4 small,
.h4 small,
h5 small,
.h5 small,
h6 small,
.h6 small,
h4 .small,
.h4 .small,
h5 .small,
.h5 .small,
h6 .small,
.h6 .small {
  font-size: 75%;
}
h1,
.h1 {
  font-size: 33px;
}
h2,
.h2 {
  font-size: 27px;
}
h3,
.h3 {
  font-size: 23px;
}
h4,
.h4 {
  font-size: 17px;
}
h5,
.h5 {
  font-size: 13px;
}
h6,
.h6 {
  font-size: 12px;
}
p {
  margin: 0 0 9px;
}
.lead {
  margin-bottom: 18px;
  font-size: 14px;
  font-weight: 300;
  line-height: 1.4;
}
@media (min-width: 768px) {
  .lead {
    font-size: 19.5px;
  }
}
small,
.small {
  font-size: 92%;
}
mark,
.mark {
  background-color: #fcf8e3;
  padding: .2em;
}
.text-left {
  text-align: left;
}
.text-right {
  text-align: right;
}
.text-center {
  text-align: center;
}
.text-justify {
  text-align: justify;
}
.text-nowrap {
  white-space: nowrap;
}
.text-lowercase {
  text-transform: lowercase;
}
.text-uppercase {
  text-transform: uppercase;
}
.text-capitalize {
  text-transform: capitalize;
}
.text-muted {
  color: #777777;
}
.text-primary {
  color: #337ab7;
}
a.text-primary:hover,
a.text-primary:focus {
  color: #286090;
}
.text-success {
  color: #3c763d;
}
a.text-success:hover,
a.text-success:focus {
  color: #2b542c;
}
.text-info {
  color: #31708f;
}
a.text-info:hover,
a.text-info:focus {
  color: #245269;
}
.text-warning {
  color: #8a6d3b;
}
a.text-warning:hover,
a.text-warning:focus {
  color: #66512c;
}
.text-danger {
  color: #a94442;
}
a.text-danger:hover,
a.text-danger:focus {
  color: #843534;
}
.bg-primary {
  color: #fff;
  background-color: #337ab7;
}
a.bg-primary:hover,
a.bg-primary:focus {
  background-color: #286090;
}
.bg-success {
  background-color: #dff0d8;
}
a.bg-success:hover,
a.bg-success:focus {
  background-color: #c1e2b3;
}
.bg-info {
  background-color: #d9edf7;
}
a.bg-info:hover,
a.bg-info:focus {
  background-color: #afd9ee;
}
.bg-warning {
  background-color: #fcf8e3;
}
a.bg-warning:hover,
a.bg-warning:focus {
  background-color: #f7ecb5;
}
.bg-danger {
  background-color: #f2dede;
}
a.bg-danger:hover,
a.bg-danger:focus {
  background-color: #e4b9b9;
}
.page-header {
  padding-bottom: 8px;
  margin: 36px 0 18px;
  border-bottom: 1px solid #eeeeee;
}
ul,
ol {
  margin-top: 0;
  margin-bottom: 9px;
}
ul ul,
ol ul,
ul ol,
ol ol {
  margin-bottom: 0;
}
.list-unstyled {
  padding-left: 0;
  list-style: none;
}
.list-inline {
  padding-left: 0;
  list-style: none;
  margin-left: -5px;
}
.list-inline > li {
  display: inline-block;
  padding-left: 5px;
  padding-right: 5px;
}
dl {
  margin-top: 0;
  margin-bottom: 18px;
}
dt,
dd {
  line-height: 1.42857143;
}
dt {
  font-weight: bold;
}
dd {
  margin-left: 0;
}
@media (min-width: 541px) {
  .dl-horizontal dt {
    float: left;
    width: 160px;
    clear: left;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dl-horizontal dd {
    margin-left: 180px;
  }
}
abbr[title],
abbr[data-original-title] {
  cursor: help;
  border-bottom: 1px dotted #777777;
}
.initialism {
  font-size: 90%;
  text-transform: uppercase;
}
blockquote {
  padding: 9px 18px;
  margin: 0 0 18px;
  font-size: inherit;
  border-left: 5px solid #eeeeee;
}
blockquote p:last-child,
blockquote ul:last-child,
blockquote ol:last-child {
  margin-bottom: 0;
}
blockquote footer,
blockquote small,
blockquote .small {
  display: block;
  font-size: 80%;
  line-height: 1.42857143;
  color: #777777;
}
blockquote footer:before,
blockquote small:before,
blockquote .small:before {
  content: '\2014 \00A0';
}
.blockquote-reverse,
blockquote.pull-right {
  padding-right: 15px;
  padding-left: 0;
  border-right: 5px solid #eeeeee;
  border-left: 0;
  text-align: right;
}
.blockquote-reverse footer:before,
blockquote.pull-right footer:before,
.blockquote-reverse small:before,
blockquote.pull-right small:before,
.blockquote-reverse .small:before,
blockquote.pull-right .small:before {
  content: '';
}
.blockquote-reverse footer:after,
blockquote.pull-right footer:after,
.blockquote-reverse small:after,
blockquote.pull-right small:after,
.blockquote-reverse .small:after,
blockquote.pull-right .small:after {
  content: '\00A0 \2014';
}
address {
  margin-bottom: 18px;
  font-style: normal;
  line-height: 1.42857143;
}
code,
kbd,
pre,
samp {
  font-family: monospace;
}
code {
  padding: 2px 4px;
  font-size: 90%;
  color: #c7254e;
  background-color: #f9f2f4;
  border-radius: 2px;
}
kbd {
  padding: 2px 4px;
  font-size: 90%;
  color: #888;
  background-color: transparent;
  border-radius: 1px;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
}
kbd kbd {
  padding: 0;
  font-size: 100%;
  font-weight: bold;
  box-shadow: none;
}
pre {
  display: block;
  padding: 8.5px;
  margin: 0 0 9px;
  font-size: 12px;
  line-height: 1.42857143;
  word-break: break-all;
  word-wrap: break-word;
  color: #333333;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 2px;
}
pre code {
  padding: 0;
  font-size: inherit;
  color: inherit;
  white-space: pre-wrap;
  background-color: transparent;
  border-radius: 0;
}
.pre-scrollable {
  max-height: 340px;
  overflow-y: scroll;
}
.container {
  margin-right: auto;
  margin-left: auto;
  padding-left: 0px;
  padding-right: 0px;
}
@media (min-width: 768px) {
  .container {
    width: 768px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 940px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1140px;
  }
}
.container-fluid {
  margin-right: auto;
  margin-left: auto;
  padding-left: 0px;
  padding-right: 0px;
}
.row {
  margin-left: 0px;
  margin-right: 0px;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
  position: relative;
  min-height: 1px;
  padding-left: 0px;
  padding-right: 0px;
}
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
  float: left;
}
.col-xs-12 {
  width: 100%;
}
.col-xs-11 {
  width: 91.66666667%;
}
.col-xs-10 {
  width: 83.33333333%;
}
.col-xs-9 {
  width: 75%;
}
.col-xs-8 {
  width: 66.66666667%;
}
.col-xs-7 {
  width: 58.33333333%;
}
.col-xs-6 {
  width: 50%;
}
.col-xs-5 {
  width: 41.66666667%;
}
.col-xs-4 {
  width: 33.33333333%;
}
.col-xs-3 {
  width: 25%;
}
.col-xs-2 {
  width: 16.66666667%;
}
.col-xs-1 {
  width: 8.33333333%;
}
.col-xs-pull-12 {
  right: 100%;
}
.col-xs-pull-11 {
  right: 91.66666667%;
}
.col-xs-pull-10 {
  right: 83.33333333%;
}
.col-xs-pull-9 {
  right: 75%;
}
.col-xs-pull-8 {
  right: 66.66666667%;
}
.col-xs-pull-7 {
  right: 58.33333333%;
}
.col-xs-pull-6 {
  right: 50%;
}
.col-xs-pull-5 {
  right: 41.66666667%;
}
.col-xs-pull-4 {
  right: 33.33333333%;
}
.col-xs-pull-3 {
  right: 25%;
}
.col-xs-pull-2 {
  right: 16.66666667%;
}
.col-xs-pull-1 {
  right: 8.33333333%;
}
.col-xs-pull-0 {
  right: auto;
}
.col-xs-push-12 {
  left: 100%;
}
.col-xs-push-11 {
  left: 91.66666667%;
}
.col-xs-push-10 {
  left: 83.33333333%;
}
.col-xs-push-9 {
  left: 75%;
}
.col-xs-push-8 {
  left: 66.66666667%;
}
.col-xs-push-7 {
  left: 58.33333333%;
}
.col-xs-push-6 {
  left: 50%;
}
.col-xs-push-5 {
  left: 41.66666667%;
}
.col-xs-push-4 {
  left: 33.33333333%;
}
.col-xs-push-3 {
  left: 25%;
}
.col-xs-push-2 {
  left: 16.66666667%;
}
.col-xs-push-1 {
  left: 8.33333333%;
}
.col-xs-push-0 {
  left: auto;
}
.col-xs-offset-12 {
  margin-left: 100%;
}
.col-xs-offset-11 {
  margin-left: 91.66666667%;
}
.col-xs-offset-10 {
  margin-left: 83.33333333%;
}
.col-xs-offset-9 {
  margin-left: 75%;
}
.col-xs-offset-8 {
  margin-left: 66.66666667%;
}
.col-xs-offset-7 {
  margin-left: 58.33333333%;
}
.col-xs-offset-6 {
  margin-left: 50%;
}
.col-xs-offset-5 {
  margin-left: 41.66666667%;
}
.col-xs-offset-4 {
  margin-left: 33.33333333%;
}
.col-xs-offset-3 {
  margin-left: 25%;
}
.col-xs-offset-2 {
  margin-left: 16.66666667%;
}
.col-xs-offset-1 {
  margin-left: 8.33333333%;
}
.col-xs-offset-0 {
  margin-left: 0%;
}
@media (min-width: 768px) {
  .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
    float: left;
  }
  .col-sm-12 {
    width: 100%;
  }
  .col-sm-11 {
    width: 91.66666667%;
  }
  .col-sm-10 {
    width: 83.33333333%;
  }
  .col-sm-9 {
    width: 75%;
  }
  .col-sm-8 {
    width: 66.66666667%;
  }
  .col-sm-7 {
    width: 58.33333333%;
  }
  .col-sm-6 {
    width: 50%;
  }
  .col-sm-5 {
    width: 41.66666667%;
  }
  .col-sm-4 {
    width: 33.33333333%;
  }
  .col-sm-3 {
    width: 25%;
  }
  .col-sm-2 {
    width: 16.66666667%;
  }
  .col-sm-1 {
    width: 8.33333333%;
  }
  .col-sm-pull-12 {
    right: 100%;
  }
  .col-sm-pull-11 {
    right: 91.66666667%;
  }
  .col-sm-pull-10 {
    right: 83.33333333%;
  }
  .col-sm-pull-9 {
    right: 75%;
  }
  .col-sm-pull-8 {
    right: 66.66666667%;
  }
  .col-sm-pull-7 {
    right: 58.33333333%;
  }
  .col-sm-pull-6 {
    right: 50%;
  }
  .col-sm-pull-5 {
    right: 41.66666667%;
  }
  .col-sm-pull-4 {
    right: 33.33333333%;
  }
  .col-sm-pull-3 {
    right: 25%;
  }
  .col-sm-pull-2 {
    right: 16.66666667%;
  }
  .col-sm-pull-1 {
    right: 8.33333333%;
  }
  .col-sm-pull-0 {
    right: auto;
  }
  .col-sm-push-12 {
    left: 100%;
  }
  .col-sm-push-11 {
    left: 91.66666667%;
  }
  .col-sm-push-10 {
    left: 83.33333333%;
  }
  .col-sm-push-9 {
    left: 75%;
  }
  .col-sm-push-8 {
    left: 66.66666667%;
  }
  .col-sm-push-7 {
    left: 58.33333333%;
  }
  .col-sm-push-6 {
    left: 50%;
  }
  .col-sm-push-5 {
    left: 41.66666667%;
  }
  .col-sm-push-4 {
    left: 33.33333333%;
  }
  .col-sm-push-3 {
    left: 25%;
  }
  .col-sm-push-2 {
    left: 16.66666667%;
  }
  .col-sm-push-1 {
    left: 8.33333333%;
  }
  .col-sm-push-0 {
    left: auto;
  }
  .col-sm-offset-12 {
    margin-left: 100%;
  }
  .col-sm-offset-11 {
    margin-left: 91.66666667%;
  }
  .col-sm-offset-10 {
    margin-left: 83.33333333%;
  }
  .col-sm-offset-9 {
    margin-left: 75%;
  }
  .col-sm-offset-8 {
    margin-left: 66.66666667%;
  }
  .col-sm-offset-7 {
    margin-left: 58.33333333%;
  }
  .col-sm-offset-6 {
    margin-left: 50%;
  }
  .col-sm-offset-5 {
    margin-left: 41.66666667%;
  }
  .col-sm-offset-4 {
    margin-left: 33.33333333%;
  }
  .col-sm-offset-3 {
    margin-left: 25%;
  }
  .col-sm-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-sm-offset-1 {
    margin-left: 8.33333333%;
  }
  .col-sm-offset-0 {
    margin-left: 0%;
  }
}
@media (min-width: 992px) {
  .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
    float: left;
  }
  .col-md-12 {
    width: 100%;
  }
  .col-md-11 {
    width: 91.66666667%;
  }
  .col-md-10 {
    width: 83.33333333%;
  }
  .col-md-9 {
    width: 75%;
  }
  .col-md-8 {
    width: 66.66666667%;
  }
  .col-md-7 {
    width: 58.33333333%;
  }
  .col-md-6 {
    width: 50%;
  }
  .col-md-5 {
    width: 41.66666667%;
  }
  .col-md-4 {
    width: 33.33333333%;
  }
  .col-md-3 {
    width: 25%;
  }
  .col-md-2 {
    width: 16.66666667%;
  }
  .col-md-1 {
    width: 8.33333333%;
  }
  .col-md-pull-12 {
    right: 100%;
  }
  .col-md-pull-11 {
    right: 91.66666667%;
  }
  .col-md-pull-10 {
    right: 83.33333333%;
  }
  .col-md-pull-9 {
    right: 75%;
  }
  .col-md-pull-8 {
    right: 66.66666667%;
  }
  .col-md-pull-7 {
    right: 58.33333333%;
  }
  .col-md-pull-6 {
    right: 50%;
  }
  .col-md-pull-5 {
    right: 41.66666667%;
  }
  .col-md-pull-4 {
    right: 33.33333333%;
  }
  .col-md-pull-3 {
    right: 25%;
  }
  .col-md-pull-2 {
    right: 16.66666667%;
  }
  .col-md-pull-1 {
    right: 8.33333333%;
  }
  .col-md-pull-0 {
    right: auto;
  }
  .col-md-push-12 {
    left: 100%;
  }
  .col-md-push-11 {
    left: 91.66666667%;
  }
  .col-md-push-10 {
    left: 83.33333333%;
  }
  .col-md-push-9 {
    left: 75%;
  }
  .col-md-push-8 {
    left: 66.66666667%;
  }
  .col-md-push-7 {
    left: 58.33333333%;
  }
  .col-md-push-6 {
    left: 50%;
  }
  .col-md-push-5 {
    left: 41.66666667%;
  }
  .col-md-push-4 {
    left: 33.33333333%;
  }
  .col-md-push-3 {
    left: 25%;
  }
  .col-md-push-2 {
    left: 16.66666667%;
  }
  .col-md-push-1 {
    left: 8.33333333%;
  }
  .col-md-push-0 {
    left: auto;
  }
  .col-md-offset-12 {
    margin-left: 100%;
  }
  .col-md-offset-11 {
    margin-left: 91.66666667%;
  }
  .col-md-offset-10 {
    margin-left: 83.33333333%;
  }
  .col-md-offset-9 {
    margin-left: 75%;
  }
  .col-md-offset-8 {
    margin-left: 66.66666667%;
  }
  .col-md-offset-7 {
    margin-left: 58.33333333%;
  }
  .col-md-offset-6 {
    margin-left: 50%;
  }
  .col-md-offset-5 {
    margin-left: 41.66666667%;
  }
  .col-md-offset-4 {
    margin-left: 33.33333333%;
  }
  .col-md-offset-3 {
    margin-left: 25%;
  }
  .col-md-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-md-offset-1 {
    margin-left: 8.33333333%;
  }
  .col-md-offset-0 {
    margin-left: 0%;
  }
}
@media (min-width: 1200px) {
  .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
    float: left;
  }
  .col-lg-12 {
    width: 100%;
  }
  .col-lg-11 {
    width: 91.66666667%;
  }
  .col-lg-10 {
    width: 83.33333333%;
  }
  .col-lg-9 {
    width: 75%;
  }
  .col-lg-8 {
    width: 66.66666667%;
  }
  .col-lg-7 {
    width: 58.33333333%;
  }
  .col-lg-6 {
    width: 50%;
  }
  .col-lg-5 {
    width: 41.66666667%;
  }
  .col-lg-4 {
    width: 33.33333333%;
  }
  .col-lg-3 {
    width: 25%;
  }
  .col-lg-2 {
    width: 16.66666667%;
  }
  .col-lg-1 {
    width: 8.33333333%;
  }
  .col-lg-pull-12 {
    right: 100%;
  }
  .col-lg-pull-11 {
    right: 91.66666667%;
  }
  .col-lg-pull-10 {
    right: 83.33333333%;
  }
  .col-lg-pull-9 {
    right: 75%;
  }
  .col-lg-pull-8 {
    right: 66.66666667%;
  }
  .col-lg-pull-7 {
    right: 58.33333333%;
  }
  .col-lg-pull-6 {
    right: 50%;
  }
  .col-lg-pull-5 {
    right: 41.66666667%;
  }
  .col-lg-pull-4 {
    right: 33.33333333%;
  }
  .col-lg-pull-3 {
    right: 25%;
  }
  .col-lg-pull-2 {
    right: 16.66666667%;
  }
  .col-lg-pull-1 {
    right: 8.33333333%;
  }
  .col-lg-pull-0 {
    right: auto;
  }
  .col-lg-push-12 {
    left: 100%;
  }
  .col-lg-push-11 {
    left: 91.66666667%;
  }
  .col-lg-push-10 {
    left: 83.33333333%;
  }
  .col-lg-push-9 {
    left: 75%;
  }
  .col-lg-push-8 {
    left: 66.66666667%;
  }
  .col-lg-push-7 {
    left: 58.33333333%;
  }
  .col-lg-push-6 {
    left: 50%;
  }
  .col-lg-push-5 {
    left: 41.66666667%;
  }
  .col-lg-push-4 {
    left: 33.33333333%;
  }
  .col-lg-push-3 {
    left: 25%;
  }
  .col-lg-push-2 {
    left: 16.66666667%;
  }
  .col-lg-push-1 {
    left: 8.33333333%;
  }
  .col-lg-push-0 {
    left: auto;
  }
  .col-lg-offset-12 {
    margin-left: 100%;
  }
  .col-lg-offset-11 {
    margin-left: 91.66666667%;
  }
  .col-lg-offset-10 {
    margin-left: 83.33333333%;
  }
  .col-lg-offset-9 {
    margin-left: 75%;
  }
  .col-lg-offset-8 {
    margin-left: 66.66666667%;
  }
  .col-lg-offset-7 {
    margin-left: 58.33333333%;
  }
  .col-lg-offset-6 {
    margin-left: 50%;
  }
  .col-lg-offset-5 {
    margin-left: 41.66666667%;
  }
  .col-lg-offset-4 {
    margin-left: 33.33333333%;
  }
  .col-lg-offset-3 {
    margin-left: 25%;
  }
  .col-lg-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-lg-offset-1 {
    margin-left: 8.33333333%;
  }
  .col-lg-offset-0 {
    margin-left: 0%;
  }
}
table {
  background-color: transparent;
}
caption {
  padding-top: 8px;
  padding-bottom: 8px;
  color: #777777;
  text-align: left;
}
th {
  text-align: left;
}
.table {
  width: 100%;
  max-width: 100%;
  margin-bottom: 18px;
}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  padding: 8px;
  line-height: 1.42857143;
  vertical-align: top;
  border-top: 1px solid #ddd;
}
.table > thead > tr > th {
  vertical-align: bottom;
  border-bottom: 2px solid #ddd;
}
.table > caption + thead > tr:first-child > th,
.table > colgroup + thead > tr:first-child > th,
.table > thead:first-child > tr:first-child > th,
.table > caption + thead > tr:first-child > td,
.table > colgroup + thead > tr:first-child > td,
.table > thead:first-child > tr:first-child > td {
  border-top: 0;
}
.table > tbody + tbody {
  border-top: 2px solid #ddd;
}
.table .table {
  background-color: #fff;
}
.table-condensed > thead > tr > th,
.table-condensed > tbody > tr > th,
.table-condensed > tfoot > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > tbody > tr > td,
.table-condensed > tfoot > tr > td {
  padding: 5px;
}
.table-bordered {
  border: 1px solid #ddd;
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
  border: 1px solid #ddd;
}
.table-bordered > thead > tr > th,
.table-bordered > thead > tr > td {
  border-bottom-width: 2px;
}
.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #f9f9f9;
}
.table-hover > tbody > tr:hover {
  background-color: #f5f5f5;
}
table col[class*="col-"] {
  position: static;
  float: none;
  display: table-column;
}
table td[class*="col-"],
table th[class*="col-"] {
  position: static;
  float: none;
  display: table-cell;
}
.table > thead > tr > td.active,
.table > tbody > tr > td.active,
.table > tfoot > tr > td.active,
.table > thead > tr > th.active,
.table > tbody > tr > th.active,
.table > tfoot > tr > th.active,
.table > thead > tr.active > td,
.table > tbody > tr.active > td,
.table > tfoot > tr.active > td,
.table > thead > tr.active > th,
.table > tbody > tr.active > th,
.table > tfoot > tr.active > th {
  background-color: #f5f5f5;
}
.table-hover > tbody > tr > td.active:hover,
.table-hover > tbody > tr > th.active:hover,
.table-hover > tbody > tr.active:hover > td,
.table-hover > tbody > tr:hover > .active,
.table-hover > tbody > tr.active:hover > th {
  background-color: #e8e8e8;
}
.table > thead > tr > td.success,
.table > tbody > tr > td.success,
.table > tfoot > tr > td.success,
.table > thead > tr > th.success,
.table > tbody > tr > th.success,
.table > tfoot > tr > th.success,
.table > thead > tr.success > td,
.table > tbody > tr.success > td,
.table > tfoot > tr.success > td,
.table > thead > tr.success > th,
.table > tbody > tr.success > th,
.table > tfoot > tr.success > th {
  background-color: #dff0d8;
}
.table-hover > tbody > tr > td.success:hover,
.table-hover > tbody > tr > th.success:hover,
.table-hover > tbody > tr.success:hover > td,
.table-hover > tbody > tr:hover > .success,
.table-hover > tbody > tr.success:hover > th {
  background-color: #d0e9c6;
}
.table > thead > tr > td.info,
.table > tbody > tr > td.info,
.table > tfoot > tr > td.info,
.table > thead > tr > th.info,
.table > tbody > tr > th.info,
.table > tfoot > tr > th.info,
.table > thead > tr.info > td,
.table > tbody > tr.info > td,
.table > tfoot > tr.info > td,
.table > thead > tr.info > th,
.table > tbody > tr.info > th,
.table > tfoot > tr.info > th {
  background-color: #d9edf7;
}
.table-hover > tbody > tr > td.info:hover,
.table-hover > tbody > tr > th.info:hover,
.table-hover > tbody > tr.info:hover > td,
.table-hover > tbody > tr:hover > .info,
.table-hover > tbody > tr.info:hover > th {
  background-color: #c4e3f3;
}
.table > thead > tr > td.warning,
.table > tbody > tr > td.warning,
.table > tfoot > tr > td.warning,
.table > thead > tr > th.warning,
.table > tbody > tr > th.warning,
.table > tfoot > tr > th.warning,
.table > thead > tr.warning > td,
.table > tbody > tr.warning > td,
.table > tfoot > tr.warning > td,
.table > thead > tr.warning > th,
.table > tbody > tr.warning > th,
.table > tfoot > tr.warning > th {
  background-color: #fcf8e3;
}
.table-hover > tbody > tr > td.warning:hover,
.table-hover > tbody > tr > th.warning:hover,
.table-hover > tbody > tr.warning:hover > td,
.table-hover > tbody > tr:hover > .warning,
.table-hover > tbody > tr.warning:hover > th {
  background-color: #faf2cc;
}
.table > thead > tr > td.danger,
.table > tbody > tr > td.danger,
.table > tfoot > tr > td.danger,
.table > thead > tr > th.danger,
.table > tbody > tr > th.danger,
.table > tfoot > tr > th.danger,
.table > thead > tr.danger > td,
.table > tbody > tr.danger > td,
.table > tfoot > tr.danger > td,
.table > thead > tr.danger > th,
.table > tbody > tr.danger > th,
.table > tfoot > tr.danger > th {
  background-color: #f2dede;
}
.table-hover > tbody > tr > td.danger:hover,
.table-hover > tbody > tr > th.danger:hover,
.table-hover > tbody > tr.danger:hover > td,
.table-hover > tbody > tr:hover > .danger,
.table-hover > tbody > tr.danger:hover > th {
  background-color: #ebcccc;
}
.table-responsive {
  overflow-x: auto;
  min-height: 0.01%;
}
@media screen and (max-width: 767px) {
  .table-responsive {
    width: 100%;
    margin-bottom: 13.5px;
    overflow-y: hidden;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    border: 1px solid #ddd;
  }
  .table-responsive > .table {
    margin-bottom: 0;
  }
  .table-responsive > .table > thead > tr > th,
  .table-responsive > .table > tbody > tr > th,
  .table-responsive > .table > tfoot > tr > th,
  .table-responsive > .table > thead > tr > td,
  .table-responsive > .table > tbody > tr > td,
  .table-responsive > .table > tfoot > tr > td {
    white-space: nowrap;
  }
  .table-responsive > .table-bordered {
    border: 0;
  }
  .table-responsive > .table-bordered > thead > tr > th:first-child,
  .table-responsive > .table-bordered > tbody > tr > th:first-child,
  .table-responsive > .table-bordered > tfoot > tr > th:first-child,
  .table-responsive > .table-bordered > thead > tr > td:first-child,
  .table-responsive > .table-bordered > tbody > tr > td:first-child,
  .table-responsive > .table-bordered > tfoot > tr > td:first-child {
    border-left: 0;
  }
  .table-responsive > .table-bordered > thead > tr > th:last-child,
  .table-responsive > .table-bordered > tbody > tr > th:last-child,
  .table-responsive > .table-bordered > tfoot > tr > th:last-child,
  .table-responsive > .table-bordered > thead > tr > td:last-child,
  .table-responsive > .table-bordered > tbody > tr > td:last-child,
  .table-responsive > .table-bordered > tfoot > tr > td:last-child {
    border-right: 0;
  }
  .table-responsive > .table-bordered > tbody > tr:last-child > th,
  .table-responsive > .table-bordered > tfoot > tr:last-child > th,
  .table-responsive > .table-bordered > tbody > tr:last-child > td,
  .table-responsive > .table-bordered > tfoot > tr:last-child > td {
    border-bottom: 0;
  }
}
fieldset {
  padding: 0;
  margin: 0;
  border: 0;
  min-width: 0;
}
legend {
  display: block;
  width: 100%;
  padding: 0;
  margin-bottom: 18px;
  font-size: 19.5px;
  line-height: inherit;
  color: #333333;
  border: 0;
  border-bottom: 1px solid #e5e5e5;
}
label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  font-weight: bold;
}
input[type="search"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
input[type="radio"],
input[type="checkbox"] {
  margin: 4px 0 0;
  margin-top: 1px \9;
  line-height: normal;
}
input[type="file"] {
  display: block;
}
input[type="range"] {
  display: block;
  width: 100%;
}
select[multiple],
select[size] {
  height: auto;
}
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
output {
  display: block;
  padding-top: 7px;
  font-size: 13px;
  line-height: 1.42857143;
  color: #555555;
}
.form-control {
  display: block;
  width: 100%;
  height: 32px;
  padding: 6px 12px;
  font-size: 13px;
  line-height: 1.42857143;
  color: #555555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 2px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.form-control:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.form-control::-moz-placeholder {
  color: #999;
  opacity: 1;
}
.form-control:-ms-input-placeholder {
  color: #999;
}
.form-control::-webkit-input-placeholder {
  color: #999;
}
.form-control::-ms-expand {
  border: 0;
  background-color: transparent;
}
.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
  background-color: #eeeeee;
  opacity: 1;
}
.form-control[disabled],
fieldset[disabled] .form-control {
  cursor: not-allowed;
}
textarea.form-control {
  height: auto;
}
input[type="search"] {
  -webkit-appearance: none;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  input[type="date"].form-control,
  input[type="time"].form-control,
  input[type="datetime-local"].form-control,
  input[type="month"].form-control {
    line-height: 32px;
  }
  input[type="date"].input-sm,
  input[type="time"].input-sm,
  input[type="datetime-local"].input-sm,
  input[type="month"].input-sm,
  .input-group-sm input[type="date"],
  .input-group-sm input[type="time"],
  .input-group-sm input[type="datetime-local"],
  .input-group-sm input[type="month"] {
    line-height: 30px;
  }
  input[type="date"].input-lg,
  input[type="time"].input-lg,
  input[type="datetime-local"].input-lg,
  input[type="month"].input-lg,
  .input-group-lg input[type="date"],
  .input-group-lg input[type="time"],
  .input-group-lg input[type="datetime-local"],
  .input-group-lg input[type="month"] {
    line-height: 45px;
  }
}
.form-group {
  margin-bottom: 15px;
}
.radio,
.checkbox {
  position: relative;
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
}
.radio label,
.checkbox label {
  min-height: 18px;
  padding-left: 20px;
  margin-bottom: 0;
  font-weight: normal;
  cursor: pointer;
}
.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
  position: absolute;
  margin-left: -20px;
  margin-top: 4px \9;
}
.radio + .radio,
.checkbox + .checkbox {
  margin-top: -5px;
}
.radio-inline,
.checkbox-inline {
  position: relative;
  display: inline-block;
  padding-left: 20px;
  margin-bottom: 0;
  vertical-align: middle;
  font-weight: normal;
  cursor: pointer;
}
.radio-inline + .radio-inline,
.checkbox-inline + .checkbox-inline {
  margin-top: 0;
  margin-left: 10px;
}
input[type="radio"][disabled],
input[type="checkbox"][disabled],
input[type="radio"].disabled,
input[type="checkbox"].disabled,
fieldset[disabled] input[type="radio"],
fieldset[disabled] input[type="checkbox"] {
  cursor: not-allowed;
}
.radio-inline.disabled,
.checkbox-inline.disabled,
fieldset[disabled] .radio-inline,
fieldset[disabled] .checkbox-inline {
  cursor: not-allowed;
}
.radio.disabled label,
.checkbox.disabled label,
fieldset[disabled] .radio label,
fieldset[disabled] .checkbox label {
  cursor: not-allowed;
}
.form-control-static {
  padding-top: 7px;
  padding-bottom: 7px;
  margin-bottom: 0;
  min-height: 31px;
}
.form-control-static.input-lg,
.form-control-static.input-sm {
  padding-left: 0;
  padding-right: 0;
}
.input-sm {
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 1px;
}
select.input-sm {
  height: 30px;
  line-height: 30px;
}
textarea.input-sm,
select[multiple].input-sm {
  height: auto;
}
.form-group-sm .form-control {
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 1px;
}
.form-group-sm select.form-control {
  height: 30px;
  line-height: 30px;
}
.form-group-sm textarea.form-control,
.form-group-sm select[multiple].form-control {
  height: auto;
}
.form-group-sm .form-control-static {
  height: 30px;
  min-height: 30px;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1.5;
}
.input-lg {
  height: 45px;
  padding: 10px 16px;
  font-size: 17px;
  line-height: 1.3333333;
  border-radius: 3px;
}
select.input-lg {
  height: 45px;
  line-height: 45px;
}
textarea.input-lg,
select[multiple].input-lg {
  height: auto;
}
.form-group-lg .form-control {
  height: 45px;
  padding: 10px 16px;
  font-size: 17px;
  line-height: 1.3333333;
  border-radius: 3px;
}
.form-group-lg select.form-control {
  height: 45px;
  line-height: 45px;
}
.form-group-lg textarea.form-control,
.form-group-lg select[multiple].form-control {
  height: auto;
}
.form-group-lg .form-control-static {
  height: 45px;
  min-height: 35px;
  padding: 11px 16px;
  font-size: 17px;
  line-height: 1.3333333;
}
.has-feedback {
  position: relative;
}
.has-feedback .form-control {
  padding-right: 40px;
}
.form-control-feedback {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  display: block;
  width: 32px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  pointer-events: none;
}
.input-lg + .form-control-feedback,
.input-group-lg + .form-control-feedback,
.form-group-lg .form-control + .form-control-feedback {
  width: 45px;
  height: 45px;
  line-height: 45px;
}
.input-sm + .form-control-feedback,
.input-group-sm + .form-control-feedback,
.form-group-sm .form-control + .form-control-feedback {
  width: 30px;
  height: 30px;
  line-height: 30px;
}
.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline,
.has-success.radio label,
.has-success.checkbox label,
.has-success.radio-inline label,
.has-success.checkbox-inline label {
  color: #3c763d;
}
.has-success .form-control {
  border-color: #3c763d;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.has-success .form-control:focus {
  border-color: #2b542c;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
}
.has-success .input-group-addon {
  color: #3c763d;
  border-color: #3c763d;
  background-color: #dff0d8;
}
.has-success .form-control-feedback {
  color: #3c763d;
}
.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline,
.has-warning.radio label,
.has-warning.checkbox label,
.has-warning.radio-inline label,
.has-warning.checkbox-inline label {
  color: #8a6d3b;
}
.has-warning .form-control {
  border-color: #8a6d3b;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.has-warning .form-control:focus {
  border-color: #66512c;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
}
.has-warning .input-group-addon {
  color: #8a6d3b;
  border-color: #8a6d3b;
  background-color: #fcf8e3;
}
.has-warning .form-control-feedback {
  color: #8a6d3b;
}
.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline,
.has-error.radio label,
.has-error.checkbox label,
.has-error.radio-inline label,
.has-error.checkbox-inline label {
  color: #a94442;
}
.has-error .form-control {
  border-color: #a94442;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.has-error .form-control:focus {
  border-color: #843534;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
}
.has-error .input-group-addon {
  color: #a94442;
  border-color: #a94442;
  background-color: #f2dede;
}
.has-error .form-control-feedback {
  color: #a94442;
}
.has-feedback label ~ .form-control-feedback {
  top: 23px;
}
.has-feedback label.sr-only ~ .form-control-feedback {
  top: 0;
}
.help-block {
  display: block;
  margin-top: 5px;
  margin-bottom: 10px;
  color: #404040;
}
@media (min-width: 768px) {
  .form-inline .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
  }
  .form-inline .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle;
  }
  .form-inline .form-control-static {
    display: inline-block;
  }
  .form-inline .input-group {
    display: inline-table;
    vertical-align: middle;
  }
  .form-inline .input-group .input-group-addon,
  .form-inline .input-group .input-group-btn,
  .form-inline .input-group .form-control {
    width: auto;
  }
  .form-inline .input-group > .form-control {
    width: 100%;
  }
  .form-inline .control-label {
    margin-bottom: 0;
    vertical-align: middle;
  }
  .form-inline .radio,
  .form-inline .checkbox {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    vertical-align: middle;
  }
  .form-inline .radio label,
  .form-inline .checkbox label {
    padding-left: 0;
  }
  .form-inline .radio input[type="radio"],
  .form-inline .checkbox input[type="checkbox"] {
    position: relative;
    margin-left: 0;
  }
  .form-inline .has-feedback .form-control-feedback {
    top: 0;
  }
}
.form-horizontal .radio,
.form-horizontal .checkbox,
.form-horizontal .radio-inline,
.form-horizontal .checkbox-inline {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 7px;
}
.form-horizontal .radio,
.form-horizontal .checkbox {
  min-height: 25px;
}
.form-horizontal .form-group {
  margin-left: 0px;
  margin-right: 0px;
}
@media (min-width: 768px) {
  .form-horizontal .control-label {
    text-align: right;
    margin-bottom: 0;
    padding-top: 7px;
  }
}
.form-horizontal .has-feedback .form-control-feedback {
  right: 0px;
}
@media (min-width: 768px) {
  .form-horizontal .form-group-lg .control-label {
    padding-top: 11px;
    font-size: 17px;
  }
}
@media (min-width: 768px) {
  .form-horizontal .form-group-sm .control-label {
    padding-top: 6px;
    font-size: 12px;
  }
}
.btn {
  display: inline-block;
  margin-bottom: 0;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  touch-action: manipulation;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  white-space: nowrap;
  padding: 6px 12px;
  font-size: 13px;
  line-height: 1.42857143;
  border-radius: 2px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.btn:hover,
.btn:focus,
.btn.focus {
  color: #333;
  text-decoration: none;
}
.btn:active,
.btn.active {
  outline: 0;
  background-image: none;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
  cursor: not-allowed;
  opacity: 0.65;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
  box-shadow: none;
}
a.btn.disabled,
fieldset[disabled] a.btn {
  pointer-events: none;
}
.btn-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}
.btn-default:focus,
.btn-default.focus {
  color: #333;
  background-color: #e6e6e6;
  border-color: #8c8c8c;
}
.btn-default:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.btn-default:active:hover,
.btn-default.active:hover,
.open > .dropdown-toggle.btn-default:hover,
.btn-default:active:focus,
.btn-default.active:focus,
.open > .dropdown-toggle.btn-default:focus,
.btn-default:active.focus,
.btn-default.active.focus,
.open > .dropdown-toggle.btn-default.focus {
  color: #333;
  background-color: #d4d4d4;
  border-color: #8c8c8c;
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  background-image: none;
}
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus {
  background-color: #fff;
  border-color: #ccc;
}
.btn-default .badge {
  color: #fff;
  background-color: #333;
}
.btn-primary {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}
.btn-primary:focus,
.btn-primary.focus {
  color: #fff;
  background-color: #286090;
  border-color: #122b40;
}
.btn-primary:hover {
  color: #fff;
  background-color: #286090;
  border-color: #204d74;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: #286090;
  border-color: #204d74;
}
.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus {
  color: #fff;
  background-color: #204d74;
  border-color: #122b40;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  background-image: none;
}
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus {
  background-color: #337ab7;
  border-color: #2e6da4;
}
.btn-primary .badge {
  color: #337ab7;
  background-color: #fff;
}
.btn-success {
  color: #fff;
  background-color: #5cb85c;
  border-color: #4cae4c;
}
.btn-success:focus,
.btn-success.focus {
  color: #fff;
  background-color: #449d44;
  border-color: #255625;
}
.btn-success:hover {
  color: #fff;
  background-color: #449d44;
  border-color: #398439;
}
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
  color: #fff;
  background-color: #449d44;
  border-color: #398439;
}
.btn-success:active:hover,
.btn-success.active:hover,
.open > .dropdown-toggle.btn-success:hover,
.btn-success:active:focus,
.btn-success.active:focus,
.open > .dropdown-toggle.btn-success:focus,
.btn-success:active.focus,
.btn-success.active.focus,
.open > .dropdown-toggle.btn-success.focus {
  color: #fff;
  background-color: #398439;
  border-color: #255625;
}
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
  background-image: none;
}
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled.focus,
.btn-success[disabled].focus,
fieldset[disabled] .btn-success.focus {
  background-color: #5cb85c;
  border-color: #4cae4c;
}
.btn-success .badge {
  color: #5cb85c;
  background-color: #fff;
}
.btn-info {
  color: #fff;
  background-color: #5bc0de;
  border-color: #46b8da;
}
.btn-info:focus,
.btn-info.focus {
  color: #fff;
  background-color: #31b0d5;
  border-color: #1b6d85;
}
.btn-info:hover {
  color: #fff;
  background-color: #31b0d5;
  border-color: #269abc;
}
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  color: #fff;
  background-color: #31b0d5;
  border-color: #269abc;
}
.btn-info:active:hover,
.btn-info.active:hover,
.open > .dropdown-toggle.btn-info:hover,
.btn-info:active:focus,
.btn-info.active:focus,
.open > .dropdown-toggle.btn-info:focus,
.btn-info:active.focus,
.btn-info.active.focus,
.open > .dropdown-toggle.btn-info.focus {
  color: #fff;
  background-color: #269abc;
  border-color: #1b6d85;
}
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  background-image: none;
}
.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled.focus,
.btn-info[disabled].focus,
fieldset[disabled] .btn-info.focus {
  background-color: #5bc0de;
  border-color: #46b8da;
}
.btn-info .badge {
  color: #5bc0de;
  background-color: #fff;
}
.btn-warning {
  color: #fff;
  background-color: #f0ad4e;
  border-color: #eea236;
}
.btn-warning:focus,
.btn-warning.focus {
  color: #fff;
  background-color: #ec971f;
  border-color: #985f0d;
}
.btn-warning:hover {
  color: #fff;
  background-color: #ec971f;
  border-color: #d58512;
}
.btn-warning:active,
.btn-warning.active,
.open > .dropdown-toggle.btn-warning {
  color: #fff;
  background-color: #ec971f;
  border-color: #d58512;
}
.btn-warning:active:hover,
.btn-warning.active:hover,
.open > .dropdown-toggle.btn-warning:hover,
.btn-warning:active:focus,
.btn-warning.active:focus,
.open > .dropdown-toggle.btn-warning:focus,
.btn-warning:active.focus,
.btn-warning.active.focus,
.open > .dropdown-toggle.btn-warning.focus {
  color: #fff;
  background-color: #d58512;
  border-color: #985f0d;
}
.btn-warning:active,
.btn-warning.active,
.open > .dropdown-toggle.btn-warning {
  background-image: none;
}
.btn-warning.disabled:hover,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning:hover,
.btn-warning.disabled:focus,
.btn-warning[disabled]:focus,
fieldset[disabled] .btn-warning:focus,
.btn-warning.disabled.focus,
.btn-warning[disabled].focus,
fieldset[disabled] .btn-warning.focus {
  background-color: #f0ad4e;
  border-color: #eea236;
}
.btn-warning .badge {
  color: #f0ad4e;
  background-color: #fff;
}
.btn-danger {
  color: #fff;
  background-color: #d9534f;
  border-color: #d43f3a;
}
.btn-danger:focus,
.btn-danger.focus {
  color: #fff;
  background-color: #c9302c;
  border-color: #761c19;
}
.btn-danger:hover {
  color: #fff;
  background-color: #c9302c;
  border-color: #ac2925;
}
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  color: #fff;
  background-color: #c9302c;
  border-color: #ac2925;
}
.btn-danger:active:hover,
.btn-danger.active:hover,
.open > .dropdown-toggle.btn-danger:hover,
.btn-danger:active:focus,
.btn-danger.active:focus,
.open > .dropdown-toggle.btn-danger:focus,
.btn-danger:active.focus,
.btn-danger.active.focus,
.open > .dropdown-toggle.btn-danger.focus {
  color: #fff;
  background-color: #ac2925;
  border-color: #761c19;
}
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  background-image: none;
}
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled.focus,
.btn-danger[disabled].focus,
fieldset[disabled] .btn-danger.focus {
  background-color: #d9534f;
  border-color: #d43f3a;
}
.btn-danger .badge {
  color: #d9534f;
  background-color: #fff;
}
.btn-link {
  color: #337ab7;
  font-weight: normal;
  border-radius: 0;
}
.btn-link,
.btn-link:active,
.btn-link.active,
.btn-link[disabled],
fieldset[disabled] .btn-link {
  background-color: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
  border-color: transparent;
}
.btn-link:hover,
.btn-link:focus {
  color: #23527c;
  text-decoration: underline;
  background-color: transparent;
}
.btn-link[disabled]:hover,
fieldset[disabled] .btn-link:hover,
.btn-link[disabled]:focus,
fieldset[disabled] .btn-link:focus {
  color: #777777;
  text-decoration: none;
}
.btn-lg,
.btn-group-lg > .btn {
  padding: 10px 16px;
  font-size: 17px;
  line-height: 1.3333333;
  border-radius: 3px;
}
.btn-sm,
.btn-group-sm > .btn {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 1px;
}
.btn-xs,
.btn-group-xs > .btn {
  padding: 1px 5px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 1px;
}
.btn-block {
  display: block;
  width: 100%;
}
.btn-block + .btn-block {
  margin-top: 5px;
}
input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
  width: 100%;
}
.fade {
  opacity: 0;
  -webkit-transition: opacity 0.15s linear;
  -o-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear;
}
.fade.in {
  opacity: 1;
}
.collapse {
  display: none;
}
.collapse.in {
  display: block;
}
tr.collapse.in {
  display: table-row;
}
tbody.collapse.in {
  display: table-row-group;
}
.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition-property: height, visibility;
  transition-property: height, visibility;
  -webkit-transition-duration: 0.35s;
  transition-duration: 0.35s;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
}
.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-top: 4px solid \9;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}
.dropup,
.dropdown {
  position: relative;
}
.dropdown-toggle:focus {
  outline: 0;
}
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  list-style: none;
  font-size: 13px;
  text-align: left;
  background-color: #fff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 2px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  background-clip: padding-box;
}
.dropdown-menu.pull-right {
  right: 0;
  left: auto;
}
.dropdown-menu .divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #e5e5e5;
}
.dropdown-menu > li > a {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333333;
  white-space: nowrap;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  text-decoration: none;
  color: #262626;
  background-color: #f5f5f5;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  color: #fff;
  text-decoration: none;
  outline: 0;
  background-color: #337ab7;
}
.dropdown-menu > .disabled > a,
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
  color: #777777;
}
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  cursor: not-allowed;
}
.open > .dropdown-menu {
  display: block;
}
.open > a {
  outline: 0;
}
.dropdown-menu-right {
  left: auto;
  right: 0;
}
.dropdown-menu-left {
  left: 0;
  right: auto;
}
.dropdown-header {
  display: block;
  padding: 3px 20px;
  font-size: 12px;
  line-height: 1.42857143;
  color: #777777;
  white-space: nowrap;
}
.dropdown-backdrop {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: 990;
}
.pull-right > .dropdown-menu {
  right: 0;
  left: auto;
}
.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
  border-top: 0;
  border-bottom: 4px dashed;
  border-bottom: 4px solid \9;
  content: "";
}
.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
  top: auto;
  bottom: 100%;
  margin-bottom: 2px;
}
@media (min-width: 541px) {
  .navbar-right .dropdown-menu {
    left: auto;
    right: 0;
  }
  .navbar-right .dropdown-menu-left {
    left: 0;
    right: auto;
  }
}
.btn-group,
.btn-group-vertical {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
.btn-group > .btn,
.btn-group-vertical > .btn {
  position: relative;
  float: left;
}
.btn-group > .btn:hover,
.btn-group-vertical > .btn:hover,
.btn-group > .btn:focus,
.btn-group-vertical > .btn:focus,
.btn-group > .btn:active,
.btn-group-vertical > .btn:active,
.btn-group > .btn.active,
.btn-group-vertical > .btn.active {
  z-index: 2;
}
.btn-group .btn + .btn,
.btn-group .btn + .btn-group,
.btn-group .btn-group + .btn,
.btn-group .btn-group + .btn-group {
  margin-left: -1px;
}
.btn-toolbar {
  margin-left: -5px;
}
.btn-toolbar .btn,
.btn-toolbar .btn-group,
.btn-toolbar .input-group {
  float: left;
}
.btn-toolbar > .btn,
.btn-toolbar > .btn-group,
.btn-toolbar > .input-group {
  margin-left: 5px;
}
.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
  border-radius: 0;
}
.btn-group > .btn:first-child {
  margin-left: 0;
}
.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}
.btn-group > .btn:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}
.btn-group > .btn-group {
  float: left;
}
.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
  border-radius: 0;
}
.btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}
.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}
.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
  outline: 0;
}
.btn-group > .btn + .dropdown-toggle {
  padding-left: 8px;
  padding-right: 8px;
}
.btn-group > .btn-lg + .dropdown-toggle {
  padding-left: 12px;
  padding-right: 12px;
}
.btn-group.open .dropdown-toggle {
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn-group.open .dropdown-toggle.btn-link {
  -webkit-box-shadow: none;
  box-shadow: none;
}
.btn .caret {
  margin-left: 0;
}
.btn-lg .caret {
  border-width: 5px 5px 0;
  border-bottom-width: 0;
}
.dropup .btn-lg .caret {
  border-width: 0 5px 5px;
}
.btn-group-vertical > .btn,
.btn-group-vertical > .btn-group,
.btn-group-vertical > .btn-group > .btn {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%;
}
.btn-group-vertical > .btn-group > .btn {
  float: none;
}
.btn-group-vertical > .btn + .btn,
.btn-group-vertical > .btn + .btn-group,
.btn-group-vertical > .btn-group + .btn,
.btn-group-vertical > .btn-group + .btn-group {
  margin-top: -1px;
  margin-left: 0;
}
.btn-group-vertical > .btn:not(:first-child):not(:last-child) {
  border-radius: 0;
}
.btn-group-vertical > .btn:first-child:not(:last-child) {
  border-top-right-radius: 2px;
  border-top-left-radius: 2px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.btn-group-vertical > .btn:last-child:not(:first-child) {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
}
.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
  border-radius: 0;
}
.btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}
.btn-group-justified {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
}
.btn-group-justified > .btn,
.btn-group-justified > .btn-group {
  float: none;
  display: table-cell;
  width: 1%;
}
.btn-group-justified > .btn-group .btn {
  width: 100%;
}
.btn-group-justified > .btn-group .dropdown-menu {
  left: auto;
}
[data-toggle="buttons"] > .btn input[type="radio"],
[data-toggle="buttons"] > .btn-group > .btn input[type="radio"],
[data-toggle="buttons"] > .btn input[type="checkbox"],
[data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] {
  position: absolute;
  clip: rect(0, 0, 0, 0);
  pointer-events: none;
}
.input-group {
  position: relative;
  display: table;
  border-collapse: separate;
}
.input-group[class*="col-"] {
  float: none;
  padding-left: 0;
  padding-right: 0;
}
.input-group .form-control {
  position: relative;
  z-index: 2;
  float: left;
  width: 100%;
  margin-bottom: 0;
}
.input-group .form-control:focus {
  z-index: 3;
}
.input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn {
  height: 45px;
  padding: 10px 16px;
  font-size: 17px;
  line-height: 1.3333333;
  border-radius: 3px;
}
select.input-group-lg > .form-control,
select.input-group-lg > .input-group-addon,
select.input-group-lg > .input-group-btn > .btn {
  height: 45px;
  line-height: 45px;
}
textarea.input-group-lg > .form-control,
textarea.input-group-lg > .input-group-addon,
textarea.input-group-lg > .input-group-btn > .btn,
select[multiple].input-group-lg > .form-control,
select[multiple].input-group-lg > .input-group-addon,
select[multiple].input-group-lg > .input-group-btn > .btn {
  height: auto;
}
.input-group-sm > .form-control,
.input-group-sm > .input-group-addon,
.input-group-sm > .input-group-btn > .btn {
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 1px;
}
select.input-group-sm > .form-control,
select.input-group-sm > .input-group-addon,
select.input-group-sm > .input-group-btn > .btn {
  height: 30px;
  line-height: 30px;
}
textarea.input-group-sm > .form-control,
textarea.input-group-sm > .input-group-addon,
textarea.input-group-sm > .input-group-btn > .btn,
select[multiple].input-group-sm > .form-control,
select[multiple].input-group-sm > .input-group-addon,
select[multiple].input-group-sm > .input-group-btn > .btn {
  height: auto;
}
.input-group-addon,
.input-group-btn,
.input-group .form-control {
  display: table-cell;
}
.input-group-addon:not(:first-child):not(:last-child),
.input-group-btn:not(:first-child):not(:last-child),
.input-group .form-control:not(:first-child):not(:last-child) {
  border-radius: 0;
}
.input-group-addon,
.input-group-btn {
  width: 1%;
  white-space: nowrap;
  vertical-align: middle;
}
.input-group-addon {
  padding: 6px 12px;
  font-size: 13px;
  font-weight: normal;
  line-height: 1;
  color: #555555;
  text-align: center;
  background-color: #eeeeee;
  border: 1px solid #ccc;
  border-radius: 2px;
}
.input-group-addon.input-sm {
  padding: 5px 10px;
  font-size: 12px;
  border-radius: 1px;
}
.input-group-addon.input-lg {
  padding: 10px 16px;
  font-size: 17px;
  border-radius: 3px;
}
.input-group-addon input[type="radio"],
.input-group-addon input[type="checkbox"] {
  margin-top: 0;
}
.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child > .btn,
.input-group-btn:first-child > .btn-group > .btn,
.input-group-btn:first-child > .dropdown-toggle,
.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle),
.input-group-btn:last-child > .btn-group:not(:last-child) > .btn {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}
.input-group-addon:first-child {
  border-right: 0;
}
.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group > .btn,
.input-group-btn:last-child > .dropdown-toggle,
.input-group-btn:first-child > .btn:not(:first-child),
.input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}
.input-group-addon:last-child {
  border-left: 0;
}
.input-group-btn {
  position: relative;
  font-size: 0;
  white-space: nowrap;
}
.input-group-btn > .btn {
  position: relative;
}
.input-group-btn > .btn + .btn {
  margin-left: -1px;
}
.input-group-btn > .btn:hover,
.input-group-btn > .btn:focus,
.input-group-btn > .btn:active {
  z-index: 2;
}
.input-group-btn:first-child > .btn,
.input-group-btn:first-child > .btn-group {
  margin-right: -1px;
}
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group {
  z-index: 2;
  margin-left: -1px;
}
.nav {
  margin-bottom: 0;
  padding-left: 0;
  list-style: none;
}
.nav > li {
  position: relative;
  display: block;
}
.nav > li > a {
  position: relative;
  display: block;
  padding: 10px 15px;
}
.nav > li > a:hover,
.nav > li > a:focus {
  text-decoration: none;
  background-color: #eeeeee;
}
.nav > li.disabled > a {
  color: #777777;
}
.nav > li.disabled > a:hover,
.nav > li.disabled > a:focus {
  color: #777777;
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
}
.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
  background-color: #eeeeee;
  border-color: #337ab7;
}
.nav .nav-divider {
  height: 1px;
  margin: 8px 0;
  overflow: hidden;
  background-color: #e5e5e5;
}
.nav > li > a > img {
  max-width: none;
}
.nav-tabs {
  border-bottom: 1px solid #ddd;
}
.nav-tabs > li {
  float: left;
  margin-bottom: -1px;
}
.nav-tabs > li > a {
  margin-right: 2px;
  line-height: 1.42857143;
  border: 1px solid transparent;
  border-radius: 2px 2px 0 0;
}
.nav-tabs > li > a:hover {
  border-color: #eeeeee #eeeeee #ddd;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
  color: #555555;
  background-color: #fff;
  border: 1px solid #ddd;
  border-bottom-color: transparent;
  cursor: default;
}
.nav-tabs.nav-justified {
  width: 100%;
  border-bottom: 0;
}
.nav-tabs.nav-justified > li {
  float: none;
}
.nav-tabs.nav-justified > li > a {
  text-align: center;
  margin-bottom: 5px;
}
.nav-tabs.nav-justified > .dropdown .dropdown-menu {
  top: auto;
  left: auto;
}
@media (min-width: 768px) {
  .nav-tabs.nav-justified > li {
    display: table-cell;
    width: 1%;
  }
  .nav-tabs.nav-justified > li > a {
    margin-bottom: 0;
  }
}
.nav-tabs.nav-justified > li > a {
  margin-right: 0;
  border-radius: 2px;
}
.nav-tabs.nav-justified > .active > a,
.nav-tabs.nav-justified > .active > a:hover,
.nav-tabs.nav-justified > .active > a:focus {
  border: 1px solid #ddd;
}
@media (min-width: 768px) {
  .nav-tabs.nav-justified > li > a {
    border-bottom: 1px solid #ddd;
    border-radius: 2px 2px 0 0;
  }
  .nav-tabs.nav-justified > .active > a,
  .nav-tabs.nav-justified > .active > a:hover,
  .nav-tabs.nav-justified > .active > a:focus {
    border-bottom-color: #fff;
  }
}
.nav-pills > li {
  float: left;
}
.nav-pills > li > a {
  border-radius: 2px;
}
.nav-pills > li + li {
  margin-left: 2px;
}
.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
  color: #fff;
  background-color: #337ab7;
}
.nav-stacked > li {
  float: none;
}
.nav-stacked > li + li {
  margin-top: 2px;
  margin-left: 0;
}
.nav-justified {
  width: 100%;
}
.nav-justified > li {
  float: none;
}
.nav-justified > li > a {
  text-align: center;
  margin-bottom: 5px;
}
.nav-justified > .dropdown .dropdown-menu {
  top: auto;
  left: auto;
}
@media (min-width: 768px) {
  .nav-justified > li {
    display: table-cell;
    width: 1%;
  }
  .nav-justified > li > a {
    margin-bottom: 0;
  }
}
.nav-tabs-justified {
  border-bottom: 0;
}
.nav-tabs-justified > li > a {
  margin-right: 0;
  border-radius: 2px;
}
.nav-tabs-justified > .active > a,
.nav-tabs-justified > .active > a:hover,
.nav-tabs-justified > .active > a:focus {
  border: 1px solid #ddd;
}
@media (min-width: 768px) {
  .nav-tabs-justified > li > a {
    border-bottom: 1px solid #ddd;
    border-radius: 2px 2px 0 0;
  }
  .nav-tabs-justified > .active > a,
  .nav-tabs-justified > .active > a:hover,
  .nav-tabs-justified > .active > a:focus {
    border-bottom-color: #fff;
  }
}
.tab-content > .tab-pane {
  display: none;
}
.tab-content > .active {
  display: block;
}
.nav-tabs .dropdown-menu {
  margin-top: -1px;
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}
.navbar {
  position: relative;
  min-height: 30px;
  margin-bottom: 18px;
  border: 1px solid transparent;
}
@media (min-width: 541px) {
  .navbar {
    border-radius: 2px;
  }
}
@media (min-width: 541px) {
  .navbar-header {
    float: left;
  }
}
.navbar-collapse {
  overflow-x: visible;
  padding-right: 0px;
  padding-left: 0px;
  border-top: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  -webkit-overflow-scrolling: touch;
}
.navbar-collapse.in {
  overflow-y: auto;
}
@media (min-width: 541px) {
  .navbar-collapse {
    width: auto;
    border-top: 0;
    box-shadow: none;
  }
  .navbar-collapse.collapse {
    display: block !important;
    height: auto !important;
    padding-bottom: 0;
    overflow: visible !important;
  }
  .navbar-collapse.in {
    overflow-y: visible;
  }
  .navbar-fixed-top .navbar-collapse,
  .navbar-static-top .navbar-collapse,
  .navbar-fixed-bottom .navbar-collapse {
    padding-left: 0;
    padding-right: 0;
  }
}
.navbar-fixed-top .navbar-collapse,
.navbar-fixed-bottom .navbar-collapse {
  max-height: 340px;
}
@media (max-device-width: 540px) and (orientation: landscape) {
  .navbar-fixed-top .navbar-collapse,
  .navbar-fixed-bottom .navbar-collapse {
    max-height: 200px;
  }
}
.container > .navbar-header,
.container-fluid > .navbar-header,
.container > .navbar-collapse,
.container-fluid > .navbar-collapse {
  margin-right: 0px;
  margin-left: 0px;
}
@media (min-width: 541px) {
  .container > .navbar-header,
  .container-fluid > .navbar-header,
  .container > .navbar-collapse,
  .container-fluid > .navbar-collapse {
    margin-right: 0;
    margin-left: 0;
  }
}
.navbar-static-top {
  z-index: 1000;
  border-width: 0 0 1px;
}
@media (min-width: 541px) {
  .navbar-static-top {
    border-radius: 0;
  }
}
.navbar-fixed-top,
.navbar-fixed-bottom {
  position: fixed;
  right: 0;
  left: 0;
  z-index: 1030;
}
@media (min-width: 541px) {
  .navbar-fixed-top,
  .navbar-fixed-bottom {
    border-radius: 0;
  }
}
.navbar-fixed-top {
  top: 0;
  border-width: 0 0 1px;
}
.navbar-fixed-bottom {
  bottom: 0;
  margin-bottom: 0;
  border-width: 1px 0 0;
}
.navbar-brand {
  float: left;
  padding: 6px 0px;
  font-size: 17px;
  line-height: 18px;
  height: 30px;
}
.navbar-brand:hover,
.navbar-brand:focus {
  text-decoration: none;
}
.navbar-brand > img {
  display: block;
}
@media (min-width: 541px) {
  .navbar > .container .navbar-brand,
  .navbar > .container-fluid .navbar-brand {
    margin-left: 0px;
  }
}
.navbar-toggle {
  position: relative;
  float: right;
  margin-right: 0px;
  padding: 9px 10px;
  margin-top: -2px;
  margin-bottom: -2px;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 2px;
}
.navbar-toggle:focus {
  outline: 0;
}
.navbar-toggle .icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 1px;
}
.navbar-toggle .icon-bar + .icon-bar {
  margin-top: 4px;
}
@media (min-width: 541px) {
  .navbar-toggle {
    display: none;
  }
}
.navbar-nav {
  margin: 3px 0px;
}
.navbar-nav > li > a {
  padding-top: 10px;
  padding-bottom: 10px;
  line-height: 18px;
}
@media (max-width: 540px) {
  .navbar-nav .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: transparent;
    border: 0;
    box-shadow: none;
  }
  .navbar-nav .open .dropdown-menu > li > a,
  .navbar-nav .open .dropdown-menu .dropdown-header {
    padding: 5px 15px 5px 25px;
  }
  .navbar-nav .open .dropdown-menu > li > a {
    line-height: 18px;
  }
  .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-nav .open .dropdown-menu > li > a:focus {
    background-image: none;
  }
}
@media (min-width: 541px) {
  .navbar-nav {
    float: left;
    margin: 0;
  }
  .navbar-nav > li {
    float: left;
  }
  .navbar-nav > li > a {
    padding-top: 6px;
    padding-bottom: 6px;
  }
}
.navbar-form {
  margin-left: 0px;
  margin-right: 0px;
  padding: 10px 0px;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
  margin-top: -1px;
  margin-bottom: -1px;
}
@media (min-width: 768px) {
  .navbar-form .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
  }
  .navbar-form .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle;
  }
  .navbar-form .form-control-static {
    display: inline-block;
  }
  .navbar-form .input-group {
    display: inline-table;
    vertical-align: middle;
  }
  .navbar-form .input-group .input-group-addon,
  .navbar-form .input-group .input-group-btn,
  .navbar-form .input-group .form-control {
    width: auto;
  }
  .navbar-form .input-group > .form-control {
    width: 100%;
  }
  .navbar-form .control-label {
    margin-bottom: 0;
    vertical-align: middle;
  }
  .navbar-form .radio,
  .navbar-form .checkbox {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    vertical-align: middle;
  }
  .navbar-form .radio label,
  .navbar-form .checkbox label {
    padding-left: 0;
  }
  .navbar-form .radio input[type="radio"],
  .navbar-form .checkbox input[type="checkbox"] {
    position: relative;
    margin-left: 0;
  }
  .navbar-form .has-feedback .form-control-feedback {
    top: 0;
  }
}
@media (max-width: 540px) {
  .navbar-form .form-group {
    margin-bottom: 5px;
  }
  .navbar-form .form-group:last-child {
    margin-bottom: 0;
  }
}
@media (min-width: 541px) {
  .navbar-form {
    width: auto;
    border: 0;
    margin-left: 0;
    margin-right: 0;
    padding-top: 0;
    padding-bottom: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
  }
}
.navbar-nav > li > .dropdown-menu {
  margin-top: 0;
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}
.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
  margin-bottom: 0;
  border-top-right-radius: 2px;
  border-top-left-radius: 2px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.navbar-btn {
  margin-top: -1px;
  margin-bottom: -1px;
}
.navbar-btn.btn-sm {
  margin-top: 0px;
  margin-bottom: 0px;
}
.navbar-btn.btn-xs {
  margin-top: 4px;
  margin-bottom: 4px;
}
.navbar-text {
  margin-top: 6px;
  margin-bottom: 6px;
}
@media (min-width: 541px) {
  .navbar-text {
    float: left;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media (min-width: 541px) {
  .navbar-left {
    float: left !important;
    float: left;
  }
  .navbar-right {
    float: right !important;
    float: right;
    margin-right: 0px;
  }
  .navbar-right ~ .navbar-right {
    margin-right: 0;
  }
}
.navbar-default {
  background-color: #f8f8f8;
  border-color: #e7e7e7;
}
.navbar-default .navbar-brand {
  color: #777;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
  color: #5e5e5e;
  background-color: transparent;
}
.navbar-default .navbar-text {
  color: #777;
}
.navbar-default .navbar-nav > li > a {
  color: #777;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #333;
  background-color: transparent;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #555;
  background-color: #e7e7e7;
}
.navbar-default .navbar-nav > .disabled > a,
.navbar-default .navbar-nav > .disabled > a:hover,
.navbar-default .navbar-nav > .disabled > a:focus {
  color: #ccc;
  background-color: transparent;
}
.navbar-default .navbar-toggle {
  border-color: #ddd;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background-color: #ddd;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #888;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: #e7e7e7;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  background-color: #e7e7e7;
  color: #555;
}
@media (max-width: 540px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #777;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #333;
    background-color: transparent;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #555;
    background-color: #e7e7e7;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #ccc;
    background-color: transparent;
  }
}
.navbar-default .navbar-link {
  color: #777;
}
.navbar-default .navbar-link:hover {
  color: #333;
}
.navbar-default .btn-link {
  color: #777;
}
.navbar-default .btn-link:hover,
.navbar-default .btn-link:focus {
  color: #333;
}
.navbar-default .btn-link[disabled]:hover,
fieldset[disabled] .navbar-default .btn-link:hover,
.navbar-default .btn-link[disabled]:focus,
fieldset[disabled] .navbar-default .btn-link:focus {
  color: #ccc;
}
.navbar-inverse {
  background-color: #222;
  border-color: #080808;
}
.navbar-inverse .navbar-brand {
  color: #9d9d9d;
}
.navbar-inverse .navbar-brand:hover,
.navbar-inverse .navbar-brand:focus {
  color: #fff;
  background-color: transparent;
}
.navbar-inverse .navbar-text {
  color: #9d9d9d;
}
.navbar-inverse .navbar-nav > li > a {
  color: #9d9d9d;
}
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
  color: #fff;
  background-color: transparent;
}
.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus {
  color: #fff;
  background-color: #080808;
}
.navbar-inverse .navbar-nav > .disabled > a,
.navbar-inverse .navbar-nav > .disabled > a:hover,
.navbar-inverse .navbar-nav > .disabled > a:focus {
  color: #444;
  background-color: transparent;
}
.navbar-inverse .navbar-toggle {
  border-color: #333;
}
.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
  background-color: #333;
}
.navbar-inverse .navbar-toggle .icon-bar {
  background-color: #fff;
}
.navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-form {
  border-color: #101010;
}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
  background-color: #080808;
  color: #fff;
}
@media (max-width: 540px) {
  .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
    border-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
    background-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
    color: #9d9d9d;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #fff;
    background-color: transparent;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #fff;
    background-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #444;
    background-color: transparent;
  }
}
.navbar-inverse .navbar-link {
  color: #9d9d9d;
}
.navbar-inverse .navbar-link:hover {
  color: #fff;
}
.navbar-inverse .btn-link {
  color: #9d9d9d;
}
.navbar-inverse .btn-link:hover,
.navbar-inverse .btn-link:focus {
  color: #fff;
}
.navbar-inverse .btn-link[disabled]:hover,
fieldset[disabled] .navbar-inverse .btn-link:hover,
.navbar-inverse .btn-link[disabled]:focus,
fieldset[disabled] .navbar-inverse .btn-link:focus {
  color: #444;
}
.breadcrumb {
  padding: 8px 15px;
  margin-bottom: 18px;
  list-style: none;
  background-color: #f5f5f5;
  border-radius: 2px;
}
.breadcrumb > li {
  display: inline-block;
}
.breadcrumb > li + li:before {
  content: "/\00a0";
  padding: 0 5px;
  color: #5e5e5e;
}
.breadcrumb > .active {
  color: #777777;
}
.pagination {
  display: inline-block;
  padding-left: 0;
  margin: 18px 0;
  border-radius: 2px;
}
.pagination > li {
  display: inline;
}
.pagination > li > a,
.pagination > li > span {
  position: relative;
  float: left;
  padding: 6px 12px;
  line-height: 1.42857143;
  text-decoration: none;
  color: #337ab7;
  background-color: #fff;
  border: 1px solid #ddd;
  margin-left: -1px;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
  margin-left: 0;
  border-bottom-left-radius: 2px;
  border-top-left-radius: 2px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
  border-bottom-right-radius: 2px;
  border-top-right-radius: 2px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
  z-index: 2;
  color: #23527c;
  background-color: #eeeeee;
  border-color: #ddd;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
  z-index: 3;
  color: #fff;
  background-color: #337ab7;
  border-color: #337ab7;
  cursor: default;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
  color: #777777;
  background-color: #fff;
  border-color: #ddd;
  cursor: not-allowed;
}
.pagination-lg > li > a,
.pagination-lg > li > span {
  padding: 10px 16px;
  font-size: 17px;
  line-height: 1.3333333;
}
.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
  border-bottom-left-radius: 3px;
  border-top-left-radius: 3px;
}
.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
  border-bottom-right-radius: 3px;
  border-top-right-radius: 3px;
}
.pagination-sm > li > a,
.pagination-sm > li > span {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
}
.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
  border-bottom-left-radius: 1px;
  border-top-left-radius: 1px;
}
.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
  border-bottom-right-radius: 1px;
  border-top-right-radius: 1px;
}
.pager {
  padding-left: 0;
  margin: 18px 0;
  list-style: none;
  text-align: center;
}
.pager li {
  display: inline;
}
.pager li > a,
.pager li > span {
  display: inline-block;
  padding: 5px 14px;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 15px;
}
.pager li > a:hover,
.pager li > a:focus {
  text-decoration: none;
  background-color: #eeeeee;
}
.pager .next > a,
.pager .next > span {
  float: right;
}
.pager .previous > a,
.pager .previous > span {
  float: left;
}
.pager .disabled > a,
.pager .disabled > a:hover,
.pager .disabled > a:focus,
.pager .disabled > span {
  color: #777777;
  background-color: #fff;
  cursor: not-allowed;
}
.label {
  display: inline;
  padding: .2em .6em .3em;
  font-size: 75%;
  font-weight: bold;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: .25em;
}
a.label:hover,
a.label:focus {
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}
.label:empty {
  display: none;
}
.btn .label {
  position: relative;
  top: -1px;
}
.label-default {
  background-color: #777777;
}
.label-default[href]:hover,
.label-default[href]:focus {
  background-color: #5e5e5e;
}
.label-primary {
  background-color: #337ab7;
}
.label-primary[href]:hover,
.label-primary[href]:focus {
  background-color: #286090;
}
.label-success {
  background-color: #5cb85c;
}
.label-success[href]:hover,
.label-success[href]:focus {
  background-color: #449d44;
}
.label-info {
  background-color: #5bc0de;
}
.label-info[href]:hover,
.label-info[href]:focus {
  background-color: #31b0d5;
}
.label-warning {
  background-color: #f0ad4e;
}
.label-warning[href]:hover,
.label-warning[href]:focus {
  background-color: #ec971f;
}
.label-danger {
  background-color: #d9534f;
}
.label-danger[href]:hover,
.label-danger[href]:focus {
  background-color: #c9302c;
}
.badge {
  display: inline-block;
  min-width: 10px;
  padding: 3px 7px;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  line-height: 1;
  vertical-align: middle;
  white-space: nowrap;
  text-align: center;
  background-color: #777777;
  border-radius: 10px;
}
.badge:empty {
  display: none;
}
.btn .badge {
  position: relative;
  top: -1px;
}
.btn-xs .badge,
.btn-group-xs > .btn .badge {
  top: 0;
  padding: 1px 5px;
}
a.badge:hover,
a.badge:focus {
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}
.list-group-item.active > .badge,
.nav-pills > .active > a > .badge {
  color: #337ab7;
  background-color: #fff;
}
.list-group-item > .badge {
  float: right;
}
.list-group-item > .badge + .badge {
  margin-right: 5px;
}
.nav-pills > li > a > .badge {
  margin-left: 3px;
}
.jumbotron {
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 30px;
  color: inherit;
  background-color: #eeeeee;
}
.jumbotron h1,
.jumbotron .h1 {
  color: inherit;
}
.jumbotron p {
  margin-bottom: 15px;
  font-size: 20px;
  font-weight: 200;
}
.jumbotron > hr {
  border-top-color: #d5d5d5;
}
.container .jumbotron,
.container-fluid .jumbotron {
  border-radius: 3px;
  padding-left: 0px;
  padding-right: 0px;
}
.jumbotron .container {
  max-width: 100%;
}
@media screen and (min-width: 768px) {
  .jumbotron {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .container .jumbotron,
  .container-fluid .jumbotron {
    padding-left: 60px;
    padding-right: 60px;
  }
  .jumbotron h1,
  .jumbotron .h1 {
    font-size: 59px;
  }
}
.thumbnail {
  display: block;
  padding: 4px;
  margin-bottom: 18px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 2px;
  -webkit-transition: border 0.2s ease-in-out;
  -o-transition: border 0.2s ease-in-out;
  transition: border 0.2s ease-in-out;
}
.thumbnail > img,
.thumbnail a > img {
  margin-left: auto;
  margin-right: auto;
}
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
  border-color: #337ab7;
}
.thumbnail .caption {
  padding: 9px;
  color: #000;
}
.alert {
  padding: 15px;
  margin-bottom: 18px;
  border: 1px solid transparent;
  border-radius: 2px;
}
.alert h4 {
  margin-top: 0;
  color: inherit;
}
.alert .alert-link {
  font-weight: bold;
}
.alert > p,
.alert > ul {
  margin-bottom: 0;
}
.alert > p + p {
  margin-top: 5px;
}
.alert-dismissable,
.alert-dismissible {
  padding-right: 35px;
}
.alert-dismissable .close,
.alert-dismissible .close {
  position: relative;
  top: -2px;
  right: -21px;
  color: inherit;
}
.alert-success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d;
}
.alert-success hr {
  border-top-color: #c9e2b3;
}
.alert-success .alert-link {
  color: #2b542c;
}
.alert-info {
  background-color: #d9edf7;
  border-color: #bce8f1;
  color: #31708f;
}
.alert-info hr {
  border-top-color: #a6e1ec;
}
.alert-info .alert-link {
  color: #245269;
}
.alert-warning {
  background-color: #fcf8e3;
  border-color: #faebcc;
  color: #8a6d3b;
}
.alert-warning hr {
  border-top-color: #f7e1b5;
}
.alert-warning .alert-link {
  color: #66512c;
}
.alert-danger {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442;
}
.alert-danger hr {
  border-top-color: #e4b9c0;
}
.alert-danger .alert-link {
  color: #843534;
}
@-webkit-keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }
  to {
    background-position: 0 0;
  }
}
@keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }
  to {
    background-position: 0 0;
  }
}
.progress {
  overflow: hidden;
  height: 18px;
  margin-bottom: 18px;
  background-color: #f5f5f5;
  border-radius: 2px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}
.progress-bar {
  float: left;
  width: 0%;
  height: 100%;
  font-size: 12px;
  line-height: 18px;
  color: #fff;
  text-align: center;
  background-color: #337ab7;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  -webkit-transition: width 0.6s ease;
  -o-transition: width 0.6s ease;
  transition: width 0.6s ease;
}
.progress-striped .progress-bar,
.progress-bar-striped {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-size: 40px 40px;
}
.progress.active .progress-bar,
.progress-bar.active {
  -webkit-animation: progress-bar-stripes 2s linear infinite;
  -o-animation: progress-bar-stripes 2s linear infinite;
  animation: progress-bar-stripes 2s linear infinite;
}
.progress-bar-success {
  background-color: #5cb85c;
}
.progress-striped .progress-bar-success {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-bar-info {
  background-color: #5bc0de;
}
.progress-striped .progress-bar-info {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-bar-warning {
  background-color: #f0ad4e;
}
.progress-striped .progress-bar-warning {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-bar-danger {
  background-color: #d9534f;
}
.progress-striped .progress-bar-danger {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.media {
  margin-top: 15px;
}
.media:first-child {
  margin-top: 0;
}
.media,
.media-body {
  zoom: 1;
  overflow: hidden;
}
.media-body {
  width: 10000px;
}
.media-object {
  display: block;
}
.media-object.img-thumbnail {
  max-width: none;
}
.media-right,
.media > .pull-right {
  padding-left: 10px;
}
.media-left,
.media > .pull-left {
  padding-right: 10px;
}
.media-left,
.media-right,
.media-body {
  display: table-cell;
  vertical-align: top;
}
.media-middle {
  vertical-align: middle;
}
.media-bottom {
  vertical-align: bottom;
}
.media-heading {
  margin-top: 0;
  margin-bottom: 5px;
}
.media-list {
  padding-left: 0;
  list-style: none;
}
.list-group {
  margin-bottom: 20px;
  padding-left: 0;
}
.list-group-item {
  position: relative;
  display: block;
  padding: 10px 15px;
  margin-bottom: -1px;
  background-color: #fff;
  border: 1px solid #ddd;
}
.list-group-item:first-child {
  border-top-right-radius: 2px;
  border-top-left-radius: 2px;
}
.list-group-item:last-child {
  margin-bottom: 0;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
}
a.list-group-item,
button.list-group-item {
  color: #555;
}
a.list-group-item .list-group-item-heading,
button.list-group-item .list-group-item-heading {
  color: #333;
}
a.list-group-item:hover,
button.list-group-item:hover,
a.list-group-item:focus,
button.list-group-item:focus {
  text-decoration: none;
  color: #555;
  background-color: #f5f5f5;
}
button.list-group-item {
  width: 100%;
  text-align: left;
}
.list-group-item.disabled,
.list-group-item.disabled:hover,
.list-group-item.disabled:focus {
  background-color: #eeeeee;
  color: #777777;
  cursor: not-allowed;
}
.list-group-item.disabled .list-group-item-heading,
.list-group-item.disabled:hover .list-group-item-heading,
.list-group-item.disabled:focus .list-group-item-heading {
  color: inherit;
}
.list-group-item.disabled .list-group-item-text,
.list-group-item.disabled:hover .list-group-item-text,
.list-group-item.disabled:focus .list-group-item-text {
  color: #777777;
}
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
  z-index: 2;
  color: #fff;
  background-color: #337ab7;
  border-color: #337ab7;
}
.list-group-item.active .list-group-item-heading,
.list-group-item.active:hover .list-group-item-heading,
.list-group-item.active:focus .list-group-item-heading,
.list-group-item.active .list-group-item-heading > small,
.list-group-item.active:hover .list-group-item-heading > small,
.list-group-item.active:focus .list-group-item-heading > small,
.list-group-item.active .list-group-item-heading > .small,
.list-group-item.active:hover .list-group-item-heading > .small,
.list-group-item.active:focus .list-group-item-heading > .small {
  color: inherit;
}
.list-group-item.active .list-group-item-text,
.list-group-item.active:hover .list-group-item-text,
.list-group-item.active:focus .list-group-item-text {
  color: #c7ddef;
}
.list-group-item-success {
  color: #3c763d;
  background-color: #dff0d8;
}
a.list-group-item-success,
button.list-group-item-success {
  color: #3c763d;
}
a.list-group-item-success .list-group-item-heading,
button.list-group-item-success .list-group-item-heading {
  color: inherit;
}
a.list-group-item-success:hover,
button.list-group-item-success:hover,
a.list-group-item-success:focus,
button.list-group-item-success:focus {
  color: #3c763d;
  background-color: #d0e9c6;
}
a.list-group-item-success.active,
button.list-group-item-success.active,
a.list-group-item-success.active:hover,
button.list-group-item-success.active:hover,
a.list-group-item-success.active:focus,
button.list-group-item-success.active:focus {
  color: #fff;
  background-color: #3c763d;
  border-color: #3c763d;
}
.list-group-item-info {
  color: #31708f;
  background-color: #d9edf7;
}
a.list-group-item-info,
button.list-group-item-info {
  color: #31708f;
}
a.list-group-item-info .list-group-item-heading,
button.list-group-item-info .list-group-item-heading {
  color: inherit;
}
a.list-group-item-info:hover,
button.list-group-item-info:hover,
a.list-group-item-info:focus,
button.list-group-item-info:focus {
  color: #31708f;
  background-color: #c4e3f3;
}
a.list-group-item-info.active,
button.list-group-item-info.active,
a.list-group-item-info.active:hover,
button.list-group-item-info.active:hover,
a.list-group-item-info.active:focus,
button.list-group-item-info.active:focus {
  color: #fff;
  background-color: #31708f;
  border-color: #31708f;
}
.list-group-item-warning {
  color: #8a6d3b;
  background-color: #fcf8e3;
}
a.list-group-item-warning,
button.list-group-item-warning {
  color: #8a6d3b;
}
a.list-group-item-warning .list-group-item-heading,
button.list-group-item-warning .list-group-item-heading {
  color: inherit;
}
a.list-group-item-warning:hover,
button.list-group-item-warning:hover,
a.list-group-item-warning:focus,
button.list-group-item-warning:focus {
  color: #8a6d3b;
  background-color: #faf2cc;
}
a.list-group-item-warning.active,
button.list-group-item-warning.active,
a.list-group-item-warning.active:hover,
button.list-group-item-warning.active:hover,
a.list-group-item-warning.active:focus,
button.list-group-item-warning.active:focus {
  color: #fff;
  background-color: #8a6d3b;
  border-color: #8a6d3b;
}
.list-group-item-danger {
  color: #a94442;
  background-color: #f2dede;
}
a.list-group-item-danger,
button.list-group-item-danger {
  color: #a94442;
}
a.list-group-item-danger .list-group-item-heading,
button.list-group-item-danger .list-group-item-heading {
  color: inherit;
}
a.list-group-item-danger:hover,
button.list-group-item-danger:hover,
a.list-group-item-danger:focus,
button.list-group-item-danger:focus {
  color: #a94442;
  background-color: #ebcccc;
}
a.list-group-item-danger.active,
button.list-group-item-danger.active,
a.list-group-item-danger.active:hover,
button.list-group-item-danger.active:hover,
a.list-group-item-danger.active:focus,
button.list-group-item-danger.active:focus {
  color: #fff;
  background-color: #a94442;
  border-color: #a94442;
}
.list-group-item-heading {
  margin-top: 0;
  margin-bottom: 5px;
}
.list-group-item-text {
  margin-bottom: 0;
  line-height: 1.3;
}
.panel {
  margin-bottom: 18px;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 2px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}
.panel-body {
  padding: 15px;
}
.panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  border-top-right-radius: 1px;
  border-top-left-radius: 1px;
}
.panel-heading > .dropdown .dropdown-toggle {
  color: inherit;
}
.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 15px;
  color: inherit;
}
.panel-title > a,
.panel-title > small,
.panel-title > .small,
.panel-title > small > a,
.panel-title > .small > a {
  color: inherit;
}
.panel-footer {
  padding: 10px 15px;
  background-color: #f5f5f5;
  border-top: 1px solid #ddd;
  border-bottom-right-radius: 1px;
  border-bottom-left-radius: 1px;
}
.panel > .list-group,
.panel > .panel-collapse > .list-group {
  margin-bottom: 0;
}
.panel > .list-group .list-group-item,
.panel > .panel-collapse > .list-group .list-group-item {
  border-width: 1px 0;
  border-radius: 0;
}
.panel > .list-group:first-child .list-group-item:first-child,
.panel > .panel-collapse > .list-group:first-child .list-group-item:first-child {
  border-top: 0;
  border-top-right-radius: 1px;
  border-top-left-radius: 1px;
}
.panel > .list-group:last-child .list-group-item:last-child,
.panel > .panel-collapse > .list-group:last-child .list-group-item:last-child {
  border-bottom: 0;
  border-bottom-right-radius: 1px;
  border-bottom-left-radius: 1px;
}
.panel > .panel-heading + .panel-collapse > .list-group .list-group-item:first-child {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}
.panel-heading + .list-group .list-group-item:first-child {
  border-top-width: 0;
}
.list-group + .panel-footer {
  border-top-width: 0;
}
.panel > .table,
.panel > .table-responsive > .table,
.panel > .panel-collapse > .table {
  margin-bottom: 0;
}
.panel > .table caption,
.panel > .table-responsive > .table caption,
.panel > .panel-collapse > .table caption {
  padding-left: 15px;
  padding-right: 15px;
}
.panel > .table:first-child,
.panel > .table-responsive:first-child > .table:first-child {
  border-top-right-radius: 1px;
  border-top-left-radius: 1px;
}
.panel > .table:first-child > thead:first-child > tr:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child {
  border-top-left-radius: 1px;
  border-top-right-radius: 1px;
}
.panel > .table:first-child > thead:first-child > tr:first-child td:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child td:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child,
.panel > .table:first-child > thead:first-child > tr:first-child th:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child th:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
  border-top-left-radius: 1px;
}
.panel > .table:first-child > thead:first-child > tr:first-child td:last-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child,
.panel > .table:first-child > tbody:first-child > tr:first-child td:last-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child,
.panel > .table:first-child > thead:first-child > tr:first-child th:last-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child,
.panel > .table:first-child > tbody:first-child > tr:first-child th:last-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
  border-top-right-radius: 1px;
}
.panel > .table:last-child,
.panel > .table-responsive:last-child > .table:last-child {
  border-bottom-right-radius: 1px;
  border-bottom-left-radius: 1px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child {
  border-bottom-left-radius: 1px;
  border-bottom-right-radius: 1px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child td:first-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
.panel > .table:last-child > tbody:last-child > tr:last-child th:first-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
  border-bottom-left-radius: 1px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child td:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
.panel > .table:last-child > tbody:last-child > tr:last-child th:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
  border-bottom-right-radius: 1px;
}
.panel > .panel-body + .table,
.panel > .panel-body + .table-responsive,
.panel > .table + .panel-body,
.panel > .table-responsive + .panel-body {
  border-top: 1px solid #ddd;
}
.panel > .table > tbody:first-child > tr:first-child th,
.panel > .table > tbody:first-child > tr:first-child td {
  border-top: 0;
}
.panel > .table-bordered,
.panel > .table-responsive > .table-bordered {
  border: 0;
}
.panel > .table-bordered > thead > tr > th:first-child,
.panel > .table-responsive > .table-bordered > thead > tr > th:first-child,
.panel > .table-bordered > tbody > tr > th:first-child,
.panel > .table-responsive > .table-bordered > tbody > tr > th:first-child,
.panel > .table-bordered > tfoot > tr > th:first-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child,
.panel > .table-bordered > thead > tr > td:first-child,
.panel > .table-responsive > .table-bordered > thead > tr > td:first-child,
.panel > .table-bordered > tbody > tr > td:first-child,
.panel > .table-responsive > .table-bordered > tbody > tr > td:first-child,
.panel > .table-bordered > tfoot > tr > td:first-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child {
  border-left: 0;
}
.panel > .table-bordered > thead > tr > th:last-child,
.panel > .table-responsive > .table-bordered > thead > tr > th:last-child,
.panel > .table-bordered > tbody > tr > th:last-child,
.panel > .table-responsive > .table-bordered > tbody > tr > th:last-child,
.panel > .table-bordered > tfoot > tr > th:last-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child,
.panel > .table-bordered > thead > tr > td:last-child,
.panel > .table-responsive > .table-bordered > thead > tr > td:last-child,
.panel > .table-bordered > tbody > tr > td:last-child,
.panel > .table-responsive > .table-bordered > tbody > tr > td:last-child,
.panel > .table-bordered > tfoot > tr > td:last-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child {
  border-right: 0;
}
.panel > .table-bordered > thead > tr:first-child > td,
.panel > .table-responsive > .table-bordered > thead > tr:first-child > td,
.panel > .table-bordered > tbody > tr:first-child > td,
.panel > .table-responsive > .table-bordered > tbody > tr:first-child > td,
.panel > .table-bordered > thead > tr:first-child > th,
.panel > .table-responsive > .table-bordered > thead > tr:first-child > th,
.panel > .table-bordered > tbody > tr:first-child > th,
.panel > .table-responsive > .table-bordered > tbody > tr:first-child > th {
  border-bottom: 0;
}
.panel > .table-bordered > tbody > tr:last-child > td,
.panel > .table-responsive > .table-bordered > tbody > tr:last-child > td,
.panel > .table-bordered > tfoot > tr:last-child > td,
.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > td,
.panel > .table-bordered > tbody > tr:last-child > th,
.panel > .table-responsive > .table-bordered > tbody > tr:last-child > th,
.panel > .table-bordered > tfoot > tr:last-child > th,
.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th {
  border-bottom: 0;
}
.panel > .table-responsive {
  border: 0;
  margin-bottom: 0;
}
.panel-group {
  margin-bottom: 18px;
}
.panel-group .panel {
  margin-bottom: 0;
  border-radius: 2px;
}
.panel-group .panel + .panel {
  margin-top: 5px;
}
.panel-group .panel-heading {
  border-bottom: 0;
}
.panel-group .panel-heading + .panel-collapse > .panel-body,
.panel-group .panel-heading + .panel-collapse > .list-group {
  border-top: 1px solid #ddd;
}
.panel-group .panel-footer {
  border-top: 0;
}
.panel-group .panel-footer + .panel-collapse .panel-body {
  border-bottom: 1px solid #ddd;
}
.panel-default {
  border-color: #ddd;
}
.panel-default > .panel-heading {
  color: #333333;
  background-color: #f5f5f5;
  border-color: #ddd;
}
.panel-default > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #ddd;
}
.panel-default > .panel-heading .badge {
  color: #f5f5f5;
  background-color: #333333;
}
.panel-default > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #ddd;
}
.panel-primary {
  border-color: #337ab7;
}
.panel-primary > .panel-heading {
  color: #fff;
  background-color: #337ab7;
  border-color: #337ab7;
}
.panel-primary > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #337ab7;
}
.panel-primary > .panel-heading .badge {
  color: #337ab7;
  background-color: #fff;
}
.panel-primary > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #337ab7;
}
.panel-success {
  border-color: #d6e9c6;
}
.panel-success > .panel-heading {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}
.panel-success > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #d6e9c6;
}
.panel-success > .panel-heading .badge {
  color: #dff0d8;
  background-color: #3c763d;
}
.panel-success > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #d6e9c6;
}
.panel-info {
  border-color: #bce8f1;
}
.panel-info > .panel-heading {
  color: #31708f;
  background-color: #d9edf7;
  border-color: #bce8f1;
}
.panel-info > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #bce8f1;
}
.panel-info > .panel-heading .badge {
  color: #d9edf7;
  background-color: #31708f;
}
.panel-info > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #bce8f1;
}
.panel-warning {
  border-color: #faebcc;
}
.panel-warning > .panel-heading {
  color: #8a6d3b;
  background-color: #fcf8e3;
  border-color: #faebcc;
}
.panel-warning > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #faebcc;
}
.panel-warning > .panel-heading .badge {
  color: #fcf8e3;
  background-color: #8a6d3b;
}
.panel-warning > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #faebcc;
}
.panel-danger {
  border-color: #ebccd1;
}
.panel-danger > .panel-heading {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1;
}
.panel-danger > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #ebccd1;
}
.panel-danger > .panel-heading .badge {
  color: #f2dede;
  background-color: #a94442;
}
.panel-danger > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #ebccd1;
}
.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}
.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  border: 0;
}
.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}
.embed-responsive-4by3 {
  padding-bottom: 75%;
}
.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 2px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}
.well blockquote {
  border-color: #ddd;
  border-color: rgba(0, 0, 0, 0.15);
}
.well-lg {
  padding: 24px;
  border-radius: 3px;
}
.well-sm {
  padding: 9px;
  border-radius: 1px;
}
.close {
  float: right;
  font-size: 19.5px;
  font-weight: bold;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  opacity: 0.2;
  filter: alpha(opacity=20);
}
.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.5;
  filter: alpha(opacity=50);
}
button.close {
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
}
.modal-open {
  overflow: hidden;
}
.modal {
  display: none;
  overflow: hidden;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  -webkit-overflow-scrolling: touch;
  outline: 0;
}
.modal.fade .modal-dialog {
  -webkit-transform: translate(0, -25%);
  -ms-transform: translate(0, -25%);
  -o-transform: translate(0, -25%);
  transform: translate(0, -25%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
}
.modal.in .modal-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
}
.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}
.modal-dialog {
  position: relative;
  width: auto;
  margin: 10px;
}
.modal-content {
  position: relative;
  background-color: #fff;
  border: 1px solid #999;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  background-clip: padding-box;
  outline: 0;
}
.modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000;
}
.modal-backdrop.fade {
  opacity: 0;
  filter: alpha(opacity=0);
}
.modal-backdrop.in {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
.modal-header {
  padding: 15px;
  border-bottom: 1px solid #e5e5e5;
}
.modal-header .close {
  margin-top: -2px;
}
.modal-title {
  margin: 0;
  line-height: 1.42857143;
}
.modal-body {
  position: relative;
  padding: 15px;
}
.modal-footer {
  padding: 15px;
  text-align: right;
  border-top: 1px solid #e5e5e5;
}
.modal-footer .btn + .btn {
  margin-left: 5px;
  margin-bottom: 0;
}
.modal-footer .btn-group .btn + .btn {
  margin-left: -1px;
}
.modal-footer .btn-block + .btn-block {
  margin-left: 0;
}
.modal-scrollbar-measure {
  position: absolute;
  top: -9999px;
  width: 50px;
  height: 50px;
  overflow: scroll;
}
@media (min-width: 768px) {
  .modal-dialog {
    width: 600px;
    margin: 30px auto;
  }
  .modal-content {
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
  }
  .modal-sm {
    width: 300px;
  }
}
@media (min-width: 992px) {
  .modal-lg {
    width: 900px;
  }
}
.tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: normal;
  line-break: auto;
  line-height: 1.42857143;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  white-space: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  font-size: 12px;
  opacity: 0;
  filter: alpha(opacity=0);
}
.tooltip.in {
  opacity: 0.9;
  filter: alpha(opacity=90);
}
.tooltip.top {
  margin-top: -3px;
  padding: 5px 0;
}
.tooltip.right {
  margin-left: 3px;
  padding: 0 5px;
}
.tooltip.bottom {
  margin-top: 3px;
  padding: 5px 0;
}
.tooltip.left {
  margin-left: -3px;
  padding: 0 5px;
}
.tooltip-inner {
  max-width: 200px;
  padding: 3px 8px;
  color: #fff;
  text-align: center;
  background-color: #000;
  border-radius: 2px;
}
.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}
.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}
.tooltip.top-left .tooltip-arrow {
  bottom: 0;
  right: 5px;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}
.tooltip.top-right .tooltip-arrow {
  bottom: 0;
  left: 5px;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}
.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #000;
}
.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #000;
}
.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}
.tooltip.bottom-left .tooltip-arrow {
  top: 0;
  right: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}
.tooltip.bottom-right .tooltip-arrow {
  top: 0;
  left: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}
.popover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1060;
  display: none;
  max-width: 276px;
  padding: 1px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: normal;
  line-break: auto;
  line-height: 1.42857143;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  white-space: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  font-size: 13px;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}
.popover.top {
  margin-top: -10px;
}
.popover.right {
  margin-left: 10px;
}
.popover.bottom {
  margin-top: 10px;
}
.popover.left {
  margin-left: -10px;
}
.popover-title {
  margin: 0;
  padding: 8px 14px;
  font-size: 13px;
  background-color: #f7f7f7;
  border-bottom: 1px solid #ebebeb;
  border-radius: 2px 2px 0 0;
}
.popover-content {
  padding: 9px 14px;
}
.popover > .arrow,
.popover > .arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}
.popover > .arrow {
  border-width: 11px;
}
.popover > .arrow:after {
  border-width: 10px;
  content: "";
}
.popover.top > .arrow {
  left: 50%;
  margin-left: -11px;
  border-bottom-width: 0;
  border-top-color: #999999;
  border-top-color: rgba(0, 0, 0, 0.25);
  bottom: -11px;
}
.popover.top > .arrow:after {
  content: " ";
  bottom: 1px;
  margin-left: -10px;
  border-bottom-width: 0;
  border-top-color: #fff;
}
.popover.right > .arrow {
  top: 50%;
  left: -11px;
  margin-top: -11px;
  border-left-width: 0;
  border-right-color: #999999;
  border-right-color: rgba(0, 0, 0, 0.25);
}
.popover.right > .arrow:after {
  content: " ";
  left: 1px;
  bottom: -10px;
  border-left-width: 0;
  border-right-color: #fff;
}
.popover.bottom > .arrow {
  left: 50%;
  margin-left: -11px;
  border-top-width: 0;
  border-bottom-color: #999999;
  border-bottom-color: rgba(0, 0, 0, 0.25);
  top: -11px;
}
.popover.bottom > .arrow:after {
  content: " ";
  top: 1px;
  margin-left: -10px;
  border-top-width: 0;
  border-bottom-color: #fff;
}
.popover.left > .arrow {
  top: 50%;
  right: -11px;
  margin-top: -11px;
  border-right-width: 0;
  border-left-color: #999999;
  border-left-color: rgba(0, 0, 0, 0.25);
}
.popover.left > .arrow:after {
  content: " ";
  right: 1px;
  border-right-width: 0;
  border-left-color: #fff;
  bottom: -10px;
}
.carousel {
  position: relative;
}
.carousel-inner {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.carousel-inner > .item {
  display: none;
  position: relative;
  -webkit-transition: 0.6s ease-in-out left;
  -o-transition: 0.6s ease-in-out left;
  transition: 0.6s ease-in-out left;
}
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  line-height: 1;
}
@media all and (transform-3d), (-webkit-transform-3d) {
  .carousel-inner > .item {
    -webkit-transition: -webkit-transform 0.6s ease-in-out;
    -moz-transition: -moz-transform 0.6s ease-in-out;
    -o-transition: -o-transform 0.6s ease-in-out;
    transition: transform 0.6s ease-in-out;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    perspective: 1000px;
  }
  .carousel-inner > .item.next,
  .carousel-inner > .item.active.right {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    left: 0;
  }
  .carousel-inner > .item.prev,
  .carousel-inner > .item.active.left {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    left: 0;
  }
  .carousel-inner > .item.next.left,
  .carousel-inner > .item.prev.right,
  .carousel-inner > .item.active {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    left: 0;
  }
}
.carousel-inner > .active,
.carousel-inner > .next,
.carousel-inner > .prev {
  display: block;
}
.carousel-inner > .active {
  left: 0;
}
.carousel-inner > .next,
.carousel-inner > .prev {
  position: absolute;
  top: 0;
  width: 100%;
}
.carousel-inner > .next {
  left: 100%;
}
.carousel-inner > .prev {
  left: -100%;
}
.carousel-inner > .next.left,
.carousel-inner > .prev.right {
  left: 0;
}
.carousel-inner > .active.left {
  left: -100%;
}
.carousel-inner > .active.right {
  left: 100%;
}
.carousel-control {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 15%;
  opacity: 0.5;
  filter: alpha(opacity=50);
  font-size: 20px;
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  background-color: rgba(0, 0, 0, 0);
}
.carousel-control.left {
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
}
.carousel-control.right {
  left: auto;
  right: 0;
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
}
.carousel-control:hover,
.carousel-control:focus {
  outline: 0;
  color: #fff;
  text-decoration: none;
  opacity: 0.9;
  filter: alpha(opacity=90);
}
.carousel-control .icon-prev,
.carousel-control .icon-next,
.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right {
  position: absolute;
  top: 50%;
  margin-top: -10px;
  z-index: 5;
  display: inline-block;
}
.carousel-control .icon-prev,
.carousel-control .glyphicon-chevron-left {
  left: 50%;
  margin-left: -10px;
}
.carousel-control .icon-next,
.carousel-control .glyphicon-chevron-right {
  right: 50%;
  margin-right: -10px;
}
.carousel-control .icon-prev,
.carousel-control .icon-next {
  width: 20px;
  height: 20px;
  line-height: 1;
  font-family: serif;
}
.carousel-control .icon-prev:before {
  content: '\2039';
}
.carousel-control .icon-next:before {
  content: '\203a';
}
.carousel-indicators {
  position: absolute;
  bottom: 10px;
  left: 50%;
  z-index: 15;
  width: 60%;
  margin-left: -30%;
  padding-left: 0;
  list-style: none;
  text-align: center;
}
.carousel-indicators li {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 1px;
  text-indent: -999px;
  border: 1px solid #fff;
  border-radius: 10px;
  cursor: pointer;
  background-color: #000 \9;
  background-color: rgba(0, 0, 0, 0);
}
.carousel-indicators .active {
  margin: 0;
  width: 12px;
  height: 12px;
  background-color: #fff;
}
.carousel-caption {
  position: absolute;
  left: 15%;
  right: 15%;
  bottom: 20px;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
.carousel-caption .btn {
  text-shadow: none;
}
@media screen and (min-width: 768px) {
  .carousel-control .glyphicon-chevron-left,
  .carousel-control .glyphicon-chevron-right,
  .carousel-control .icon-prev,
  .carousel-control .icon-next {
    width: 30px;
    height: 30px;
    margin-top: -10px;
    font-size: 30px;
  }
  .carousel-control .glyphicon-chevron-left,
  .carousel-control .icon-prev {
    margin-left: -10px;
  }
  .carousel-control .glyphicon-chevron-right,
  .carousel-control .icon-next {
    margin-right: -10px;
  }
  .carousel-caption {
    left: 20%;
    right: 20%;
    padding-bottom: 30px;
  }
  .carousel-indicators {
    bottom: 20px;
  }
}
.clearfix:before,
.clearfix:after,
.dl-horizontal dd:before,
.dl-horizontal dd:after,
.container:before,
.container:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after,
.form-horizontal .form-group:before,
.form-horizontal .form-group:after,
.btn-toolbar:before,
.btn-toolbar:after,
.btn-group-vertical > .btn-group:before,
.btn-group-vertical > .btn-group:after,
.nav:before,
.nav:after,
.navbar:before,
.navbar:after,
.navbar-header:before,
.navbar-header:after,
.navbar-collapse:before,
.navbar-collapse:after,
.pager:before,
.pager:after,
.panel-body:before,
.panel-body:after,
.modal-header:before,
.modal-header:after,
.modal-footer:before,
.modal-footer:after,
.item_buttons:before,
.item_buttons:after {
  content: " ";
  display: table;
}
.clearfix:after,
.dl-horizontal dd:after,
.container:after,
.container-fluid:after,
.row:after,
.form-horizontal .form-group:after,
.btn-toolbar:after,
.btn-group-vertical > .btn-group:after,
.nav:after,
.navbar:after,
.navbar-header:after,
.navbar-collapse:after,
.pager:after,
.panel-body:after,
.modal-header:after,
.modal-footer:after,
.item_buttons:after {
  clear: both;
}
.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.pull-right {
  float: right !important;
}
.pull-left {
  float: left !important;
}
.hide {
  display: none !important;
}
.show {
  display: block !important;
}
.invisible {
  visibility: hidden;
}
.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.hidden {
  display: none !important;
}
.affix {
  position: fixed;
}
@-ms-viewport {
  width: device-width;
}
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: none !important;
}
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
  display: none !important;
}
@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
  table.visible-xs {
    display: table !important;
  }
  tr.visible-xs {
    display: table-row !important;
  }
  th.visible-xs,
  td.visible-xs {
    display: table-cell !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-block {
    display: block !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline {
    display: inline !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block !important;
  }
  table.visible-sm {
    display: table !important;
  }
  tr.visible-sm {
    display: table-row !important;
  }
  th.visible-sm,
  td.visible-sm {
    display: table-cell !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-block {
    display: block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline {
    display: inline !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md {
    display: block !important;
  }
  table.visible-md {
    display: table !important;
  }
  tr.visible-md {
    display: table-row !important;
  }
  th.visible-md,
  td.visible-md {
    display: table-cell !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-block {
    display: block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline {
    display: inline !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg {
    display: block !important;
  }
  table.visible-lg {
    display: table !important;
  }
  tr.visible-lg {
    display: table-row !important;
  }
  th.visible-lg,
  td.visible-lg {
    display: table-cell !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-block {
    display: block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline {
    display: inline !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline-block {
    display: inline-block !important;
  }
}
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}
.visible-print {
  display: none !important;
}
@media print {
  .visible-print {
    display: block !important;
  }
  table.visible-print {
    display: table !important;
  }
  tr.visible-print {
    display: table-row !important;
  }
  th.visible-print,
  td.visible-print {
    display: table-cell !important;
  }
}
.visible-print-block {
  display: none !important;
}
@media print {
  .visible-print-block {
    display: block !important;
  }
}
.visible-print-inline {
  display: none !important;
}
@media print {
  .visible-print-inline {
    display: inline !important;
  }
}
.visible-print-inline-block {
  display: none !important;
}
@media print {
  .visible-print-inline-block {
    display: inline-block !important;
  }
}
@media print {
  .hidden-print {
    display: none !important;
  }
}
/*!
*
* Font Awesome
*
*/
/*!
 *  Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
/* FONT PATH
 * -------------------------- */
@font-face {
  font-family: 'FontAwesome';
  src: url('../components/font-awesome/fonts/fontawesome-webfont.eot?v=4.7.0');
  src: url('../components/font-awesome/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../components/font-awesome/fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../components/font-awesome/fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../components/font-awesome/fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../components/font-awesome/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/* makes the font 33% larger relative to the icon container */
.fa-lg {
  font-size: 1.33333333em;
  line-height: 0.75em;
  vertical-align: -15%;
}
.fa-2x {
  font-size: 2em;
}
.fa-3x {
  font-size: 3em;
}
.fa-4x {
  font-size: 4em;
}
.fa-5x {
  font-size: 5em;
}
.fa-fw {
  width: 1.28571429em;
  text-align: center;
}
.fa-ul {
  padding-left: 0;
  margin-left: 2.14285714em;
  list-style-type: none;
}
.fa-ul > li {
  position: relative;
}
.fa-li {
  position: absolute;
  left: -2.14285714em;
  width: 2.14285714em;
  top: 0.14285714em;
  text-align: center;
}
.fa-li.fa-lg {
  left: -1.85714286em;
}
.fa-border {
  padding: .2em .25em .15em;
  border: solid 0.08em #eee;
  border-radius: .1em;
}
.fa-pull-left {
  float: left;
}
.fa-pull-right {
  float: right;
}
.fa.fa-pull-left {
  margin-right: .3em;
}
.fa.fa-pull-right {
  margin-left: .3em;
}
/* Deprecated as of 4.4.0 */
.pull-right {
  float: right;
}
.pull-left {
  float: left;
}
.fa.pull-left {
  margin-right: .3em;
}
.fa.pull-right {
  margin-left: .3em;
}
.fa-spin {
  -webkit-animation: fa-spin 2s infinite linear;
  animation: fa-spin 2s infinite linear;
}
.fa-pulse {
  -webkit-animation: fa-spin 1s infinite steps(8);
  animation: fa-spin 1s infinite steps(8);
}
@-webkit-keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
.fa-rotate-90 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
.fa-rotate-180 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}
.fa-rotate-270 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}
.fa-flip-horizontal {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
  -webkit-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.fa-flip-vertical {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  -webkit-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  transform: scale(1, -1);
}
:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical {
  filter: none;
}
.fa-stack {
  position: relative;
  display: inline-block;
  width: 2em;
  height: 2em;
  line-height: 2em;
  vertical-align: middle;
}
.fa-stack-1x,
.fa-stack-2x {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}
.fa-stack-1x {
  line-height: inherit;
}
.fa-stack-2x {
  font-size: 2em;
}
.fa-inverse {
  color: #fff;
}
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
   readers do not read off random characters that represent icons */
.fa-glass:before {
  content: "\f000";
}
.fa-music:before {
  content: "\f001";
}
.fa-search:before {
  content: "\f002";
}
.fa-envelope-o:before {
  content: "\f003";
}
.fa-heart:before {
  content: "\f004";
}
.fa-star:before {
  content: "\f005";
}
.fa-star-o:before {
  content: "\f006";
}
.fa-user:before {
  content: "\f007";
}
.fa-film:before {
  content: "\f008";
}
.fa-th-large:before {
  content: "\f009";
}
.fa-th:before {
  content: "\f00a";
}
.fa-th-list:before {
  content: "\f00b";
}
.fa-check:before {
  content: "\f00c";
}
.fa-remove:before,
.fa-close:before,
.fa-times:before {
  content: "\f00d";
}
.fa-search-plus:before {
  content: "\f00e";
}
.fa-search-minus:before {
  content: "\f010";
}
.fa-power-off:before {
  content: "\f011";
}
.fa-signal:before {
  content: "\f012";
}
.fa-gear:before,
.fa-cog:before {
  content: "\f013";
}
.fa-trash-o:before {
  content: "\f014";
}
.fa-home:before {
  content: "\f015";
}
.fa-file-o:before {
  content: "\f016";
}
.fa-clock-o:before {
  content: "\f017";
}
.fa-road:before {
  content: "\f018";
}
.fa-download:before {
  content: "\f019";
}
.fa-arrow-circle-o-down:before {
  content: "\f01a";
}
.fa-arrow-circle-o-up:before {
  content: "\f01b";
}
.fa-inbox:before {
  content: "\f01c";
}
.fa-play-circle-o:before {
  content: "\f01d";
}
.fa-rotate-right:before,
.fa-repeat:before {
  content: "\f01e";
}
.fa-refresh:before {
  content: "\f021";
}
.fa-list-alt:before {
  content: "\f022";
}
.fa-lock:before {
  content: "\f023";
}
.fa-flag:before {
  content: "\f024";
}
.fa-headphones:before {
  content: "\f025";
}
.fa-volume-off:before {
  content: "\f026";
}
.fa-volume-down:before {
  content: "\f027";
}
.fa-volume-up:before {
  content: "\f028";
}
.fa-qrcode:before {
  content: "\f029";
}
.fa-barcode:before {
  content: "\f02a";
}
.fa-tag:before {
  content: "\f02b";
}
.fa-tags:before {
  content: "\f02c";
}
.fa-book:before {
  content: "\f02d";
}
.fa-bookmark:before {
  content: "\f02e";
}
.fa-print:before {
  content: "\f02f";
}
.fa-camera:before {
  content: "\f030";
}
.fa-font:before {
  content: "\f031";
}
.fa-bold:before {
  content: "\f032";
}
.fa-italic:before {
  content: "\f033";
}
.fa-text-height:before {
  content: "\f034";
}
.fa-text-width:before {
  content: "\f035";
}
.fa-align-left:before {
  content: "\f036";
}
.fa-align-center:before {
  content: "\f037";
}
.fa-align-right:before {
  content: "\f038";
}
.fa-align-justify:before {
  content: "\f039";
}
.fa-list:before {
  content: "\f03a";
}
.fa-dedent:before,
.fa-outdent:before {
  content: "\f03b";
}
.fa-indent:before {
  content: "\f03c";
}
.fa-video-camera:before {
  content: "\f03d";
}
.fa-photo:before,
.fa-image:before,
.fa-picture-o:before {
  content: "\f03e";
}
.fa-pencil:before {
  content: "\f040";
}
.fa-map-marker:before {
  content: "\f041";
}
.fa-adjust:before {
  content: "\f042";
}
.fa-tint:before {
  content: "\f043";
}
.fa-edit:before,
.fa-pencil-square-o:before {
  content: "\f044";
}
.fa-share-square-o:before {
  content: "\f045";
}
.fa-check-square-o:before {
  content: "\f046";
}
.fa-arrows:before {
  content: "\f047";
}
.fa-step-backward:before {
  content: "\f048";
}
.fa-fast-backward:before {
  content: "\f049";
}
.fa-backward:before {
  content: "\f04a";
}
.fa-play:before {
  content: "\f04b";
}
.fa-pause:before {
  content: "\f04c";
}
.fa-stop:before {
  content: "\f04d";
}
.fa-forward:before {
  content: "\f04e";
}
.fa-fast-forward:before {
  content: "\f050";
}
.fa-step-forward:before {
  content: "\f051";
}
.fa-eject:before {
  content: "\f052";
}
.fa-chevron-left:before {
  content: "\f053";
}
.fa-chevron-right:before {
  content: "\f054";
}
.fa-plus-circle:before {
  content: "\f055";
}
.fa-minus-circle:before {
  content: "\f056";
}
.fa-times-circle:before {
  content: "\f057";
}
.fa-check-circle:before {
  content: "\f058";
}
.fa-question-circle:before {
  content: "\f059";
}
.fa-info-circle:before {
  content: "\f05a";
}
.fa-crosshairs:before {
  content: "\f05b";
}
.fa-times-circle-o:before {
  content: "\f05c";
}
.fa-check-circle-o:before {
  content: "\f05d";
}
.fa-ban:before {
  content: "\f05e";
}
.fa-arrow-left:before {
  content: "\f060";
}
.fa-arrow-right:before {
  content: "\f061";
}
.fa-arrow-up:before {
  content: "\f062";
}
.fa-arrow-down:before {
  content: "\f063";
}
.fa-mail-forward:before,
.fa-share:before {
  content: "\f064";
}
.fa-expand:before {
  content: "\f065";
}
.fa-compress:before {
  content: "\f066";
}
.fa-plus:before {
  content: "\f067";
}
.fa-minus:before {
  content: "\f068";
}
.fa-asterisk:before {
  content: "\f069";
}
.fa-exclamation-circle:before {
  content: "\f06a";
}
.fa-gift:before {
  content: "\f06b";
}
.fa-leaf:before {
  content: "\f06c";
}
.fa-fire:before {
  content: "\f06d";
}
.fa-eye:before {
  content: "\f06e";
}
.fa-eye-slash:before {
  content: "\f070";
}
.fa-warning:before,
.fa-exclamation-triangle:before {
  content: "\f071";
}
.fa-plane:before {
  content: "\f072";
}
.fa-calendar:before {
  content: "\f073";
}
.fa-random:before {
  content: "\f074";
}
.fa-comment:before {
  content: "\f075";
}
.fa-magnet:before {
  content: "\f076";
}
.fa-chevron-up:before {
  content: "\f077";
}
.fa-chevron-down:before {
  content: "\f078";
}
.fa-retweet:before {
  content: "\f079";
}
.fa-shopping-cart:before {
  content: "\f07a";
}
.fa-folder:before {
  content: "\f07b";
}
.fa-folder-open:before {
  content: "\f07c";
}
.fa-arrows-v:before {
  content: "\f07d";
}
.fa-arrows-h:before {
  content: "\f07e";
}
.fa-bar-chart-o:before,
.fa-bar-chart:before {
  content: "\f080";
}
.fa-twitter-square:before {
  content: "\f081";
}
.fa-facebook-square:before {
  content: "\f082";
}
.fa-camera-retro:before {
  content: "\f083";
}
.fa-key:before {
  content: "\f084";
}
.fa-gears:before,
.fa-cogs:before {
  content: "\f085";
}
.fa-comments:before {
  content: "\f086";
}
.fa-thumbs-o-up:before {
  content: "\f087";
}
.fa-thumbs-o-down:before {
  content: "\f088";
}
.fa-star-half:before {
  content: "\f089";
}
.fa-heart-o:before {
  content: "\f08a";
}
.fa-sign-out:before {
  content: "\f08b";
}
.fa-linkedin-square:before {
  content: "\f08c";
}
.fa-thumb-tack:before {
  content: "\f08d";
}
.fa-external-link:before {
  content: "\f08e";
}
.fa-sign-in:before {
  content: "\f090";
}
.fa-trophy:before {
  content: "\f091";
}
.fa-github-square:before {
  content: "\f092";
}
.fa-upload:before {
  content: "\f093";
}
.fa-lemon-o:before {
  content: "\f094";
}
.fa-phone:before {
  content: "\f095";
}
.fa-square-o:before {
  content: "\f096";
}
.fa-bookmark-o:before {
  content: "\f097";
}
.fa-phone-square:before {
  content: "\f098";
}
.fa-twitter:before {
  content: "\f099";
}
.fa-facebook-f:before,
.fa-facebook:before {
  content: "\f09a";
}
.fa-github:before {
  content: "\f09b";
}
.fa-unlock:before {
  content: "\f09c";
}
.fa-credit-card:before {
  content: "\f09d";
}
.fa-feed:before,
.fa-rss:before {
  content: "\f09e";
}
.fa-hdd-o:before {
  content: "\f0a0";
}
.fa-bullhorn:before {
  content: "\f0a1";
}
.fa-bell:before {
  content: "\f0f3";
}
.fa-certificate:before {
  content: "\f0a3";
}
.fa-hand-o-right:before {
  content: "\f0a4";
}
.fa-hand-o-left:before {
  content: "\f0a5";
}
.fa-hand-o-up:before {
  content: "\f0a6";
}
.fa-hand-o-down:before {
  content: "\f0a7";
}
.fa-arrow-circle-left:before {
  content: "\f0a8";
}
.fa-arrow-circle-right:before {
  content: "\f0a9";
}
.fa-arrow-circle-up:before {
  content: "\f0aa";
}
.fa-arrow-circle-down:before {
  content: "\f0ab";
}
.fa-globe:before {
  content: "\f0ac";
}
.fa-wrench:before {
  content: "\f0ad";
}
.fa-tasks:before {
  content: "\f0ae";
}
.fa-filter:before {
  content: "\f0b0";
}
.fa-briefcase:before {
  content: "\f0b1";
}
.fa-arrows-alt:before {
  content: "\f0b2";
}
.fa-group:before,
.fa-users:before {
  content: "\f0c0";
}
.fa-chain:before,
.fa-link:before {
  content: "\f0c1";
}
.fa-cloud:before {
  content: "\f0c2";
}
.fa-flask:before {
  content: "\f0c3";
}
.fa-cut:before,
.fa-scissors:before {
  content: "\f0c4";
}
.fa-copy:before,
.fa-files-o:before {
  content: "\f0c5";
}
.fa-paperclip:before {
  content: "\f0c6";
}
.fa-save:before,
.fa-floppy-o:before {
  content: "\f0c7";
}
.fa-square:before {
  content: "\f0c8";
}
.fa-navicon:before,
.fa-reorder:before,
.fa-bars:before {
  content: "\f0c9";
}
.fa-list-ul:before {
  content: "\f0ca";
}
.fa-list-ol:before {
  content: "\f0cb";
}
.fa-strikethrough:before {
  content: "\f0cc";
}
.fa-underline:before {
  content: "\f0cd";
}
.fa-table:before {
  content: "\f0ce";
}
.fa-magic:before {
  content: "\f0d0";
}
.fa-truck:before {
  content: "\f0d1";
}
.fa-pinterest:before {
  content: "\f0d2";
}
.fa-pinterest-square:before {
  content: "\f0d3";
}
.fa-google-plus-square:before {
  content: "\f0d4";
}
.fa-google-plus:before {
  content: "\f0d5";
}
.fa-money:before {
  content: "\f0d6";
}
.fa-caret-down:before {
  content: "\f0d7";
}
.fa-caret-up:before {
  content: "\f0d8";
}
.fa-caret-left:before {
  content: "\f0d9";
}
.fa-caret-right:before {
  content: "\f0da";
}
.fa-columns:before {
  content: "\f0db";
}
.fa-unsorted:before,
.fa-sort:before {
  content: "\f0dc";
}
.fa-sort-down:before,
.fa-sort-desc:before {
  content: "\f0dd";
}
.fa-sort-up:before,
.fa-sort-asc:before {
  content: "\f0de";
}
.fa-envelope:before {
  content: "\f0e0";
}
.fa-linkedin:before {
  content: "\f0e1";
}
.fa-rotate-left:before,
.fa-undo:before {
  content: "\f0e2";
}
.fa-legal:before,
.fa-gavel:before {
  content: "\f0e3";
}
.fa-dashboard:before,
.fa-tachometer:before {
  content: "\f0e4";
}
.fa-comment-o:before {
  content: "\f0e5";
}
.fa-comments-o:before {
  content: "\f0e6";
}
.fa-flash:before,
.fa-bolt:before {
  content: "\f0e7";
}
.fa-sitemap:before {
  content: "\f0e8";
}
.fa-umbrella:before {
  content: "\f0e9";
}
.fa-paste:before,
.fa-clipboard:before {
  content: "\f0ea";
}
.fa-lightbulb-o:before {
  content: "\f0eb";
}
.fa-exchange:before {
  content: "\f0ec";
}
.fa-cloud-download:before {
  content: "\f0ed";
}
.fa-cloud-upload:before {
  content: "\f0ee";
}
.fa-user-md:before {
  content: "\f0f0";
}
.fa-stethoscope:before {
  content: "\f0f1";
}
.fa-suitcase:before {
  content: "\f0f2";
}
.fa-bell-o:before {
  content: "\f0a2";
}
.fa-coffee:before {
  content: "\f0f4";
}
.fa-cutlery:before {
  content: "\f0f5";
}
.fa-file-text-o:before {
  content: "\f0f6";
}
.fa-building-o:before {
  content: "\f0f7";
}
.fa-hospital-o:before {
  content: "\f0f8";
}
.fa-ambulance:before {
  content: "\f0f9";
}
.fa-medkit:before {
  content: "\f0fa";
}
.fa-fighter-jet:before {
  content: "\f0fb";
}
.fa-beer:before {
  content: "\f0fc";
}
.fa-h-square:before {
  content: "\f0fd";
}
.fa-plus-square:before {
  content: "\f0fe";
}
.fa-angle-double-left:before {
  content: "\f100";
}
.fa-angle-double-right:before {
  content: "\f101";
}
.fa-angle-double-up:before {
  content: "\f102";
}
.fa-angle-double-down:before {
  content: "\f103";
}
.fa-angle-left:before {
  content: "\f104";
}
.fa-angle-right:before {
  content: "\f105";
}
.fa-angle-up:before {
  content: "\f106";
}
.fa-angle-down:before {
  content: "\f107";
}
.fa-desktop:before {
  content: "\f108";
}
.fa-laptop:before {
  content: "\f109";
}
.fa-tablet:before {
  content: "\f10a";
}
.fa-mobile-phone:before,
.fa-mobile:before {
  content: "\f10b";
}
.fa-circle-o:before {
  content: "\f10c";
}
.fa-quote-left:before {
  content: "\f10d";
}
.fa-quote-right:before {
  content: "\f10e";
}
.fa-spinner:before {
  content: "\f110";
}
.fa-circle:before {
  content: "\f111";
}
.fa-mail-reply:before,
.fa-reply:before {
  content: "\f112";
}
.fa-github-alt:before {
  content: "\f113";
}
.fa-folder-o:before {
  content: "\f114";
}
.fa-folder-open-o:before {
  content: "\f115";
}
.fa-smile-o:before {
  content: "\f118";
}
.fa-frown-o:before {
  content: "\f119";
}
.fa-meh-o:before {
  content: "\f11a";
}
.fa-gamepad:before {
  content: "\f11b";
}
.fa-keyboard-o:before {
  content: "\f11c";
}
.fa-flag-o:before {
  content: "\f11d";
}
.fa-flag-checkered:before {
  content: "\f11e";
}
.fa-terminal:before {
  content: "\f120";
}
.fa-code:before {
  content: "\f121";
}
.fa-mail-reply-all:before,
.fa-reply-all:before {
  content: "\f122";
}
.fa-star-half-empty:before,
.fa-star-half-full:before,
.fa-star-half-o:before {
  content: "\f123";
}
.fa-location-arrow:before {
  content: "\f124";
}
.fa-crop:before {
  content: "\f125";
}
.fa-code-fork:before {
  content: "\f126";
}
.fa-unlink:before,
.fa-chain-broken:before {
  content: "\f127";
}
.fa-question:before {
  content: "\f128";
}
.fa-info:before {
  content: "\f129";
}
.fa-exclamation:before {
  content: "\f12a";
}
.fa-superscript:before {
  content: "\f12b";
}
.fa-subscript:before {
  content: "\f12c";
}
.fa-eraser:before {
  content: "\f12d";
}
.fa-puzzle-piece:before {
  content: "\f12e";
}
.fa-microphone:before {
  content: "\f130";
}
.fa-microphone-slash:before {
  content: "\f131";
}
.fa-shield:before {
  content: "\f132";
}
.fa-calendar-o:before {
  content: "\f133";
}
.fa-fire-extinguisher:before {
  content: "\f134";
}
.fa-rocket:before {
  content: "\f135";
}
.fa-maxcdn:before {
  content: "\f136";
}
.fa-chevron-circle-left:before {
  content: "\f137";
}
.fa-chevron-circle-right:before {
  content: "\f138";
}
.fa-chevron-circle-up:before {
  content: "\f139";
}
.fa-chevron-circle-down:before {
  content: "\f13a";
}
.fa-html5:before {
  content: "\f13b";
}
.fa-css3:before {
  content: "\f13c";
}
.fa-anchor:before {
  content: "\f13d";
}
.fa-unlock-alt:before {
  content: "\f13e";
}
.fa-bullseye:before {
  content: "\f140";
}
.fa-ellipsis-h:before {
  content: "\f141";
}
.fa-ellipsis-v:before {
  content: "\f142";
}
.fa-rss-square:before {
  content: "\f143";
}
.fa-play-circle:before {
  content: "\f144";
}
.fa-ticket:before {
  content: "\f145";
}
.fa-minus-square:before {
  content: "\f146";
}
.fa-minus-square-o:before {
  content: "\f147";
}
.fa-level-up:before {
  content: "\f148";
}
.fa-level-down:before {
  content: "\f149";
}
.fa-check-square:before {
  content: "\f14a";
}
.fa-pencil-square:before {
  content: "\f14b";
}
.fa-external-link-square:before {
  content: "\f14c";
}
.fa-share-square:before {
  content: "\f14d";
}
.fa-compass:before {
  content: "\f14e";
}
.fa-toggle-down:before,
.fa-caret-square-o-down:before {
  content: "\f150";
}
.fa-toggle-up:before,
.fa-caret-square-o-up:before {
  content: "\f151";
}
.fa-toggle-right:before,
.fa-caret-square-o-right:before {
  content: "\f152";
}
.fa-euro:before,
.fa-eur:before {
  content: "\f153";
}
.fa-gbp:before {
  content: "\f154";
}
.fa-dollar:before,
.fa-usd:before {
  content: "\f155";
}
.fa-rupee:before,
.fa-inr:before {
  content: "\f156";
}
.fa-cny:before,
.fa-rmb:before,
.fa-yen:before,
.fa-jpy:before {
  content: "\f157";
}
.fa-ruble:before,
.fa-rouble:before,
.fa-rub:before {
  content: "\f158";
}
.fa-won:before,
.fa-krw:before {
  content: "\f159";
}
.fa-bitcoin:before,
.fa-btc:before {
  content: "\f15a";
}
.fa-file:before {
  content: "\f15b";
}
.fa-file-text:before {
  content: "\f15c";
}
.fa-sort-alpha-asc:before {
  content: "\f15d";
}
.fa-sort-alpha-desc:before {
  content: "\f15e";
}
.fa-sort-amount-asc:before {
  content: "\f160";
}
.fa-sort-amount-desc:before {
  content: "\f161";
}
.fa-sort-numeric-asc:before {
  content: "\f162";
}
.fa-sort-numeric-desc:before {
  content: "\f163";
}
.fa-thumbs-up:before {
  content: "\f164";
}
.fa-thumbs-down:before {
  content: "\f165";
}
.fa-youtube-square:before {
  content: "\f166";
}
.fa-youtube:before {
  content: "\f167";
}
.fa-xing:before {
  content: "\f168";
}
.fa-xing-square:before {
  content: "\f169";
}
.fa-youtube-play:before {
  content: "\f16a";
}
.fa-dropbox:before {
  content: "\f16b";
}
.fa-stack-overflow:before {
  content: "\f16c";
}
.fa-instagram:before {
  content: "\f16d";
}
.fa-flickr:before {
  content: "\f16e";
}
.fa-adn:before {
  content: "\f170";
}
.fa-bitbucket:before {
  content: "\f171";
}
.fa-bitbucket-square:before {
  content: "\f172";
}
.fa-tumblr:before {
  content: "\f173";
}
.fa-tumblr-square:before {
  content: "\f174";
}
.fa-long-arrow-down:before {
  content: "\f175";
}
.fa-long-arrow-up:before {
  content: "\f176";
}
.fa-long-arrow-left:before {
  content: "\f177";
}
.fa-long-arrow-right:before {
  content: "\f178";
}
.fa-apple:before {
  content: "\f179";
}
.fa-windows:before {
  content: "\f17a";
}
.fa-android:before {
  content: "\f17b";
}
.fa-linux:before {
  content: "\f17c";
}
.fa-dribbble:before {
  content: "\f17d";
}
.fa-skype:before {
  content: "\f17e";
}
.fa-foursquare:before {
  content: "\f180";
}
.fa-trello:before {
  content: "\f181";
}
.fa-female:before {
  content: "\f182";
}
.fa-male:before {
  content: "\f183";
}
.fa-gittip:before,
.fa-gratipay:before {
  content: "\f184";
}
.fa-sun-o:before {
  content: "\f185";
}
.fa-moon-o:before {
  content: "\f186";
}
.fa-archive:before {
  content: "\f187";
}
.fa-bug:before {
  content: "\f188";
}
.fa-vk:before {
  content: "\f189";
}
.fa-weibo:before {
  content: "\f18a";
}
.fa-renren:before {
  content: "\f18b";
}
.fa-pagelines:before {
  content: "\f18c";
}
.fa-stack-exchange:before {
  content: "\f18d";
}
.fa-arrow-circle-o-right:before {
  content: "\f18e";
}
.fa-arrow-circle-o-left:before {
  content: "\f190";
}
.fa-toggle-left:before,
.fa-caret-square-o-left:before {
  content: "\f191";
}
.fa-dot-circle-o:before {
  content: "\f192";
}
.fa-wheelchair:before {
  content: "\f193";
}
.fa-vimeo-square:before {
  content: "\f194";
}
.fa-turkish-lira:before,
.fa-try:before {
  content: "\f195";
}
.fa-plus-square-o:before {
  content: "\f196";
}
.fa-space-shuttle:before {
  content: "\f197";
}
.fa-slack:before {
  content: "\f198";
}
.fa-envelope-square:before {
  content: "\f199";
}
.fa-wordpress:before {
  content: "\f19a";
}
.fa-openid:before {
  content: "\f19b";
}
.fa-institution:before,
.fa-bank:before,
.fa-university:before {
  content: "\f19c";
}
.fa-mortar-board:before,
.fa-graduation-cap:before {
  content: "\f19d";
}
.fa-yahoo:before {
  content: "\f19e";
}
.fa-google:before {
  content: "\f1a0";
}
.fa-reddit:before {
  content: "\f1a1";
}
.fa-reddit-square:before {
  content: "\f1a2";
}
.fa-stumbleupon-circle:before {
  content: "\f1a3";
}
.fa-stumbleupon:before {
  content: "\f1a4";
}
.fa-delicious:before {
  content: "\f1a5";
}
.fa-digg:before {
  content: "\f1a6";
}
.fa-pied-piper-pp:before {
  content: "\f1a7";
}
.fa-pied-piper-alt:before {
  content: "\f1a8";
}
.fa-drupal:before {
  content: "\f1a9";
}
.fa-joomla:before {
  content: "\f1aa";
}
.fa-language:before {
  content: "\f1ab";
}
.fa-fax:before {
  content: "\f1ac";
}
.fa-building:before {
  content: "\f1ad";
}
.fa-child:before {
  content: "\f1ae";
}
.fa-paw:before {
  content: "\f1b0";
}
.fa-spoon:before {
  content: "\f1b1";
}
.fa-cube:before {
  content: "\f1b2";
}
.fa-cubes:before {
  content: "\f1b3";
}
.fa-behance:before {
  content: "\f1b4";
}
.fa-behance-square:before {
  content: "\f1b5";
}
.fa-steam:before {
  content: "\f1b6";
}
.fa-steam-square:before {
  content: "\f1b7";
}
.fa-recycle:before {
  content: "\f1b8";
}
.fa-automobile:before,
.fa-car:before {
  content: "\f1b9";
}
.fa-cab:before,
.fa-taxi:before {
  content: "\f1ba";
}
.fa-tree:before {
  content: "\f1bb";
}
.fa-spotify:before {
  content: "\f1bc";
}
.fa-deviantart:before {
  content: "\f1bd";
}
.fa-soundcloud:before {
  content: "\f1be";
}
.fa-database:before {
  content: "\f1c0";
}
.fa-file-pdf-o:before {
  content: "\f1c1";
}
.fa-file-word-o:before {
  content: "\f1c2";
}
.fa-file-excel-o:before {
  content: "\f1c3";
}
.fa-file-powerpoint-o:before {
  content: "\f1c4";
}
.fa-file-photo-o:before,
.fa-file-picture-o:before,
.fa-file-image-o:before {
  content: "\f1c5";
}
.fa-file-zip-o:before,
.fa-file-archive-o:before {
  content: "\f1c6";
}
.fa-file-sound-o:before,
.fa-file-audio-o:before {
  content: "\f1c7";
}
.fa-file-movie-o:before,
.fa-file-video-o:before {
  content: "\f1c8";
}
.fa-file-code-o:before {
  content: "\f1c9";
}
.fa-vine:before {
  content: "\f1ca";
}
.fa-codepen:before {
  content: "\f1cb";
}
.fa-jsfiddle:before {
  content: "\f1cc";
}
.fa-life-bouy:before,
.fa-life-buoy:before,
.fa-life-saver:before,
.fa-support:before,
.fa-life-ring:before {
  content: "\f1cd";
}
.fa-circle-o-notch:before {
  content: "\f1ce";
}
.fa-ra:before,
.fa-resistance:before,
.fa-rebel:before {
  content: "\f1d0";
}
.fa-ge:before,
.fa-empire:before {
  content: "\f1d1";
}
.fa-git-square:before {
  content: "\f1d2";
}
.fa-git:before {
  content: "\f1d3";
}
.fa-y-combinator-square:before,
.fa-yc-square:before,
.fa-hacker-news:before {
  content: "\f1d4";
}
.fa-tencent-weibo:before {
  content: "\f1d5";
}
.fa-qq:before {
  content: "\f1d6";
}
.fa-wechat:before,
.fa-weixin:before {
  content: "\f1d7";
}
.fa-send:before,
.fa-paper-plane:before {
  content: "\f1d8";
}
.fa-send-o:before,
.fa-paper-plane-o:before {
  content: "\f1d9";
}
.fa-history:before {
  content: "\f1da";
}
.fa-circle-thin:before {
  content: "\f1db";
}
.fa-header:before {
  content: "\f1dc";
}
.fa-paragraph:before {
  content: "\f1dd";
}
.fa-sliders:before {
  content: "\f1de";
}
.fa-share-alt:before {
  content: "\f1e0";
}
.fa-share-alt-square:before {
  content: "\f1e1";
}
.fa-bomb:before {
  content: "\f1e2";
}
.fa-soccer-ball-o:before,
.fa-futbol-o:before {
  content: "\f1e3";
}
.fa-tty:before {
  content: "\f1e4";
}
.fa-binoculars:before {
  content: "\f1e5";
}
.fa-plug:before {
  content: "\f1e6";
}
.fa-slideshare:before {
  content: "\f1e7";
}
.fa-twitch:before {
  content: "\f1e8";
}
.fa-yelp:before {
  content: "\f1e9";
}
.fa-newspaper-o:before {
  content: "\f1ea";
}
.fa-wifi:before {
  content: "\f1eb";
}
.fa-calculator:before {
  content: "\f1ec";
}
.fa-paypal:before {
  content: "\f1ed";
}
.fa-google-wallet:before {
  content: "\f1ee";
}
.fa-cc-visa:before {
  content: "\f1f0";
}
.fa-cc-mastercard:before {
  content: "\f1f1";
}
.fa-cc-discover:before {
  content: "\f1f2";
}
.fa-cc-amex:before {
  content: "\f1f3";
}
.fa-cc-paypal:before {
  content: "\f1f4";
}
.fa-cc-stripe:before {
  content: "\f1f5";
}
.fa-bell-slash:before {
  content: "\f1f6";
}
.fa-bell-slash-o:before {
  content: "\f1f7";
}
.fa-trash:before {
  content: "\f1f8";
}
.fa-copyright:before {
  content: "\f1f9";
}
.fa-at:before {
  content: "\f1fa";
}
.fa-eyedropper:before {
  content: "\f1fb";
}
.fa-paint-brush:before {
  content: "\f1fc";
}
.fa-birthday-cake:before {
  content: "\f1fd";
}
.fa-area-chart:before {
  content: "\f1fe";
}
.fa-pie-chart:before {
  content: "\f200";
}
.fa-line-chart:before {
  content: "\f201";
}
.fa-lastfm:before {
  content: "\f202";
}
.fa-lastfm-square:before {
  content: "\f203";
}
.fa-toggle-off:before {
  content: "\f204";
}
.fa-toggle-on:before {
  content: "\f205";
}
.fa-bicycle:before {
  content: "\f206";
}
.fa-bus:before {
  content: "\f207";
}
.fa-ioxhost:before {
  content: "\f208";
}
.fa-angellist:before {
  content: "\f209";
}
.fa-cc:before {
  content: "\f20a";
}
.fa-shekel:before,
.fa-sheqel:before,
.fa-ils:before {
  content: "\f20b";
}
.fa-meanpath:before {
  content: "\f20c";
}
.fa-buysellads:before {
  content: "\f20d";
}
.fa-connectdevelop:before {
  content: "\f20e";
}
.fa-dashcube:before {
  content: "\f210";
}
.fa-forumbee:before {
  content: "\f211";
}
.fa-leanpub:before {
  content: "\f212";
}
.fa-sellsy:before {
  content: "\f213";
}
.fa-shirtsinbulk:before {
  content: "\f214";
}
.fa-simplybuilt:before {
  content: "\f215";
}
.fa-skyatlas:before {
  content: "\f216";
}
.fa-cart-plus:before {
  content: "\f217";
}
.fa-cart-arrow-down:before {
  content: "\f218";
}
.fa-diamond:before {
  content: "\f219";
}
.fa-ship:before {
  content: "\f21a";
}
.fa-user-secret:before {
  content: "\f21b";
}
.fa-motorcycle:before {
  content: "\f21c";
}
.fa-street-view:before {
  content: "\f21d";
}
.fa-heartbeat:before {
  content: "\f21e";
}
.fa-venus:before {
  content: "\f221";
}
.fa-mars:before {
  content: "\f222";
}
.fa-mercury:before {
  content: "\f223";
}
.fa-intersex:before,
.fa-transgender:before {
  content: "\f224";
}
.fa-transgender-alt:before {
  content: "\f225";
}
.fa-venus-double:before {
  content: "\f226";
}
.fa-mars-double:before {
  content: "\f227";
}
.fa-venus-mars:before {
  content: "\f228";
}
.fa-mars-stroke:before {
  content: "\f229";
}
.fa-mars-stroke-v:before {
  content: "\f22a";
}
.fa-mars-stroke-h:before {
  content: "\f22b";
}
.fa-neuter:before {
  content: "\f22c";
}
.fa-genderless:before {
  content: "\f22d";
}
.fa-facebook-official:before {
  content: "\f230";
}
.fa-pinterest-p:before {
  content: "\f231";
}
.fa-whatsapp:before {
  content: "\f232";
}
.fa-server:before {
  content: "\f233";
}
.fa-user-plus:before {
  content: "\f234";
}
.fa-user-times:before {
  content: "\f235";
}
.fa-hotel:before,
.fa-bed:before {
  content: "\f236";
}
.fa-viacoin:before {
  content: "\f237";
}
.fa-train:before {
  content: "\f238";
}
.fa-subway:before {
  content: "\f239";
}
.fa-medium:before {
  content: "\f23a";
}
.fa-yc:before,
.fa-y-combinator:before {
  content: "\f23b";
}
.fa-optin-monster:before {
  content: "\f23c";
}
.fa-opencart:before {
  content: "\f23d";
}
.fa-expeditedssl:before {
  content: "\f23e";
}
.fa-battery-4:before,
.fa-battery:before,
.fa-battery-full:before {
  content: "\f240";
}
.fa-battery-3:before,
.fa-battery-three-quarters:before {
  content: "\f241";
}
.fa-battery-2:before,
.fa-battery-half:before {
  content: "\f242";
}
.fa-battery-1:before,
.fa-battery-quarter:before {
  content: "\f243";
}
.fa-battery-0:before,
.fa-battery-empty:before {
  content: "\f244";
}
.fa-mouse-pointer:before {
  content: "\f245";
}
.fa-i-cursor:before {
  content: "\f246";
}
.fa-object-group:before {
  content: "\f247";
}
.fa-object-ungroup:before {
  content: "\f248";
}
.fa-sticky-note:before {
  content: "\f249";
}
.fa-sticky-note-o:before {
  content: "\f24a";
}
.fa-cc-jcb:before {
  content: "\f24b";
}
.fa-cc-diners-club:before {
  content: "\f24c";
}
.fa-clone:before {
  content: "\f24d";
}
.fa-balance-scale:before {
  content: "\f24e";
}
.fa-hourglass-o:before {
  content: "\f250";
}
.fa-hourglass-1:before,
.fa-hourglass-start:before {
  content: "\f251";
}
.fa-hourglass-2:before,
.fa-hourglass-half:before {
  content: "\f252";
}
.fa-hourglass-3:before,
.fa-hourglass-end:before {
  content: "\f253";
}
.fa-hourglass:before {
  content: "\f254";
}
.fa-hand-grab-o:before,
.fa-hand-rock-o:before {
  content: "\f255";
}
.fa-hand-stop-o:before,
.fa-hand-paper-o:before {
  content: "\f256";
}
.fa-hand-scissors-o:before {
  content: "\f257";
}
.fa-hand-lizard-o:before {
  content: "\f258";
}
.fa-hand-spock-o:before {
  content: "\f259";
}
.fa-hand-pointer-o:before {
  content: "\f25a";
}
.fa-hand-peace-o:before {
  content: "\f25b";
}
.fa-trademark:before {
  content: "\f25c";
}
.fa-registered:before {
  content: "\f25d";
}
.fa-creative-commons:before {
  content: "\f25e";
}
.fa-gg:before {
  content: "\f260";
}
.fa-gg-circle:before {
  content: "\f261";
}
.fa-tripadvisor:before {
  content: "\f262";
}
.fa-odnoklassniki:before {
  content: "\f263";
}
.fa-odnoklassniki-square:before {
  content: "\f264";
}
.fa-get-pocket:before {
  content: "\f265";
}
.fa-wikipedia-w:before {
  content: "\f266";
}
.fa-safari:before {
  content: "\f267";
}
.fa-chrome:before {
  content: "\f268";
}
.fa-firefox:before {
  content: "\f269";
}
.fa-opera:before {
  content: "\f26a";
}
.fa-internet-explorer:before {
  content: "\f26b";
}
.fa-tv:before,
.fa-television:before {
  content: "\f26c";
}
.fa-contao:before {
  content: "\f26d";
}
.fa-500px:before {
  content: "\f26e";
}
.fa-amazon:before {
  content: "\f270";
}
.fa-calendar-plus-o:before {
  content: "\f271";
}
.fa-calendar-minus-o:before {
  content: "\f272";
}
.fa-calendar-times-o:before {
  content: "\f273";
}
.fa-calendar-check-o:before {
  content: "\f274";
}
.fa-industry:before {
  content: "\f275";
}
.fa-map-pin:before {
  content: "\f276";
}
.fa-map-signs:before {
  content: "\f277";
}
.fa-map-o:before {
  content: "\f278";
}
.fa-map:before {
  content: "\f279";
}
.fa-commenting:before {
  content: "\f27a";
}
.fa-commenting-o:before {
  content: "\f27b";
}
.fa-houzz:before {
  content: "\f27c";
}
.fa-vimeo:before {
  content: "\f27d";
}
.fa-black-tie:before {
  content: "\f27e";
}
.fa-fonticons:before {
  content: "\f280";
}
.fa-reddit-alien:before {
  content: "\f281";
}
.fa-edge:before {
  content: "\f282";
}
.fa-credit-card-alt:before {
  content: "\f283";
}
.fa-codiepie:before {
  content: "\f284";
}
.fa-modx:before {
  content: "\f285";
}
.fa-fort-awesome:before {
  content: "\f286";
}
.fa-usb:before {
  content: "\f287";
}
.fa-product-hunt:before {
  content: "\f288";
}
.fa-mixcloud:before {
  content: "\f289";
}
.fa-scribd:before {
  content: "\f28a";
}
.fa-pause-circle:before {
  content: "\f28b";
}
.fa-pause-circle-o:before {
  content: "\f28c";
}
.fa-stop-circle:before {
  content: "\f28d";
}
.fa-stop-circle-o:before {
  content: "\f28e";
}
.fa-shopping-bag:before {
  content: "\f290";
}
.fa-shopping-basket:before {
  content: "\f291";
}
.fa-hashtag:before {
  content: "\f292";
}
.fa-bluetooth:before {
  content: "\f293";
}
.fa-bluetooth-b:before {
  content: "\f294";
}
.fa-percent:before {
  content: "\f295";
}
.fa-gitlab:before {
  content: "\f296";
}
.fa-wpbeginner:before {
  content: "\f297";
}
.fa-wpforms:before {
  content: "\f298";
}
.fa-envira:before {
  content: "\f299";
}
.fa-universal-access:before {
  content: "\f29a";
}
.fa-wheelchair-alt:before {
  content: "\f29b";
}
.fa-question-circle-o:before {
  content: "\f29c";
}
.fa-blind:before {
  content: "\f29d";
}
.fa-audio-description:before {
  content: "\f29e";
}
.fa-volume-control-phone:before {
  content: "\f2a0";
}
.fa-braille:before {
  content: "\f2a1";
}
.fa-assistive-listening-systems:before {
  content: "\f2a2";
}
.fa-asl-interpreting:before,
.fa-american-sign-language-interpreting:before {
  content: "\f2a3";
}
.fa-deafness:before,
.fa-hard-of-hearing:before,
.fa-deaf:before {
  content: "\f2a4";
}
.fa-glide:before {
  content: "\f2a5";
}
.fa-glide-g:before {
  content: "\f2a6";
}
.fa-signing:before,
.fa-sign-language:before {
  content: "\f2a7";
}
.fa-low-vision:before {
  content: "\f2a8";
}
.fa-viadeo:before {
  content: "\f2a9";
}
.fa-viadeo-square:before {
  content: "\f2aa";
}
.fa-snapchat:before {
  content: "\f2ab";
}
.fa-snapchat-ghost:before {
  content: "\f2ac";
}
.fa-snapchat-square:before {
  content: "\f2ad";
}
.fa-pied-piper:before {
  content: "\f2ae";
}
.fa-first-order:before {
  content: "\f2b0";
}
.fa-yoast:before {
  content: "\f2b1";
}
.fa-themeisle:before {
  content: "\f2b2";
}
.fa-google-plus-circle:before,
.fa-google-plus-official:before {
  content: "\f2b3";
}
.fa-fa:before,
.fa-font-awesome:before {
  content: "\f2b4";
}
.fa-handshake-o:before {
  content: "\f2b5";
}
.fa-envelope-open:before {
  content: "\f2b6";
}
.fa-envelope-open-o:before {
  content: "\f2b7";
}
.fa-linode:before {
  content: "\f2b8";
}
.fa-address-book:before {
  content: "\f2b9";
}
.fa-address-book-o:before {
  content: "\f2ba";
}
.fa-vcard:before,
.fa-address-card:before {
  content: "\f2bb";
}
.fa-vcard-o:before,
.fa-address-card-o:before {
  content: "\f2bc";
}
.fa-user-circle:before {
  content: "\f2bd";
}
.fa-user-circle-o:before {
  content: "\f2be";
}
.fa-user-o:before {
  content: "\f2c0";
}
.fa-id-badge:before {
  content: "\f2c1";
}
.fa-drivers-license:before,
.fa-id-card:before {
  content: "\f2c2";
}
.fa-drivers-license-o:before,
.fa-id-card-o:before {
  content: "\f2c3";
}
.fa-quora:before {
  content: "\f2c4";
}
.fa-free-code-camp:before {
  content: "\f2c5";
}
.fa-telegram:before {
  content: "\f2c6";
}
.fa-thermometer-4:before,
.fa-thermometer:before,
.fa-thermometer-full:before {
  content: "\f2c7";
}
.fa-thermometer-3:before,
.fa-thermometer-three-quarters:before {
  content: "\f2c8";
}
.fa-thermometer-2:before,
.fa-thermometer-half:before {
  content: "\f2c9";
}
.fa-thermometer-1:before,
.fa-thermometer-quarter:before {
  content: "\f2ca";
}
.fa-thermometer-0:before,
.fa-thermometer-empty:before {
  content: "\f2cb";
}
.fa-shower:before {
  content: "\f2cc";
}
.fa-bathtub:before,
.fa-s15:before,
.fa-bath:before {
  content: "\f2cd";
}
.fa-podcast:before {
  content: "\f2ce";
}
.fa-window-maximize:before {
  content: "\f2d0";
}
.fa-window-minimize:before {
  content: "\f2d1";
}
.fa-window-restore:before {
  content: "\f2d2";
}
.fa-times-rectangle:before,
.fa-window-close:before {
  content: "\f2d3";
}
.fa-times-rectangle-o:before,
.fa-window-close-o:before {
  content: "\f2d4";
}
.fa-bandcamp:before {
  content: "\f2d5";
}
.fa-grav:before {
  content: "\f2d6";
}
.fa-etsy:before {
  content: "\f2d7";
}
.fa-imdb:before {
  content: "\f2d8";
}
.fa-ravelry:before {
  content: "\f2d9";
}
.fa-eercast:before {
  content: "\f2da";
}
.fa-microchip:before {
  content: "\f2db";
}
.fa-snowflake-o:before {
  content: "\f2dc";
}
.fa-superpowers:before {
  content: "\f2dd";
}
.fa-wpexplorer:before {
  content: "\f2de";
}
.fa-meetup:before {
  content: "\f2e0";
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}
/*!
*
* IPython base
*
*/
.modal.fade .modal-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
}
code {
  color: #000;
}
pre {
  font-size: inherit;
  line-height: inherit;
}
label {
  font-weight: normal;
}
/* Make the page background atleast 100% the height of the view port */
/* Make the page itself atleast 70% the height of the view port */
.border-box-sizing {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.corner-all {
  border-radius: 2px;
}
.no-padding {
  padding: 0px;
}
/* Flexible box model classes */
/* Taken from Alex Russell http://infrequently.org/2009/08/css-3-progress/ */
/* This file is a compatability layer.  It allows the usage of flexible box 
model layouts accross multiple browsers, including older browsers.  The newest,
universal implementation of the flexible box model is used when available (see
`Modern browsers` comments below).  Browsers that are known to implement this 
new spec completely include:

    Firefox 28.0+
    Chrome 29.0+
    Internet Explorer 11+ 
    Opera 17.0+

Browsers not listed, including Safari, are supported via the styling under the
`Old browsers` comments below.
*/
.hbox {
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: horizontal;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: horizontal;
  -moz-box-align: stretch;
  display: box;
  box-orient: horizontal;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: row;
  align-items: stretch;
}
.hbox > * {
  /* Old browsers */
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  box-flex: 0;
  /* Modern browsers */
  flex: none;
}
.vbox {
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: vertical;
  -moz-box-align: stretch;
  display: box;
  box-orient: vertical;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.vbox > * {
  /* Old browsers */
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  box-flex: 0;
  /* Modern browsers */
  flex: none;
}
.hbox.reverse,
.vbox.reverse,
.reverse {
  /* Old browsers */
  -webkit-box-direction: reverse;
  -moz-box-direction: reverse;
  box-direction: reverse;
  /* Modern browsers */
  flex-direction: row-reverse;
}
.hbox.box-flex0,
.vbox.box-flex0,
.box-flex0 {
  /* Old browsers */
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  box-flex: 0;
  /* Modern browsers */
  flex: none;
  width: auto;
}
.hbox.box-flex1,
.vbox.box-flex1,
.box-flex1 {
  /* Old browsers */
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  box-flex: 1;
  /* Modern browsers */
  flex: 1;
}
.hbox.box-flex,
.vbox.box-flex,
.box-flex {
  /* Old browsers */
  /* Old browsers */
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  box-flex: 1;
  /* Modern browsers */
  flex: 1;
}
.hbox.box-flex2,
.vbox.box-flex2,
.box-flex2 {
  /* Old browsers */
  -webkit-box-flex: 2;
  -moz-box-flex: 2;
  box-flex: 2;
  /* Modern browsers */
  flex: 2;
}
.box-group1 {
  /*  Deprecated */
  -webkit-box-flex-group: 1;
  -moz-box-flex-group: 1;
  box-flex-group: 1;
}
.box-group2 {
  /* Deprecated */
  -webkit-box-flex-group: 2;
  -moz-box-flex-group: 2;
  box-flex-group: 2;
}
.hbox.start,
.vbox.start,
.start {
  /* Old browsers */
  -webkit-box-pack: start;
  -moz-box-pack: start;
  box-pack: start;
  /* Modern browsers */
  justify-content: flex-start;
}
.hbox.end,
.vbox.end,
.end {
  /* Old browsers */
  -webkit-box-pack: end;
  -moz-box-pack: end;
  box-pack: end;
  /* Modern browsers */
  justify-content: flex-end;
}
.hbox.center,
.vbox.center,
.center {
  /* Old browsers */
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  /* Modern browsers */
  justify-content: center;
}
.hbox.baseline,
.vbox.baseline,
.baseline {
  /* Old browsers */
  -webkit-box-pack: baseline;
  -moz-box-pack: baseline;
  box-pack: baseline;
  /* Modern browsers */
  justify-content: baseline;
}
.hbox.stretch,
.vbox.stretch,
.stretch {
  /* Old browsers */
  -webkit-box-pack: stretch;
  -moz-box-pack: stretch;
  box-pack: stretch;
  /* Modern browsers */
  justify-content: stretch;
}
.hbox.align-start,
.vbox.align-start,
.align-start {
  /* Old browsers */
  -webkit-box-align: start;
  -moz-box-align: start;
  box-align: start;
  /* Modern browsers */
  align-items: flex-start;
}
.hbox.align-end,
.vbox.align-end,
.align-end {
  /* Old browsers */
  -webkit-box-align: end;
  -moz-box-align: end;
  box-align: end;
  /* Modern browsers */
  align-items: flex-end;
}
.hbox.align-center,
.vbox.align-center,
.align-center {
  /* Old browsers */
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  /* Modern browsers */
  align-items: center;
}
.hbox.align-baseline,
.vbox.align-baseline,
.align-baseline {
  /* Old browsers */
  -webkit-box-align: baseline;
  -moz-box-align: baseline;
  box-align: baseline;
  /* Modern browsers */
  align-items: baseline;
}
.hbox.align-stretch,
.vbox.align-stretch,
.align-stretch {
  /* Old browsers */
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  box-align: stretch;
  /* Modern browsers */
  align-items: stretch;
}
div.error {
  margin: 2em;
  text-align: center;
}
div.error > h1 {
  font-size: 500%;
  line-height: normal;
}
div.error > p {
  font-size: 200%;
  line-height: normal;
}
div.traceback-wrapper {
  text-align: left;
  max-width: 800px;
  margin: auto;
}
div.traceback-wrapper pre.traceback {
  max-height: 600px;
  overflow: auto;
}
/**
 * Primary styles
 *
 * Author: Jupyter Development Team
 */
body {
  background-color: #fff;
  /* This makes sure that the body covers the entire window and needs to
       be in a different element than the display: box in wrapper below */
  position: absolute;
  left: 0px;
  right: 0px;
  top: 0px;
  bottom: 0px;
  overflow: visible;
}
body > #header {
  /* Initially hidden to prevent FLOUC */
  display: none;
  background-color: #fff;
  /* Display over codemirror */
  position: relative;
  z-index: 100;
}
body > #header #header-container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 5px;
  padding-bottom: 5px;
  padding-top: 5px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
body > #header .header-bar {
  width: 100%;
  height: 1px;
  background: #e7e7e7;
  margin-bottom: -1px;
}
@media print {
  body > #header {
    display: none !important;
  }
}
#header-spacer {
  width: 100%;
  visibility: hidden;
}
@media print {
  #header-spacer {
    display: none;
  }
}
#ipython_notebook {
  padding-left: 0px;
  padding-top: 1px;
  padding-bottom: 1px;
}
[dir="rtl"] #ipython_notebook {
  margin-right: 10px;
  margin-left: 0;
}
[dir="rtl"] #ipython_notebook.pull-left {
  float: right !important;
  float: right;
}
.flex-spacer {
  flex: 1;
}
#noscript {
  width: auto;
  padding-top: 16px;
  padding-bottom: 16px;
  text-align: center;
  font-size: 22px;
  color: red;
  font-weight: bold;
}
#ipython_notebook img {
  height: 28px;
}
#site {
  width: 100%;
  display: none;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  overflow: auto;
}
@media print {
  #site {
    height: auto !important;
  }
}
/* Smaller buttons */
.ui-button .ui-button-text {
  padding: 0.2em 0.8em;
  font-size: 77%;
}
input.ui-button {
  padding: 0.3em 0.9em;
}
span#kernel_logo_widget {
  margin: 0 10px;
}
span#login_widget {
  float: right;
}
[dir="rtl"] span#login_widget {
  float: left;
}
span#login_widget > .button,
#logout {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}
span#login_widget > .button:focus,
#logout:focus,
span#login_widget > .button.focus,
#logout.focus {
  color: #333;
  background-color: #e6e6e6;
  border-color: #8c8c8c;
}
span#login_widget > .button:hover,
#logout:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
span#login_widget > .button:active,
#logout:active,
span#login_widget > .button.active,
#logout.active,
.open > .dropdown-togglespan#login_widget > .button,
.open > .dropdown-toggle#logout {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
span#login_widget > .button:active:hover,
#logout:active:hover,
span#login_widget > .button.active:hover,
#logout.active:hover,
.open > .dropdown-togglespan#login_widget > .button:hover,
.open > .dropdown-toggle#logout:hover,
span#login_widget > .button:active:focus,
#logout:active:focus,
span#login_widget > .button.active:focus,
#logout.active:focus,
.open > .dropdown-togglespan#login_widget > .button:focus,
.open > .dropdown-toggle#logout:focus,
span#login_widget > .button:active.focus,
#logout:active.focus,
span#login_widget > .button.active.focus,
#logout.active.focus,
.open > .dropdown-togglespan#login_widget > .button.focus,
.open > .dropdown-toggle#logout.focus {
  color: #333;
  background-color: #d4d4d4;
  border-color: #8c8c8c;
}
span#login_widget > .button:active,
#logout:active,
span#login_widget > .button.active,
#logout.active,
.open > .dropdown-togglespan#login_widget > .button,
.open > .dropdown-toggle#logout {
  background-image: none;
}
span#login_widget > .button.disabled:hover,
#logout.disabled:hover,
span#login_widget > .button[disabled]:hover,
#logout[disabled]:hover,
fieldset[disabled] span#login_widget > .button:hover,
fieldset[disabled] #logout:hover,
span#login_widget > .button.disabled:focus,
#logout.disabled:focus,
span#login_widget > .button[disabled]:focus,
#logout[disabled]:focus,
fieldset[disabled] span#login_widget > .button:focus,
fieldset[disabled] #logout:focus,
span#login_widget > .button.disabled.focus,
#logout.disabled.focus,
span#login_widget > .button[disabled].focus,
#logout[disabled].focus,
fieldset[disabled] span#login_widget > .button.focus,
fieldset[disabled] #logout.focus {
  background-color: #fff;
  border-color: #ccc;
}
span#login_widget > .button .badge,
#logout .badge {
  color: #fff;
  background-color: #333;
}
.nav-header {
  text-transform: none;
}
#header > span {
  margin-top: 10px;
}
.modal_stretch .modal-dialog {
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: vertical;
  -moz-box-align: stretch;
  display: box;
  box-orient: vertical;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: 80vh;
}
.modal_stretch .modal-dialog .modal-body {
  max-height: calc(100vh - 200px);
  overflow: auto;
  flex: 1;
}
.modal-header {
  cursor: move;
}
@media (min-width: 768px) {
  .modal .modal-dialog {
    width: 700px;
  }
}
@media (min-width: 768px) {
  select.form-control {
    margin-left: 12px;
    margin-right: 12px;
  }
}
/*!
*
* IPython auth
*
*/
.center-nav {
  display: inline-block;
  margin-bottom: -4px;
}
[dir="rtl"] .center-nav form.pull-left {
  float: right !important;
  float: right;
}
[dir="rtl"] .center-nav .navbar-text {
  float: right;
}
[dir="rtl"] .navbar-inner {
  text-align: right;
}
[dir="rtl"] div.text-left {
  text-align: right;
}
/*!
*
* IPython tree view
*
*/
/* We need an invisible input field on top of the sentense*/
/* "Drag file onto the list ..." */
.alternate_upload {
  background-color: none;
  display: inline;
}
.alternate_upload.form {
  padding: 0;
  margin: 0;
}
.alternate_upload input.fileinput {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  cursor: pointer;
  opacity: 0;
  z-index: 2;
}
.alternate_upload .btn-xs > input.fileinput {
  margin: -1px -5px;
}
.alternate_upload .btn-upload {
  position: relative;
  height: 22px;
}
::-webkit-file-upload-button {
  cursor: pointer;
}
/**
 * Primary styles
 *
 * Author: Jupyter Development Team
 */
ul#tabs {
  margin-bottom: 4px;
}
ul#tabs a {
  padding-top: 6px;
  padding-bottom: 4px;
}
[dir="rtl"] ul#tabs.nav-tabs > li {
  float: right;
}
[dir="rtl"] ul#tabs.nav.nav-tabs {
  padding-right: 0;
}
ul.breadcrumb a:focus,
ul.breadcrumb a:hover {
  text-decoration: none;
}
ul.breadcrumb i.icon-home {
  font-size: 16px;
  margin-right: 4px;
}
ul.breadcrumb span {
  color: #5e5e5e;
}
.list_toolbar {
  padding: 4px 0 4px 0;
  vertical-align: middle;
}
.list_toolbar .tree-buttons {
  padding-top: 1px;
}
[dir="rtl"] .list_toolbar .tree-buttons .pull-right {
  float: left !important;
  float: left;
}
[dir="rtl"] .list_toolbar .col-sm-4,
[dir="rtl"] .list_toolbar .col-sm-8 {
  float: right;
}
.dynamic-buttons {
  padding-top: 3px;
  display: inline-block;
}
.list_toolbar [class*="span"] {
  min-height: 24px;
}
.list_header {
  font-weight: bold;
  background-color: #EEE;
}
.list_placeholder {
  font-weight: bold;
  padding-top: 4px;
  padding-bottom: 4px;
  padding-left: 7px;
  padding-right: 7px;
}
.list_container {
  margin-top: 4px;
  margin-bottom: 20px;
  border: 1px solid #ddd;
  border-radius: 2px;
}
.list_container > div {
  border-bottom: 1px solid #ddd;
}
.list_container > div:hover .list-item {
  background-color: red;
}
.list_container > div:last-child {
  border: none;
}
.list_item:hover .list_item {
  background-color: #ddd;
}
.list_item a {
  text-decoration: none;
}
.list_item:hover {
  background-color: #fafafa;
}
.list_header > div,
.list_item > div {
  padding-top: 4px;
  padding-bottom: 4px;
  padding-left: 7px;
  padding-right: 7px;
  line-height: 22px;
}
.list_header > div input,
.list_item > div input {
  margin-right: 7px;
  margin-left: 14px;
  vertical-align: text-bottom;
  line-height: 22px;
  position: relative;
  top: -1px;
}
.list_header > div .item_link,
.list_item > div .item_link {
  margin-left: -1px;
  vertical-align: baseline;
  line-height: 22px;
}
[dir="rtl"] .list_item > div input {
  margin-right: 0;
}
.new-file input[type=checkbox] {
  visibility: hidden;
}
.item_name {
  line-height: 22px;
  height: 24px;
}
.item_icon {
  font-size: 14px;
  color: #5e5e5e;
  margin-right: 7px;
  margin-left: 7px;
  line-height: 22px;
  vertical-align: baseline;
}
.item_modified {
  margin-right: 7px;
  margin-left: 7px;
}
[dir="rtl"] .item_modified.pull-right {
  float: left !important;
  float: left;
}
.item_buttons {
  line-height: 1em;
  margin-left: -5px;
}
.item_buttons .btn,
.item_buttons .btn-group,
.item_buttons .input-group {
  float: left;
}
.item_buttons > .btn,
.item_buttons > .btn-group,
.item_buttons > .input-group {
  margin-left: 5px;
}
.item_buttons .btn {
  min-width: 13ex;
}
.item_buttons .running-indicator {
  padding-top: 4px;
  color: #5cb85c;
}
.item_buttons .kernel-name {
  padding-top: 4px;
  color: #5bc0de;
  margin-right: 7px;
  float: left;
}
[dir="rtl"] .item_buttons.pull-right {
  float: left !important;
  float: left;
}
[dir="rtl"] .item_buttons .kernel-name {
  margin-left: 7px;
  float: right;
}
.toolbar_info {
  height: 24px;
  line-height: 24px;
}
.list_item input:not([type=checkbox]) {
  padding-top: 3px;
  padding-bottom: 3px;
  height: 22px;
  line-height: 14px;
  margin: 0px;
}
.highlight_text {
  color: blue;
}
#project_name {
  display: inline-block;
  padding-left: 7px;
  margin-left: -2px;
}
#project_name > .breadcrumb {
  padding: 0px;
  margin-bottom: 0px;
  background-color: transparent;
  font-weight: bold;
}
.sort_button {
  display: inline-block;
  padding-left: 7px;
}
[dir="rtl"] .sort_button.pull-right {
  float: left !important;
  float: left;
}
#tree-selector {
  padding-right: 0px;
}
#button-select-all {
  min-width: 50px;
}
[dir="rtl"] #button-select-all.btn {
  float: right ;
}
#select-all {
  margin-left: 7px;
  margin-right: 2px;
  margin-top: 2px;
  height: 16px;
}
[dir="rtl"] #select-all.pull-left {
  float: right !important;
  float: right;
}
.menu_icon {
  margin-right: 2px;
}
.tab-content .row {
  margin-left: 0px;
  margin-right: 0px;
}
.folder_icon:before {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f114";
}
.folder_icon:before.fa-pull-left {
  margin-right: .3em;
}
.folder_icon:before.fa-pull-right {
  margin-left: .3em;
}
.folder_icon:before.pull-left {
  margin-right: .3em;
}
.folder_icon:before.pull-right {
  margin-left: .3em;
}
.notebook_icon:before {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f02d";
  position: relative;
  top: -1px;
}
.notebook_icon:before.fa-pull-left {
  margin-right: .3em;
}
.notebook_icon:before.fa-pull-right {
  margin-left: .3em;
}
.notebook_icon:before.pull-left {
  margin-right: .3em;
}
.notebook_icon:before.pull-right {
  margin-left: .3em;
}
.running_notebook_icon:before {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f02d";
  position: relative;
  top: -1px;
  color: #5cb85c;
}
.running_notebook_icon:before.fa-pull-left {
  margin-right: .3em;
}
.running_notebook_icon:before.fa-pull-right {
  margin-left: .3em;
}
.running_notebook_icon:before.pull-left {
  margin-right: .3em;
}
.running_notebook_icon:before.pull-right {
  margin-left: .3em;
}
.file_icon:before {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f016";
  position: relative;
  top: -2px;
}
.file_icon:before.fa-pull-left {
  margin-right: .3em;
}
.file_icon:before.fa-pull-right {
  margin-left: .3em;
}
.file_icon:before.pull-left {
  margin-right: .3em;
}
.file_icon:before.pull-right {
  margin-left: .3em;
}
#notebook_toolbar .pull-right {
  padding-top: 0px;
  margin-right: -1px;
}
ul#new-menu {
  left: auto;
  right: 0;
}
#new-menu .dropdown-header {
  font-size: 10px;
  border-bottom: 1px solid #e5e5e5;
  padding: 0 0 3px;
  margin: -3px 20px 0;
}
.kernel-menu-icon {
  padding-right: 12px;
  width: 24px;
  content: "\f096";
}
.kernel-menu-icon:before {
  content: "\f096";
}
.kernel-menu-icon-current:before {
  content: "\f00c";
}
#tab_content {
  padding-top: 20px;
}
#running .panel-group .panel {
  margin-top: 3px;
  margin-bottom: 1em;
}
#running .panel-group .panel .panel-heading {
  background-color: #EEE;
  padding-top: 4px;
  padding-bottom: 4px;
  padding-left: 7px;
  padding-right: 7px;
  line-height: 22px;
}
#running .panel-group .panel .panel-heading a:focus,
#running .panel-group .panel .panel-heading a:hover {
  text-decoration: none;
}
#running .panel-group .panel .panel-body {
  padding: 0px;
}
#running .panel-group .panel .panel-body .list_container {
  margin-top: 0px;
  margin-bottom: 0px;
  border: 0px;
  border-radius: 0px;
}
#running .panel-group .panel .panel-body .list_container .list_item {
  border-bottom: 1px solid #ddd;
}
#running .panel-group .panel .panel-body .list_container .list_item:last-child {
  border-bottom: 0px;
}
.delete-button {
  display: none;
}
.duplicate-button {
  display: none;
}
.rename-button {
  display: none;
}
.move-button {
  display: none;
}
.download-button {
  display: none;
}
.shutdown-button {
  display: none;
}
.dynamic-instructions {
  display: inline-block;
  padding-top: 4px;
}
/*!
*
* IPython text editor webapp
*
*/
.selected-keymap i.fa {
  padding: 0px 5px;
}
.selected-keymap i.fa:before {
  content: "\f00c";
}
#mode-menu {
  overflow: auto;
  max-height: 20em;
}
.edit_app #header {
  -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
  box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
}
.edit_app #menubar .navbar {
  /* Use a negative 1 bottom margin, so the border overlaps the border of the
    header */
  margin-bottom: -1px;
}
.dirty-indicator {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 20px;
}
.dirty-indicator.fa-pull-left {
  margin-right: .3em;
}
.dirty-indicator.fa-pull-right {
  margin-left: .3em;
}
.dirty-indicator.pull-left {
  margin-right: .3em;
}
.dirty-indicator.pull-right {
  margin-left: .3em;
}
.dirty-indicator-dirty {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 20px;
}
.dirty-indicator-dirty.fa-pull-left {
  margin-right: .3em;
}
.dirty-indicator-dirty.fa-pull-right {
  margin-left: .3em;
}
.dirty-indicator-dirty.pull-left {
  margin-right: .3em;
}
.dirty-indicator-dirty.pull-right {
  margin-left: .3em;
}
.dirty-indicator-clean {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 20px;
}
.dirty-indicator-clean.fa-pull-left {
  margin-right: .3em;
}
.dirty-indicator-clean.fa-pull-right {
  margin-left: .3em;
}
.dirty-indicator-clean.pull-left {
  margin-right: .3em;
}
.dirty-indicator-clean.pull-right {
  margin-left: .3em;
}
.dirty-indicator-clean:before {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f00c";
}
.dirty-indicator-clean:before.fa-pull-left {
  margin-right: .3em;
}
.dirty-indicator-clean:before.fa-pull-right {
  margin-left: .3em;
}
.dirty-indicator-clean:before.pull-left {
  margin-right: .3em;
}
.dirty-indicator-clean:before.pull-right {
  margin-left: .3em;
}
#filename {
  font-size: 16pt;
  display: table;
  padding: 0px 5px;
}
#current-mode {
  padding-left: 5px;
  padding-right: 5px;
}
#texteditor-backdrop {
  padding-top: 20px;
  padding-bottom: 20px;
}
@media not print {
  #texteditor-backdrop {
    background-color: #EEE;
  }
}
@media print {
  #texteditor-backdrop #texteditor-container .CodeMirror-gutter,
  #texteditor-backdrop #texteditor-container .CodeMirror-gutters {
    background-color: #fff;
  }
}
@media not print {
  #texteditor-backdrop #texteditor-container .CodeMirror-gutter,
  #texteditor-backdrop #texteditor-container .CodeMirror-gutters {
    background-color: #fff;
  }
}
@media not print {
  #texteditor-backdrop #texteditor-container {
    padding: 0px;
    background-color: #fff;
    -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
    box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
  }
}
.CodeMirror-dialog {
  background-color: #fff;
}
/*!
*
* IPython notebook
*
*/
/* CSS font colors for translated ANSI escape sequences */
/* The color values are a mix of
   http://www.xcolors.net/dl/baskerville-ivorylight and
   http://www.xcolors.net/dl/euphrasia */
.ansi-black-fg {
  color: #3E424D;
}
.ansi-black-bg {
  background-color: #3E424D;
}
.ansi-black-intense-fg {
  color: #282C36;
}
.ansi-black-intense-bg {
  background-color: #282C36;
}
.ansi-red-fg {
  color: #E75C58;
}
.ansi-red-bg {
  background-color: #E75C58;
}
.ansi-red-intense-fg {
  color: #B22B31;
}
.ansi-red-intense-bg {
  background-color: #B22B31;
}
.ansi-green-fg {
  color: #00A250;
}
.ansi-green-bg {
  background-color: #00A250;
}
.ansi-green-intense-fg {
  color: #007427;
}
.ansi-green-intense-bg {
  background-color: #007427;
}
.ansi-yellow-fg {
  color: #DDB62B;
}
.ansi-yellow-bg {
  background-color: #DDB62B;
}
.ansi-yellow-intense-fg {
  color: #B27D12;
}
.ansi-yellow-intense-bg {
  background-color: #B27D12;
}
.ansi-blue-fg {
  color: #208FFB;
}
.ansi-blue-bg {
  background-color: #208FFB;
}
.ansi-blue-intense-fg {
  color: #0065CA;
}
.ansi-blue-intense-bg {
  background-color: #0065CA;
}
.ansi-magenta-fg {
  color: #D160C4;
}
.ansi-magenta-bg {
  background-color: #D160C4;
}
.ansi-magenta-intense-fg {
  color: #A03196;
}
.ansi-magenta-intense-bg {
  background-color: #A03196;
}
.ansi-cyan-fg {
  color: #60C6C8;
}
.ansi-cyan-bg {
  background-color: #60C6C8;
}
.ansi-cyan-intense-fg {
  color: #258F8F;
}
.ansi-cyan-intense-bg {
  background-color: #258F8F;
}
.ansi-white-fg {
  color: #C5C1B4;
}
.ansi-white-bg {
  background-color: #C5C1B4;
}
.ansi-white-intense-fg {
  color: #A1A6B2;
}
.ansi-white-intense-bg {
  background-color: #A1A6B2;
}
.ansi-default-inverse-fg {
  color: #FFFFFF;
}
.ansi-default-inverse-bg {
  background-color: #000000;
}
.ansi-bold {
  font-weight: bold;
}
.ansi-underline {
  text-decoration: underline;
}
/* The following styles are deprecated an will be removed in a future version */
.ansibold {
  font-weight: bold;
}
.ansi-inverse {
  outline: 0.5px dotted;
}
/* use dark versions for foreground, to improve visibility */
.ansiblack {
  color: black;
}
.ansired {
  color: darkred;
}
.ansigreen {
  color: darkgreen;
}
.ansiyellow {
  color: #c4a000;
}
.ansiblue {
  color: darkblue;
}
.ansipurple {
  color: darkviolet;
}
.ansicyan {
  color: steelblue;
}
.ansigray {
  color: gray;
}
/* and light for background, for the same reason */
.ansibgblack {
  background-color: black;
}
.ansibgred {
  background-color: red;
}
.ansibggreen {
  background-color: green;
}
.ansibgyellow {
  background-color: yellow;
}
.ansibgblue {
  background-color: blue;
}
.ansibgpurple {
  background-color: magenta;
}
.ansibgcyan {
  background-color: cyan;
}
.ansibggray {
  background-color: gray;
}
div.cell {
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: vertical;
  -moz-box-align: stretch;
  display: box;
  box-orient: vertical;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: column;
  align-items: stretch;
  border-radius: 2px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  border-width: 1px;
  border-style: solid;
  border-color: transparent;
  width: 100%;
  padding: 5px;
  /* This acts as a spacer between cells, that is outside the border */
  margin: 0px;
  outline: none;
  position: relative;
  overflow: visible;
}
div.cell:before {
  position: absolute;
  display: block;
  top: -1px;
  left: -1px;
  width: 5px;
  height: calc(100% +  2px);
  content: '';
  background: transparent;
}
div.cell.jupyter-soft-selected {
  border-left-color: #E3F2FD;
  border-left-width: 1px;
  padding-left: 5px;
  border-right-color: #E3F2FD;
  border-right-width: 1px;
  background: #E3F2FD;
}
@media print {
  div.cell.jupyter-soft-selected {
    border-color: transparent;
  }
}
div.cell.selected,
div.cell.selected.jupyter-soft-selected {
  border-color: #ababab;
}
div.cell.selected:before,
div.cell.selected.jupyter-soft-selected:before {
  position: absolute;
  display: block;
  top: -1px;
  left: -1px;
  width: 5px;
  height: calc(100% +  2px);
  content: '';
  background: #42A5F5;
}
@media print {
  div.cell.selected,
  div.cell.selected.jupyter-soft-selected {
    border-color: transparent;
  }
}
.edit_mode div.cell.selected {
  border-color: #66BB6A;
}
.edit_mode div.cell.selected:before {
  position: absolute;
  display: block;
  top: -1px;
  left: -1px;
  width: 5px;
  height: calc(100% +  2px);
  content: '';
  background: #66BB6A;
}
@media print {
  .edit_mode div.cell.selected {
    border-color: transparent;
  }
}
.prompt {
  /* This needs to be wide enough for 3 digit prompt numbers: In[100]: */
  min-width: 14ex;
  /* This padding is tuned to match the padding on the CodeMirror editor. */
  padding: 0.4em;
  margin: 0px;
  font-family: monospace;
  text-align: right;
  /* This has to match that of the the CodeMirror class line-height below */
  line-height: 1.21429em;
  /* Don't highlight prompt number selection */
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /* Use default cursor */
  cursor: default;
}
@media (max-width: 540px) {
  .prompt {
    text-align: left;
  }
}
div.inner_cell {
  min-width: 0;
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: vertical;
  -moz-box-align: stretch;
  display: box;
  box-orient: vertical;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: column;
  align-items: stretch;
  /* Old browsers */
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  box-flex: 1;
  /* Modern browsers */
  flex: 1;
}
/* input_area and input_prompt must match in top border and margin for alignment */
div.input_area {
  border: 1px solid #cfcfcf;
  border-radius: 2px;
  background: #f7f7f7;
  line-height: 1.21429em;
}
/* This is needed so that empty prompt areas can collapse to zero height when there
   is no content in the output_subarea and the prompt. The main purpose of this is
   to make sure that empty JavaScript output_subareas have no height. */
div.prompt:empty {
  padding-top: 0;
  padding-bottom: 0;
}
div.unrecognized_cell {
  padding: 5px 5px 5px 0px;
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: horizontal;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: horizontal;
  -moz-box-align: stretch;
  display: box;
  box-orient: horizontal;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: row;
  align-items: stretch;
}
div.unrecognized_cell .inner_cell {
  border-radius: 2px;
  padding: 5px;
  font-weight: bold;
  color: red;
  border: 1px solid #cfcfcf;
  background: #eaeaea;
}
div.unrecognized_cell .inner_cell a {
  color: inherit;
  text-decoration: none;
}
div.unrecognized_cell .inner_cell a:hover {
  color: inherit;
  text-decoration: none;
}
@media (max-width: 540px) {
  div.unrecognized_cell > div.prompt {
    display: none;
  }
}
div.code_cell {
  /* avoid page breaking on code cells when printing */
}
@media print {
  div.code_cell {
    page-break-inside: avoid;
  }
}
/* any special styling for code cells that are currently running goes here */
div.input {
  page-break-inside: avoid;
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: horizontal;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: horizontal;
  -moz-box-align: stretch;
  display: box;
  box-orient: horizontal;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: row;
  align-items: stretch;
}
@media (max-width: 540px) {
  div.input {
    /* Old browsers */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-box-align: stretch;
    display: -moz-box;
    -moz-box-orient: vertical;
    -moz-box-align: stretch;
    display: box;
    box-orient: vertical;
    box-align: stretch;
    /* Modern browsers */
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
}
/* input_area and input_prompt must match in top border and margin for alignment */
div.input_prompt {
  color: #303F9F;
  border-top: 1px solid transparent;
}
div.input_area > div.highlight {
  margin: 0.4em;
  border: none;
  padding: 0px;
  background-color: transparent;
}
div.input_area > div.highlight > pre {
  margin: 0px;
  border: none;
  padding: 0px;
  background-color: transparent;
}
/* The following gets added to the <head> if it is detected that the user has a
 * monospace font with inconsistent normal/bold/italic height.  See
 * notebookmain.js.  Such fonts will have keywords vertically offset with
 * respect to the rest of the text.  The user should select a better font.
 * See: https://github.com/ipython/ipython/issues/1503
 *
 * .CodeMirror span {
 *      vertical-align: bottom;
 * }
 */
.CodeMirror {
  line-height: 1.21429em;
  /* Changed from 1em to our global default */
  font-size: 14px;
  height: auto;
  /* Changed to auto to autogrow */
  background: none;
  /* Changed from white to allow our bg to show through */
}
.CodeMirror-scroll {
  /*  The CodeMirror docs are a bit fuzzy on if overflow-y should be hidden or visible.*/
  /*  We have found that if it is visible, vertical scrollbars appear with font size changes.*/
  overflow-y: hidden;
  overflow-x: auto;
}
.CodeMirror-lines {
  /* In CM2, this used to be 0.4em, but in CM3 it went to 4px. We need the em value because */
  /* we have set a different line-height and want this to scale with that. */
  /* Note that this should set vertical padding only, since CodeMirror assumes
       that horizontal padding will be set on CodeMirror pre */
  padding: 0.4em 0;
}
.CodeMirror-linenumber {
  padding: 0 8px 0 4px;
}
.CodeMirror-gutters {
  border-bottom-left-radius: 2px;
  border-top-left-radius: 2px;
}
.CodeMirror pre {
  /* In CM3 this went to 4px from 0 in CM2. This sets horizontal padding only,
    use .CodeMirror-lines for vertical */
  padding: 0 0.4em;
  border: 0;
  border-radius: 0;
}
.CodeMirror-cursor {
  border-left: 1.4px solid black;
}
@media screen and (min-width: 2138px) and (max-width: 4319px) {
  .CodeMirror-cursor {
    border-left: 2px solid black;
  }
}
@media screen and (min-width: 4320px) {
  .CodeMirror-cursor {
    border-left: 4px solid black;
  }
}
/*

Original style from softwaremaniacs.org (c) Ivan Sagalaev <Maniac@SoftwareManiacs.Org>
Adapted from GitHub theme

*/
.highlight-base {
  color: #000;
}
.highlight-variable {
  color: #000;
}
.highlight-variable-2 {
  color: #1a1a1a;
}
.highlight-variable-3 {
  color: #333333;
}
.highlight-string {
  color: #BA2121;
}
.highlight-comment {
  color: #408080;
  font-style: italic;
}
.highlight-number {
  color: #080;
}
.highlight-atom {
  color: #88F;
}
.highlight-keyword {
  color: #008000;
  font-weight: bold;
}
.highlight-builtin {
  color: #008000;
}
.highlight-error {
  color: #f00;
}
.highlight-operator {
  color: #AA22FF;
  font-weight: bold;
}
.highlight-meta {
  color: #AA22FF;
}
/* previously not defined, copying from default codemirror */
.highlight-def {
  color: #00f;
}
.highlight-string-2 {
  color: #f50;
}
.highlight-qualifier {
  color: #555;
}
.highlight-bracket {
  color: #997;
}
.highlight-tag {
  color: #170;
}
.highlight-attribute {
  color: #00c;
}
.highlight-header {
  color: blue;
}
.highlight-quote {
  color: #090;
}
.highlight-link {
  color: #00c;
}
/* apply the same style to codemirror */
.cm-s-ipython span.cm-keyword {
  color: #008000;
  font-weight: bold;
}
.cm-s-ipython span.cm-atom {
  color: #88F;
}
.cm-s-ipython span.cm-number {
  color: #080;
}
.cm-s-ipython span.cm-def {
  color: #00f;
}
.cm-s-ipython span.cm-variable {
  color: #000;
}
.cm-s-ipython span.cm-operator {
  color: #AA22FF;
  font-weight: bold;
}
.cm-s-ipython span.cm-variable-2 {
  color: #1a1a1a;
}
.cm-s-ipython span.cm-variable-3 {
  color: #333333;
}
.cm-s-ipython span.cm-comment {
  color: #408080;
  font-style: italic;
}
.cm-s-ipython span.cm-string {
  color: #BA2121;
}
.cm-s-ipython span.cm-string-2 {
  color: #f50;
}
.cm-s-ipython span.cm-meta {
  color: #AA22FF;
}
.cm-s-ipython span.cm-qualifier {
  color: #555;
}
.cm-s-ipython span.cm-builtin {
  color: #008000;
}
.cm-s-ipython span.cm-bracket {
  color: #997;
}
.cm-s-ipython span.cm-tag {
  color: #170;
}
.cm-s-ipython span.cm-attribute {
  color: #00c;
}
.cm-s-ipython span.cm-header {
  color: blue;
}
.cm-s-ipython span.cm-quote {
  color: #090;
}
.cm-s-ipython span.cm-link {
  color: #00c;
}
.cm-s-ipython span.cm-error {
  color: #f00;
}
.cm-s-ipython span.cm-tab {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAMCAYAAAAkuj5RAAAAAXNSR0IArs4c6QAAAGFJREFUSMft1LsRQFAQheHPowAKoACx3IgEKtaEHujDjORSgWTH/ZOdnZOcM/sgk/kFFWY0qV8foQwS4MKBCS3qR6ixBJvElOobYAtivseIE120FaowJPN75GMu8j/LfMwNjh4HUpwg4LUAAAAASUVORK5CYII=);
  background-position: right;
  background-repeat: no-repeat;
}
div.output_wrapper {
  /* this position must be relative to enable descendents to be absolute within it */
  position: relative;
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: vertical;
  -moz-box-align: stretch;
  display: box;
  box-orient: vertical;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: column;
  align-items: stretch;
  z-index: 1;
}
/* class for the output area when it should be height-limited */
div.output_scroll {
  /* ideally, this would be max-height, but FF barfs all over that */
  height: 24em;
  /* FF needs this *and the wrapper* to specify full width, or it will shrinkwrap */
  width: 100%;
  overflow: auto;
  border-radius: 2px;
  -webkit-box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.8);
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.8);
  display: block;
}
/* output div while it is collapsed */
div.output_collapsed {
  margin: 0px;
  padding: 0px;
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: vertical;
  -moz-box-align: stretch;
  display: box;
  box-orient: vertical;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
div.out_prompt_overlay {
  height: 100%;
  padding: 0px 0.4em;
  position: absolute;
  border-radius: 2px;
}
div.out_prompt_overlay:hover {
  /* use inner shadow to get border that is computed the same on WebKit/FF */
  -webkit-box-shadow: inset 0 0 1px #000;
  box-shadow: inset 0 0 1px #000;
  background: rgba(240, 240, 240, 0.5);
}
div.output_prompt {
  color: #D84315;
}
/* This class is the outer container of all output sections. */
div.output_area {
  padding: 0px;
  page-break-inside: avoid;
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: horizontal;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: horizontal;
  -moz-box-align: stretch;
  display: box;
  box-orient: horizontal;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: row;
  align-items: stretch;
}
div.output_area .MathJax_Display {
  text-align: left !important;
}
div.output_area .rendered_html table {
  margin-left: 0;
  margin-right: 0;
}
div.output_area .rendered_html img {
  margin-left: 0;
  margin-right: 0;
}
div.output_area img,
div.output_area svg {
  max-width: 100%;
  height: auto;
}
div.output_area img.unconfined,
div.output_area svg.unconfined {
  max-width: none;
}
div.output_area .mglyph > img {
  max-width: none;
}
/* This is needed to protect the pre formating from global settings such
   as that of bootstrap */
.output {
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: vertical;
  -moz-box-align: stretch;
  display: box;
  box-orient: vertical;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
@media (max-width: 540px) {
  div.output_area {
    /* Old browsers */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-box-align: stretch;
    display: -moz-box;
    -moz-box-orient: vertical;
    -moz-box-align: stretch;
    display: box;
    box-orient: vertical;
    box-align: stretch;
    /* Modern browsers */
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
}
div.output_area pre {
  margin: 0;
  padding: 1px 0 1px 0;
  border: 0;
  vertical-align: baseline;
  color: black;
  background-color: transparent;
  border-radius: 0;
}
/* This class is for the output subarea inside the output_area and after
   the prompt div. */
div.output_subarea {
  overflow-x: auto;
  padding: 0.4em;
  /* Old browsers */
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  box-flex: 1;
  /* Modern browsers */
  flex: 1;
  max-width: calc(100% - 14ex);
}
div.output_scroll div.output_subarea {
  overflow-x: visible;
}
/* The rest of the output_* classes are for special styling of the different
   output types */
/* all text output has this class: */
div.output_text {
  text-align: left;
  color: #000;
  /* This has to match that of the the CodeMirror class line-height below */
  line-height: 1.21429em;
}
/* stdout/stderr are 'text' as well as 'stream', but execute_result/error are *not* streams */
div.output_stderr {
  background: #fdd;
  /* very light red background for stderr */
}
div.output_latex {
  text-align: left;
}
/* Empty output_javascript divs should have no height */
div.output_javascript:empty {
  padding: 0;
}
.js-error {
  color: darkred;
}
/* raw_input styles */
div.raw_input_container {
  line-height: 1.21429em;
  padding-top: 5px;
}
pre.raw_input_prompt {
  /* nothing needed here. */
}
input.raw_input {
  font-family: monospace;
  font-size: inherit;
  color: inherit;
  width: auto;
  /* make sure input baseline aligns with prompt */
  vertical-align: baseline;
  /* padding + margin = 0.5em between prompt and cursor */
  padding: 0em 0.25em;
  margin: 0em 0.25em;
}
input.raw_input:focus {
  box-shadow: none;
}
p.p-space {
  margin-bottom: 10px;
}
div.output_unrecognized {
  padding: 5px;
  font-weight: bold;
  color: red;
}
div.output_unrecognized a {
  color: inherit;
  text-decoration: none;
}
div.output_unrecognized a:hover {
  color: inherit;
  text-decoration: none;
}
.rendered_html {
  color: #000;
  /* any extras will just be numbers: */
}
.rendered_html em {
  font-style: italic;
}
.rendered_html strong {
  font-weight: bold;
}
.rendered_html u {
  text-decoration: underline;
}
.rendered_html :link {
  text-decoration: underline;
}
.rendered_html :visited {
  text-decoration: underline;
}
.rendered_html h1 {
  font-size: 185.7%;
  margin: 1.08em 0 0 0;
  font-weight: bold;
  line-height: 1.0;
}
.rendered_html h2 {
  font-size: 157.1%;
  margin: 1.27em 0 0 0;
  font-weight: bold;
  line-height: 1.0;
}
.rendered_html h3 {
  font-size: 128.6%;
  margin: 1.55em 0 0 0;
  font-weight: bold;
  line-height: 1.0;
}
.rendered_html h4 {
  font-size: 100%;
  margin: 2em 0 0 0;
  font-weight: bold;
  line-height: 1.0;
}
.rendered_html h5 {
  font-size: 100%;
  margin: 2em 0 0 0;
  font-weight: bold;
  line-height: 1.0;
  font-style: italic;
}
.rendered_html h6 {
  font-size: 100%;
  margin: 2em 0 0 0;
  font-weight: bold;
  line-height: 1.0;
  font-style: italic;
}
.rendered_html h1:first-child {
  margin-top: 0.538em;
}
.rendered_html h2:first-child {
  margin-top: 0.636em;
}
.rendered_html h3:first-child {
  margin-top: 0.777em;
}
.rendered_html h4:first-child {
  margin-top: 1em;
}
.rendered_html h5:first-child {
  margin-top: 1em;
}
.rendered_html h6:first-child {
  margin-top: 1em;
}
.rendered_html ul:not(.list-inline),
.rendered_html ol:not(.list-inline) {
  padding-left: 2em;
}
.rendered_html ul {
  list-style: disc;
}
.rendered_html ul ul {
  list-style: square;
  margin-top: 0;
}
.rendered_html ul ul ul {
  list-style: circle;
}
.rendered_html ol {
  list-style: decimal;
}
.rendered_html ol ol {
  list-style: upper-alpha;
  margin-top: 0;
}
.rendered_html ol ol ol {
  list-style: lower-alpha;
}
.rendered_html ol ol ol ol {
  list-style: lower-roman;
}
.rendered_html ol ol ol ol ol {
  list-style: decimal;
}
.rendered_html * + ul {
  margin-top: 1em;
}
.rendered_html * + ol {
  margin-top: 1em;
}
.rendered_html hr {
  color: black;
  background-color: black;
}
.rendered_html pre {
  margin: 1em 2em;
  padding: 0px;
  background-color: #fff;
}
.rendered_html code {
  background-color: #eff0f1;
}
.rendered_html p code {
  padding: 1px 5px;
}
.rendered_html pre code {
  background-color: #fff;
}
.rendered_html pre,
.rendered_html code {
  border: 0;
  color: #000;
  font-size: 100%;
}
.rendered_html blockquote {
  margin: 1em 2em;
}
.rendered_html table {
  margin-left: auto;
  margin-right: auto;
  border: none;
  border-collapse: collapse;
  border-spacing: 0;
  color: black;
  font-size: 12px;
  table-layout: fixed;
}
.rendered_html thead {
  border-bottom: 1px solid black;
  vertical-align: bottom;
}
.rendered_html tr,
.rendered_html th,
.rendered_html td {
  text-align: right;
  vertical-align: middle;
  padding: 0.5em 0.5em;
  line-height: normal;
  white-space: normal;
  max-width: none;
  border: none;
}
.rendered_html th {
  font-weight: bold;
}
.rendered_html tbody tr:nth-child(odd) {
  background: #f5f5f5;
}
.rendered_html tbody tr:hover {
  background: rgba(66, 165, 245, 0.2);
}
.rendered_html * + table {
  margin-top: 1em;
}
.rendered_html p {
  text-align: left;
}
.rendered_html * + p {
  margin-top: 1em;
}
.rendered_html img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.rendered_html * + img {
  margin-top: 1em;
}
.rendered_html img,
.rendered_html svg {
  max-width: 100%;
  height: auto;
}
.rendered_html img.unconfined,
.rendered_html svg.unconfined {
  max-width: none;
}
.rendered_html .alert {
  margin-bottom: initial;
}
.rendered_html * + .alert {
  margin-top: 1em;
}
[dir="rtl"] .rendered_html p {
  text-align: right;
}
div.text_cell {
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: horizontal;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: horizontal;
  -moz-box-align: stretch;
  display: box;
  box-orient: horizontal;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: row;
  align-items: stretch;
}
@media (max-width: 540px) {
  div.text_cell > div.prompt {
    display: none;
  }
}
div.text_cell_render {
  /*font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;*/
  outline: none;
  resize: none;
  width: inherit;
  border-style: none;
  padding: 0.5em 0.5em 0.5em 0.4em;
  color: #000;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
a.anchor-link:link {
  text-decoration: none;
  padding: 0px 20px;
  visibility: hidden;
}
h1:hover .anchor-link,
h2:hover .anchor-link,
h3:hover .anchor-link,
h4:hover .anchor-link,
h5:hover .anchor-link,
h6:hover .anchor-link {
  visibility: visible;
}
.text_cell.rendered .input_area {
  display: none;
}
.text_cell.rendered .rendered_html {
  overflow-x: auto;
  overflow-y: hidden;
}
.text_cell.rendered .rendered_html tr,
.text_cell.rendered .rendered_html th,
.text_cell.rendered .rendered_html td {
  max-width: none;
}
.text_cell.unrendered .text_cell_render {
  display: none;
}
.text_cell .dropzone .input_area {
  border: 2px dashed #bababa;
  margin: -1px;
}
.cm-header-1,
.cm-header-2,
.cm-header-3,
.cm-header-4,
.cm-header-5,
.cm-header-6 {
  font-weight: bold;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.cm-header-1 {
  font-size: 185.7%;
}
.cm-header-2 {
  font-size: 157.1%;
}
.cm-header-3 {
  font-size: 128.6%;
}
.cm-header-4 {
  font-size: 110%;
}
.cm-header-5 {
  font-size: 100%;
  font-style: italic;
}
.cm-header-6 {
  font-size: 100%;
  font-style: italic;
}
/*!
*
* IPython notebook webapp
*
*/
@media (max-width: 767px) {
  .notebook_app {
    padding-left: 0px;
    padding-right: 0px;
  }
}
#ipython-main-app {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  height: 100%;
}
div#notebook_panel {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  height: 100%;
}
div#notebook {
  font-size: 14px;
  line-height: 20px;
  overflow-y: hidden;
  overflow-x: auto;
  width: 100%;
  /* This spaces the page away from the edge of the notebook area */
  padding-top: 20px;
  margin: 0px;
  outline: none;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  min-height: 100%;
}
@media not print {
  #notebook-container {
    padding: 15px;
    background-color: #fff;
    min-height: 0;
    -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
    box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
  }
}
@media print {
  #notebook-container {
    width: 100%;
  }
}
div.ui-widget-content {
  border: 1px solid #ababab;
  outline: none;
}
pre.dialog {
  background-color: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 2px;
  padding: 0.4em;
  padding-left: 2em;
}
p.dialog {
  padding: 0.2em;
}
/* Word-wrap output correctly.  This is the CSS3 spelling, though Firefox seems
   to not honor it correctly.  Webkit browsers (Chrome, rekonq, Safari) do.
 */
pre,
code,
kbd,
samp {
  white-space: pre-wrap;
}
#fonttest {
  font-family: monospace;
}
p {
  margin-bottom: 0;
}
.end_space {
  min-height: 100px;
  transition: height .2s ease;
}
.notebook_app > #header {
  -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
  box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
}
@media not print {
  .notebook_app {
    background-color: #EEE;
  }
}
kbd {
  border-style: solid;
  border-width: 1px;
  box-shadow: none;
  margin: 2px;
  padding-left: 2px;
  padding-right: 2px;
  padding-top: 1px;
  padding-bottom: 1px;
}
.jupyter-keybindings {
  padding: 1px;
  line-height: 24px;
  border-bottom: 1px solid gray;
}
.jupyter-keybindings input {
  margin: 0;
  padding: 0;
  border: none;
}
.jupyter-keybindings i {
  padding: 6px;
}
.well code {
  background-color: #ffffff;
  border-color: #ababab;
  border-width: 1px;
  border-style: solid;
  padding: 2px;
  padding-top: 1px;
  padding-bottom: 1px;
}
/* CSS for the cell toolbar */
.celltoolbar {
  border: thin solid #CFCFCF;
  border-bottom: none;
  background: #EEE;
  border-radius: 2px 2px 0px 0px;
  width: 100%;
  height: 29px;
  padding-right: 4px;
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: horizontal;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: horizontal;
  -moz-box-align: stretch;
  display: box;
  box-orient: horizontal;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: row;
  align-items: stretch;
  /* Old browsers */
  -webkit-box-pack: end;
  -moz-box-pack: end;
  box-pack: end;
  /* Modern browsers */
  justify-content: flex-end;
  display: -webkit-flex;
}
@media print {
  .celltoolbar {
    display: none;
  }
}
.ctb_hideshow {
  display: none;
  vertical-align: bottom;
}
/* ctb_show is added to the ctb_hideshow div to show the cell toolbar.
   Cell toolbars are only shown when the ctb_global_show class is also set.
*/
.ctb_global_show .ctb_show.ctb_hideshow {
  display: block;
}
.ctb_global_show .ctb_show + .input_area,
.ctb_global_show .ctb_show + div.text_cell_input,
.ctb_global_show .ctb_show ~ div.text_cell_render {
  border-top-right-radius: 0px;
  border-top-left-radius: 0px;
}
.ctb_global_show .ctb_show ~ div.text_cell_render {
  border: 1px solid #cfcfcf;
}
.celltoolbar {
  font-size: 87%;
  padding-top: 3px;
}
.celltoolbar select {
  display: block;
  width: 100%;
  height: 32px;
  padding: 6px 12px;
  font-size: 13px;
  line-height: 1.42857143;
  color: #555555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 2px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 1px;
  width: inherit;
  font-size: inherit;
  height: 22px;
  padding: 0px;
  display: inline-block;
}
.celltoolbar select:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.celltoolbar select::-moz-placeholder {
  color: #999;
  opacity: 1;
}
.celltoolbar select:-ms-input-placeholder {
  color: #999;
}
.celltoolbar select::-webkit-input-placeholder {
  color: #999;
}
.celltoolbar select::-ms-expand {
  border: 0;
  background-color: transparent;
}
.celltoolbar select[disabled],
.celltoolbar select[readonly],
fieldset[disabled] .celltoolbar select {
  background-color: #eeeeee;
  opacity: 1;
}
.celltoolbar select[disabled],
fieldset[disabled] .celltoolbar select {
  cursor: not-allowed;
}
textarea.celltoolbar select {
  height: auto;
}
select.celltoolbar select {
  height: 30px;
  line-height: 30px;
}
textarea.celltoolbar select,
select[multiple].celltoolbar select {
  height: auto;
}
.celltoolbar label {
  margin-left: 5px;
  margin-right: 5px;
}
.tags_button_container {
  width: 100%;
  display: flex;
}
.tag-container {
  display: flex;
  flex-direction: row;
  flex-grow: 1;
  overflow: hidden;
  position: relative;
}
.tag-container > * {
  margin: 0 4px;
}
.remove-tag-btn {
  margin-left: 4px;
}
.tags-input {
  display: flex;
}
.cell-tag:last-child:after {
  content: "";
  position: absolute;
  right: 0;
  width: 40px;
  height: 100%;
  /* Fade to background color of cell toolbar */
  background: linear-gradient(to right, rgba(0, 0, 0, 0), #EEE);
}
.tags-input > * {
  margin-left: 4px;
}
.cell-tag,
.tags-input input,
.tags-input button {
  display: block;
  width: 100%;
  height: 32px;
  padding: 6px 12px;
  font-size: 13px;
  line-height: 1.42857143;
  color: #555555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 2px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 1px;
  box-shadow: none;
  width: inherit;
  font-size: inherit;
  height: 22px;
  line-height: 22px;
  padding: 0px 4px;
  display: inline-block;
}
.cell-tag:focus,
.tags-input input:focus,
.tags-input button:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.cell-tag::-moz-placeholder,
.tags-input input::-moz-placeholder,
.tags-input button::-moz-placeholder {
  color: #999;
  opacity: 1;
}
.cell-tag:-ms-input-placeholder,
.tags-input input:-ms-input-placeholder,
.tags-input button:-ms-input-placeholder {
  color: #999;
}
.cell-tag::-webkit-input-placeholder,
.tags-input input::-webkit-input-placeholder,
.tags-input button::-webkit-input-placeholder {
  color: #999;
}
.cell-tag::-ms-expand,
.tags-input input::-ms-expand,
.tags-input button::-ms-expand {
  border: 0;
  background-color: transparent;
}
.cell-tag[disabled],
.tags-input input[disabled],
.tags-input button[disabled],
.cell-tag[readonly],
.tags-input input[readonly],
.tags-input button[readonly],
fieldset[disabled] .cell-tag,
fieldset[disabled] .tags-input input,
fieldset[disabled] .tags-input button {
  background-color: #eeeeee;
  opacity: 1;
}
.cell-tag[disabled],
.tags-input input[disabled],
.tags-input button[disabled],
fieldset[disabled] .cell-tag,
fieldset[disabled] .tags-input input,
fieldset[disabled] .tags-input button {
  cursor: not-allowed;
}
textarea.cell-tag,
textarea.tags-input input,
textarea.tags-input button {
  height: auto;
}
select.cell-tag,
select.tags-input input,
select.tags-input button {
  height: 30px;
  line-height: 30px;
}
textarea.cell-tag,
textarea.tags-input input,
textarea.tags-input button,
select[multiple].cell-tag,
select[multiple].tags-input input,
select[multiple].tags-input button {
  height: auto;
}
.cell-tag,
.tags-input button {
  padding: 0px 4px;
}
.cell-tag {
  background-color: #fff;
  white-space: nowrap;
}
.tags-input input[type=text]:focus {
  outline: none;
  box-shadow: none;
  border-color: #ccc;
}
.completions {
  position: absolute;
  z-index: 110;
  overflow: hidden;
  border: 1px solid #ababab;
  border-radius: 2px;
  -webkit-box-shadow: 0px 6px 10px -1px #adadad;
  box-shadow: 0px 6px 10px -1px #adadad;
  line-height: 1;
}
.completions select {
  background: white;
  outline: none;
  border: none;
  padding: 0px;
  margin: 0px;
  overflow: auto;
  font-family: monospace;
  font-size: 110%;
  color: #000;
  width: auto;
}
.completions select option.context {
  color: #286090;
}
#kernel_logo_widget .current_kernel_logo {
  display: none;
  margin-top: -1px;
  margin-bottom: -1px;
  width: 32px;
  height: 32px;
}
[dir="rtl"] #kernel_logo_widget {
  float: left !important;
  float: left;
}
.modal .modal-body .move-path {
  display: flex;
  flex-direction: row;
  justify-content: space;
  align-items: center;
}
.modal .modal-body .move-path .server-root {
  padding-right: 20px;
}
.modal .modal-body .move-path .path-input {
  flex: 1;
}
#menubar {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  margin-top: 1px;
}
#menubar .navbar {
  border-top: 1px;
  border-radius: 0px 0px 2px 2px;
  margin-bottom: 0px;
}
#menubar .navbar-toggle {
  float: left;
  padding-top: 7px;
  padding-bottom: 7px;
  border: none;
}
#menubar .navbar-collapse {
  clear: left;
}
[dir="rtl"] #menubar .navbar-toggle {
  float: right;
}
[dir="rtl"] #menubar .navbar-collapse {
  clear: right;
}
[dir="rtl"] #menubar .navbar-nav {
  float: right;
}
[dir="rtl"] #menubar .nav {
  padding-right: 0px;
}
[dir="rtl"] #menubar .navbar-nav > li {
  float: right;
}
[dir="rtl"] #menubar .navbar-right {
  float: left !important;
}
[dir="rtl"] ul.dropdown-menu {
  text-align: right;
  left: auto;
}
[dir="rtl"] ul#new-menu.dropdown-menu {
  right: auto;
  left: 0;
}
.nav-wrapper {
  border-bottom: 1px solid #e7e7e7;
}
i.menu-icon {
  padding-top: 4px;
}
[dir="rtl"] i.menu-icon.pull-right {
  float: left !important;
  float: left;
}
ul#help_menu li a {
  overflow: hidden;
  padding-right: 2.2em;
}
ul#help_menu li a i {
  margin-right: -1.2em;
}
[dir="rtl"] ul#help_menu li a {
  padding-left: 2.2em;
}
[dir="rtl"] ul#help_menu li a i {
  margin-right: 0;
  margin-left: -1.2em;
}
[dir="rtl"] ul#help_menu li a i.pull-right {
  float: left !important;
  float: left;
}
.dropdown-submenu {
  position: relative;
}
.dropdown-submenu > .dropdown-menu {
  top: 0;
  left: 100%;
  margin-top: -6px;
  margin-left: -1px;
}
[dir="rtl"] .dropdown-submenu > .dropdown-menu {
  right: 100%;
  margin-right: -1px;
}
.dropdown-submenu:hover > .dropdown-menu {
  display: block;
}
.dropdown-submenu > a:after {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: block;
  content: "\f0da";
  float: right;
  color: #333333;
  margin-top: 2px;
  margin-right: -10px;
}
.dropdown-submenu > a:after.fa-pull-left {
  margin-right: .3em;
}
.dropdown-submenu > a:after.fa-pull-right {
  margin-left: .3em;
}
.dropdown-submenu > a:after.pull-left {
  margin-right: .3em;
}
.dropdown-submenu > a:after.pull-right {
  margin-left: .3em;
}
[dir="rtl"] .dropdown-submenu > a:after {
  float: left;
  content: "\f0d9";
  margin-right: 0;
  margin-left: -10px;
}
.dropdown-submenu:hover > a:after {
  color: #262626;
}
.dropdown-submenu.pull-left {
  float: none;
}
.dropdown-submenu.pull-left > .dropdown-menu {
  left: -100%;
  margin-left: 10px;
}
#notification_area {
  float: right !important;
  float: right;
  z-index: 10;
}
[dir="rtl"] #notification_area {
  float: left !important;
  float: left;
}
.indicator_area {
  float: right !important;
  float: right;
  color: #777;
  margin-left: 5px;
  margin-right: 5px;
  width: 11px;
  z-index: 10;
  text-align: center;
  width: auto;
}
[dir="rtl"] .indicator_area {
  float: left !important;
  float: left;
}
#kernel_indicator {
  float: right !important;
  float: right;
  color: #777;
  margin-left: 5px;
  margin-right: 5px;
  width: 11px;
  z-index: 10;
  text-align: center;
  width: auto;
  border-left: 1px solid;
}
#kernel_indicator .kernel_indicator_name {
  padding-left: 5px;
  padding-right: 5px;
}
[dir="rtl"] #kernel_indicator {
  float: left !important;
  float: left;
  border-left: 0;
  border-right: 1px solid;
}
#modal_indicator {
  float: right !important;
  float: right;
  color: #777;
  margin-left: 5px;
  margin-right: 5px;
  width: 11px;
  z-index: 10;
  text-align: center;
  width: auto;
}
[dir="rtl"] #modal_indicator {
  float: left !important;
  float: left;
}
#readonly-indicator {
  float: right !important;
  float: right;
  color: #777;
  margin-left: 5px;
  margin-right: 5px;
  width: 11px;
  z-index: 10;
  text-align: center;
  width: auto;
  margin-top: 2px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  display: none;
}
.modal_indicator:before {
  width: 1.28571429em;
  text-align: center;
}
.edit_mode .modal_indicator:before {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f040";
}
.edit_mode .modal_indicator:before.fa-pull-left {
  margin-right: .3em;
}
.edit_mode .modal_indicator:before.fa-pull-right {
  margin-left: .3em;
}
.edit_mode .modal_indicator:before.pull-left {
  margin-right: .3em;
}
.edit_mode .modal_indicator:before.pull-right {
  margin-left: .3em;
}
.command_mode .modal_indicator:before {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: ' ';
}
.command_mode .modal_indicator:before.fa-pull-left {
  margin-right: .3em;
}
.command_mode .modal_indicator:before.fa-pull-right {
  margin-left: .3em;
}
.command_mode .modal_indicator:before.pull-left {
  margin-right: .3em;
}
.command_mode .modal_indicator:before.pull-right {
  margin-left: .3em;
}
.kernel_idle_icon:before {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f10c";
}
.kernel_idle_icon:before.fa-pull-left {
  margin-right: .3em;
}
.kernel_idle_icon:before.fa-pull-right {
  margin-left: .3em;
}
.kernel_idle_icon:before.pull-left {
  margin-right: .3em;
}
.kernel_idle_icon:before.pull-right {
  margin-left: .3em;
}
.kernel_busy_icon:before {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f111";
}
.kernel_busy_icon:before.fa-pull-left {
  margin-right: .3em;
}
.kernel_busy_icon:before.fa-pull-right {
  margin-left: .3em;
}
.kernel_busy_icon:before.pull-left {
  margin-right: .3em;
}
.kernel_busy_icon:before.pull-right {
  margin-left: .3em;
}
.kernel_dead_icon:before {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f1e2";
}
.kernel_dead_icon:before.fa-pull-left {
  margin-right: .3em;
}
.kernel_dead_icon:before.fa-pull-right {
  margin-left: .3em;
}
.kernel_dead_icon:before.pull-left {
  margin-right: .3em;
}
.kernel_dead_icon:before.pull-right {
  margin-left: .3em;
}
.kernel_disconnected_icon:before {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f127";
}
.kernel_disconnected_icon:before.fa-pull-left {
  margin-right: .3em;
}
.kernel_disconnected_icon:before.fa-pull-right {
  margin-left: .3em;
}
.kernel_disconnected_icon:before.pull-left {
  margin-right: .3em;
}
.kernel_disconnected_icon:before.pull-right {
  margin-left: .3em;
}
.notification_widget {
  color: #777;
  z-index: 10;
  background: rgba(240, 240, 240, 0.5);
  margin-right: 4px;
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}
.notification_widget:focus,
.notification_widget.focus {
  color: #333;
  background-color: #e6e6e6;
  border-color: #8c8c8c;
}
.notification_widget:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.notification_widget:active,
.notification_widget.active,
.open > .dropdown-toggle.notification_widget {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.notification_widget:active:hover,
.notification_widget.active:hover,
.open > .dropdown-toggle.notification_widget:hover,
.notification_widget:active:focus,
.notification_widget.active:focus,
.open > .dropdown-toggle.notification_widget:focus,
.notification_widget:active.focus,
.notification_widget.active.focus,
.open > .dropdown-toggle.notification_widget.focus {
  color: #333;
  background-color: #d4d4d4;
  border-color: #8c8c8c;
}
.notification_widget:active,
.notification_widget.active,
.open > .dropdown-toggle.notification_widget {
  background-image: none;
}
.notification_widget.disabled:hover,
.notification_widget[disabled]:hover,
fieldset[disabled] .notification_widget:hover,
.notification_widget.disabled:focus,
.notification_widget[disabled]:focus,
fieldset[disabled] .notification_widget:focus,
.notification_widget.disabled.focus,
.notification_widget[disabled].focus,
fieldset[disabled] .notification_widget.focus {
  background-color: #fff;
  border-color: #ccc;
}
.notification_widget .badge {
  color: #fff;
  background-color: #333;
}
.notification_widget.warning {
  color: #fff;
  background-color: #f0ad4e;
  border-color: #eea236;
}
.notification_widget.warning:focus,
.notification_widget.warning.focus {
  color: #fff;
  background-color: #ec971f;
  border-color: #985f0d;
}
.notification_widget.warning:hover {
  color: #fff;
  background-color: #ec971f;
  border-color: #d58512;
}
.notification_widget.warning:active,
.notification_widget.warning.active,
.open > .dropdown-toggle.notification_widget.warning {
  color: #fff;
  background-color: #ec971f;
  border-color: #d58512;
}
.notification_widget.warning:active:hover,
.notification_widget.warning.active:hover,
.open > .dropdown-toggle.notification_widget.warning:hover,
.notification_widget.warning:active:focus,
.notification_widget.warning.active:focus,
.open > .dropdown-toggle.notification_widget.warning:focus,
.notification_widget.warning:active.focus,
.notification_widget.warning.active.focus,
.open > .dropdown-toggle.notification_widget.warning.focus {
  color: #fff;
  background-color: #d58512;
  border-color: #985f0d;
}
.notification_widget.warning:active,
.notification_widget.warning.active,
.open > .dropdown-toggle.notification_widget.warning {
  background-image: none;
}
.notification_widget.warning.disabled:hover,
.notification_widget.warning[disabled]:hover,
fieldset[disabled] .notification_widget.warning:hover,
.notification_widget.warning.disabled:focus,
.notification_widget.warning[disabled]:focus,
fieldset[disabled] .notification_widget.warning:focus,
.notification_widget.warning.disabled.focus,
.notification_widget.warning[disabled].focus,
fieldset[disabled] .notification_widget.warning.focus {
  background-color: #f0ad4e;
  border-color: #eea236;
}
.notification_widget.warning .badge {
  color: #f0ad4e;
  background-color: #fff;
}
.notification_widget.success {
  color: #fff;
  background-color: #5cb85c;
  border-color: #4cae4c;
}
.notification_widget.success:focus,
.notification_widget.success.focus {
  color: #fff;
  background-color: #449d44;
  border-color: #255625;
}
.notification_widget.success:hover {
  color: #fff;
  background-color: #449d44;
  border-color: #398439;
}
.notification_widget.success:active,
.notification_widget.success.active,
.open > .dropdown-toggle.notification_widget.success {
  color: #fff;
  background-color: #449d44;
  border-color: #398439;
}
.notification_widget.success:active:hover,
.notification_widget.success.active:hover,
.open > .dropdown-toggle.notification_widget.success:hover,
.notification_widget.success:active:focus,
.notification_widget.success.active:focus,
.open > .dropdown-toggle.notification_widget.success:focus,
.notification_widget.success:active.focus,
.notification_widget.success.active.focus,
.open > .dropdown-toggle.notification_widget.success.focus {
  color: #fff;
  background-color: #398439;
  border-color: #255625;
}
.notification_widget.success:active,
.notification_widget.success.active,
.open > .dropdown-toggle.notification_widget.success {
  background-image: none;
}
.notification_widget.success.disabled:hover,
.notification_widget.success[disabled]:hover,
fieldset[disabled] .notification_widget.success:hover,
.notification_widget.success.disabled:focus,
.notification_widget.success[disabled]:focus,
fieldset[disabled] .notification_widget.success:focus,
.notification_widget.success.disabled.focus,
.notification_widget.success[disabled].focus,
fieldset[disabled] .notification_widget.success.focus {
  background-color: #5cb85c;
  border-color: #4cae4c;
}
.notification_widget.success .badge {
  color: #5cb85c;
  background-color: #fff;
}
.notification_widget.info {
  color: #fff;
  background-color: #5bc0de;
  border-color: #46b8da;
}
.notification_widget.info:focus,
.notification_widget.info.focus {
  color: #fff;
  background-color: #31b0d5;
  border-color: #1b6d85;
}
.notification_widget.info:hover {
  color: #fff;
  background-color: #31b0d5;
  border-color: #269abc;
}
.notification_widget.info:active,
.notification_widget.info.active,
.open > .dropdown-toggle.notification_widget.info {
  color: #fff;
  background-color: #31b0d5;
  border-color: #269abc;
}
.notification_widget.info:active:hover,
.notification_widget.info.active:hover,
.open > .dropdown-toggle.notification_widget.info:hover,
.notification_widget.info:active:focus,
.notification_widget.info.active:focus,
.open > .dropdown-toggle.notification_widget.info:focus,
.notification_widget.info:active.focus,
.notification_widget.info.active.focus,
.open > .dropdown-toggle.notification_widget.info.focus {
  color: #fff;
  background-color: #269abc;
  border-color: #1b6d85;
}
.notification_widget.info:active,
.notification_widget.info.active,
.open > .dropdown-toggle.notification_widget.info {
  background-image: none;
}
.notification_widget.info.disabled:hover,
.notification_widget.info[disabled]:hover,
fieldset[disabled] .notification_widget.info:hover,
.notification_widget.info.disabled:focus,
.notification_widget.info[disabled]:focus,
fieldset[disabled] .notification_widget.info:focus,
.notification_widget.info.disabled.focus,
.notification_widget.info[disabled].focus,
fieldset[disabled] .notification_widget.info.focus {
  background-color: #5bc0de;
  border-color: #46b8da;
}
.notification_widget.info .badge {
  color: #5bc0de;
  background-color: #fff;
}
.notification_widget.danger {
  color: #fff;
  background-color: #d9534f;
  border-color: #d43f3a;
}
.notification_widget.danger:focus,
.notification_widget.danger.focus {
  color: #fff;
  background-color: #c9302c;
  border-color: #761c19;
}
.notification_widget.danger:hover {
  color: #fff;
  background-color: #c9302c;
  border-color: #ac2925;
}
.notification_widget.danger:active,
.notification_widget.danger.active,
.open > .dropdown-toggle.notification_widget.danger {
  color: #fff;
  background-color: #c9302c;
  border-color: #ac2925;
}
.notification_widget.danger:active:hover,
.notification_widget.danger.active:hover,
.open > .dropdown-toggle.notification_widget.danger:hover,
.notification_widget.danger:active:focus,
.notification_widget.danger.active:focus,
.open > .dropdown-toggle.notification_widget.danger:focus,
.notification_widget.danger:active.focus,
.notification_widget.danger.active.focus,
.open > .dropdown-toggle.notification_widget.danger.focus {
  color: #fff;
  background-color: #ac2925;
  border-color: #761c19;
}
.notification_widget.danger:active,
.notification_widget.danger.active,
.open > .dropdown-toggle.notification_widget.danger {
  background-image: none;
}
.notification_widget.danger.disabled:hover,
.notification_widget.danger[disabled]:hover,
fieldset[disabled] .notification_widget.danger:hover,
.notification_widget.danger.disabled:focus,
.notification_widget.danger[disabled]:focus,
fieldset[disabled] .notification_widget.danger:focus,
.notification_widget.danger.disabled.focus,
.notification_widget.danger[disabled].focus,
fieldset[disabled] .notification_widget.danger.focus {
  background-color: #d9534f;
  border-color: #d43f3a;
}
.notification_widget.danger .badge {
  color: #d9534f;
  background-color: #fff;
}
div#pager {
  background-color: #fff;
  font-size: 14px;
  line-height: 20px;
  overflow: hidden;
  display: none;
  position: fixed;
  bottom: 0px;
  width: 100%;
  max-height: 50%;
  padding-top: 8px;
  -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
  box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
  /* Display over codemirror */
  z-index: 100;
  /* Hack which prevents jquery ui resizable from changing top. */
  top: auto !important;
}
div#pager pre {
  line-height: 1.21429em;
  color: #000;
  background-color: #f7f7f7;
  padding: 0.4em;
}
div#pager #pager-button-area {
  position: absolute;
  top: 8px;
  right: 20px;
}
div#pager #pager-contents {
  position: relative;
  overflow: auto;
  width: 100%;
  height: 100%;
}
div#pager #pager-contents #pager-container {
  position: relative;
  padding: 15px 0px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
div#pager .ui-resizable-handle {
  top: 0px;
  height: 8px;
  background: #f7f7f7;
  border-top: 1px solid #cfcfcf;
  border-bottom: 1px solid #cfcfcf;
  /* This injects handle bars (a short, wide = symbol) for 
        the resize handle. */
}
div#pager .ui-resizable-handle::after {
  content: '';
  top: 2px;
  left: 50%;
  height: 3px;
  width: 30px;
  margin-left: -15px;
  position: absolute;
  border-top: 1px solid #cfcfcf;
}
.quickhelp {
  /* Old browsers */
  display: -webkit-box;
  -webkit-box-orient: horizontal;
  -webkit-box-align: stretch;
  display: -moz-box;
  -moz-box-orient: horizontal;
  -moz-box-align: stretch;
  display: box;
  box-orient: horizontal;
  box-align: stretch;
  /* Modern browsers */
  display: flex;
  flex-direction: row;
  align-items: stretch;
  line-height: 1.8em;
}
.shortcut_key {
  display: inline-block;
  width: 21ex;
  text-align: right;
  font-family: monospace;
}
.shortcut_descr {
  display: inline-block;
  /* Old browsers */
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  box-flex: 1;
  /* Modern browsers */
  flex: 1;
}
span.save_widget {
  height: 30px;
  margin-top: 4px;
  display: flex;
  justify-content: flex-start;
  align-items: baseline;
  width: 50%;
  flex: 1;
}
span.save_widget span.filename {
  height: 100%;
  line-height: 1em;
  margin-left: 16px;
  border: none;
  font-size: 146.5%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  border-radius: 2px;
}
span.save_widget span.filename:hover {
  background-color: #e6e6e6;
}
[dir="rtl"] span.save_widget.pull-left {
  float: right !important;
  float: right;
}
[dir="rtl"] span.save_widget span.filename {
  margin-left: 0;
  margin-right: 16px;
}
span.checkpoint_status,
span.autosave_status {
  font-size: small;
  white-space: nowrap;
  padding: 0 5px;
}
@media (max-width: 767px) {
  span.save_widget {
    font-size: small;
    padding: 0 0 0 5px;
  }
  span.checkpoint_status,
  span.autosave_status {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  span.checkpoint_status {
    display: none;
  }
  span.autosave_status {
    font-size: x-small;
  }
}
.toolbar {
  padding: 0px;
  margin-left: -5px;
  margin-top: 2px;
  margin-bottom: 5px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.toolbar select,
.toolbar label {
  width: auto;
  vertical-align: middle;
  margin-right: 2px;
  margin-bottom: 0px;
  display: inline;
  font-size: 92%;
  margin-left: 0.3em;
  margin-right: 0.3em;
  padding: 0px;
  padding-top: 3px;
}
.toolbar .btn {
  padding: 2px 8px;
}
.toolbar .btn-group {
  margin-top: 0px;
  margin-left: 5px;
}
.toolbar-btn-label {
  margin-left: 6px;
}
#maintoolbar {
  margin-bottom: -3px;
  margin-top: -8px;
  border: 0px;
  min-height: 27px;
  margin-left: 0px;
  padding-top: 11px;
  padding-bottom: 3px;
}
#maintoolbar .navbar-text {
  float: none;
  vertical-align: middle;
  text-align: right;
  margin-left: 5px;
  margin-right: 0px;
  margin-top: 0px;
}
.select-xs {
  height: 24px;
}
[dir="rtl"] .btn-group > .btn,
.btn-group-vertical > .btn {
  float: right;
}
.pulse,
.dropdown-menu > li > a.pulse,
li.pulse > a.dropdown-toggle,
li.pulse.open > a.dropdown-toggle {
  background-color: #F37626;
  color: white;
}
/**
 * Primary styles
 *
 * Author: Jupyter Development Team
 */
/** WARNING IF YOU ARE EDITTING THIS FILE, if this is a .css file, It has a lot
 * of chance of beeing generated from the ../less/[samename].less file, you can
 * try to get back the less file by reverting somme commit in history
 **/
/*
 * We'll try to get something pretty, so we
 * have some strange css to have the scroll bar on
 * the left with fix button on the top right of the tooltip
 */
@-moz-keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@-moz-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/*properties of tooltip after "expand"*/
.bigtooltip {
  overflow: auto;
  height: 200px;
  -webkit-transition-property: height;
  -webkit-transition-duration: 500ms;
  -moz-transition-property: height;
  -moz-transition-duration: 500ms;
  transition-property: height;
  transition-duration: 500ms;
}
/*properties of tooltip before "expand"*/
.smalltooltip {
  -webkit-transition-property: height;
  -webkit-transition-duration: 500ms;
  -moz-transition-property: height;
  -moz-transition-duration: 500ms;
  transition-property: height;
  transition-duration: 500ms;
  text-overflow: ellipsis;
  overflow: hidden;
  height: 80px;
}
.tooltipbuttons {
  position: absolute;
  padding-right: 15px;
  top: 0px;
  right: 0px;
}
.tooltiptext {
  /*avoid the button to overlap on some docstring*/
  padding-right: 30px;
}
.ipython_tooltip {
  max-width: 700px;
  /*fade-in animation when inserted*/
  -webkit-animation: fadeOut 400ms;
  -moz-animation: fadeOut 400ms;
  animation: fadeOut 400ms;
  -webkit-animation: fadeIn 400ms;
  -moz-animation: fadeIn 400ms;
  animation: fadeIn 400ms;
  vertical-align: middle;
  background-color: #f7f7f7;
  overflow: visible;
  border: #ababab 1px solid;
  outline: none;
  padding: 3px;
  margin: 0px;
  padding-left: 7px;
  font-family: monospace;
  min-height: 50px;
  -moz-box-shadow: 0px 6px 10px -1px #adadad;
  -webkit-box-shadow: 0px 6px 10px -1px #adadad;
  box-shadow: 0px 6px 10px -1px #adadad;
  border-radius: 2px;
  position: absolute;
  z-index: 1000;
}
.ipython_tooltip a {
  float: right;
}
.ipython_tooltip .tooltiptext pre {
  border: 0;
  border-radius: 0;
  font-size: 100%;
  background-color: #f7f7f7;
}
.pretooltiparrow {
  left: 0px;
  margin: 0px;
  top: -16px;
  width: 40px;
  height: 16px;
  overflow: hidden;
  position: absolute;
}
.pretooltiparrow:before {
  background-color: #f7f7f7;
  border: 1px #ababab solid;
  z-index: 11;
  content: "";
  position: absolute;
  left: 15px;
  top: 10px;
  width: 25px;
  height: 25px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}
ul.typeahead-list i {
  margin-left: -10px;
  width: 18px;
}
[dir="rtl"] ul.typeahead-list i {
  margin-left: 0;
  margin-right: -10px;
}
ul.typeahead-list {
  max-height: 80vh;
  overflow: auto;
}
ul.typeahead-list > li > a {
  /** Firefox bug **/
  /* see https://github.com/jupyter/notebook/issues/559 */
  white-space: normal;
}
ul.typeahead-list  > li > a.pull-right {
  float: left !important;
  float: left;
}
[dir="rtl"] .typeahead-list {
  text-align: right;
}
.cmd-palette .modal-body {
  padding: 7px;
}
.cmd-palette form {
  background: white;
}
.cmd-palette input {
  outline: none;
}
.no-shortcut {
  min-width: 20px;
  color: transparent;
}
[dir="rtl"] .no-shortcut.pull-right {
  float: left !important;
  float: left;
}
[dir="rtl"] .command-shortcut.pull-right {
  float: left !important;
  float: left;
}
.command-shortcut:before {
  content: "(command mode)";
  padding-right: 3px;
  color: #777777;
}
.edit-shortcut:before {
  content: "(edit)";
  padding-right: 3px;
  color: #777777;
}
[dir="rtl"] .edit-shortcut.pull-right {
  float: left !important;
  float: left;
}
#find-and-replace #replace-preview .match,
#find-and-replace #replace-preview .insert {
  background-color: #BBDEFB;
  border-color: #90CAF9;
  border-style: solid;
  border-width: 1px;
  border-radius: 0px;
}
[dir="ltr"] #find-and-replace .input-group-btn + .form-control {
  border-left: none;
}
[dir="rtl"] #find-and-replace .input-group-btn + .form-control {
  border-right: none;
}
#find-and-replace #replace-preview .replace .match {
  background-color: #FFCDD2;
  border-color: #EF9A9A;
  border-radius: 0px;
}
#find-and-replace #replace-preview .replace .insert {
  background-color: #C8E6C9;
  border-color: #A5D6A7;
  border-radius: 0px;
}
#find-and-replace #replace-preview {
  max-height: 60vh;
  overflow: auto;
}
#find-and-replace #replace-preview pre {
  padding: 5px 10px;
}
.terminal-app {
  background: #EEE;
}
.terminal-app #header {
  background: #fff;
  -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
  box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.2);
}
.terminal-app .terminal {
  width: 100%;
  float: left;
  font-family: monospace;
  color: white;
  background: black;
  padding: 0.4em;
  border-radius: 2px;
  -webkit-box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.4);
  box-shadow: 0px 0px 12px 1px rgba(87, 87, 87, 0.4);
}
.terminal-app .terminal,
.terminal-app .terminal dummy-screen {
  line-height: 1em;
  font-size: 14px;
}
.terminal-app .terminal .xterm-rows {
  padding: 10px;
}
.terminal-app .terminal-cursor {
  color: black;
  background: white;
}
.terminal-app #terminado-container {
  margin-top: 20px;
}
/*# sourceMappingURL=style.min.css.map */
    </style>
<style type="text/css">
    .highlight .hll { background-color: #ffffcc }
.highlight  { background: #f8f8f8; }
.highlight .c { color: #408080; font-style: italic } /* Comment */
.highlight .err { border: 1px solid #FF0000 } /* Error */
.highlight .k { color: #008000; font-weight: bold } /* Keyword */
.highlight .o { color: #666666 } /* Operator */
.highlight .ch { color: #408080; font-style: italic } /* Comment.Hashbang */
.highlight .cm { color: #408080; font-style: italic } /* Comment.Multiline */
.highlight .cp { color: #BC7A00 } /* Comment.Preproc */
.highlight .cpf { color: #408080; font-style: italic } /* Comment.PreprocFile */
.highlight .c1 { color: #408080; font-style: italic } /* Comment.Single */
.highlight .cs { color: #408080; font-style: italic } /* Comment.Special */
.highlight .gd { color: #A00000 } /* Generic.Deleted */
.highlight .ge { font-style: italic } /* Generic.Emph */
.highlight .gr { color: #FF0000 } /* Generic.Error */
.highlight .gh { color: #000080; font-weight: bold } /* Generic.Heading */
.highlight .gi { color: #00A000 } /* Generic.Inserted */
.highlight .go { color: #888888 } /* Generic.Output */
.highlight .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
.highlight .gs { font-weight: bold } /* Generic.Strong */
.highlight .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
.highlight .gt { color: #0044DD } /* Generic.Traceback */
.highlight .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
.highlight .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
.highlight .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
.highlight .kp { color: #008000 } /* Keyword.Pseudo */
.highlight .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
.highlight .kt { color: #B00040 } /* Keyword.Type */
.highlight .m { color: #666666 } /* Literal.Number */
.highlight .s { color: #BA2121 } /* Literal.String */
.highlight .na { color: #7D9029 } /* Name.Attribute */
.highlight .nb { color: #008000 } /* Name.Builtin */
.highlight .nc { color: #0000FF; font-weight: bold } /* Name.Class */
.highlight .no { color: #880000 } /* Name.Constant */
.highlight .nd { color: #AA22FF } /* Name.Decorator */
.highlight .ni { color: #999999; font-weight: bold } /* Name.Entity */
.highlight .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
.highlight .nf { color: #0000FF } /* Name.Function */
.highlight .nl { color: #A0A000 } /* Name.Label */
.highlight .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
.highlight .nt { color: #008000; font-weight: bold } /* Name.Tag */
.highlight .nv { color: #19177C } /* Name.Variable */
.highlight .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
.highlight .w { color: #bbbbbb } /* Text.Whitespace */
.highlight .mb { color: #666666 } /* Literal.Number.Bin */
.highlight .mf { color: #666666 } /* Literal.Number.Float */
.highlight .mh { color: #666666 } /* Literal.Number.Hex */
.highlight .mi { color: #666666 } /* Literal.Number.Integer */
.highlight .mo { color: #666666 } /* Literal.Number.Oct */
.highlight .sa { color: #BA2121 } /* Literal.String.Affix */
.highlight .sb { color: #BA2121 } /* Literal.String.Backtick */
.highlight .sc { color: #BA2121 } /* Literal.String.Char */
.highlight .dl { color: #BA2121 } /* Literal.String.Delimiter */
.highlight .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
.highlight .s2 { color: #BA2121 } /* Literal.String.Double */
.highlight .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
.highlight .sh { color: #BA2121 } /* Literal.String.Heredoc */
.highlight .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
.highlight .sx { color: #008000 } /* Literal.String.Other */
.highlight .sr { color: #BB6688 } /* Literal.String.Regex */
.highlight .s1 { color: #BA2121 } /* Literal.String.Single */
.highlight .ss { color: #19177C } /* Literal.String.Symbol */
.highlight .bp { color: #008000 } /* Name.Builtin.Pseudo */
.highlight .fm { color: #0000FF } /* Name.Function.Magic */
.highlight .vc { color: #19177C } /* Name.Variable.Class */
.highlight .vg { color: #19177C } /* Name.Variable.Global */
.highlight .vi { color: #19177C } /* Name.Variable.Instance */
.highlight .vm { color: #19177C } /* Name.Variable.Magic */
.highlight .il { color: #666666 } /* Literal.Number.Integer.Long */
    </style>
<style type="text/css">
    
/* Temporary definitions which will become obsolete with Notebook release 5.0 */
.ansi-black-fg { color: #3E424D; }
.ansi-black-bg { background-color: #3E424D; }
.ansi-black-intense-fg { color: #282C36; }
.ansi-black-intense-bg { background-color: #282C36; }
.ansi-red-fg { color: #E75C58; }
.ansi-red-bg { background-color: #E75C58; }
.ansi-red-intense-fg { color: #B22B31; }
.ansi-red-intense-bg { background-color: #B22B31; }
.ansi-green-fg { color: #00A250; }
.ansi-green-bg { background-color: #00A250; }
.ansi-green-intense-fg { color: #007427; }
.ansi-green-intense-bg { background-color: #007427; }
.ansi-yellow-fg { color: #DDB62B; }
.ansi-yellow-bg { background-color: #DDB62B; }
.ansi-yellow-intense-fg { color: #B27D12; }
.ansi-yellow-intense-bg { background-color: #B27D12; }
.ansi-blue-fg { color: #208FFB; }
.ansi-blue-bg { background-color: #208FFB; }
.ansi-blue-intense-fg { color: #0065CA; }
.ansi-blue-intense-bg { background-color: #0065CA; }
.ansi-magenta-fg { color: #D160C4; }
.ansi-magenta-bg { background-color: #D160C4; }
.ansi-magenta-intense-fg { color: #A03196; }
.ansi-magenta-intense-bg { background-color: #A03196; }
.ansi-cyan-fg { color: #60C6C8; }
.ansi-cyan-bg { background-color: #60C6C8; }
.ansi-cyan-intense-fg { color: #258F8F; }
.ansi-cyan-intense-bg { background-color: #258F8F; }
.ansi-white-fg { color: #C5C1B4; }
.ansi-white-bg { background-color: #C5C1B4; }
.ansi-white-intense-fg { color: #A1A6B2; }
.ansi-white-intense-bg { background-color: #A1A6B2; }

.ansi-bold { font-weight: bold; }

    </style>
<style type="text/css">
    /* CSS stylesheet for fuzzingbook */
/* This is applied both for the HTML version as well as for the Jupyter Notebook version */
/* To apply this on local Jupyter notebook sessions, copy it to ~/.jupyter/custom/custom.css */

/* Loading fonts in Jupyter */
@import url(https://fonts.googleapis.com/css?family=Fira+Mono:400,500,700|Patua+One|Open+Sans|Source+Code+Pro);


/* Fonts */
h1, h2, h3, h4, h5 {
	font-family: 'Patua One', Helvetica, Arial, sans-serif;
}

body {
  font-family: 'Open Sans', sans-serif;
}

code, kbd, pre, samp {
  font-family: 'Fira Mono', 'Source Code Pro', monospace;
}

.CodeMirror pre {
  font-family: 'Fira Mono', 'Source Code Pro', monospace;
}


/* Font sizes */
/* We use somewhat smaller fonts for small devices */

p, li {
	font-size: 16px;
	line-height: 26px;
}
@media only screen and (max-width: 600px) {
    p, li {
    	font-size: 14px;
    	line-height: 24px;
    }
}

code, kbd, pre, samp {
  font-size: 14px;
  line-height: 18px;
}
.CodeMirror pre {
  font-size: 14px;
  line-height: 18px;
}
/* Code size must be extra small to fit on screen */
@media only screen and (max-width: 600px) {
    code, kbd, pre, samp {
      font-size: 12px;
      line-height: 18px;
    }
    .CodeMirror pre {
      font-size: 12px;
      line-height: 18px;
    }
}


/* Titles */

/* Book title */
/* Patua One looks better in normal weight */
section > h1 {
	font-size: 48px!important;
    font-weight: normal!important;
}

/* Chapter title */
h1 {
	font-size: 38px!important;
    font-weight: normal!important;
}

/* Section */
h2 {
	font-size: 28px!important;
    font-weight: normal!important;
}

/* Subsection */
h3 {
	font-size: 24px!important;
    font-weight: normal!important;
}

/* More sections */
h4, h5, h6 {
	font-size: 20px!important;
    font-weight: normal!important;
}

/* Small screens */
@media only screen and (max-width: 600px) {
    section > h1 { font-size: 36px!important; }
    h1 { font-size: 32px!important; }
    h2 { font-size: 26px!important; }
    h3 { font-size: 22px!important; }
    h4, h5, h6 {
        { font-size: 18px!important; }
    };
}


/* Exercises */
/* Some color tweaks to exercise2 buttons */
.onoffswitch-label {
    border: 2px solid #ffffff!important;
}

/* Show solution */
.onoffswitch-inner:after {
    background-color: #B03A2E!important; 
    color: #ffffff!important;
}

/* Hide solution */
.onoffswitch-inner:before {
    background-color: #F1948A!important; 
    color: #000000!important;
}


/* Jupyter Table of Contents */
/* See https://github.com/ipython-contrib/jupyter_contrib_nbextensions/blob/master/src/jupyter_contrib_nbextensions/nbextensions/toc2/main.css */
#toc-wrapper .toc-item-num {
    font-family: 'Patua One', Helvetica, Arial, sans-serif!important;
    /* font-family: 'Open Sans', sans-serif!important; */
}

#toc-wrapper li > span:hover {
  background-color: #F1948A!important;
}
.toc-item li { 
    font-size: 14px!important; 
    /* font-family: 'Patua One', Helvetica, Arial, sans-serif!important; */
    font-weight: normal!important;
}
#toc-wrapper .header {
  font-size: 20px!important;
  color: #B03A2E;
  font-family: 'Patua One', Helvetica, Arial, sans-serif;
  font-weight: normal!important;
}


/* Colors */
/* We want white code boxes on a light grey background */
body {
    background-color: #F0F0F0;
}

.container {
    background-color: #F8F8F8!important;    
}

.input_area, .output_area {
    background-color: white!important;    
}

/* Regular outputs come in blue, errors in red */
.output_area pre {
    color: darkblue!important;
/*  font-weight: bold; */
}

.output_stderr pre {
    color: #B03A2E!important;
}

/* Headers are dark red, too */
h1, h2, h3 {
    color: #B03A2E;
}

h4, h5 {
    color: black;
}

/* And links also come in shades of red */
a:link { /* unvisited link */
    color: #A93226;
    /* text-decoration: none!important; */
}

a:visited {
    color: #A93226;
    /* text-decoration: none!important; */
}

a:hover, a:focus {
    color: #F1948A;
    /* text-decoration: none!important; */
    /* font-weight: bolder!important; */
}

a:active {
    color: red;
    /* text-decoration: none!important; */
}

/* Make selections yellow; easier to see in classroom */
::selection {
    background: #ffff50;
}
::-moz-selection { /* Code for Firefox */
    background: #ffff50;
}


/* Imprint */
.imprint {
	font-size: 12px;
    line-height: 16px;
    margin-top: 1cm;
}

/* Solutions */
.solution_link {
	/* font-size: 12px; */
    font-style: italic;
}


/* Beta warning */
.beta {
    background: #ffff50;
    padding: 3px;
    font-style: italic;
    color: #000000;
    padding: 5px;
}

/* Current page in menu */
#cssmenu a.this_page {
    font-weight: bold;
    color: #ffffff;
}

/* Notebook page in menu */
#cssmenu a.edit_as_notebook {
    font-weight: bold;
    color: #ffffff;
}

/* More coming in menu */
.more_coming {
    font-style: italic!important;
}

/* New chapter indicator in menu */
.new_chapter {
    font-weight: bold;
    font-size: 100%;
    /* color: aqua; */
    color: #F1948A;
}

/* Part number in menu */
.part_number {
	float: left;
    text-align: left;
    width: 22px;
}


/* Chapters in menu */
.chapters {
    /* font-style: italic!important; */
}

/* Chapter numbers in menu */
.chnum {
    /* font-weight: bold; */
}


/* Imports */
a.import {
    text-decoration: underline;
    color: blue;
}

a.import:visited {
    color: darkblue;
}

a.import:hover, a.import:focus {
    color: cornflowerblue;
}

a.import:active {
    color: red!important;
}


/* Main content */
article {
    margin-top: 30px; /* Add a top margin to avoid content overlay */
}

/* Have links show up at a nice offset */
/* See https://stackoverflow.com/questions/4086107/fixed-page-header-overlaps-in-page-anchors */
:target::before {
  content: "";
  display: block;
  height: 60px; /* fixed header height*/
  margin: -60px 0 0; /* negative fixed header height */
}

/* On small screens, have menu text disappear, leaving only icons */
@media screen and (max-width: 900px) { span.menu_5 { display: none;} }
@media screen and (max-width: 850px) { span.menu_4 { display: none;} }
@media screen and (max-width: 800px) { span.menu_3 { display: none;} }
@media screen and (max-width: 750px) { span.menu_2 { display: none;} }
@media screen and (max-width: 700px) { span.menu_1 { display: none;} }

/* On small screens, use whatever width that is there */
@media only screen and (max-width: 600px) {
  .container {
    width: auto;
  }
}

/* CSS Menu */
#cssmenu,
#cssmenu ul,
#cssmenu ol,
#cssmenu li,
#cssmenu a {
  border: none;
  line-height: 1;
  margin: 0;
  padding: 0;
  box-sizing: content-box;
  cursor: pointer;
}
#cssmenu {
  height: 37px;
  display: block;
  border: 1px solid;
  /* border-radius: 5px; */
  width: 100%;
  border-color: #660000;
  position: fixed;
  z-index: 5000;
  transition: opacity 1s;
  margin: 0;
  padding: 0;
}
#cssmenu > ul,
#cssmenu > ol {
  list-style: inside none;
  margin: 0;
  padding: 0;
}
#cssmenu > ul > li,
#cssmenu > ol > li {
  list-style: inside none;
  float: left;
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
}
#cssmenu.align-center > ul,
#cssmenu.align-center > ol {
  text-align: center;
  font-size: 0;
}
#cssmenu.align-center > ul > li,
#cssmenu.align-center > ol > li {
  float: none;
  display: inline-block;
}
#cssmenu.align-center ul ul,
#cssmenu.align-center ol ol,
#cssmenu.align-center ol ul,
#cssmenu.align-center ul ol {
  text-align: left;
}
#cssmenu.align-center > ul > li:first-child > a,
#cssmenu.align-center > ol > li:first-child > a {
  /* border-radius: 0; */
}
#cssmenu > ul > li > a,
#cssmenu > ol > li > a {
  outline: none;
  display: block;
  position: relative;
  text-align: center;
  text-decoration: none;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);
  font-weight: 700;
  font-size: 13px;
  font-family: Arial, Helvetica, sans-serif;
  border-right: 1px solid #660000;
  color: #ffffff;
  padding: 12px 20px;
}
#cssmenu > ul > li:first-child > a,
#cssmenu > ol > li:first-child > a {
  /* border-radius: 5px 0 0 5px; */
}
#cssmenu > ul > li > a:after,
#cssmenu > ol > li > a:after {
  content: "";
  position: absolute;
  border-right: 1px solid;
  top: -1px;
  bottom: -1px;
  right: -2px;
  z-index: 5010;
  border-color: #cc0000;
}
#cssmenu ul li.has-sub:hover > a:after,
#cssmenu ol li.has-sub:hover > a:after {
  top: 0;
  bottom: 0;
}
#cssmenu > ul > li.has-sub > a:before,
#cssmenu > ol > li.has-sub > a:before {
  content: "";
  position: absolute;
  top: 18px;
  right: 6px;
  border: 5px solid transparent;
  border-top: 5px solid #ffffff;
}
#cssmenu > ul > li.has-sub:hover > a:before,
#cssmenu > ol > li.has-sub:hover > a:before {
  top: 19px;
}
#cssmenu > ul > li.has-sub:hover > a,
#cssmenu > ol > li.has-sub:hover > a {
  padding-bottom: 14px;
  z-index: 5020;
  border-color: #3f3f3f;
}
#cssmenu ul li.has-sub:hover > ul,
#cssmenu ul li.has-sub:hover > ol,
#cssmenu ol li.has-sub:hover > ul,
#cssmenu ol li.has-sub:hover > ol {
  display: block;
}
#cssmenu > ul > li.has-sub > a:hover,
#cssmenu > ul > li.has-sub:hover > a,
#cssmenu > ol > li.has-sub > a:hover,
#cssmenu > ol > li.has-sub:hover > a {
  background: #3f3f3f;
  border-color: #3f3f3f;
}
#cssmenu ul li.has-sub:focus-within > ul,
#cssmenu ul li.has-sub:focus-within > ol,
#cssmenu ol li.has-sub:focus-within > ul,
#cssmenu ol li.has-sub:focus-within > ol {
  display: block;
}
#cssmenu > ul > li.has-sub > a:focus-within,
#cssmenu > ul > li.has-sub:focus-within > a,
#cssmenu > ol > li.has-sub > a:focus-within,
#cssmenu > ol > li.has-sub:focus-within > a {
  background: #3f3f3f;
  border-color: #3f3f3f;
}
#cssmenu ul li > ul,
#cssmenu ul li > ol,
#cssmenu ol li > ul,
#cssmenu ol li > ol {
  display: none;
  width: auto;
  position: absolute;
  top: 38px;
  background: #3f3f3f;
  /* border-radius: 0 0 5px 5px; */
  z-index: 5020;
  padding: 10px 0;
  transition: all 0.5s ease;
  transition-duration: 0.5s;
}
#cssmenu ul li > ul,
#cssmenu ul li > ol {
  width: 250px;
}
#cssmenu ul ul ul,
#cssmenu ul ul ol,
#cssmenu ul ol ul,
#cssmenu ul ol ol {
  position: absolute;
}
#cssmenu ul ul li:hover > ul,
#cssmenu ul ul li:hover > ol,
#cssmenu ul ol li:hover > ul,
#cssmenu ul ol li:hover > ol {
  left: 100%;
  top: -10px;
  /* border-radius: 5px; */
}
#cssmenu ul li > ul li,
#cssmenu ul li > ol li,
#cssmenu ol li > ul li,
#cssmenu ol li > ol li {
  display: block;
  list-style: inside none;
  position: relative;
  margin: 0;
  padding: 0;
}
#cssmenu ul li > ul li a,
#cssmenu ul li > ol li a,
#cssmenu ol li > ul li a,
#cssmenu ol li > ol li a {
  outline: none;
  display: block;
  position: relative;
  font: 10pt Arial, Helvetica, sans-serif;
  color: #ffffff;
  text-decoration: none;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);
  margin: 0;
  padding: 8px 20px;
}
#cssmenu,
#cssmenu ul ul > li:hover > a,
#cssmenu ul ul li a:hover {
  background: #bb0000;
  /*
  background: -moz-linear-gradient(top, #cc0000 0%, #990000 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cc0000), color-stop(100%, #990000));
  background: -webkit-linear-gradient(top, #cc0000 0%, #990000 100%);
  background: -o-linear-gradient(top, #cc0000 0%, #990000 100%);
  background: -ms-linear-gradient(top, #cc0000 0%, #990000 100%);
  background: linear-gradient(top, #cc0000 0%, #990000 100%);
  */
}
#cssmenu > ul > li > a:hover {
  background: #bb0000;
  color: #ffffff;
}
#cssmenu ul ul a:hover,
#cssmenu ul ol a:hover {
  background: #bb0000;
  color: #ffffff;
}
#cssmenu > ul > li.has-sub > a:hover:before {
  border-top: 5px solid #ffffff;
}


    </style>


<style type="text/css">
/* Overrides of notebook CSS for static HTML export */
.reveal {
  font-size: 160%;
}
.reveal pre {
  width: inherit;
  padding: 0.4em;
  margin: 0px;
  font-family: monospace, sans-serif;
  font-size: 80%;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
}
.reveal pre code {
  padding: 0px;
}
.reveal section img {
  border: 0px solid black;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0);
}
.reveal i {
  font-style: normal;
  font-family: FontAwesome;
  font-size: 2em;
}
.reveal .slides {
  text-align: left;
}
.reveal.fade {
  opacity: 1;
}
.reveal .progress {
  position: static;
}
.reveal .controls .navigate-left,
.reveal .controls .navigate-left.enabled {
  border-right-color: #727272;
}
.reveal .controls .navigate-left.enabled:hover,
.reveal .controls .navigate-left.enabled.enabled:hover {
  border-right-color: #dfdfdf;
}
.reveal .controls .navigate-right,
.reveal .controls .navigate-right.enabled {
  border-left-color: #727272;
}
.reveal .controls .navigate-right.enabled:hover,
.reveal .controls .navigate-right.enabled.enabled:hover {
  border-left-color: #dfdfdf;
}
.reveal .controls .navigate-up,
.reveal .controls .navigate-up.enabled {
  border-bottom-color: #727272;
}
.reveal .controls .navigate-up.enabled:hover,
.reveal .controls .navigate-up.enabled.enabled:hover {
  border-bottom-color: #dfdfdf;
}
.reveal .controls .navigate-down,
.reveal .controls .navigate-down.enabled {
  border-top-color: #727272;
}
.reveal .controls .navigate-down.enabled:hover,
.reveal .controls .navigate-down.enabled.enabled:hover {
  border-top-color: #dfdfdf;
}
.reveal .progress span {
  background: #727272;
}
div.input_area {
  padding: 0.06em;
}
div.code_cell {
  background-color: transparent;
}
div.prompt {
  width: 11ex;
  padding: 0.4em;
  margin: 0px;
  font-family: monospace, sans-serif;
  font-size: 80%;
  text-align: right;
}
div.output_area pre {
  font-family: monospace, sans-serif;
  font-size: 80%;
}
div.output_prompt {
  /* 5px right shift to account for margin in parent container */
  margin: 5px 5px 0 0;
}
div.text_cell.rendered .rendered_html {
  /* The H1 height seems miscalculated, we are just hidding the scrollbar */
  overflow-y: hidden;
}
a.anchor-link {
  /* There is still an anchor, we are only hidding it */
  display: none;
}
.rendered_html p {
  text-align: inherit;
}
::-webkit-scrollbar
{
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar *
{
  background:transparent;
}
::-webkit-scrollbar-thumb
{
  background: #727272 !important;
}
</style>

<!-- Custom stylesheet, it must be in the same directory as the html file -->
<link rel="stylesheet" href="custom.css">

</head>


<body>


<div class="reveal">
<div class="slides">
<section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<h1 id="Fuzzing-with-Input-Fragments">Fuzzing with Input Fragments<a class="anchor-link" href="#Fuzzing-with-Input-Fragments">&#182;</a></h1><p>In this chapter, we introduce how to combine <a href="Parser.slides.html">parsing</a> and <a href="GrammarFuzzer.slides.html">fuzzing</a>.  This allows to <em>mutate</em> existing inputs while preserving syntactical correctness, and to <em>reuse</em> fragments from existing inputs while generating new ones.  The combination of parsing and fuzzing, as demonstrated in this chapter, has been highly successful in practice: The <em>LangFuzz</em> fuzzer for JavaScript has found more than 2,600 bugs in JavaScript interpreters this way.</p>

</div>
</div>
</div></section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p><strong>Prerequisites</strong></p>
<ul>
<li>You should know <a href="Parser.slides.html">how to use a parser</a>.</li>
<li>You should have read the <a href="GrammarFuzzer.slides.html">chapter on efficient grammar fuzzing</a>.</li>
</ul>

</div>
</div>
</div></section></section><section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<h2 id="Recombining-Parsed-Inputs">Recombining Parsed Inputs<a class="anchor-link" href="#Recombining-Parsed-Inputs">&#182;</a></h2>
</div>
</div>
</div><aside class="notes">

<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>Recombining parsed inputs was pioneered by <em>Langfuzz</em> \cite{Holler2012}. The main challenge is that program inputs often carry additional constraints beyond what is described by the syntax. For example, in Java, one needs to declare a variable (using a specific format for declaration) before it can be used in an expression. This restriction is not captured in the <em>Java CFG</em>. Checking for type correctness is another example for additional restrictions carried by program definitions.</p>

</div>
</div>
</div>
</aside><aside class="notes">

<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>When fuzzing compilers and interpreters, naive generation of programs using the language <em>CFG</em> often fails to achieve significant deeper coverage due to these kinds of checks external to the grammar. Holler et al. suggests using pre-existing valid code fragments to get around these restrictions. The idea is that the pre-existing valid code fragments already conform to the restrictions external to the grammar, and can often provide a means to evade validity checks.</p>

</div>
</div>
</div>
</aside></section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<h3 id="A-Grammar-based-Mutational-Fuzzer">A Grammar-based Mutational Fuzzer<a class="anchor-link" href="#A-Grammar-based-Mutational-Fuzzer">&#182;</a></h3><p>The idea is that one can treat the derivation tree of a preexisting program as the scaffolding, poke holes in it, and patch it with generated inputs from our grammar. Given below is a grammar for a language that allows assignment of variables.</p>

</div>
</div>
</div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[3]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="kn">import</span> <span class="nn">string</span>
</pre></div>

    </div>
</div>
</div>

</div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[5]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">VAR_GRAMMAR</span> <span class="o">=</span> <span class="p">{</span>
    <span class="s1">&#39;&lt;start&gt;&#39;</span><span class="p">:</span> <span class="p">[</span><span class="s1">&#39;&lt;statements&gt;&#39;</span><span class="p">],</span>
    <span class="s1">&#39;&lt;statements&gt;&#39;</span><span class="p">:</span> <span class="p">[</span><span class="s1">&#39;&lt;statement&gt;;&lt;statements&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;statement&gt;&#39;</span><span class="p">],</span>
    <span class="s1">&#39;&lt;statement&gt;&#39;</span><span class="p">:</span> <span class="p">[</span><span class="s1">&#39;&lt;assignment&gt;&#39;</span><span class="p">],</span>
    <span class="s1">&#39;&lt;assignment&gt;&#39;</span><span class="p">:</span> <span class="p">[</span><span class="s1">&#39;&lt;identifier&gt;=&lt;expr&gt;&#39;</span><span class="p">],</span>
    <span class="s1">&#39;&lt;identifier&gt;&#39;</span><span class="p">:</span> <span class="p">[</span><span class="s1">&#39;&lt;word&gt;&#39;</span><span class="p">],</span>
    <span class="s1">&#39;&lt;word&gt;&#39;</span><span class="p">:</span> <span class="p">[</span><span class="s1">&#39;&lt;alpha&gt;&lt;word&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;alpha&gt;&#39;</span><span class="p">],</span>
    <span class="s1">&#39;&lt;alpha&gt;&#39;</span><span class="p">:</span> <span class="nb">list</span><span class="p">(</span><span class="n">string</span><span class="o">.</span><span class="n">ascii_letters</span><span class="p">),</span>
    <span class="s1">&#39;&lt;expr&gt;&#39;</span><span class="p">:</span> <span class="p">[</span><span class="s1">&#39;&lt;term&gt;+&lt;expr&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;term&gt;-&lt;expr&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;term&gt;&#39;</span><span class="p">],</span>
    <span class="s1">&#39;&lt;term&gt;&#39;</span><span class="p">:</span> <span class="p">[</span><span class="s1">&#39;&lt;factor&gt;*&lt;term&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;factor&gt;/&lt;term&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;factor&gt;&#39;</span><span class="p">],</span>
    <span class="s1">&#39;&lt;factor&gt;&#39;</span><span class="p">:</span>
    <span class="p">[</span><span class="s1">&#39;+&lt;factor&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;-&lt;factor&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;(&lt;expr&gt;)&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;identifier&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;number&gt;&#39;</span><span class="p">],</span>
    <span class="s1">&#39;&lt;number&gt;&#39;</span><span class="p">:</span> <span class="p">[</span><span class="s1">&#39;&lt;integer&gt;.&lt;integer&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;integer&gt;&#39;</span><span class="p">],</span>
    <span class="s1">&#39;&lt;integer&gt;&#39;</span><span class="p">:</span> <span class="p">[</span><span class="s1">&#39;&lt;digit&gt;&lt;integer&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;digit&gt;&#39;</span><span class="p">],</span>
    <span class="s1">&#39;&lt;digit&gt;&#39;</span><span class="p">:</span> <span class="n">crange</span><span class="p">(</span><span class="s1">&#39;0&#39;</span><span class="p">,</span> <span class="s1">&#39;9&#39;</span><span class="p">)</span>
<span class="p">}</span>
</pre></div>

    </div>
</div>
</div>

</div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[6]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">syntax_diagram</span><span class="p">(</span><span class="n">VAR_GRAMMAR</span><span class="p">)</span>
</pre></div>

    </div>
</div>
</div>

<div class="output_wrapper">
<div class="output">


<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>start
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="62" viewBox="0 0 225.0 62" width="225.0" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 21v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 31h0.0"/><path d="M185.0 31h0.0"/><path d="M40.0 31h20"/><g>
<path d="M60.0 31h0.0"/><path d="M165.0 31h0.0"/><g class="non-terminal">
<path d="M60.0 31h0.0"/><path d="M165.0 31h0.0"/><rect height="22" width="105.0" x="60.0" y="20"/><text x="112.5" y="35">statements</text></g></g><path d="M165.0 31h20"/></g><path d="M 185.0 31 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>statements
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="92" viewBox="0 0 390.0 92" width="390.0" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 51v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 61h0.0"/><path d="M350.0 61h0.0"/><path d="M40.0 61a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M60.0 31h0.0"/><path d="M330.0 31h0.0"/><g class="non-terminal">
<path d="M60.0 31h0.0"/><path d="M156.5 31h0.0"/><rect height="22" width="96.5" x="60.0" y="20"/><text x="108.25" y="35">statement</text></g><path d="M156.5 31h10"/><path d="M166.5 31h10"/><g class="terminal">
<path d="M176.5 31h0.0"/><path d="M205.0 31h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="176.5" y="20"/><text x="190.75" y="35">;</text></g><path d="M205.0 31h10"/><path d="M215.0 31h10"/><g class="non-terminal">
<path d="M225.0 31h0.0"/><path d="M330.0 31h0.0"/><rect height="22" width="105.0" x="225.0" y="20"/><text x="277.5" y="35">statements</text></g></g><path d="M330.0 31a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M40.0 61h20"/><g>
<path d="M60.0 61h86.75"/><path d="M243.25 61h86.75"/><g class="non-terminal">
<path d="M146.75 61h0.0"/><path d="M243.25 61h0.0"/><rect height="22" width="96.5" x="146.75" y="50"/><text x="195.0" y="65">statement</text></g></g><path d="M330.0 61h20"/></g><path d="M 350.0 61 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>statement
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="62" viewBox="0 0 225.0 62" width="225.0" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 21v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 31h0.0"/><path d="M185.0 31h0.0"/><path d="M40.0 31h20"/><g>
<path d="M60.0 31h0.0"/><path d="M165.0 31h0.0"/><g class="non-terminal">
<path d="M60.0 31h0.0"/><path d="M165.0 31h0.0"/><rect height="22" width="105.0" x="60.0" y="20"/><text x="112.5" y="35">assignment</text></g></g><path d="M165.0 31h20"/></g><path d="M 185.0 31 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>assignment
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="62" viewBox="0 0 347.5 62" width="347.5" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 21v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 31h0.0"/><path d="M307.5 31h0.0"/><path d="M40.0 31h20"/><g>
<path d="M60.0 31h0.0"/><path d="M287.5 31h0.0"/><g class="non-terminal">
<path d="M60.0 31h0.0"/><path d="M165.0 31h0.0"/><rect height="22" width="105.0" x="60.0" y="20"/><text x="112.5" y="35">identifier</text></g><path d="M165.0 31h10"/><path d="M175.0 31h10"/><g class="terminal">
<path d="M185.0 31h0.0"/><path d="M213.5 31h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="185.0" y="20"/><text x="199.25" y="35">=</text></g><path d="M213.5 31h10"/><path d="M223.5 31h10"/><g class="non-terminal">
<path d="M233.5 31h0.0"/><path d="M287.5 31h0.0"/><rect height="22" width="54.0" x="233.5" y="20"/><text x="260.5" y="35">expr</text></g></g><path d="M287.5 31h20"/></g><path d="M 307.5 31 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>identifier
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="62" viewBox="0 0 174.0 62" width="174.0" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 21v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 31h0.0"/><path d="M134.0 31h0.0"/><path d="M40.0 31h20"/><g>
<path d="M60.0 31h0.0"/><path d="M114.0 31h0.0"/><g class="non-terminal">
<path d="M60.0 31h0.0"/><path d="M114.0 31h0.0"/><rect height="22" width="54.0" x="60.0" y="20"/><text x="87.0" y="35">word</text></g></g><path d="M114.0 31h20"/></g><path d="M 134.0 31 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>word
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="92" viewBox="0 0 256.5 92" width="256.5" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 51v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 61h0.0"/><path d="M216.5 61h0.0"/><path d="M40.0 61a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M60.0 31h0.0"/><path d="M196.5 31h0.0"/><g class="non-terminal">
<path d="M60.0 31h0.0"/><path d="M122.5 31h0.0"/><rect height="22" width="62.5" x="60.0" y="20"/><text x="91.25" y="35">alpha</text></g><path d="M122.5 31h10"/><path d="M132.5 31h10"/><g class="non-terminal">
<path d="M142.5 31h0.0"/><path d="M196.5 31h0.0"/><rect height="22" width="54.0" x="142.5" y="20"/><text x="169.5" y="35">word</text></g></g><path d="M196.5 31a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M40.0 61h20"/><g>
<path d="M60.0 61h37.0"/><path d="M159.5 61h37.0"/><g class="non-terminal">
<path d="M97.0 61h0.0"/><path d="M159.5 61h0.0"/><rect height="22" width="62.5" x="97.0" y="50"/><text x="128.25" y="65">alpha</text></g></g><path d="M196.5 61h20"/></g><path d="M 216.5 61 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>alpha
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="348" viewBox="0 0 611.0 348" width="611.0" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 179v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 189h0.0"/><path d="M571.0 189h0.0"/><path d="M40.0 189a10 10 0 0 0 10 -10v-149a10 10 0 0 1 10 -10h412.5"/><path d="M138.5 328h412.5a10 10 0 0 0 10 -10v-119a10 10 0 0 1 10 -10"/><path d="M40.0 189h10"/><g>
<path d="M50.0 189h0.0"/><path d="M118.5 189h0.0"/><path d="M50.0 189a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M70.0 159h0.0"/><path d="M98.5 159h0.0"/><g class="terminal">
<path d="M70.0 159h0.0"/><path d="M98.5 159h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="148"/><text x="84.25" y="163">e</text></g></g><path d="M98.5 159a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M50.0 189a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/><g>
<path d="M70.0 129h0.0"/><path d="M98.5 129h0.0"/><g class="terminal">
<path d="M70.0 129h0.0"/><path d="M98.5 129h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="118"/><text x="84.25" y="133">d</text></g></g><path d="M98.5 129a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><path d="M50.0 189a10 10 0 0 0 10 -10v-70a10 10 0 0 1 10 -10"/><g>
<path d="M70.0 99h0.0"/><path d="M98.5 99h0.0"/><g class="terminal">
<path d="M70.0 99h0.0"/><path d="M98.5 99h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="88"/><text x="84.25" y="103">c</text></g></g><path d="M98.5 99a10 10 0 0 1 10 10v70a10 10 0 0 0 10 10"/><path d="M50.0 189a10 10 0 0 0 10 -10v-100a10 10 0 0 1 10 -10"/><g>
<path d="M70.0 69h0.0"/><path d="M98.5 69h0.0"/><g class="terminal">
<path d="M70.0 69h0.0"/><path d="M98.5 69h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="58"/><text x="84.25" y="73">b</text></g></g><path d="M98.5 69a10 10 0 0 1 10 10v100a10 10 0 0 0 10 10"/><path d="M50.0 189a10 10 0 0 0 10 -10v-130a10 10 0 0 1 10 -10"/><g>
<path d="M70.0 39h0.0"/><path d="M98.5 39h0.0"/><g class="terminal">
<path d="M70.0 39h0.0"/><path d="M98.5 39h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="28"/><text x="84.25" y="43">a</text></g></g><path d="M98.5 39a10 10 0 0 1 10 10v130a10 10 0 0 0 10 10"/><path d="M50.0 189h20"/><g>
<path d="M70.0 189h0.0"/><path d="M98.5 189h0.0"/><g class="terminal">
<path d="M70.0 189h0.0"/><path d="M98.5 189h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="178"/><text x="84.25" y="193">f</text></g></g><path d="M98.5 189h20"/><path d="M50.0 189a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><g>
<path d="M70.0 219h0.0"/><path d="M98.5 219h0.0"/><g class="terminal">
<path d="M70.0 219h0.0"/><path d="M98.5 219h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="208"/><text x="84.25" y="223">g</text></g></g><path d="M98.5 219a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><path d="M50.0 189a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><g>
<path d="M70.0 249h0.0"/><path d="M98.5 249h0.0"/><g class="terminal">
<path d="M70.0 249h0.0"/><path d="M98.5 249h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="238"/><text x="84.25" y="253">h</text></g></g><path d="M98.5 249a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/><path d="M50.0 189a10 10 0 0 1 10 10v70a10 10 0 0 0 10 10"/><g>
<path d="M70.0 279h0.0"/><path d="M98.5 279h0.0"/><g class="terminal">
<path d="M70.0 279h0.0"/><path d="M98.5 279h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="268"/><text x="84.25" y="283">i</text></g></g><path d="M98.5 279a10 10 0 0 0 10 -10v-70a10 10 0 0 1 10 -10"/><path d="M50.0 189a10 10 0 0 1 10 10v100a10 10 0 0 0 10 10"/><g>
<path d="M70.0 309h0.0"/><path d="M98.5 309h0.0"/><g class="terminal">
<path d="M70.0 309h0.0"/><path d="M98.5 309h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="298"/><text x="84.25" y="313">j</text></g></g><path d="M98.5 309a10 10 0 0 0 10 -10v-100a10 10 0 0 1 10 -10"/></g><path d="M118.5 189a10 10 0 0 1 10 10v119a10 10 0 0 0 10 10"/><path d="M118.5 20a10 10 0 0 1 10 10v149a10 10 0 0 0 10 10"/><g>
<path d="M138.5 189h0.0"/><path d="M207.0 189h0.0"/><path d="M138.5 189a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M158.5 159h0.0"/><path d="M187.0 159h0.0"/><g class="terminal">
<path d="M158.5 159h0.0"/><path d="M187.0 159h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="148"/><text x="172.75" y="163">o</text></g></g><path d="M187.0 159a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M138.5 189a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/><g>
<path d="M158.5 129h0.0"/><path d="M187.0 129h0.0"/><g class="terminal">
<path d="M158.5 129h0.0"/><path d="M187.0 129h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="118"/><text x="172.75" y="133">n</text></g></g><path d="M187.0 129a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><path d="M138.5 189a10 10 0 0 0 10 -10v-70a10 10 0 0 1 10 -10"/><g>
<path d="M158.5 99h0.0"/><path d="M187.0 99h0.0"/><g class="terminal">
<path d="M158.5 99h0.0"/><path d="M187.0 99h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="88"/><text x="172.75" y="103">m</text></g></g><path d="M187.0 99a10 10 0 0 1 10 10v70a10 10 0 0 0 10 10"/><path d="M138.5 189a10 10 0 0 0 10 -10v-100a10 10 0 0 1 10 -10"/><g>
<path d="M158.5 69h0.0"/><path d="M187.0 69h0.0"/><g class="terminal">
<path d="M158.5 69h0.0"/><path d="M187.0 69h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="58"/><text x="172.75" y="73">l</text></g></g><path d="M187.0 69a10 10 0 0 1 10 10v100a10 10 0 0 0 10 10"/><path d="M138.5 189a10 10 0 0 0 10 -10v-130a10 10 0 0 1 10 -10"/><g>
<path d="M158.5 39h0.0"/><path d="M187.0 39h0.0"/><g class="terminal">
<path d="M158.5 39h0.0"/><path d="M187.0 39h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="28"/><text x="172.75" y="43">k</text></g></g><path d="M187.0 39a10 10 0 0 1 10 10v130a10 10 0 0 0 10 10"/><path d="M138.5 189h20"/><g>
<path d="M158.5 189h0.0"/><path d="M187.0 189h0.0"/><g class="terminal">
<path d="M158.5 189h0.0"/><path d="M187.0 189h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="178"/><text x="172.75" y="193">p</text></g></g><path d="M187.0 189h20"/><path d="M138.5 189a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><g>
<path d="M158.5 219h0.0"/><path d="M187.0 219h0.0"/><g class="terminal">
<path d="M158.5 219h0.0"/><path d="M187.0 219h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="208"/><text x="172.75" y="223">q</text></g></g><path d="M187.0 219a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><path d="M138.5 189a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><g>
<path d="M158.5 249h0.0"/><path d="M187.0 249h0.0"/><g class="terminal">
<path d="M158.5 249h0.0"/><path d="M187.0 249h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="238"/><text x="172.75" y="253">r</text></g></g><path d="M187.0 249a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/><path d="M138.5 189a10 10 0 0 1 10 10v70a10 10 0 0 0 10 10"/><g>
<path d="M158.5 279h0.0"/><path d="M187.0 279h0.0"/><g class="terminal">
<path d="M158.5 279h0.0"/><path d="M187.0 279h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="268"/><text x="172.75" y="283">s</text></g></g><path d="M187.0 279a10 10 0 0 0 10 -10v-70a10 10 0 0 1 10 -10"/><path d="M138.5 189a10 10 0 0 1 10 10v100a10 10 0 0 0 10 10"/><g>
<path d="M158.5 309h0.0"/><path d="M187.0 309h0.0"/><g class="terminal">
<path d="M158.5 309h0.0"/><path d="M187.0 309h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="298"/><text x="172.75" y="313">t</text></g></g><path d="M187.0 309a10 10 0 0 0 10 -10v-100a10 10 0 0 1 10 -10"/></g><path d="M207.0 189a10 10 0 0 1 10 10v119a10 10 0 0 0 10 10"/><path d="M207.0 20a10 10 0 0 1 10 10v149a10 10 0 0 0 10 10"/><g>
<path d="M227.0 189h0.0"/><path d="M295.5 189h0.0"/><path d="M227.0 189a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M247.0 159h0.0"/><path d="M275.5 159h0.0"/><g class="terminal">
<path d="M247.0 159h0.0"/><path d="M275.5 159h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="148"/><text x="261.25" y="163">y</text></g></g><path d="M275.5 159a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M227.0 189a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/><g>
<path d="M247.0 129h0.0"/><path d="M275.5 129h0.0"/><g class="terminal">
<path d="M247.0 129h0.0"/><path d="M275.5 129h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="118"/><text x="261.25" y="133">x</text></g></g><path d="M275.5 129a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><path d="M227.0 189a10 10 0 0 0 10 -10v-70a10 10 0 0 1 10 -10"/><g>
<path d="M247.0 99h0.0"/><path d="M275.5 99h0.0"/><g class="terminal">
<path d="M247.0 99h0.0"/><path d="M275.5 99h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="88"/><text x="261.25" y="103">w</text></g></g><path d="M275.5 99a10 10 0 0 1 10 10v70a10 10 0 0 0 10 10"/><path d="M227.0 189a10 10 0 0 0 10 -10v-100a10 10 0 0 1 10 -10"/><g>
<path d="M247.0 69h0.0"/><path d="M275.5 69h0.0"/><g class="terminal">
<path d="M247.0 69h0.0"/><path d="M275.5 69h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="58"/><text x="261.25" y="73">v</text></g></g><path d="M275.5 69a10 10 0 0 1 10 10v100a10 10 0 0 0 10 10"/><path d="M227.0 189a10 10 0 0 0 10 -10v-130a10 10 0 0 1 10 -10"/><g>
<path d="M247.0 39h0.0"/><path d="M275.5 39h0.0"/><g class="terminal">
<path d="M247.0 39h0.0"/><path d="M275.5 39h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="28"/><text x="261.25" y="43">u</text></g></g><path d="M275.5 39a10 10 0 0 1 10 10v130a10 10 0 0 0 10 10"/><path d="M227.0 189h20"/><g>
<path d="M247.0 189h0.0"/><path d="M275.5 189h0.0"/><g class="terminal">
<path d="M247.0 189h0.0"/><path d="M275.5 189h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="178"/><text x="261.25" y="193">z</text></g></g><path d="M275.5 189h20"/><path d="M227.0 189a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><g>
<path d="M247.0 219h0.0"/><path d="M275.5 219h0.0"/><g class="terminal">
<path d="M247.0 219h0.0"/><path d="M275.5 219h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="208"/><text x="261.25" y="223">A</text></g></g><path d="M275.5 219a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><path d="M227.0 189a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><g>
<path d="M247.0 249h0.0"/><path d="M275.5 249h0.0"/><g class="terminal">
<path d="M247.0 249h0.0"/><path d="M275.5 249h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="238"/><text x="261.25" y="253">B</text></g></g><path d="M275.5 249a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/><path d="M227.0 189a10 10 0 0 1 10 10v70a10 10 0 0 0 10 10"/><g>
<path d="M247.0 279h0.0"/><path d="M275.5 279h0.0"/><g class="terminal">
<path d="M247.0 279h0.0"/><path d="M275.5 279h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="268"/><text x="261.25" y="283">C</text></g></g><path d="M275.5 279a10 10 0 0 0 10 -10v-70a10 10 0 0 1 10 -10"/><path d="M227.0 189a10 10 0 0 1 10 10v100a10 10 0 0 0 10 10"/><g>
<path d="M247.0 309h0.0"/><path d="M275.5 309h0.0"/><g class="terminal">
<path d="M247.0 309h0.0"/><path d="M275.5 309h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="298"/><text x="261.25" y="313">D</text></g></g><path d="M275.5 309a10 10 0 0 0 10 -10v-100a10 10 0 0 1 10 -10"/></g><path d="M295.5 189a10 10 0 0 1 10 10v119a10 10 0 0 0 10 10"/><path d="M295.5 20a10 10 0 0 1 10 10v149a10 10 0 0 0 10 10"/><g>
<path d="M315.5 189h0.0"/><path d="M384.0 189h0.0"/><path d="M315.5 189a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M335.5 159h0.0"/><path d="M364.0 159h0.0"/><g class="terminal">
<path d="M335.5 159h0.0"/><path d="M364.0 159h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="148"/><text x="349.75" y="163">I</text></g></g><path d="M364.0 159a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M315.5 189a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/><g>
<path d="M335.5 129h0.0"/><path d="M364.0 129h0.0"/><g class="terminal">
<path d="M335.5 129h0.0"/><path d="M364.0 129h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="118"/><text x="349.75" y="133">H</text></g></g><path d="M364.0 129a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><path d="M315.5 189a10 10 0 0 0 10 -10v-70a10 10 0 0 1 10 -10"/><g>
<path d="M335.5 99h0.0"/><path d="M364.0 99h0.0"/><g class="terminal">
<path d="M335.5 99h0.0"/><path d="M364.0 99h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="88"/><text x="349.75" y="103">G</text></g></g><path d="M364.0 99a10 10 0 0 1 10 10v70a10 10 0 0 0 10 10"/><path d="M315.5 189a10 10 0 0 0 10 -10v-100a10 10 0 0 1 10 -10"/><g>
<path d="M335.5 69h0.0"/><path d="M364.0 69h0.0"/><g class="terminal">
<path d="M335.5 69h0.0"/><path d="M364.0 69h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="58"/><text x="349.75" y="73">F</text></g></g><path d="M364.0 69a10 10 0 0 1 10 10v100a10 10 0 0 0 10 10"/><path d="M315.5 189a10 10 0 0 0 10 -10v-130a10 10 0 0 1 10 -10"/><g>
<path d="M335.5 39h0.0"/><path d="M364.0 39h0.0"/><g class="terminal">
<path d="M335.5 39h0.0"/><path d="M364.0 39h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="28"/><text x="349.75" y="43">E</text></g></g><path d="M364.0 39a10 10 0 0 1 10 10v130a10 10 0 0 0 10 10"/><path d="M315.5 189h20"/><g>
<path d="M335.5 189h0.0"/><path d="M364.0 189h0.0"/><g class="terminal">
<path d="M335.5 189h0.0"/><path d="M364.0 189h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="178"/><text x="349.75" y="193">J</text></g></g><path d="M364.0 189h20"/><path d="M315.5 189a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><g>
<path d="M335.5 219h0.0"/><path d="M364.0 219h0.0"/><g class="terminal">
<path d="M335.5 219h0.0"/><path d="M364.0 219h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="208"/><text x="349.75" y="223">K</text></g></g><path d="M364.0 219a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><path d="M315.5 189a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><g>
<path d="M335.5 249h0.0"/><path d="M364.0 249h0.0"/><g class="terminal">
<path d="M335.5 249h0.0"/><path d="M364.0 249h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="238"/><text x="349.75" y="253">L</text></g></g><path d="M364.0 249a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/><path d="M315.5 189a10 10 0 0 1 10 10v70a10 10 0 0 0 10 10"/><g>
<path d="M335.5 279h0.0"/><path d="M364.0 279h0.0"/><g class="terminal">
<path d="M335.5 279h0.0"/><path d="M364.0 279h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="268"/><text x="349.75" y="283">M</text></g></g><path d="M364.0 279a10 10 0 0 0 10 -10v-70a10 10 0 0 1 10 -10"/><path d="M315.5 189a10 10 0 0 1 10 10v100a10 10 0 0 0 10 10"/><g>
<path d="M335.5 309h0.0"/><path d="M364.0 309h0.0"/><g class="terminal">
<path d="M335.5 309h0.0"/><path d="M364.0 309h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="298"/><text x="349.75" y="313">N</text></g></g><path d="M364.0 309a10 10 0 0 0 10 -10v-100a10 10 0 0 1 10 -10"/></g><path d="M384.0 189a10 10 0 0 1 10 10v119a10 10 0 0 0 10 10"/><path d="M384.0 20a10 10 0 0 1 10 10v149a10 10 0 0 0 10 10"/><g>
<path d="M404.0 189h0.0"/><path d="M472.5 189h0.0"/><path d="M404.0 189a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M424.0 159h0.0"/><path d="M452.5 159h0.0"/><g class="terminal">
<path d="M424.0 159h0.0"/><path d="M452.5 159h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="148"/><text x="438.25" y="163">S</text></g></g><path d="M452.5 159a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M404.0 189a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/><g>
<path d="M424.0 129h0.0"/><path d="M452.5 129h0.0"/><g class="terminal">
<path d="M424.0 129h0.0"/><path d="M452.5 129h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="118"/><text x="438.25" y="133">R</text></g></g><path d="M452.5 129a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><path d="M404.0 189a10 10 0 0 0 10 -10v-70a10 10 0 0 1 10 -10"/><g>
<path d="M424.0 99h0.0"/><path d="M452.5 99h0.0"/><g class="terminal">
<path d="M424.0 99h0.0"/><path d="M452.5 99h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="88"/><text x="438.25" y="103">Q</text></g></g><path d="M452.5 99a10 10 0 0 1 10 10v70a10 10 0 0 0 10 10"/><path d="M404.0 189a10 10 0 0 0 10 -10v-100a10 10 0 0 1 10 -10"/><g>
<path d="M424.0 69h0.0"/><path d="M452.5 69h0.0"/><g class="terminal">
<path d="M424.0 69h0.0"/><path d="M452.5 69h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="58"/><text x="438.25" y="73">P</text></g></g><path d="M452.5 69a10 10 0 0 1 10 10v100a10 10 0 0 0 10 10"/><path d="M404.0 189a10 10 0 0 0 10 -10v-130a10 10 0 0 1 10 -10"/><g>
<path d="M424.0 39h0.0"/><path d="M452.5 39h0.0"/><g class="terminal">
<path d="M424.0 39h0.0"/><path d="M452.5 39h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="28"/><text x="438.25" y="43">O</text></g></g><path d="M452.5 39a10 10 0 0 1 10 10v130a10 10 0 0 0 10 10"/><path d="M404.0 189h20"/><g>
<path d="M424.0 189h0.0"/><path d="M452.5 189h0.0"/><g class="terminal">
<path d="M424.0 189h0.0"/><path d="M452.5 189h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="178"/><text x="438.25" y="193">T</text></g></g><path d="M452.5 189h20"/><path d="M404.0 189a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><g>
<path d="M424.0 219h0.0"/><path d="M452.5 219h0.0"/><g class="terminal">
<path d="M424.0 219h0.0"/><path d="M452.5 219h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="208"/><text x="438.25" y="223">U</text></g></g><path d="M452.5 219a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><path d="M404.0 189a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><g>
<path d="M424.0 249h0.0"/><path d="M452.5 249h0.0"/><g class="terminal">
<path d="M424.0 249h0.0"/><path d="M452.5 249h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="238"/><text x="438.25" y="253">V</text></g></g><path d="M452.5 249a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/><path d="M404.0 189a10 10 0 0 1 10 10v70a10 10 0 0 0 10 10"/><g>
<path d="M424.0 279h0.0"/><path d="M452.5 279h0.0"/><g class="terminal">
<path d="M424.0 279h0.0"/><path d="M452.5 279h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="268"/><text x="438.25" y="283">W</text></g></g><path d="M452.5 279a10 10 0 0 0 10 -10v-70a10 10 0 0 1 10 -10"/><path d="M404.0 189a10 10 0 0 1 10 10v100a10 10 0 0 0 10 10"/><g>
<path d="M424.0 309h0.0"/><path d="M452.5 309h0.0"/><g class="terminal">
<path d="M424.0 309h0.0"/><path d="M452.5 309h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="298"/><text x="438.25" y="313">X</text></g></g><path d="M452.5 309a10 10 0 0 0 10 -10v-100a10 10 0 0 1 10 -10"/></g><path d="M472.5 189a10 10 0 0 1 10 10v119a10 10 0 0 0 10 10"/><path d="M472.5 20a10 10 0 0 1 10 10v149a10 10 0 0 0 10 10"/><g>
<path d="M492.5 189h0.0"/><path d="M561.0 189h0.0"/><path d="M492.5 189a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M512.5 159h0.0"/><path d="M541.0 159h0.0"/><g class="terminal">
<path d="M512.5 159h0.0"/><path d="M541.0 159h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="512.5" y="148"/><text x="526.75" y="163">Y</text></g></g><path d="M541.0 159a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M492.5 189h20"/><g>
<path d="M512.5 189h0.0"/><path d="M541.0 189h0.0"/><g class="terminal">
<path d="M512.5 189h0.0"/><path d="M541.0 189h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="512.5" y="178"/><text x="526.75" y="193">Z</text></g></g><path d="M541.0 189h20"/></g><path d="M561.0 189h10"/></g><path d="M 571.0 189 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>expr
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="122" viewBox="0 0 296.5 122" width="296.5" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 51v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 61h0.0"/><path d="M256.5 61h0.0"/><path d="M40.0 61a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M60.0 31h0.0"/><path d="M236.5 31h0.0"/><g class="non-terminal">
<path d="M60.0 31h0.0"/><path d="M114.0 31h0.0"/><rect height="22" width="54.0" x="60.0" y="20"/><text x="87.0" y="35">term</text></g><path d="M114.0 31h10"/><path d="M124.0 31h10"/><g class="terminal">
<path d="M134.0 31h0.0"/><path d="M162.5 31h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="134.0" y="20"/><text x="148.25" y="35">+</text></g><path d="M162.5 31h10"/><path d="M172.5 31h10"/><g class="non-terminal">
<path d="M182.5 31h0.0"/><path d="M236.5 31h0.0"/><rect height="22" width="54.0" x="182.5" y="20"/><text x="209.5" y="35">expr</text></g></g><path d="M236.5 31a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M40.0 61h20"/><g>
<path d="M60.0 61h0.0"/><path d="M236.5 61h0.0"/><g class="non-terminal">
<path d="M60.0 61h0.0"/><path d="M114.0 61h0.0"/><rect height="22" width="54.0" x="60.0" y="50"/><text x="87.0" y="65">term</text></g><path d="M114.0 61h10"/><path d="M124.0 61h10"/><g class="terminal">
<path d="M134.0 61h0.0"/><path d="M162.5 61h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="134.0" y="50"/><text x="148.25" y="65">-</text></g><path d="M162.5 61h10"/><path d="M172.5 61h10"/><g class="non-terminal">
<path d="M182.5 61h0.0"/><path d="M236.5 61h0.0"/><rect height="22" width="54.0" x="182.5" y="50"/><text x="209.5" y="65">expr</text></g></g><path d="M236.5 61h20"/><path d="M40.0 61a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><g>
<path d="M60.0 91h61.25"/><path d="M175.25 91h61.25"/><g class="non-terminal">
<path d="M121.25 91h0.0"/><path d="M175.25 91h0.0"/><rect height="22" width="54.0" x="121.25" y="80"/><text x="148.25" y="95">term</text></g></g><path d="M236.5 91a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/></g><path d="M 256.5 61 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>term
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="122" viewBox="0 0 313.5 122" width="313.5" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 51v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 61h0.0"/><path d="M273.5 61h0.0"/><path d="M40.0 61a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M60.0 31h0.0"/><path d="M253.5 31h0.0"/><g class="non-terminal">
<path d="M60.0 31h0.0"/><path d="M131.0 31h0.0"/><rect height="22" width="71.0" x="60.0" y="20"/><text x="95.5" y="35">factor</text></g><path d="M131.0 31h10"/><path d="M141.0 31h10"/><g class="terminal">
<path d="M151.0 31h0.0"/><path d="M179.5 31h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="151.0" y="20"/><text x="165.25" y="35">*</text></g><path d="M179.5 31h10"/><path d="M189.5 31h10"/><g class="non-terminal">
<path d="M199.5 31h0.0"/><path d="M253.5 31h0.0"/><rect height="22" width="54.0" x="199.5" y="20"/><text x="226.5" y="35">term</text></g></g><path d="M253.5 31a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M40.0 61h20"/><g>
<path d="M60.0 61h0.0"/><path d="M253.5 61h0.0"/><g class="non-terminal">
<path d="M60.0 61h0.0"/><path d="M131.0 61h0.0"/><rect height="22" width="71.0" x="60.0" y="50"/><text x="95.5" y="65">factor</text></g><path d="M131.0 61h10"/><path d="M141.0 61h10"/><g class="terminal">
<path d="M151.0 61h0.0"/><path d="M179.5 61h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="151.0" y="50"/><text x="165.25" y="65">/</text></g><path d="M179.5 61h10"/><path d="M189.5 61h10"/><g class="non-terminal">
<path d="M199.5 61h0.0"/><path d="M253.5 61h0.0"/><rect height="22" width="54.0" x="199.5" y="50"/><text x="226.5" y="65">term</text></g></g><path d="M253.5 61h20"/><path d="M40.0 61a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><g>
<path d="M60.0 91h61.25"/><path d="M192.25 91h61.25"/><g class="non-terminal">
<path d="M121.25 91h0.0"/><path d="M192.25 91h0.0"/><rect height="22" width="71.0" x="121.25" y="80"/><text x="156.75" y="95">factor</text></g></g><path d="M253.5 91a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/></g><path d="M 273.5 61 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>factor
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="182" viewBox="0 0 271.0 182" width="271.0" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 81v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 91h0.0"/><path d="M231.0 91h0.0"/><path d="M40.0 91a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M60.0 61h15.75"/><path d="M195.25 61h15.75"/><g class="terminal">
<path d="M75.75 61h0.0"/><path d="M104.25 61h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="75.75" y="50"/><text x="90.0" y="65">-</text></g><path d="M104.25 61h10"/><path d="M114.25 61h10"/><g class="non-terminal">
<path d="M124.25 61h0.0"/><path d="M195.25 61h0.0"/><rect height="22" width="71.0" x="124.25" y="50"/><text x="159.75" y="65">factor</text></g></g><path d="M211.0 61a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M40.0 91a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/><g>
<path d="M60.0 31h15.75"/><path d="M195.25 31h15.75"/><g class="terminal">
<path d="M75.75 31h0.0"/><path d="M104.25 31h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="75.75" y="20"/><text x="90.0" y="35">+</text></g><path d="M104.25 31h10"/><path d="M114.25 31h10"/><g class="non-terminal">
<path d="M124.25 31h0.0"/><path d="M195.25 31h0.0"/><rect height="22" width="71.0" x="124.25" y="20"/><text x="159.75" y="35">factor</text></g></g><path d="M211.0 31a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><path d="M40.0 91h20"/><g>
<path d="M60.0 91h0.0"/><path d="M211.0 91h0.0"/><g class="terminal">
<path d="M60.0 91h0.0"/><path d="M88.5 91h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="60.0" y="80"/><text x="74.25" y="95">(</text></g><path d="M88.5 91h10"/><path d="M98.5 91h10"/><g class="non-terminal">
<path d="M108.5 91h0.0"/><path d="M162.5 91h0.0"/><rect height="22" width="54.0" x="108.5" y="80"/><text x="135.5" y="95">expr</text></g><path d="M162.5 91h10"/><path d="M172.5 91h10"/><g class="terminal">
<path d="M182.5 91h0.0"/><path d="M211.0 91h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="182.5" y="80"/><text x="196.75" y="95">)</text></g></g><path d="M211.0 91h20"/><path d="M40.0 91a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><g>
<path d="M60.0 121h23.0"/><path d="M188.0 121h23.0"/><g class="non-terminal">
<path d="M83.0 121h0.0"/><path d="M188.0 121h0.0"/><rect height="22" width="105.0" x="83.0" y="110"/><text x="135.5" y="125">identifier</text></g></g><path d="M211.0 121a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><path d="M40.0 91a10 10 0 0 1 10 10v40a10 10 0 0 0 10 10"/><g>
<path d="M60.0 151h40.0"/><path d="M171.0 151h40.0"/><g class="non-terminal">
<path d="M100.0 151h0.0"/><path d="M171.0 151h0.0"/><rect height="22" width="71.0" x="100.0" y="140"/><text x="135.5" y="155">number</text></g></g><path d="M211.0 151a10 10 0 0 0 10 -10v-40a10 10 0 0 1 10 -10"/></g><path d="M 231.0 91 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>number
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="92" viewBox="0 0 347.5 92" width="347.5" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 51v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 61h0.0"/><path d="M307.5 61h0.0"/><path d="M40.0 61a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M60.0 31h0.0"/><path d="M287.5 31h0.0"/><g class="non-terminal">
<path d="M60.0 31h0.0"/><path d="M139.5 31h0.0"/><rect height="22" width="79.5" x="60.0" y="20"/><text x="99.75" y="35">integer</text></g><path d="M139.5 31h10"/><path d="M149.5 31h10"/><g class="terminal">
<path d="M159.5 31h0.0"/><path d="M188.0 31h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="159.5" y="20"/><text x="173.75" y="35">.</text></g><path d="M188.0 31h10"/><path d="M198.0 31h10"/><g class="non-terminal">
<path d="M208.0 31h0.0"/><path d="M287.5 31h0.0"/><rect height="22" width="79.5" x="208.0" y="20"/><text x="247.75" y="35">integer</text></g></g><path d="M287.5 31a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M40.0 61h20"/><g>
<path d="M60.0 61h74.0"/><path d="M213.5 61h74.0"/><g class="non-terminal">
<path d="M134.0 61h0.0"/><path d="M213.5 61h0.0"/><rect height="22" width="79.5" x="134.0" y="50"/><text x="173.75" y="65">integer</text></g></g><path d="M287.5 61h20"/></g><path d="M 307.5 61 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>integer
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="92" viewBox="0 0 282.0 92" width="282.0" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 51v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 61h0.0"/><path d="M242.0 61h0.0"/><path d="M40.0 61a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M60.0 31h0.0"/><path d="M222.0 31h0.0"/><g class="non-terminal">
<path d="M60.0 31h0.0"/><path d="M122.5 31h0.0"/><rect height="22" width="62.5" x="60.0" y="20"/><text x="91.25" y="35">digit</text></g><path d="M122.5 31h10"/><path d="M132.5 31h10"/><g class="non-terminal">
<path d="M142.5 31h0.0"/><path d="M222.0 31h0.0"/><rect height="22" width="79.5" x="142.5" y="20"/><text x="182.25" y="35">integer</text></g></g><path d="M222.0 31a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M40.0 61h20"/><g>
<path d="M60.0 61h49.75"/><path d="M172.25 61h49.75"/><g class="non-terminal">
<path d="M109.75 61h0.0"/><path d="M172.25 61h0.0"/><rect height="22" width="62.5" x="109.75" y="50"/><text x="141.0" y="65">digit</text></g></g><path d="M222.0 61h20"/></g><path d="M 242.0 61 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>digit
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<svg class="railroad-diagram" height="109" viewBox="0 0 522.5 109" width="522.5" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(.5 .5)">
<style>/* <![CDATA[ */
    svg.railroad-diagram {
        background-color:hsl(100,100%,100%);
    }
    svg.railroad-diagram path {
        stroke-width:3;
        stroke:black;
        fill:rgba(0,0,0,0);
    }
    svg.railroad-diagram text {
        font:bold 14px monospace;
        text-anchor:middle;
    }
    svg.railroad-diagram text.label{
        text-anchor:start;
    }
    svg.railroad-diagram text.comment{
        font:italic 12px monospace;
    }
    svg.railroad-diagram rect{
        stroke-width:3;
        stroke:black;
        fill:hsl(0,62%,82%);
    }

/* ]]> */
</style><g>
<path d="M20 59v20m10 -20v20m-10 -10h20"/></g><g>
<path d="M40 69h0.0"/><path d="M482.5 69h0.0"/><path d="M40.0 69a10 10 0 0 0 10 -10v-29a10 10 0 0 1 10 -10h324.0"/><path d="M138.5 89h324.0a10 10 0 0 0 10 -10v0a10 10 0 0 1 10 -10"/><path d="M40.0 69h10"/><g>
<path d="M50.0 69h0.0"/><path d="M118.5 69h0.0"/><path d="M50.0 69a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M70.0 39h0.0"/><path d="M98.5 39h0.0"/><g class="terminal">
<path d="M70.0 39h0.0"/><path d="M98.5 39h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="28"/><text x="84.25" y="43">0</text></g></g><path d="M98.5 39a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M50.0 69h20"/><g>
<path d="M70.0 69h0.0"/><path d="M98.5 69h0.0"/><g class="terminal">
<path d="M70.0 69h0.0"/><path d="M98.5 69h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="70.0" y="58"/><text x="84.25" y="73">1</text></g></g><path d="M98.5 69h20"/></g><path d="M118.5 69a10 10 0 0 1 10 10v0a10 10 0 0 0 10 10"/><path d="M118.5 20a10 10 0 0 1 10 10v29a10 10 0 0 0 10 10"/><g>
<path d="M138.5 69h0.0"/><path d="M207.0 69h0.0"/><path d="M138.5 69a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M158.5 39h0.0"/><path d="M187.0 39h0.0"/><g class="terminal">
<path d="M158.5 39h0.0"/><path d="M187.0 39h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="28"/><text x="172.75" y="43">2</text></g></g><path d="M187.0 39a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M138.5 69h20"/><g>
<path d="M158.5 69h0.0"/><path d="M187.0 69h0.0"/><g class="terminal">
<path d="M158.5 69h0.0"/><path d="M187.0 69h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="158.5" y="58"/><text x="172.75" y="73">3</text></g></g><path d="M187.0 69h20"/></g><path d="M207.0 69a10 10 0 0 1 10 10v0a10 10 0 0 0 10 10"/><path d="M207.0 20a10 10 0 0 1 10 10v29a10 10 0 0 0 10 10"/><g>
<path d="M227.0 69h0.0"/><path d="M295.5 69h0.0"/><path d="M227.0 69a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M247.0 39h0.0"/><path d="M275.5 39h0.0"/><g class="terminal">
<path d="M247.0 39h0.0"/><path d="M275.5 39h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="28"/><text x="261.25" y="43">4</text></g></g><path d="M275.5 39a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M227.0 69h20"/><g>
<path d="M247.0 69h0.0"/><path d="M275.5 69h0.0"/><g class="terminal">
<path d="M247.0 69h0.0"/><path d="M275.5 69h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="247.0" y="58"/><text x="261.25" y="73">5</text></g></g><path d="M275.5 69h20"/></g><path d="M295.5 69a10 10 0 0 1 10 10v0a10 10 0 0 0 10 10"/><path d="M295.5 20a10 10 0 0 1 10 10v29a10 10 0 0 0 10 10"/><g>
<path d="M315.5 69h0.0"/><path d="M384.0 69h0.0"/><path d="M315.5 69a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M335.5 39h0.0"/><path d="M364.0 39h0.0"/><g class="terminal">
<path d="M335.5 39h0.0"/><path d="M364.0 39h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="28"/><text x="349.75" y="43">6</text></g></g><path d="M364.0 39a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M315.5 69h20"/><g>
<path d="M335.5 69h0.0"/><path d="M364.0 69h0.0"/><g class="terminal">
<path d="M335.5 69h0.0"/><path d="M364.0 69h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="335.5" y="58"/><text x="349.75" y="73">7</text></g></g><path d="M364.0 69h20"/></g><path d="M384.0 69a10 10 0 0 1 10 10v0a10 10 0 0 0 10 10"/><path d="M384.0 20a10 10 0 0 1 10 10v29a10 10 0 0 0 10 10"/><g>
<path d="M404.0 69h0.0"/><path d="M472.5 69h0.0"/><path d="M404.0 69a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"/><g>
<path d="M424.0 39h0.0"/><path d="M452.5 39h0.0"/><g class="terminal">
<path d="M424.0 39h0.0"/><path d="M452.5 39h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="28"/><text x="438.25" y="43">8</text></g></g><path d="M452.5 39a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"/><path d="M404.0 69h20"/><g>
<path d="M424.0 69h0.0"/><path d="M452.5 69h0.0"/><g class="terminal">
<path d="M424.0 69h0.0"/><path d="M452.5 69h0.0"/><rect height="22" rx="10" ry="10" width="28.5" x="424.0" y="58"/><text x="438.25" y="73">9</text></g></g><path d="M452.5 69h20"/></g><path d="M472.5 69h10"/></g><path d="M 482.5 69 h 20 m -10 -10 v 20 m 10 -20 v 20"/></g></svg>
</div>

</div>

</div>
</div>

</div><aside class="notes">

<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>Let us use our new grammar to parse a program.</p>

</div>
</div>
</div>
</aside><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[7]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">mystring</span> <span class="o">=</span> <span class="s1">&#39;va=10;vb=20&#39;</span>
</pre></div>

    </div>
</div>
</div>

</div></div><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[8]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="k">def</span> <span class="nf">hl_predicate</span><span class="p">(</span><span class="n">_d</span><span class="p">,</span> <span class="n">_n</span><span class="p">,</span> <span class="n">symbol</span><span class="p">,</span> <span class="n">_a</span><span class="p">):</span> <span class="k">return</span> <span class="n">symbol</span> <span class="ow">in</span> <span class="p">{</span>
    <span class="s1">&#39;&lt;number&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;identifier&gt;&#39;</span><span class="p">}</span>
</pre></div>

    </div>
</div>
</div>

</div></div><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[10]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">parser</span> <span class="o">=</span> <span class="n">PEGParser</span><span class="p">(</span><span class="n">VAR_GRAMMAR</span><span class="p">)</span>
<span class="k">for</span> <span class="n">tree</span> <span class="ow">in</span> <span class="n">parser</span><span class="o">.</span><span class="n">parse</span><span class="p">(</span><span class="n">mystring</span><span class="p">):</span>
    <span class="n">display_tree</span><span class="p">(</span><span class="n">tree</span><span class="p">,</span> <span class="n">node_attr</span><span class="o">=</span><span class="n">highlight_node</span><span class="p">(</span><span class="n">hl_predicate</span><span class="p">))</span>
</pre></div>

    </div>
</div>
</div>

<div class="output_wrapper">
<div class="output">


<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Generated by graphviz version 2.40.1 (20161225.0304)
 -->
<!-- Title: %3 Pages: 1 -->
<svg width="437pt" height="635pt"
 viewBox="0.00 0.00 437.00 635.00" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="scale(1 1) rotate(0) translate(4 631)">
<title>%3</title>
<polygon fill="#ffffff" stroke="transparent" points="-4,4 -4,-631 433,-631 433,4 -4,4"/>
<!-- 0 -->
<g id="node1" class="node">
<title>0</title>
<text text-anchor="middle" x="190.5" y="-615.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;start&gt;</text>
</g>
<!-- 1 -->
<g id="node2" class="node">
<title>1</title>
<text text-anchor="middle" x="190.5" y="-564.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statements&gt;</text>
</g>
<!-- 0&#45;&gt;1 -->
<g id="edge1" class="edge">
<title>0&#45;&gt;1</title>
<path fill="none" stroke="#000000" d="M190.5,-611.9748C190.5,-605.195 190.5,-594.966 190.5,-586.1331"/>
<polygon fill="#000000" stroke="#000000" points="194.0001,-586.0561 190.5,-576.0561 187.0001,-586.0561 194.0001,-586.0561"/>
</g>
<!-- 2 -->
<g id="node3" class="node">
<title>2</title>
<text text-anchor="middle" x="133.5" y="-513.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statement&gt;</text>
</g>
<!-- 1&#45;&gt;2 -->
<g id="edge2" class="edge">
<title>1&#45;&gt;2</title>
<path fill="none" stroke="#000000" d="M182.0895,-560.9748C173.5859,-553.3663 160.2275,-541.4141 149.6677,-531.9658"/>
<polygon fill="#000000" stroke="#000000" points="151.7313,-529.1157 141.9451,-525.0561 147.0637,-534.3324 151.7313,-529.1157"/>
</g>
<!-- 22 -->
<g id="node23" class="node">
<title>22</title>
<text text-anchor="middle" x="190.5" y="-513.8" font-family="Times,serif" font-size="14.00" fill="#000000">;</text>
</g>
<!-- 1&#45;&gt;22 -->
<g id="edge22" class="edge">
<title>1&#45;&gt;22</title>
<path fill="none" stroke="#000000" d="M190.5,-560.9748C190.5,-554.195 190.5,-543.966 190.5,-535.1331"/>
<polygon fill="#000000" stroke="#000000" points="194.0001,-535.0561 190.5,-525.0561 187.0001,-535.0561 194.0001,-535.0561"/>
</g>
<!-- 23 -->
<g id="node24" class="node">
<title>23</title>
<text text-anchor="middle" x="249.5" y="-513.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statements&gt;</text>
</g>
<!-- 1&#45;&gt;23 -->
<g id="edge23" class="edge">
<title>1&#45;&gt;23</title>
<path fill="none" stroke="#000000" d="M199.2057,-560.9748C208.0947,-553.291 222.109,-541.177 233.0889,-531.6859"/>
<polygon fill="#000000" stroke="#000000" points="235.4821,-534.2435 240.7586,-525.0561 230.9044,-528.9478 235.4821,-534.2435"/>
</g>
<!-- 3 -->
<g id="node4" class="node">
<title>3</title>
<text text-anchor="middle" x="129.5" y="-462.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;assignment&gt;</text>
</g>
<!-- 2&#45;&gt;3 -->
<g id="edge3" class="edge">
<title>2&#45;&gt;3</title>
<path fill="none" stroke="#000000" d="M132.9098,-509.9748C132.378,-503.195 131.5758,-492.966 130.883,-484.1331"/>
<polygon fill="#000000" stroke="#000000" points="134.3639,-483.7518 130.0926,-474.0561 127.3854,-484.2992 134.3639,-483.7518"/>
</g>
<!-- 4 -->
<g id="node5" class="node">
<title>4</title>
<text text-anchor="middle" x="73.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;identifier&gt;</text>
</g>
<!-- 3&#45;&gt;4 -->
<g id="edge4" class="edge">
<title>3&#45;&gt;4</title>
<path fill="none" stroke="#000000" d="M121.237,-458.9748C112.8826,-451.3663 99.7586,-439.4141 89.384,-429.9658"/>
<polygon fill="#000000" stroke="#000000" points="91.547,-427.2017 81.7969,-423.0561 86.8337,-432.3771 91.547,-427.2017"/>
</g>
<!-- 11 -->
<g id="node12" class="node">
<title>11</title>
<text text-anchor="middle" x="129.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">=</text>
</g>
<!-- 3&#45;&gt;11 -->
<g id="edge11" class="edge">
<title>3&#45;&gt;11</title>
<path fill="none" stroke="#000000" d="M129.5,-458.9748C129.5,-452.195 129.5,-441.966 129.5,-433.1331"/>
<polygon fill="#000000" stroke="#000000" points="133.0001,-433.0561 129.5,-423.0561 126.0001,-433.0561 133.0001,-433.0561"/>
</g>
<!-- 12 -->
<g id="node13" class="node">
<title>12</title>
<text text-anchor="middle" x="172.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 3&#45;&gt;12 -->
<g id="edge12" class="edge">
<title>3&#45;&gt;12</title>
<path fill="none" stroke="#000000" d="M135.8448,-458.9748C142.0692,-451.5923 151.7417,-440.1203 159.5881,-430.8142"/>
<polygon fill="#000000" stroke="#000000" points="162.359,-432.9574 166.1292,-423.0561 157.0073,-428.4452 162.359,-432.9574"/>
</g>
<!-- 5 -->
<g id="node6" class="node">
<title>5</title>
<text text-anchor="middle" x="73.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;word&gt;</text>
</g>
<!-- 4&#45;&gt;5 -->
<g id="edge5" class="edge">
<title>4&#45;&gt;5</title>
<path fill="none" stroke="#000000" d="M73.5,-407.9748C73.5,-401.195 73.5,-390.966 73.5,-382.1331"/>
<polygon fill="#000000" stroke="#000000" points="77.0001,-382.0561 73.5,-372.0561 70.0001,-382.0561 77.0001,-382.0561"/>
</g>
<!-- 6 -->
<g id="node7" class="node">
<title>6</title>
<text text-anchor="middle" x="23.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;alpha&gt;</text>
</g>
<!-- 5&#45;&gt;6 -->
<g id="edge6" class="edge">
<title>5&#45;&gt;6</title>
<path fill="none" stroke="#000000" d="M66.1223,-356.9748C58.7369,-349.4417 47.1768,-337.6503 37.958,-328.2472"/>
<polygon fill="#000000" stroke="#000000" points="40.4079,-325.7466 30.9079,-321.0561 35.4094,-330.6471 40.4079,-325.7466"/>
</g>
<!-- 8 -->
<g id="node9" class="node">
<title>8</title>
<text text-anchor="middle" x="87.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;word&gt;</text>
</g>
<!-- 5&#45;&gt;8 -->
<g id="edge8" class="edge">
<title>5&#45;&gt;8</title>
<path fill="none" stroke="#000000" d="M75.5657,-356.9748C77.4476,-350.1196 80.2973,-339.7383 82.7402,-330.8392"/>
<polygon fill="#000000" stroke="#000000" points="86.1537,-331.6259 85.4258,-321.0561 79.4034,-329.7728 86.1537,-331.6259"/>
</g>
<!-- 7 -->
<g id="node8" class="node">
<title>7</title>
<text text-anchor="middle" x="23.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">v</text>
</g>
<!-- 6&#45;&gt;7 -->
<g id="edge7" class="edge">
<title>6&#45;&gt;7</title>
<path fill="none" stroke="#000000" d="M23.5,-305.9748C23.5,-299.195 23.5,-288.966 23.5,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="27.0001,-280.0561 23.5,-270.0561 20.0001,-280.0561 27.0001,-280.0561"/>
</g>
<!-- 9 -->
<g id="node10" class="node">
<title>9</title>
<text text-anchor="middle" x="87.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;alpha&gt;</text>
</g>
<!-- 8&#45;&gt;9 -->
<g id="edge9" class="edge">
<title>8&#45;&gt;9</title>
<path fill="none" stroke="#000000" d="M87.5,-305.9748C87.5,-299.195 87.5,-288.966 87.5,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="91.0001,-280.0561 87.5,-270.0561 84.0001,-280.0561 91.0001,-280.0561"/>
</g>
<!-- 10 -->
<g id="node11" class="node">
<title>10</title>
<text text-anchor="middle" x="87.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">a</text>
</g>
<!-- 9&#45;&gt;10 -->
<g id="edge10" class="edge">
<title>9&#45;&gt;10</title>
<path fill="none" stroke="#000000" d="M87.5,-254.9748C87.5,-248.195 87.5,-237.966 87.5,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="91.0001,-229.0561 87.5,-219.0561 84.0001,-229.0561 91.0001,-229.0561"/>
</g>
<!-- 13 -->
<g id="node14" class="node">
<title>13</title>
<text text-anchor="middle" x="168.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 12&#45;&gt;13 -->
<g id="edge13" class="edge">
<title>12&#45;&gt;13</title>
<path fill="none" stroke="#000000" d="M171.9098,-407.9748C171.378,-401.195 170.5758,-390.966 169.883,-382.1331"/>
<polygon fill="#000000" stroke="#000000" points="173.3639,-381.7518 169.0926,-372.0561 166.3854,-382.2992 173.3639,-381.7518"/>
</g>
<!-- 14 -->
<g id="node15" class="node">
<title>14</title>
<text text-anchor="middle" x="166.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 13&#45;&gt;14 -->
<g id="edge14" class="edge">
<title>13&#45;&gt;14</title>
<path fill="none" stroke="#000000" d="M168.2049,-356.9748C167.939,-350.195 167.5379,-339.966 167.1915,-331.1331"/>
<polygon fill="#000000" stroke="#000000" points="170.6856,-330.9112 166.7963,-321.0561 163.691,-331.1856 170.6856,-330.9112"/>
</g>
<!-- 15 -->
<g id="node16" class="node">
<title>15</title>
<text text-anchor="middle" x="164.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;number&gt;</text>
</g>
<!-- 14&#45;&gt;15 -->
<g id="edge15" class="edge">
<title>14&#45;&gt;15</title>
<path fill="none" stroke="#000000" d="M166.2049,-305.9748C165.939,-299.195 165.5379,-288.966 165.1915,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="168.6856,-279.9112 164.7963,-270.0561 161.691,-280.1856 168.6856,-279.9112"/>
</g>
<!-- 16 -->
<g id="node17" class="node">
<title>16</title>
<text text-anchor="middle" x="164.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;integer&gt;</text>
</g>
<!-- 15&#45;&gt;16 -->
<g id="edge16" class="edge">
<title>15&#45;&gt;16</title>
<path fill="none" stroke="#000000" d="M164.5,-254.9748C164.5,-248.195 164.5,-237.966 164.5,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="168.0001,-229.0561 164.5,-219.0561 161.0001,-229.0561 168.0001,-229.0561"/>
</g>
<!-- 17 -->
<g id="node18" class="node">
<title>17</title>
<text text-anchor="middle" x="131.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;digit&gt;</text>
</g>
<!-- 16&#45;&gt;17 -->
<g id="edge17" class="edge">
<title>16&#45;&gt;17</title>
<path fill="none" stroke="#000000" d="M159.6307,-203.9748C155.0001,-196.8183 147.8828,-185.8188 141.966,-176.6747"/>
<polygon fill="#000000" stroke="#000000" points="144.7603,-174.5504 136.3892,-168.0561 138.8833,-178.3532 144.7603,-174.5504"/>
</g>
<!-- 19 -->
<g id="node20" class="node">
<title>19</title>
<text text-anchor="middle" x="198.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;integer&gt;</text>
</g>
<!-- 16&#45;&gt;19 -->
<g id="edge19" class="edge">
<title>16&#45;&gt;19</title>
<path fill="none" stroke="#000000" d="M169.5168,-203.9748C174.338,-196.743 181.7754,-185.5868 187.9089,-176.3866"/>
<polygon fill="#000000" stroke="#000000" points="190.8277,-178.3181 193.4626,-168.0561 185.0034,-174.4352 190.8277,-178.3181"/>
</g>
<!-- 18 -->
<g id="node19" class="node">
<title>18</title>
<text text-anchor="middle" x="131.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">1</text>
</g>
<!-- 17&#45;&gt;18 -->
<g id="edge18" class="edge">
<title>17&#45;&gt;18</title>
<path fill="none" stroke="#000000" d="M131.5,-152.9748C131.5,-146.195 131.5,-135.966 131.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="135.0001,-127.0561 131.5,-117.0561 128.0001,-127.0561 135.0001,-127.0561"/>
</g>
<!-- 20 -->
<g id="node21" class="node">
<title>20</title>
<text text-anchor="middle" x="198.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;digit&gt;</text>
</g>
<!-- 19&#45;&gt;20 -->
<g id="edge20" class="edge">
<title>19&#45;&gt;20</title>
<path fill="none" stroke="#000000" d="M198.5,-152.9748C198.5,-146.195 198.5,-135.966 198.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="202.0001,-127.0561 198.5,-117.0561 195.0001,-127.0561 202.0001,-127.0561"/>
</g>
<!-- 21 -->
<g id="node22" class="node">
<title>21</title>
<text text-anchor="middle" x="198.5" y="-54.8" font-family="Times,serif" font-size="14.00" fill="#000000">0</text>
</g>
<!-- 20&#45;&gt;21 -->
<g id="edge21" class="edge">
<title>20&#45;&gt;21</title>
<path fill="none" stroke="#000000" d="M198.5,-101.9748C198.5,-95.195 198.5,-84.966 198.5,-76.1331"/>
<polygon fill="#000000" stroke="#000000" points="202.0001,-76.0561 198.5,-66.0561 195.0001,-76.0561 202.0001,-76.0561"/>
</g>
<!-- 24 -->
<g id="node25" class="node">
<title>24</title>
<text text-anchor="middle" x="255.5" y="-462.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statement&gt;</text>
</g>
<!-- 23&#45;&gt;24 -->
<g id="edge24" class="edge">
<title>23&#45;&gt;24</title>
<path fill="none" stroke="#000000" d="M250.3853,-509.9748C251.1829,-503.195 252.3864,-492.966 253.4255,-484.1331"/>
<polygon fill="#000000" stroke="#000000" points="256.9186,-484.3966 254.611,-474.0561 249.9665,-483.5786 256.9186,-484.3966"/>
</g>
<!-- 25 -->
<g id="node26" class="node">
<title>25</title>
<text text-anchor="middle" x="261.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;assignment&gt;</text>
</g>
<!-- 24&#45;&gt;25 -->
<g id="edge25" class="edge">
<title>24&#45;&gt;25</title>
<path fill="none" stroke="#000000" d="M256.3853,-458.9748C257.1829,-452.195 258.3864,-441.966 259.4255,-433.1331"/>
<polygon fill="#000000" stroke="#000000" points="262.9186,-433.3966 260.611,-423.0561 255.9665,-432.5786 262.9186,-433.3966"/>
</g>
<!-- 26 -->
<g id="node27" class="node">
<title>26</title>
<text text-anchor="middle" x="248.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;identifier&gt;</text>
</g>
<!-- 25&#45;&gt;26 -->
<g id="edge26" class="edge">
<title>25&#45;&gt;26</title>
<path fill="none" stroke="#000000" d="M259.5818,-407.9748C257.8344,-401.1196 255.1882,-390.7383 252.9198,-381.8392"/>
<polygon fill="#000000" stroke="#000000" points="256.2877,-380.8817 250.4261,-372.0561 249.5046,-382.6108 256.2877,-380.8817"/>
</g>
<!-- 33 -->
<g id="node34" class="node">
<title>33</title>
<text text-anchor="middle" x="304.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">=</text>
</g>
<!-- 25&#45;&gt;33 -->
<g id="edge33" class="edge">
<title>25&#45;&gt;33</title>
<path fill="none" stroke="#000000" d="M267.8448,-407.9748C274.7131,-399.8286 285.7798,-386.703 293.9587,-377.0025"/>
<polygon fill="#000000" stroke="#000000" points="296.6845,-379.1993 300.4547,-369.298 291.3328,-374.6871 296.6845,-379.1993"/>
</g>
<!-- 34 -->
<g id="node35" class="node">
<title>34</title>
<text text-anchor="middle" x="350.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 25&#45;&gt;34 -->
<g id="edge34" class="edge">
<title>25&#45;&gt;34</title>
<path fill="none" stroke="#000000" d="M274.6323,-407.9748C288.83,-399.839 311.6952,-386.7365 328.6171,-377.0397"/>
<polygon fill="#000000" stroke="#000000" points="330.3776,-380.0648 337.3139,-372.0561 326.8972,-373.9913 330.3776,-380.0648"/>
</g>
<!-- 27 -->
<g id="node28" class="node">
<title>27</title>
<text text-anchor="middle" x="248.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;word&gt;</text>
</g>
<!-- 26&#45;&gt;27 -->
<g id="edge27" class="edge">
<title>26&#45;&gt;27</title>
<path fill="none" stroke="#000000" d="M248.5,-356.9748C248.5,-350.195 248.5,-339.966 248.5,-331.1331"/>
<polygon fill="#000000" stroke="#000000" points="252.0001,-331.0561 248.5,-321.0561 245.0001,-331.0561 252.0001,-331.0561"/>
</g>
<!-- 28 -->
<g id="node29" class="node">
<title>28</title>
<text text-anchor="middle" x="235.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;alpha&gt;</text>
</g>
<!-- 27&#45;&gt;28 -->
<g id="edge28" class="edge">
<title>27&#45;&gt;28</title>
<path fill="none" stroke="#000000" d="M246.5818,-305.9748C244.8344,-299.1196 242.1882,-288.7383 239.9198,-279.8392"/>
<polygon fill="#000000" stroke="#000000" points="243.2877,-278.8817 237.4261,-270.0561 236.5046,-280.6108 243.2877,-278.8817"/>
</g>
<!-- 30 -->
<g id="node31" class="node">
<title>30</title>
<text text-anchor="middle" x="299.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;word&gt;</text>
</g>
<!-- 27&#45;&gt;30 -->
<g id="edge30" class="edge">
<title>27&#45;&gt;30</title>
<path fill="none" stroke="#000000" d="M256.0252,-305.9748C263.5583,-298.4417 275.3497,-286.6503 284.7528,-277.2472"/>
<polygon fill="#000000" stroke="#000000" points="287.3477,-279.6021 291.9439,-270.0561 282.3979,-274.6523 287.3477,-279.6021"/>
</g>
<!-- 29 -->
<g id="node30" class="node">
<title>29</title>
<text text-anchor="middle" x="235.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">v</text>
</g>
<!-- 28&#45;&gt;29 -->
<g id="edge29" class="edge">
<title>28&#45;&gt;29</title>
<path fill="none" stroke="#000000" d="M235.5,-254.9748C235.5,-248.195 235.5,-237.966 235.5,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="239.0001,-229.0561 235.5,-219.0561 232.0001,-229.0561 239.0001,-229.0561"/>
</g>
<!-- 31 -->
<g id="node32" class="node">
<title>31</title>
<text text-anchor="middle" x="297.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;alpha&gt;</text>
</g>
<!-- 30&#45;&gt;31 -->
<g id="edge31" class="edge">
<title>30&#45;&gt;31</title>
<path fill="none" stroke="#000000" d="M299.2049,-254.9748C298.939,-248.195 298.5379,-237.966 298.1915,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="301.6856,-228.9112 297.7963,-219.0561 294.691,-229.1856 301.6856,-228.9112"/>
</g>
<!-- 32 -->
<g id="node33" class="node">
<title>32</title>
<text text-anchor="middle" x="297.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">b</text>
</g>
<!-- 31&#45;&gt;32 -->
<g id="edge32" class="edge">
<title>31&#45;&gt;32</title>
<path fill="none" stroke="#000000" d="M297.5,-203.9748C297.5,-197.195 297.5,-186.966 297.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="301.0001,-178.0561 297.5,-168.0561 294.0001,-178.0561 301.0001,-178.0561"/>
</g>
<!-- 35 -->
<g id="node36" class="node">
<title>35</title>
<text text-anchor="middle" x="364.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 34&#45;&gt;35 -->
<g id="edge35" class="edge">
<title>34&#45;&gt;35</title>
<path fill="none" stroke="#000000" d="M352.5657,-356.9748C354.4476,-350.1196 357.2973,-339.7383 359.7402,-330.8392"/>
<polygon fill="#000000" stroke="#000000" points="363.1537,-331.6259 362.4258,-321.0561 356.4034,-329.7728 363.1537,-331.6259"/>
</g>
<!-- 36 -->
<g id="node37" class="node">
<title>36</title>
<text text-anchor="middle" x="367.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 35&#45;&gt;36 -->
<g id="edge36" class="edge">
<title>35&#45;&gt;36</title>
<path fill="none" stroke="#000000" d="M364.9427,-305.9748C365.3415,-299.195 365.9432,-288.966 366.4628,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="369.9622,-280.2444 367.0555,-270.0561 362.9742,-279.8333 369.9622,-280.2444"/>
</g>
<!-- 37 -->
<g id="node38" class="node">
<title>37</title>
<text text-anchor="middle" x="368.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;number&gt;</text>
</g>
<!-- 36&#45;&gt;37 -->
<g id="edge37" class="edge">
<title>36&#45;&gt;37</title>
<path fill="none" stroke="#000000" d="M367.6476,-254.9748C367.7805,-248.195 367.9811,-237.966 368.1543,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="371.655,-229.1228 368.3518,-219.0561 364.6564,-228.9855 371.655,-229.1228"/>
</g>
<!-- 38 -->
<g id="node39" class="node">
<title>38</title>
<text text-anchor="middle" x="368.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;integer&gt;</text>
</g>
<!-- 37&#45;&gt;38 -->
<g id="edge38" class="edge">
<title>37&#45;&gt;38</title>
<path fill="none" stroke="#000000" d="M368.5,-203.9748C368.5,-197.195 368.5,-186.966 368.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="372.0001,-178.0561 368.5,-168.0561 365.0001,-178.0561 372.0001,-178.0561"/>
</g>
<!-- 39 -->
<g id="node40" class="node">
<title>39</title>
<text text-anchor="middle" x="334.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;digit&gt;</text>
</g>
<!-- 38&#45;&gt;39 -->
<g id="edge39" class="edge">
<title>38&#45;&gt;39</title>
<path fill="none" stroke="#000000" d="M363.4832,-152.9748C358.662,-145.743 351.2246,-134.5868 345.0911,-125.3866"/>
<polygon fill="#000000" stroke="#000000" points="347.9966,-123.4352 339.5374,-117.0561 342.1723,-127.3181 347.9966,-123.4352"/>
</g>
<!-- 41 -->
<g id="node42" class="node">
<title>41</title>
<text text-anchor="middle" x="401.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;integer&gt;</text>
</g>
<!-- 38&#45;&gt;41 -->
<g id="edge41" class="edge">
<title>38&#45;&gt;41</title>
<path fill="none" stroke="#000000" d="M373.3693,-152.9748C377.9999,-145.8183 385.1172,-134.8188 391.034,-125.6747"/>
<polygon fill="#000000" stroke="#000000" points="394.1167,-127.3532 396.6108,-117.0561 388.2397,-123.5504 394.1167,-127.3532"/>
</g>
<!-- 40 -->
<g id="node41" class="node">
<title>40</title>
<text text-anchor="middle" x="334.5" y="-54.8" font-family="Times,serif" font-size="14.00" fill="#000000">2</text>
</g>
<!-- 39&#45;&gt;40 -->
<g id="edge40" class="edge">
<title>39&#45;&gt;40</title>
<path fill="none" stroke="#000000" d="M334.5,-101.9748C334.5,-95.195 334.5,-84.966 334.5,-76.1331"/>
<polygon fill="#000000" stroke="#000000" points="338.0001,-76.0561 334.5,-66.0561 331.0001,-76.0561 338.0001,-76.0561"/>
</g>
<!-- 42 -->
<g id="node43" class="node">
<title>42</title>
<text text-anchor="middle" x="401.5" y="-54.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;digit&gt;</text>
</g>
<!-- 41&#45;&gt;42 -->
<g id="edge42" class="edge">
<title>41&#45;&gt;42</title>
<path fill="none" stroke="#000000" d="M401.5,-101.9748C401.5,-95.195 401.5,-84.966 401.5,-76.1331"/>
<polygon fill="#000000" stroke="#000000" points="405.0001,-76.0561 401.5,-66.0561 398.0001,-76.0561 405.0001,-76.0561"/>
</g>
<!-- 43 -->
<g id="node44" class="node">
<title>43</title>
<text text-anchor="middle" x="401.5" y="-3.8" font-family="Times,serif" font-size="14.00" fill="#000000">0</text>
</g>
<!-- 42&#45;&gt;43 -->
<g id="edge43" class="edge">
<title>42&#45;&gt;43</title>
<path fill="none" stroke="#000000" d="M401.5,-50.9748C401.5,-44.195 401.5,-33.966 401.5,-25.1331"/>
<polygon fill="#000000" stroke="#000000" points="405.0001,-25.0561 401.5,-15.0561 398.0001,-25.0561 405.0001,-25.0561"/>
</g>
</g>
</svg>

</div>

</div>

</div>
</div>

</div></div><div class="fragment">
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>As can be seen from the above example, our grammar is rather detailed. So we need to define our token nodes, which correspond to the <em>red</em> nodes above.</p>

</div>
</div>
</div></div><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[11]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">VAR_TOKENS</span> <span class="o">=</span> <span class="p">{</span><span class="s1">&#39;&lt;number&gt;&#39;</span><span class="p">,</span> <span class="s1">&#39;&lt;identifier&gt;&#39;</span><span class="p">}</span>
</pre></div>

    </div>
</div>
</div>

</div></div></section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>These tokens are pruned using the <code>prune_tree</code> method that we mentioned previously.
Here is a slightly more complex program to parse, but with the tree pruned using tokens:</p>

</div>
</div>
</div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[12]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">mystring</span> <span class="o">=</span> <span class="s1">&#39;avar=1.3;bvar=avar-3*(4+300)&#39;</span>
<span class="n">parser</span> <span class="o">=</span> <span class="n">PEGParser</span><span class="p">(</span><span class="n">VAR_GRAMMAR</span><span class="p">,</span> <span class="n">tokens</span><span class="o">=</span><span class="n">VAR_TOKENS</span><span class="p">)</span>
<span class="k">for</span> <span class="n">tree</span> <span class="ow">in</span> <span class="n">parser</span><span class="o">.</span><span class="n">parse</span><span class="p">(</span><span class="n">mystring</span><span class="p">):</span>
    <span class="n">display_tree</span><span class="p">(</span><span class="n">tree</span><span class="p">,</span> <span class="n">node_attr</span><span class="o">=</span><span class="n">highlight_node</span><span class="p">(</span><span class="n">hl_predicate</span><span class="p">))</span>
</pre></div>

    </div>
</div>
</div>

<div class="output_wrapper">
<div class="output">


<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Generated by graphviz version 2.40.1 (20161225.0304)
 -->
<!-- Title: %3 Pages: 1 -->
<svg width="469pt" height="788pt"
 viewBox="0.00 0.00 469.00 788.00" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="scale(1 1) rotate(0) translate(4 784)">
<title>%3</title>
<polygon fill="#ffffff" stroke="transparent" points="-4,4 -4,-784 465,-784 465,4 -4,4"/>
<!-- 0 -->
<g id="node1" class="node">
<title>0</title>
<text text-anchor="middle" x="150.5" y="-768.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;start&gt;</text>
</g>
<!-- 1 -->
<g id="node2" class="node">
<title>1</title>
<text text-anchor="middle" x="150.5" y="-717.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statements&gt;</text>
</g>
<!-- 0&#45;&gt;1 -->
<g id="edge1" class="edge">
<title>0&#45;&gt;1</title>
<path fill="none" stroke="#000000" d="M150.5,-764.9748C150.5,-758.195 150.5,-747.966 150.5,-739.1331"/>
<polygon fill="#000000" stroke="#000000" points="154.0001,-739.0561 150.5,-729.0561 147.0001,-739.0561 154.0001,-739.0561"/>
</g>
<!-- 2 -->
<g id="node3" class="node">
<title>2</title>
<text text-anchor="middle" x="93.5" y="-666.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statement&gt;</text>
</g>
<!-- 1&#45;&gt;2 -->
<g id="edge2" class="edge">
<title>1&#45;&gt;2</title>
<path fill="none" stroke="#000000" d="M142.0895,-713.9748C133.5859,-706.3663 120.2275,-694.4141 109.6677,-684.9658"/>
<polygon fill="#000000" stroke="#000000" points="111.7313,-682.1157 101.9451,-678.0561 107.0637,-687.3324 111.7313,-682.1157"/>
</g>
<!-- 12 -->
<g id="node13" class="node">
<title>12</title>
<text text-anchor="middle" x="150.5" y="-666.8" font-family="Times,serif" font-size="14.00" fill="#000000">;</text>
</g>
<!-- 1&#45;&gt;12 -->
<g id="edge12" class="edge">
<title>1&#45;&gt;12</title>
<path fill="none" stroke="#000000" d="M150.5,-713.9748C150.5,-707.195 150.5,-696.966 150.5,-688.1331"/>
<polygon fill="#000000" stroke="#000000" points="154.0001,-688.0561 150.5,-678.0561 147.0001,-688.0561 154.0001,-688.0561"/>
</g>
<!-- 13 -->
<g id="node14" class="node">
<title>13</title>
<text text-anchor="middle" x="209.5" y="-666.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statements&gt;</text>
</g>
<!-- 1&#45;&gt;13 -->
<g id="edge13" class="edge">
<title>1&#45;&gt;13</title>
<path fill="none" stroke="#000000" d="M159.2057,-713.9748C168.0947,-706.291 182.109,-694.177 193.0889,-684.6859"/>
<polygon fill="#000000" stroke="#000000" points="195.4821,-687.2435 200.7586,-678.0561 190.9044,-681.9478 195.4821,-687.2435"/>
</g>
<!-- 3 -->
<g id="node4" class="node">
<title>3</title>
<text text-anchor="middle" x="89.5" y="-615.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;assignment&gt;</text>
</g>
<!-- 2&#45;&gt;3 -->
<g id="edge3" class="edge">
<title>2&#45;&gt;3</title>
<path fill="none" stroke="#000000" d="M92.9098,-662.9748C92.378,-656.195 91.5758,-645.966 90.883,-637.1331"/>
<polygon fill="#000000" stroke="#000000" points="94.3639,-636.7518 90.0926,-627.0561 87.3854,-637.2992 94.3639,-636.7518"/>
</g>
<!-- 4 -->
<g id="node5" class="node">
<title>4</title>
<text text-anchor="middle" x="33.5" y="-564.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;identifier&gt;</text>
</g>
<!-- 3&#45;&gt;4 -->
<g id="edge4" class="edge">
<title>3&#45;&gt;4</title>
<path fill="none" stroke="#000000" d="M81.237,-611.9748C72.8826,-604.3663 59.7586,-592.4141 49.384,-582.9658"/>
<polygon fill="#000000" stroke="#000000" points="51.547,-580.2017 41.7969,-576.0561 46.8337,-585.3771 51.547,-580.2017"/>
</g>
<!-- 6 -->
<g id="node7" class="node">
<title>6</title>
<text text-anchor="middle" x="89.5" y="-564.8" font-family="Times,serif" font-size="14.00" fill="#000000">=</text>
</g>
<!-- 3&#45;&gt;6 -->
<g id="edge6" class="edge">
<title>3&#45;&gt;6</title>
<path fill="none" stroke="#000000" d="M89.5,-611.9748C89.5,-605.195 89.5,-594.966 89.5,-586.1331"/>
<polygon fill="#000000" stroke="#000000" points="93.0001,-586.0561 89.5,-576.0561 86.0001,-586.0561 93.0001,-586.0561"/>
</g>
<!-- 7 -->
<g id="node8" class="node">
<title>7</title>
<text text-anchor="middle" x="132.5" y="-564.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 3&#45;&gt;7 -->
<g id="edge7" class="edge">
<title>3&#45;&gt;7</title>
<path fill="none" stroke="#000000" d="M95.8448,-611.9748C102.0692,-604.5923 111.7417,-593.1203 119.5881,-583.8142"/>
<polygon fill="#000000" stroke="#000000" points="122.359,-585.9574 126.1292,-576.0561 117.0073,-581.4452 122.359,-585.9574"/>
</g>
<!-- 5 -->
<g id="node6" class="node">
<title>5</title>
<text text-anchor="middle" x="33.5" y="-513.8" font-family="Times,serif" font-size="14.00" fill="#000000">avar</text>
</g>
<!-- 4&#45;&gt;5 -->
<g id="edge5" class="edge">
<title>4&#45;&gt;5</title>
<path fill="none" stroke="#000000" d="M33.5,-560.9748C33.5,-554.195 33.5,-543.966 33.5,-535.1331"/>
<polygon fill="#000000" stroke="#000000" points="37.0001,-535.0561 33.5,-525.0561 30.0001,-535.0561 37.0001,-535.0561"/>
</g>
<!-- 8 -->
<g id="node9" class="node">
<title>8</title>
<text text-anchor="middle" x="108.5" y="-513.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 7&#45;&gt;8 -->
<g id="edge8" class="edge">
<title>7&#45;&gt;8</title>
<path fill="none" stroke="#000000" d="M128.9587,-560.9748C125.6619,-553.969 120.6319,-543.2803 116.3845,-534.2547"/>
<polygon fill="#000000" stroke="#000000" points="119.4807,-532.614 112.0558,-525.0561 113.147,-535.5946 119.4807,-532.614"/>
</g>
<!-- 9 -->
<g id="node10" class="node">
<title>9</title>
<text text-anchor="middle" x="108.5" y="-462.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 8&#45;&gt;9 -->
<g id="edge9" class="edge">
<title>8&#45;&gt;9</title>
<path fill="none" stroke="#000000" d="M108.5,-509.9748C108.5,-503.195 108.5,-492.966 108.5,-484.1331"/>
<polygon fill="#000000" stroke="#000000" points="112.0001,-484.0561 108.5,-474.0561 105.0001,-484.0561 112.0001,-484.0561"/>
</g>
<!-- 10 -->
<g id="node11" class="node">
<title>10</title>
<text text-anchor="middle" x="108.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;number&gt;</text>
</g>
<!-- 9&#45;&gt;10 -->
<g id="edge10" class="edge">
<title>9&#45;&gt;10</title>
<path fill="none" stroke="#000000" d="M108.5,-458.9748C108.5,-452.195 108.5,-441.966 108.5,-433.1331"/>
<polygon fill="#000000" stroke="#000000" points="112.0001,-433.0561 108.5,-423.0561 105.0001,-433.0561 112.0001,-433.0561"/>
</g>
<!-- 11 -->
<g id="node12" class="node">
<title>11</title>
<text text-anchor="middle" x="108.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">1.3</text>
</g>
<!-- 10&#45;&gt;11 -->
<g id="edge11" class="edge">
<title>10&#45;&gt;11</title>
<path fill="none" stroke="#000000" d="M108.5,-407.9748C108.5,-401.195 108.5,-390.966 108.5,-382.1331"/>
<polygon fill="#000000" stroke="#000000" points="112.0001,-382.0561 108.5,-372.0561 105.0001,-382.0561 112.0001,-382.0561"/>
</g>
<!-- 14 -->
<g id="node15" class="node">
<title>14</title>
<text text-anchor="middle" x="210.5" y="-615.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statement&gt;</text>
</g>
<!-- 13&#45;&gt;14 -->
<g id="edge14" class="edge">
<title>13&#45;&gt;14</title>
<path fill="none" stroke="#000000" d="M209.6476,-662.9748C209.7805,-656.195 209.9811,-645.966 210.1543,-637.1331"/>
<polygon fill="#000000" stroke="#000000" points="213.655,-637.1228 210.3518,-627.0561 206.6564,-636.9855 213.655,-637.1228"/>
</g>
<!-- 15 -->
<g id="node16" class="node">
<title>15</title>
<text text-anchor="middle" x="212.5" y="-564.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;assignment&gt;</text>
</g>
<!-- 14&#45;&gt;15 -->
<g id="edge15" class="edge">
<title>14&#45;&gt;15</title>
<path fill="none" stroke="#000000" d="M210.7951,-611.9748C211.061,-605.195 211.4621,-594.966 211.8085,-586.1331"/>
<polygon fill="#000000" stroke="#000000" points="215.309,-586.1856 212.2037,-576.0561 208.3144,-585.9112 215.309,-586.1856"/>
</g>
<!-- 16 -->
<g id="node17" class="node">
<title>16</title>
<text text-anchor="middle" x="181.5" y="-513.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;identifier&gt;</text>
</g>
<!-- 15&#45;&gt;16 -->
<g id="edge16" class="edge">
<title>15&#45;&gt;16</title>
<path fill="none" stroke="#000000" d="M207.9258,-560.9748C203.5758,-553.8183 196.8899,-542.8188 191.3317,-533.6747"/>
<polygon fill="#000000" stroke="#000000" points="194.278,-531.7834 186.0929,-525.0561 188.2963,-535.4193 194.278,-531.7834"/>
</g>
<!-- 18 -->
<g id="node19" class="node">
<title>18</title>
<text text-anchor="middle" x="237.5" y="-513.8" font-family="Times,serif" font-size="14.00" fill="#000000">=</text>
</g>
<!-- 15&#45;&gt;18 -->
<g id="edge18" class="edge">
<title>15&#45;&gt;18</title>
<path fill="none" stroke="#000000" d="M216.1888,-560.9748C219.6231,-553.969 224.8626,-543.2803 229.2869,-534.2547"/>
<polygon fill="#000000" stroke="#000000" points="232.5371,-535.5759 233.796,-525.0561 226.2517,-532.4947 232.5371,-535.5759"/>
</g>
<!-- 19 -->
<g id="node20" class="node">
<title>19</title>
<text text-anchor="middle" x="280.5" y="-513.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 15&#45;&gt;19 -->
<g id="edge19" class="edge">
<title>15&#45;&gt;19</title>
<path fill="none" stroke="#000000" d="M222.5336,-560.9748C232.9796,-553.1403 249.5664,-540.7002 262.3258,-531.1307"/>
<polygon fill="#000000" stroke="#000000" points="264.5252,-533.8561 270.4252,-525.0561 260.3252,-528.2561 264.5252,-533.8561"/>
</g>
<!-- 17 -->
<g id="node18" class="node">
<title>17</title>
<text text-anchor="middle" x="181.5" y="-462.8" font-family="Times,serif" font-size="14.00" fill="#000000">bvar</text>
</g>
<!-- 16&#45;&gt;17 -->
<g id="edge17" class="edge">
<title>16&#45;&gt;17</title>
<path fill="none" stroke="#000000" d="M181.5,-509.9748C181.5,-503.195 181.5,-492.966 181.5,-484.1331"/>
<polygon fill="#000000" stroke="#000000" points="185.0001,-484.0561 181.5,-474.0561 178.0001,-484.0561 185.0001,-484.0561"/>
</g>
<!-- 20 -->
<g id="node21" class="node">
<title>20</title>
<text text-anchor="middle" x="236.5" y="-462.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 19&#45;&gt;20 -->
<g id="edge20" class="edge">
<title>19&#45;&gt;20</title>
<path fill="none" stroke="#000000" d="M274.0076,-509.9748C267.6385,-502.5923 257.741,-491.1203 249.7122,-481.8142"/>
<polygon fill="#000000" stroke="#000000" points="252.2014,-479.3414 243.019,-474.0561 246.9013,-483.914 252.2014,-479.3414"/>
</g>
<!-- 24 -->
<g id="node25" class="node">
<title>24</title>
<text text-anchor="middle" x="280.5" y="-462.8" font-family="Times,serif" font-size="14.00" fill="#000000">&#45;</text>
</g>
<!-- 19&#45;&gt;24 -->
<g id="edge24" class="edge">
<title>19&#45;&gt;24</title>
<path fill="none" stroke="#000000" d="M280.5,-509.9748C280.5,-503.195 280.5,-492.966 280.5,-484.1331"/>
<polygon fill="#000000" stroke="#000000" points="284.0001,-484.0561 280.5,-474.0561 277.0001,-484.0561 284.0001,-484.0561"/>
</g>
<!-- 25 -->
<g id="node26" class="node">
<title>25</title>
<text text-anchor="middle" x="340.5" y="-462.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 19&#45;&gt;25 -->
<g id="edge25" class="edge">
<title>19&#45;&gt;25</title>
<path fill="none" stroke="#000000" d="M289.3532,-509.9748C298.3929,-502.291 312.6447,-490.177 323.8107,-480.6859"/>
<polygon fill="#000000" stroke="#000000" points="326.2578,-483.1994 331.6105,-474.0561 321.7243,-477.8658 326.2578,-483.1994"/>
</g>
<!-- 21 -->
<g id="node22" class="node">
<title>21</title>
<text text-anchor="middle" x="231.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 20&#45;&gt;21 -->
<g id="edge21" class="edge">
<title>20&#45;&gt;21</title>
<path fill="none" stroke="#000000" d="M235.7622,-458.9748C235.0975,-452.195 234.0947,-441.966 233.2287,-433.1331"/>
<polygon fill="#000000" stroke="#000000" points="236.6999,-432.6669 232.2408,-423.0561 229.7333,-433.3499 236.6999,-432.6669"/>
</g>
<!-- 22 -->
<g id="node23" class="node">
<title>22</title>
<text text-anchor="middle" x="222.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;identifier&gt;</text>
</g>
<!-- 21&#45;&gt;22 -->
<g id="edge22" class="edge">
<title>21&#45;&gt;22</title>
<path fill="none" stroke="#000000" d="M230.172,-407.9748C228.9756,-401.195 227.1705,-390.966 225.6117,-382.1331"/>
<polygon fill="#000000" stroke="#000000" points="229.0181,-381.2957 223.8334,-372.0561 222.1246,-382.5122 229.0181,-381.2957"/>
</g>
<!-- 23 -->
<g id="node24" class="node">
<title>23</title>
<text text-anchor="middle" x="222.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">avar</text>
</g>
<!-- 22&#45;&gt;23 -->
<g id="edge23" class="edge">
<title>22&#45;&gt;23</title>
<path fill="none" stroke="#000000" d="M222.5,-356.9748C222.5,-350.195 222.5,-339.966 222.5,-331.1331"/>
<polygon fill="#000000" stroke="#000000" points="226.0001,-331.0561 222.5,-321.0561 219.0001,-331.0561 226.0001,-331.0561"/>
</g>
<!-- 26 -->
<g id="node27" class="node">
<title>26</title>
<text text-anchor="middle" x="342.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 25&#45;&gt;26 -->
<g id="edge26" class="edge">
<title>25&#45;&gt;26</title>
<path fill="none" stroke="#000000" d="M340.7951,-458.9748C341.061,-452.195 341.4621,-441.966 341.8085,-433.1331"/>
<polygon fill="#000000" stroke="#000000" points="345.309,-433.1856 342.2037,-423.0561 338.3144,-432.9112 345.309,-433.1856"/>
</g>
<!-- 27 -->
<g id="node28" class="node">
<title>27</title>
<text text-anchor="middle" x="298.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 26&#45;&gt;27 -->
<g id="edge27" class="edge">
<title>26&#45;&gt;27</title>
<path fill="none" stroke="#000000" d="M336.0076,-407.9748C329.6385,-400.5923 319.741,-389.1203 311.7122,-379.8142"/>
<polygon fill="#000000" stroke="#000000" points="314.2014,-377.3414 305.019,-372.0561 308.9013,-381.914 314.2014,-377.3414"/>
</g>
<!-- 30 -->
<g id="node31" class="node">
<title>30</title>
<text text-anchor="middle" x="345.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">*</text>
</g>
<!-- 26&#45;&gt;30 -->
<g id="edge30" class="edge">
<title>26&#45;&gt;30</title>
<path fill="none" stroke="#000000" d="M342.9427,-407.9748C343.3415,-401.195 343.9432,-390.966 344.4628,-382.1331"/>
<polygon fill="#000000" stroke="#000000" points="347.9622,-382.2444 345.0555,-372.0561 340.9742,-381.8333 347.9622,-382.2444"/>
</g>
<!-- 31 -->
<g id="node32" class="node">
<title>31</title>
<text text-anchor="middle" x="388.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 26&#45;&gt;31 -->
<g id="edge31" class="edge">
<title>26&#45;&gt;31</title>
<path fill="none" stroke="#000000" d="M349.2875,-407.9748C356.0141,-400.517 366.505,-388.8857 374.9436,-379.53"/>
<polygon fill="#000000" stroke="#000000" points="377.586,-381.826 381.6847,-372.0561 372.388,-377.1376 377.586,-381.826"/>
</g>
<!-- 28 -->
<g id="node29" class="node">
<title>28</title>
<text text-anchor="middle" x="298.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;number&gt;</text>
</g>
<!-- 27&#45;&gt;28 -->
<g id="edge28" class="edge">
<title>27&#45;&gt;28</title>
<path fill="none" stroke="#000000" d="M298.5,-356.9748C298.5,-350.195 298.5,-339.966 298.5,-331.1331"/>
<polygon fill="#000000" stroke="#000000" points="302.0001,-331.0561 298.5,-321.0561 295.0001,-331.0561 302.0001,-331.0561"/>
</g>
<!-- 29 -->
<g id="node30" class="node">
<title>29</title>
<text text-anchor="middle" x="298.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">3</text>
</g>
<!-- 28&#45;&gt;29 -->
<g id="edge29" class="edge">
<title>28&#45;&gt;29</title>
<path fill="none" stroke="#000000" d="M298.5,-305.9748C298.5,-299.195 298.5,-288.966 298.5,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="302.0001,-280.0561 298.5,-270.0561 295.0001,-280.0561 302.0001,-280.0561"/>
</g>
<!-- 32 -->
<g id="node33" class="node">
<title>32</title>
<text text-anchor="middle" x="388.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 31&#45;&gt;32 -->
<g id="edge32" class="edge">
<title>31&#45;&gt;32</title>
<path fill="none" stroke="#000000" d="M388.5,-356.9748C388.5,-350.195 388.5,-339.966 388.5,-331.1331"/>
<polygon fill="#000000" stroke="#000000" points="392.0001,-331.0561 388.5,-321.0561 385.0001,-331.0561 392.0001,-331.0561"/>
</g>
<!-- 33 -->
<g id="node34" class="node">
<title>33</title>
<text text-anchor="middle" x="347.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">(</text>
</g>
<!-- 32&#45;&gt;33 -->
<g id="edge33" class="edge">
<title>32&#45;&gt;33</title>
<path fill="none" stroke="#000000" d="M382.4503,-305.9748C375.6341,-297.4961 364.4814,-283.6232 356.6104,-273.8324"/>
<polygon fill="#000000" stroke="#000000" points="359.1088,-271.3541 350.1154,-265.7533 353.6531,-275.74 359.1088,-271.3541"/>
</g>
<!-- 34 -->
<g id="node35" class="node">
<title>34</title>
<text text-anchor="middle" x="388.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 32&#45;&gt;34 -->
<g id="edge34" class="edge">
<title>32&#45;&gt;34</title>
<path fill="none" stroke="#000000" d="M388.5,-305.9748C388.5,-299.195 388.5,-288.966 388.5,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="392.0001,-280.0561 388.5,-270.0561 385.0001,-280.0561 392.0001,-280.0561"/>
</g>
<!-- 45 -->
<g id="node46" class="node">
<title>45</title>
<text text-anchor="middle" x="429.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">)</text>
</g>
<!-- 32&#45;&gt;45 -->
<g id="edge45" class="edge">
<title>32&#45;&gt;45</title>
<path fill="none" stroke="#000000" d="M394.5497,-305.9748C401.3659,-297.4961 412.5186,-283.6232 420.3896,-273.8324"/>
<polygon fill="#000000" stroke="#000000" points="423.3469,-275.74 426.8846,-265.7533 417.8912,-271.3541 423.3469,-275.74"/>
</g>
<!-- 35 -->
<g id="node36" class="node">
<title>35</title>
<text text-anchor="middle" x="345.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 34&#45;&gt;35 -->
<g id="edge35" class="edge">
<title>34&#45;&gt;35</title>
<path fill="none" stroke="#000000" d="M382.1552,-254.9748C375.9308,-247.5923 366.2583,-236.1203 358.4119,-226.8142"/>
<polygon fill="#000000" stroke="#000000" points="360.9927,-224.4452 351.8708,-219.0561 355.641,-228.9574 360.9927,-224.4452"/>
</g>
<!-- 39 -->
<g id="node40" class="node">
<title>39</title>
<text text-anchor="middle" x="388.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">+</text>
</g>
<!-- 34&#45;&gt;39 -->
<g id="edge39" class="edge">
<title>34&#45;&gt;39</title>
<path fill="none" stroke="#000000" d="M388.5,-254.9748C388.5,-248.195 388.5,-237.966 388.5,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="392.0001,-229.0561 388.5,-219.0561 385.0001,-229.0561 392.0001,-229.0561"/>
</g>
<!-- 40 -->
<g id="node41" class="node">
<title>40</title>
<text text-anchor="middle" x="431.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 34&#45;&gt;40 -->
<g id="edge40" class="edge">
<title>34&#45;&gt;40</title>
<path fill="none" stroke="#000000" d="M394.8448,-254.9748C401.0692,-247.5923 410.7417,-236.1203 418.5881,-226.8142"/>
<polygon fill="#000000" stroke="#000000" points="421.359,-228.9574 425.1292,-219.0561 416.0073,-224.4452 421.359,-228.9574"/>
</g>
<!-- 36 -->
<g id="node37" class="node">
<title>36</title>
<text text-anchor="middle" x="345.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 35&#45;&gt;36 -->
<g id="edge36" class="edge">
<title>35&#45;&gt;36</title>
<path fill="none" stroke="#000000" d="M345.5,-203.9748C345.5,-197.195 345.5,-186.966 345.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="349.0001,-178.0561 345.5,-168.0561 342.0001,-178.0561 349.0001,-178.0561"/>
</g>
<!-- 37 -->
<g id="node38" class="node">
<title>37</title>
<text text-anchor="middle" x="345.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;number&gt;</text>
</g>
<!-- 36&#45;&gt;37 -->
<g id="edge37" class="edge">
<title>36&#45;&gt;37</title>
<path fill="none" stroke="#000000" d="M345.5,-152.9748C345.5,-146.195 345.5,-135.966 345.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="349.0001,-127.0561 345.5,-117.0561 342.0001,-127.0561 349.0001,-127.0561"/>
</g>
<!-- 38 -->
<g id="node39" class="node">
<title>38</title>
<text text-anchor="middle" x="345.5" y="-54.8" font-family="Times,serif" font-size="14.00" fill="#000000">4</text>
</g>
<!-- 37&#45;&gt;38 -->
<g id="edge38" class="edge">
<title>37&#45;&gt;38</title>
<path fill="none" stroke="#000000" d="M345.5,-101.9748C345.5,-95.195 345.5,-84.966 345.5,-76.1331"/>
<polygon fill="#000000" stroke="#000000" points="349.0001,-76.0561 345.5,-66.0561 342.0001,-76.0561 349.0001,-76.0561"/>
</g>
<!-- 41 -->
<g id="node42" class="node">
<title>41</title>
<text text-anchor="middle" x="431.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 40&#45;&gt;41 -->
<g id="edge41" class="edge">
<title>40&#45;&gt;41</title>
<path fill="none" stroke="#000000" d="M431.5,-203.9748C431.5,-197.195 431.5,-186.966 431.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="435.0001,-178.0561 431.5,-168.0561 428.0001,-178.0561 435.0001,-178.0561"/>
</g>
<!-- 42 -->
<g id="node43" class="node">
<title>42</title>
<text text-anchor="middle" x="431.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 41&#45;&gt;42 -->
<g id="edge42" class="edge">
<title>41&#45;&gt;42</title>
<path fill="none" stroke="#000000" d="M431.5,-152.9748C431.5,-146.195 431.5,-135.966 431.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="435.0001,-127.0561 431.5,-117.0561 428.0001,-127.0561 435.0001,-127.0561"/>
</g>
<!-- 43 -->
<g id="node44" class="node">
<title>43</title>
<text text-anchor="middle" x="431.5" y="-54.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;number&gt;</text>
</g>
<!-- 42&#45;&gt;43 -->
<g id="edge43" class="edge">
<title>42&#45;&gt;43</title>
<path fill="none" stroke="#000000" d="M431.5,-101.9748C431.5,-95.195 431.5,-84.966 431.5,-76.1331"/>
<polygon fill="#000000" stroke="#000000" points="435.0001,-76.0561 431.5,-66.0561 428.0001,-76.0561 435.0001,-76.0561"/>
</g>
<!-- 44 -->
<g id="node45" class="node">
<title>44</title>
<text text-anchor="middle" x="431.5" y="-3.8" font-family="Times,serif" font-size="14.00" fill="#000000">300</text>
</g>
<!-- 43&#45;&gt;44 -->
<g id="edge44" class="edge">
<title>43&#45;&gt;44</title>
<path fill="none" stroke="#000000" d="M431.5,-50.9748C431.5,-44.195 431.5,-33.966 431.5,-25.1331"/>
<polygon fill="#000000" stroke="#000000" points="435.0001,-25.0561 431.5,-15.0561 428.0001,-25.0561 435.0001,-25.0561"/>
</g>
</g>
</svg>

</div>

</div>

</div>
</div>

</div><aside class="notes">

<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>We develop a <code>LangFuzzer</code> class that generates recombined inputs. To apply the <em>Langfuzz</em> approach, we need a few parsed strings.</p>

</div>
</div>
</div>
</aside><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[13]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">mystrings</span> <span class="o">=</span> <span class="p">[</span>
    <span class="s1">&#39;abc=12+(3+3.3)&#39;</span><span class="p">,</span>
    <span class="s1">&#39;a=1;b=2;c=a+b&#39;</span><span class="p">,</span>
    <span class="s1">&#39;avar=1.3;bvar=avar-3*(4+300)&#39;</span><span class="p">,</span>
    <span class="s1">&#39;a=1.3;b=a-1*(4+3+(2/a))&#39;</span><span class="p">,</span>
    <span class="s1">&#39;a=10;b=20;c=34;d=-b+(b*b-4*a*c)/(2*a)&#39;</span><span class="p">,</span>
    <span class="s1">&#39;x=10;y=20;z=(x+y)*(x-y)&#39;</span><span class="p">,</span>
    <span class="s1">&#39;x=23;y=51;z=x*x-y*y&#39;</span><span class="p">,</span>
<span class="p">]</span>
</pre></div>

    </div>
</div>
</div>

</div><aside class="notes">

<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>We recurse through any given tree, collecting parsed fragments corresponding to each nonterminal. Further, we also name each node so that we can address each node separately.</p>

</div>
</div>
</div>
</aside></div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[15]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="k">class</span> <span class="nc">LangFuzzer</span><span class="p">(</span><span class="n">Fuzzer</span><span class="p">):</span>
    <span class="k">def</span> <span class="nf">__init__</span><span class="p">(</span><span class="bp">self</span><span class="p">,</span> <span class="n">parser</span><span class="p">):</span>
        <span class="bp">self</span><span class="o">.</span><span class="n">parser</span> <span class="o">=</span> <span class="n">parser</span>
        <span class="bp">self</span><span class="o">.</span><span class="n">fragments</span> <span class="o">=</span> <span class="p">{</span><span class="n">k</span><span class="p">:</span> <span class="p">[]</span> <span class="k">for</span> <span class="n">k</span> <span class="ow">in</span> <span class="bp">self</span><span class="o">.</span><span class="n">parser</span><span class="o">.</span><span class="n">cgrammar</span><span class="p">}</span>

    <span class="k">def</span> <span class="nf">traverse_tree</span><span class="p">(</span><span class="bp">self</span><span class="p">,</span> <span class="n">node</span><span class="p">):</span>
        <span class="n">counter</span> <span class="o">=</span> <span class="mi">1</span>
        <span class="n">nodes</span> <span class="o">=</span> <span class="p">{}</span>

        <span class="k">def</span> <span class="nf">helper</span><span class="p">(</span><span class="n">node</span><span class="p">,</span> <span class="nb">id</span><span class="p">):</span>
            <span class="k">nonlocal</span> <span class="n">counter</span>
            <span class="n">name</span><span class="p">,</span> <span class="n">children</span> <span class="o">=</span> <span class="n">node</span>
            <span class="n">new_children</span> <span class="o">=</span> <span class="p">[]</span>
            <span class="n">nodes</span><span class="p">[</span><span class="nb">id</span><span class="p">]</span> <span class="o">=</span> <span class="n">node</span>
            <span class="k">for</span> <span class="n">child</span> <span class="ow">in</span> <span class="n">children</span><span class="p">:</span>
                <span class="n">counter</span> <span class="o">+=</span> <span class="mi">1</span>
                <span class="n">new_children</span><span class="o">.</span><span class="n">append</span><span class="p">(</span><span class="n">helper</span><span class="p">(</span><span class="n">child</span><span class="p">,</span> <span class="n">counter</span><span class="p">))</span>
            <span class="k">return</span> <span class="n">name</span><span class="p">,</span> <span class="n">new_children</span><span class="p">,</span> <span class="nb">id</span>

        <span class="k">return</span> <span class="n">helper</span><span class="p">(</span><span class="n">node</span><span class="p">,</span> <span class="n">counter</span><span class="p">),</span> <span class="n">nodes</span>

    <span class="k">def</span> <span class="nf">fragment</span><span class="p">(</span><span class="bp">self</span><span class="p">,</span> <span class="n">strings</span><span class="p">):</span>
        <span class="bp">self</span><span class="o">.</span><span class="n">trees</span> <span class="o">=</span> <span class="p">[]</span>
        <span class="k">for</span> <span class="n">string</span> <span class="ow">in</span> <span class="n">strings</span><span class="p">:</span>
            <span class="k">for</span> <span class="n">tree</span> <span class="ow">in</span> <span class="bp">self</span><span class="o">.</span><span class="n">parser</span><span class="o">.</span><span class="n">parse</span><span class="p">(</span><span class="n">string</span><span class="p">):</span>
                <span class="n">tree</span><span class="p">,</span> <span class="n">nodes</span> <span class="o">=</span> <span class="bp">self</span><span class="o">.</span><span class="n">traverse_tree</span><span class="p">(</span><span class="n">tree</span><span class="p">)</span>
                <span class="bp">self</span><span class="o">.</span><span class="n">trees</span><span class="o">.</span><span class="n">append</span><span class="p">((</span><span class="n">tree</span><span class="p">,</span> <span class="n">nodes</span><span class="p">))</span>
                <span class="k">for</span> <span class="n">node</span> <span class="ow">in</span> <span class="n">nodes</span><span class="p">:</span>
                    <span class="n">symbol</span> <span class="o">=</span> <span class="n">nodes</span><span class="p">[</span><span class="n">node</span><span class="p">][</span><span class="mi">0</span><span class="p">]</span>
                    <span class="k">if</span> <span class="n">symbol</span> <span class="ow">in</span> <span class="bp">self</span><span class="o">.</span><span class="n">fragments</span><span class="p">:</span>
                        <span class="bp">self</span><span class="o">.</span><span class="n">fragments</span><span class="p">[</span><span class="n">symbol</span><span class="p">]</span><span class="o">.</span><span class="n">append</span><span class="p">(</span><span class="n">nodes</span><span class="p">[</span><span class="n">node</span><span class="p">])</span>
        <span class="k">return</span> <span class="bp">self</span><span class="o">.</span><span class="n">fragments</span>
</pre></div>

    </div>
</div>
</div>

</div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[16]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">lf</span> <span class="o">=</span> <span class="n">LangFuzzer</span><span class="p">(</span><span class="n">PEGParser</span><span class="p">(</span><span class="n">VAR_GRAMMAR</span><span class="p">,</span> <span class="n">tokens</span><span class="o">=</span><span class="n">VAR_TOKENS</span><span class="p">))</span>
<span class="n">fragments</span> <span class="o">=</span> <span class="n">lf</span><span class="o">.</span><span class="n">fragment</span><span class="p">(</span><span class="n">mystrings</span><span class="p">)</span>
<span class="k">for</span> <span class="n">key</span> <span class="ow">in</span> <span class="n">fragments</span><span class="p">:</span>
    <span class="nb">print</span><span class="p">(</span><span class="s2">&quot;</span><span class="si">%s</span><span class="s2">: </span><span class="si">%d</span><span class="s2">&quot;</span> <span class="o">%</span> <span class="p">(</span><span class="n">key</span><span class="p">,</span> <span class="nb">len</span><span class="p">(</span><span class="n">fragments</span><span class="p">[</span><span class="n">key</span><span class="p">])))</span>
</pre></div>

    </div>
</div>
</div>

<div class="output_wrapper">
<div class="output">


<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>&lt;start&gt;: 7
&lt;statements&gt;: 18
&lt;statement&gt;: 18
&lt;assignment&gt;: 18
&lt;identifier&gt;: 37
&lt;word&gt;: 0
&lt;alpha&gt;: 0
&lt;expr&gt;: 39
&lt;term&gt;: 50
&lt;factor&gt;: 51
&lt;number&gt;: 23
&lt;integer&gt;: 0
&lt;digit&gt;: 0
</pre>
</div>
</div>

</div>
</div>

</div><aside class="notes">

<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>All that remains is to actually find a place to poke a hole using <code>candidate()</code>, and patch that hole using <code>generate_new_tree()</code>. We will explain how to do this next.</p>
<p>But before that, we update our <code>initialization</code> method with a call to `fragment().</p>

</div>
</div>
</div>
</aside></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[17]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="kn">import</span> <span class="nn">random</span>
</pre></div>

    </div>
</div>
</div>

</div><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[18]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="k">class</span> <span class="nc">LangFuzzer</span><span class="p">(</span><span class="n">LangFuzzer</span><span class="p">):</span>
    <span class="k">def</span> <span class="nf">__init__</span><span class="p">(</span><span class="bp">self</span><span class="p">,</span> <span class="n">parser</span><span class="p">,</span> <span class="n">strings</span><span class="p">):</span>
        <span class="bp">self</span><span class="o">.</span><span class="n">parser</span> <span class="o">=</span> <span class="n">parser</span>
        <span class="bp">self</span><span class="o">.</span><span class="n">fragments</span> <span class="o">=</span> <span class="p">{</span><span class="n">k</span><span class="p">:</span> <span class="p">[]</span> <span class="k">for</span> <span class="n">k</span> <span class="ow">in</span> <span class="bp">self</span><span class="o">.</span><span class="n">parser</span><span class="o">.</span><span class="n">cgrammar</span><span class="p">}</span>
        <span class="bp">self</span><span class="o">.</span><span class="n">fragment</span><span class="p">(</span><span class="n">strings</span><span class="p">)</span>
</pre></div>

    </div>
</div>
</div>

</div></div></section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<h4 id="Candidate">Candidate<a class="anchor-link" href="#Candidate">&#182;</a></h4><p><code>LangFuzzer</code> accepts a list of strings, which are stored as derivation trees in the object.</p>
<p>The method <code>candidate()</code> chooses one of the derivation trees randomly as the template, and identifies a node such that it can be replaced by another node that is different from itself. That is, it chooses a node such that, if the non-terminal name of the node is <code>node_type</code>, there is at least one other entry in <code>fragment[node_type])</code></p>

</div>
</div>
</div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[19]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="k">class</span> <span class="nc">LangFuzzer</span><span class="p">(</span><span class="n">LangFuzzer</span><span class="p">):</span>
    <span class="k">def</span> <span class="nf">candidate</span><span class="p">(</span><span class="bp">self</span><span class="p">):</span>
        <span class="n">tree</span><span class="p">,</span> <span class="n">nodes</span> <span class="o">=</span> <span class="n">random</span><span class="o">.</span><span class="n">choice</span><span class="p">(</span><span class="bp">self</span><span class="o">.</span><span class="n">trees</span><span class="p">)</span>
        <span class="n">interesting_nodes</span> <span class="o">=</span> <span class="p">[</span>
            <span class="n">n</span> <span class="k">for</span> <span class="n">n</span> <span class="ow">in</span> <span class="n">nodes</span> <span class="k">if</span> <span class="n">nodes</span><span class="p">[</span><span class="n">n</span><span class="p">][</span><span class="mi">0</span><span class="p">]</span> <span class="ow">in</span> <span class="bp">self</span><span class="o">.</span><span class="n">fragments</span>
            <span class="ow">and</span> <span class="nb">len</span><span class="p">(</span><span class="bp">self</span><span class="o">.</span><span class="n">fragments</span><span class="p">[</span><span class="n">nodes</span><span class="p">[</span><span class="n">n</span><span class="p">][</span><span class="mi">0</span><span class="p">]])</span> <span class="o">&gt;</span> <span class="mi">1</span>
        <span class="p">]</span>
        <span class="n">node</span> <span class="o">=</span> <span class="n">random</span><span class="o">.</span><span class="n">choice</span><span class="p">(</span><span class="n">interesting_nodes</span><span class="p">)</span>
        <span class="k">return</span> <span class="n">tree</span><span class="p">,</span> <span class="n">node</span>
</pre></div>

    </div>
</div>
</div>

</div><div class="fragment">
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>Here is how it is used -- the <em>red</em> node is the node chosen.</p>

</div>
</div>
</div></div><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[20]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">random</span><span class="o">.</span><span class="n">seed</span><span class="p">(</span><span class="mi">1</span><span class="p">)</span>
<span class="n">lf</span> <span class="o">=</span> <span class="n">LangFuzzer</span><span class="p">(</span><span class="n">PEGParser</span><span class="p">(</span><span class="n">VAR_GRAMMAR</span><span class="p">,</span> <span class="n">tokens</span><span class="o">=</span><span class="n">VAR_TOKENS</span><span class="p">),</span> <span class="n">mystrings</span><span class="p">)</span>
<span class="n">tree</span><span class="p">,</span> <span class="n">node</span> <span class="o">=</span> <span class="n">lf</span><span class="o">.</span><span class="n">candidate</span><span class="p">()</span>
</pre></div>

    </div>
</div>
</div>

</div></div><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[21]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="k">def</span> <span class="nf">hl_predicate</span><span class="p">(</span><span class="n">_d</span><span class="p">,</span> <span class="n">nid</span><span class="p">,</span> <span class="n">_s</span><span class="p">,</span> <span class="n">_a</span><span class="p">):</span> <span class="k">return</span> <span class="n">nid</span> <span class="ow">in</span> <span class="p">{</span><span class="n">node</span><span class="p">}</span>
</pre></div>

    </div>
</div>
</div>

</div></div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[22]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">display_tree</span><span class="p">(</span><span class="n">tree</span><span class="p">,</span> <span class="n">node_attr</span><span class="o">=</span><span class="n">highlight_node</span><span class="p">(</span><span class="n">hl_predicate</span><span class="p">))</span>
</pre></div>

    </div>
</div>
</div>

<div class="output_wrapper">
<div class="output">


<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Generated by graphviz version 2.40.1 (20161225.0304)
 -->
<!-- Title: %3 Pages: 1 -->
<svg width="511pt" height="584pt"
 viewBox="0.00 0.00 511.00 584.00" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="scale(1 1) rotate(0) translate(4 580)">
<title>%3</title>
<polygon fill="#ffffff" stroke="transparent" points="-4,4 -4,-580 507,-580 507,4 -4,4"/>
<!-- 0 -->
<g id="node1" class="node">
<title>0</title>
<text text-anchor="middle" x="198.5" y="-564.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;start&gt;</text>
</g>
<!-- 1 -->
<g id="node2" class="node">
<title>1</title>
<text text-anchor="middle" x="198.5" y="-513.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statements&gt;</text>
</g>
<!-- 0&#45;&gt;1 -->
<g id="edge1" class="edge">
<title>0&#45;&gt;1</title>
<path fill="none" stroke="#000000" d="M198.5,-560.9748C198.5,-554.195 198.5,-543.966 198.5,-535.1331"/>
<polygon fill="#000000" stroke="#000000" points="202.0001,-535.0561 198.5,-525.0561 195.0001,-535.0561 202.0001,-535.0561"/>
</g>
<!-- 2 -->
<g id="node3" class="node">
<title>2</title>
<text text-anchor="middle" x="134.5" y="-462.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statement&gt;</text>
</g>
<!-- 1&#45;&gt;2 -->
<g id="edge2" class="edge">
<title>1&#45;&gt;2</title>
<path fill="none" stroke="#000000" d="M189.0566,-509.9748C179.3197,-502.2157 163.9137,-489.939 151.9526,-480.4075"/>
<polygon fill="#000000" stroke="#000000" points="153.984,-477.551 143.9822,-474.0561 149.6216,-483.0254 153.984,-477.551"/>
</g>
<!-- 12 -->
<g id="node13" class="node">
<title>12</title>
<text text-anchor="middle" x="198.5" y="-462.8" font-family="Times,serif" font-size="14.00" fill="#000000">;</text>
</g>
<!-- 1&#45;&gt;12 -->
<g id="edge12" class="edge">
<title>1&#45;&gt;12</title>
<path fill="none" stroke="#000000" d="M198.5,-509.9748C198.5,-503.195 198.5,-492.966 198.5,-484.1331"/>
<polygon fill="#000000" stroke="#000000" points="202.0001,-484.0561 198.5,-474.0561 195.0001,-484.0561 202.0001,-484.0561"/>
</g>
<!-- 13 -->
<g id="node14" class="node">
<title>13</title>
<text text-anchor="middle" x="260.5" y="-462.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statements&gt;</text>
</g>
<!-- 1&#45;&gt;13 -->
<g id="edge13" class="edge">
<title>1&#45;&gt;13</title>
<path fill="none" stroke="#000000" d="M207.6483,-509.9748C216.9894,-502.291 231.7162,-490.177 243.2544,-480.6859"/>
<polygon fill="#000000" stroke="#000000" points="245.8147,-483.1119 251.3142,-474.0561 241.3678,-477.7058 245.8147,-483.1119"/>
</g>
<!-- 3 -->
<g id="node4" class="node">
<title>3</title>
<text text-anchor="middle" x="117.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;assignment&gt;</text>
</g>
<!-- 2&#45;&gt;3 -->
<g id="edge3" class="edge">
<title>2&#45;&gt;3</title>
<path fill="none" stroke="#000000" d="M131.9916,-458.9748C129.6814,-452.0443 126.1699,-441.5097 123.1821,-432.5464"/>
<polygon fill="#000000" stroke="#000000" points="126.5014,-431.4361 120.0187,-423.0561 119.8607,-433.6498 126.5014,-431.4361"/>
</g>
<!-- 4 -->
<g id="node5" class="node">
<title>4</title>
<text text-anchor="middle" x="33.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;identifier&gt;</text>
</g>
<!-- 3&#45;&gt;4 -->
<g id="edge4" class="edge">
<title>3&#45;&gt;4</title>
<path fill="none" stroke="#000000" d="M105.1055,-407.9748C91.8295,-399.9143 70.5237,-386.9787 54.5986,-377.3099"/>
<polygon fill="#000000" stroke="#000000" points="56.3097,-374.2542 45.9453,-372.0561 52.6768,-380.2377 56.3097,-374.2542"/>
</g>
<!-- 6 -->
<g id="node7" class="node">
<title>6</title>
<text text-anchor="middle" x="89.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">=</text>
</g>
<!-- 3&#45;&gt;6 -->
<g id="edge6" class="edge">
<title>3&#45;&gt;6</title>
<path fill="none" stroke="#000000" d="M113.3685,-407.9748C109.4808,-400.8936 103.5274,-390.05 98.5391,-380.9641"/>
<polygon fill="#000000" stroke="#000000" points="101.5291,-379.1375 93.6484,-372.0561 95.3931,-382.5063 101.5291,-379.1375"/>
</g>
<!-- 7 -->
<g id="node8" class="node">
<title>7</title>
<text text-anchor="middle" x="132.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 3&#45;&gt;7 -->
<g id="edge7" class="edge">
<title>3&#45;&gt;7</title>
<path fill="none" stroke="#000000" d="M119.7133,-407.9748C121.7295,-401.1196 124.7829,-390.7383 127.4002,-381.8392"/>
<polygon fill="#000000" stroke="#000000" points="130.8137,-382.6374 130.2776,-372.0561 124.0981,-380.6622 130.8137,-382.6374"/>
</g>
<!-- 5 -->
<g id="node6" class="node">
<title>5</title>
<text text-anchor="middle" x="33.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">a</text>
</g>
<!-- 4&#45;&gt;5 -->
<g id="edge5" class="edge">
<title>4&#45;&gt;5</title>
<path fill="none" stroke="#000000" d="M33.5,-356.9748C33.5,-350.195 33.5,-339.966 33.5,-331.1331"/>
<polygon fill="#000000" stroke="#000000" points="37.0001,-331.0561 33.5,-321.0561 30.0001,-331.0561 37.0001,-331.0561"/>
</g>
<!-- 8 -->
<g id="node9" class="node">
<title>8</title>
<text text-anchor="middle" x="95.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 7&#45;&gt;8 -->
<g id="edge8" class="edge">
<title>7&#45;&gt;8</title>
<path fill="none" stroke="#000000" d="M127.0405,-356.9748C121.7939,-349.743 113.7002,-338.5868 107.0256,-329.3866"/>
<polygon fill="#000000" stroke="#000000" points="109.6872,-327.095 100.9819,-321.0561 104.0212,-331.2056 109.6872,-327.095"/>
</g>
<!-- 9 -->
<g id="node10" class="node">
<title>9</title>
<text text-anchor="middle" x="95.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 8&#45;&gt;9 -->
<g id="edge9" class="edge">
<title>8&#45;&gt;9</title>
<path fill="none" stroke="#000000" d="M95.5,-305.9748C95.5,-299.195 95.5,-288.966 95.5,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="99.0001,-280.0561 95.5,-270.0561 92.0001,-280.0561 99.0001,-280.0561"/>
</g>
<!-- 10 -->
<g id="node11" class="node">
<title>10</title>
<text text-anchor="middle" x="95.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;number&gt;</text>
</g>
<!-- 9&#45;&gt;10 -->
<g id="edge10" class="edge">
<title>9&#45;&gt;10</title>
<path fill="none" stroke="#000000" d="M95.5,-254.9748C95.5,-248.195 95.5,-237.966 95.5,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="99.0001,-229.0561 95.5,-219.0561 92.0001,-229.0561 99.0001,-229.0561"/>
</g>
<!-- 11 -->
<g id="node12" class="node">
<title>11</title>
<text text-anchor="middle" x="95.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">1</text>
</g>
<!-- 10&#45;&gt;11 -->
<g id="edge11" class="edge">
<title>10&#45;&gt;11</title>
<path fill="none" stroke="#000000" d="M95.5,-203.9748C95.5,-197.195 95.5,-186.966 95.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="99.0001,-178.0561 95.5,-168.0561 92.0001,-178.0561 99.0001,-178.0561"/>
</g>
<!-- 14 -->
<g id="node15" class="node">
<title>14</title>
<text text-anchor="middle" x="224.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statement&gt;</text>
</g>
<!-- 13&#45;&gt;14 -->
<g id="edge14" class="edge">
<title>13&#45;&gt;14</title>
<path fill="none" stroke="#000000" d="M255.1881,-458.9748C250.0833,-451.743 242.2084,-440.5868 235.7141,-431.3866"/>
<polygon fill="#000000" stroke="#000000" points="238.46,-429.2074 229.8337,-423.0561 232.7412,-433.2442 238.46,-429.2074"/>
</g>
<!-- 24 -->
<g id="node25" class="node">
<title>24</title>
<text text-anchor="middle" x="279.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">;</text>
</g>
<!-- 13&#45;&gt;24 -->
<g id="edge24" class="edge">
<title>13&#45;&gt;24</title>
<path fill="none" stroke="#000000" d="M263.3035,-458.9748C266.0635,-451.5663 270.3578,-440.0395 273.8313,-430.716"/>
<polygon fill="#000000" stroke="#000000" points="277.1793,-431.7547 277.3906,-421.162 270.6197,-429.3109 277.1793,-431.7547"/>
</g>
<!-- 25 -->
<g id="node26" class="node">
<title>25</title>
<text text-anchor="middle" x="339.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statements&gt;</text>
</g>
<!-- 13&#45;&gt;25 -->
<g id="edge25" class="edge">
<title>13&#45;&gt;25</title>
<path fill="none" stroke="#000000" d="M272.1567,-458.9748C284.5258,-450.9897 304.3062,-438.22 319.236,-428.5818"/>
<polygon fill="#000000" stroke="#000000" points="321.2923,-431.4203 327.7955,-423.0561 317.4957,-425.5393 321.2923,-431.4203"/>
</g>
<!-- 15 -->
<g id="node16" class="node">
<title>15</title>
<text text-anchor="middle" x="224.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;assignment&gt;</text>
</g>
<!-- 14&#45;&gt;15 -->
<g id="edge15" class="edge">
<title>14&#45;&gt;15</title>
<path fill="none" stroke="#000000" d="M224.5,-407.9748C224.5,-401.195 224.5,-390.966 224.5,-382.1331"/>
<polygon fill="#000000" stroke="#000000" points="228.0001,-382.0561 224.5,-372.0561 221.0001,-382.0561 228.0001,-382.0561"/>
</g>
<!-- 16 -->
<g id="node17" class="node">
<title>16</title>
<text text-anchor="middle" x="168.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;identifier&gt;</text>
</g>
<!-- 15&#45;&gt;16 -->
<g id="edge16" class="edge">
<title>15&#45;&gt;16</title>
<path fill="none" stroke="#000000" d="M216.237,-356.9748C207.8826,-349.3663 194.7586,-337.4141 184.384,-327.9658"/>
<polygon fill="#000000" stroke="#000000" points="186.547,-325.2017 176.7969,-321.0561 181.8337,-330.3771 186.547,-325.2017"/>
</g>
<!-- 18 -->
<g id="node19" class="node">
<title>18</title>
<text text-anchor="middle" x="224.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">=</text>
</g>
<!-- 15&#45;&gt;18 -->
<g id="edge18" class="edge">
<title>15&#45;&gt;18</title>
<path fill="none" stroke="#000000" d="M224.5,-356.9748C224.5,-350.195 224.5,-339.966 224.5,-331.1331"/>
<polygon fill="#000000" stroke="#000000" points="228.0001,-331.0561 224.5,-321.0561 221.0001,-331.0561 228.0001,-331.0561"/>
</g>
<!-- 19 -->
<g id="node20" class="node">
<title>19</title>
<text text-anchor="middle" x="267.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 15&#45;&gt;19 -->
<g id="edge19" class="edge">
<title>15&#45;&gt;19</title>
<path fill="none" stroke="#000000" d="M230.8448,-356.9748C237.0692,-349.5923 246.7417,-338.1203 254.5881,-328.8142"/>
<polygon fill="#000000" stroke="#000000" points="257.359,-330.9574 261.1292,-321.0561 252.0073,-326.4452 257.359,-330.9574"/>
</g>
<!-- 17 -->
<g id="node18" class="node">
<title>17</title>
<text text-anchor="middle" x="168.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">b</text>
</g>
<!-- 16&#45;&gt;17 -->
<g id="edge17" class="edge">
<title>16&#45;&gt;17</title>
<path fill="none" stroke="#000000" d="M168.5,-305.9748C168.5,-299.195 168.5,-288.966 168.5,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="172.0001,-280.0561 168.5,-270.0561 165.0001,-280.0561 172.0001,-280.0561"/>
</g>
<!-- 20 -->
<g id="node21" class="node">
<title>20</title>
<text text-anchor="middle" x="254.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 19&#45;&gt;20 -->
<g id="edge20" class="edge">
<title>19&#45;&gt;20</title>
<path fill="none" stroke="#000000" d="M265.5818,-305.9748C263.8344,-299.1196 261.1882,-288.7383 258.9198,-279.8392"/>
<polygon fill="#000000" stroke="#000000" points="262.2877,-278.8817 256.4261,-270.0561 255.5046,-280.6108 262.2877,-278.8817"/>
</g>
<!-- 21 -->
<g id="node22" class="node">
<title>21</title>
<text text-anchor="middle" x="254.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 20&#45;&gt;21 -->
<g id="edge21" class="edge">
<title>20&#45;&gt;21</title>
<path fill="none" stroke="#000000" d="M254.5,-254.9748C254.5,-248.195 254.5,-237.966 254.5,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="258.0001,-229.0561 254.5,-219.0561 251.0001,-229.0561 258.0001,-229.0561"/>
</g>
<!-- 22 -->
<g id="node23" class="node">
<title>22</title>
<text text-anchor="middle" x="254.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;number&gt;</text>
</g>
<!-- 21&#45;&gt;22 -->
<g id="edge22" class="edge">
<title>21&#45;&gt;22</title>
<path fill="none" stroke="#000000" d="M254.5,-203.9748C254.5,-197.195 254.5,-186.966 254.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="258.0001,-178.0561 254.5,-168.0561 251.0001,-178.0561 258.0001,-178.0561"/>
</g>
<!-- 23 -->
<g id="node24" class="node">
<title>23</title>
<text text-anchor="middle" x="254.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">2</text>
</g>
<!-- 22&#45;&gt;23 -->
<g id="edge23" class="edge">
<title>22&#45;&gt;23</title>
<path fill="none" stroke="#000000" d="M254.5,-152.9748C254.5,-146.195 254.5,-135.966 254.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="258.0001,-127.0561 254.5,-117.0561 251.0001,-127.0561 258.0001,-127.0561"/>
</g>
<!-- 26 -->
<g id="node27" class="node">
<title>26</title>
<text text-anchor="middle" x="343.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statement&gt;</text>
</g>
<!-- 25&#45;&gt;26 -->
<g id="edge26" class="edge">
<title>25&#45;&gt;26</title>
<path fill="none" stroke="#000000" d="M340.0902,-407.9748C340.622,-401.195 341.4242,-390.966 342.117,-382.1331"/>
<polygon fill="#000000" stroke="#000000" points="345.6146,-382.2992 342.9074,-372.0561 338.6361,-381.7518 345.6146,-382.2992"/>
</g>
<!-- 27 -->
<g id="node28" class="node">
<title>27</title>
<text text-anchor="middle" x="370.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;assignment&gt;</text>
</g>
<!-- 26&#45;&gt;27 -->
<g id="edge27" class="edge">
<title>26&#45;&gt;27</title>
<path fill="none" stroke="#000000" d="M347.4839,-356.9748C351.2328,-349.8936 356.9735,-339.05 361.7837,-329.9641"/>
<polygon fill="#000000" stroke="#000000" points="364.914,-331.5316 366.4997,-321.0561 358.7275,-328.2564 364.914,-331.5316"/>
</g>
<!-- 28 -->
<g id="node29" class="node">
<title>28</title>
<text text-anchor="middle" x="327.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;identifier&gt;</text>
</g>
<!-- 27&#45;&gt;28 -->
<g id="edge28" class="edge">
<title>27&#45;&gt;28</title>
<path fill="none" stroke="#000000" d="M364.1552,-305.9748C357.9308,-298.5923 348.2583,-287.1203 340.4119,-277.8142"/>
<polygon fill="#000000" stroke="#000000" points="342.9927,-275.4452 333.8708,-270.0561 337.641,-279.9574 342.9927,-275.4452"/>
</g>
<!-- 30 -->
<g id="node31" class="node">
<title>30</title>
<text text-anchor="middle" x="383.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">=</text>
</g>
<!-- 27&#45;&gt;30 -->
<g id="edge30" class="edge">
<title>27&#45;&gt;30</title>
<path fill="none" stroke="#000000" d="M372.4182,-305.9748C374.1656,-299.1196 376.8118,-288.7383 379.0802,-279.8392"/>
<polygon fill="#000000" stroke="#000000" points="382.4954,-280.6108 381.5739,-270.0561 375.7123,-278.8817 382.4954,-280.6108"/>
</g>
<!-- 31 -->
<g id="node32" class="node">
<title>31</title>
<text text-anchor="middle" x="426.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 27&#45;&gt;31 -->
<g id="edge31" class="edge">
<title>27&#45;&gt;31</title>
<path fill="none" stroke="#000000" d="M378.763,-305.9748C387.1174,-298.3663 400.2414,-286.4141 410.616,-276.9658"/>
<polygon fill="#000000" stroke="#000000" points="413.1663,-279.3771 418.2031,-270.0561 408.453,-274.2017 413.1663,-279.3771"/>
</g>
<!-- 29 -->
<g id="node30" class="node">
<title>29</title>
<text text-anchor="middle" x="327.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">c</text>
</g>
<!-- 28&#45;&gt;29 -->
<g id="edge29" class="edge">
<title>28&#45;&gt;29</title>
<path fill="none" stroke="#000000" d="M327.5,-254.9748C327.5,-248.195 327.5,-237.966 327.5,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="331.0001,-229.0561 327.5,-219.0561 324.0001,-229.0561 331.0001,-229.0561"/>
</g>
<!-- 32 -->
<g id="node33" class="node">
<title>32</title>
<text text-anchor="middle" x="383.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 31&#45;&gt;32 -->
<g id="edge32" class="edge">
<title>31&#45;&gt;32</title>
<path fill="none" stroke="#000000" d="M420.1552,-254.9748C413.9308,-247.5923 404.2583,-236.1203 396.4119,-226.8142"/>
<polygon fill="#000000" stroke="#000000" points="398.9927,-224.4452 389.8708,-219.0561 393.641,-228.9574 398.9927,-224.4452"/>
</g>
<!-- 36 -->
<g id="node37" class="node">
<title>36</title>
<text text-anchor="middle" x="426.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">+</text>
</g>
<!-- 31&#45;&gt;36 -->
<g id="edge36" class="edge">
<title>31&#45;&gt;36</title>
<path fill="none" stroke="#000000" d="M426.5,-254.9748C426.5,-248.195 426.5,-237.966 426.5,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="430.0001,-229.0561 426.5,-219.0561 423.0001,-229.0561 430.0001,-229.0561"/>
</g>
<!-- 37 -->
<g id="node38" class="node">
<title>37</title>
<text text-anchor="middle" x="469.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 31&#45;&gt;37 -->
<g id="edge37" class="edge">
<title>31&#45;&gt;37</title>
<path fill="none" stroke="#000000" d="M432.8448,-254.9748C439.0692,-247.5923 448.7417,-236.1203 456.5881,-226.8142"/>
<polygon fill="#000000" stroke="#000000" points="459.359,-228.9574 463.1292,-219.0561 454.0073,-224.4452 459.359,-228.9574"/>
</g>
<!-- 33 -->
<g id="node34" class="node">
<title>33</title>
<text text-anchor="middle" x="383.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 32&#45;&gt;33 -->
<g id="edge33" class="edge">
<title>32&#45;&gt;33</title>
<path fill="none" stroke="#000000" d="M383.5,-203.9748C383.5,-197.195 383.5,-186.966 383.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="387.0001,-178.0561 383.5,-168.0561 380.0001,-178.0561 387.0001,-178.0561"/>
</g>
<!-- 34 -->
<g id="node35" class="node">
<title>34</title>
<text text-anchor="middle" x="383.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;identifier&gt;</text>
</g>
<!-- 33&#45;&gt;34 -->
<g id="edge34" class="edge">
<title>33&#45;&gt;34</title>
<path fill="none" stroke="#000000" d="M383.5,-152.9748C383.5,-146.195 383.5,-135.966 383.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="387.0001,-127.0561 383.5,-117.0561 380.0001,-127.0561 387.0001,-127.0561"/>
</g>
<!-- 35 -->
<g id="node36" class="node">
<title>35</title>
<text text-anchor="middle" x="383.5" y="-54.8" font-family="Times,serif" font-size="14.00" fill="#000000">a</text>
</g>
<!-- 34&#45;&gt;35 -->
<g id="edge35" class="edge">
<title>34&#45;&gt;35</title>
<path fill="none" stroke="#000000" d="M383.5,-101.9748C383.5,-95.195 383.5,-84.966 383.5,-76.1331"/>
<polygon fill="#000000" stroke="#000000" points="387.0001,-76.0561 383.5,-66.0561 380.0001,-76.0561 387.0001,-76.0561"/>
</g>
<!-- 38 -->
<g id="node39" class="node">
<title>38</title>
<text text-anchor="middle" x="469.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 37&#45;&gt;38 -->
<g id="edge38" class="edge">
<title>37&#45;&gt;38</title>
<path fill="none" stroke="#000000" d="M469.5,-203.9748C469.5,-197.195 469.5,-186.966 469.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="473.0001,-178.0561 469.5,-168.0561 466.0001,-178.0561 473.0001,-178.0561"/>
</g>
<!-- 39 -->
<g id="node40" class="node">
<title>39</title>
<text text-anchor="middle" x="469.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 38&#45;&gt;39 -->
<g id="edge39" class="edge">
<title>38&#45;&gt;39</title>
<path fill="none" stroke="#000000" d="M469.5,-152.9748C469.5,-146.195 469.5,-135.966 469.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="473.0001,-127.0561 469.5,-117.0561 466.0001,-127.0561 473.0001,-127.0561"/>
</g>
<!-- 40 -->
<g id="node41" class="node">
<title>40</title>
<text text-anchor="middle" x="469.5" y="-54.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;identifier&gt;</text>
</g>
<!-- 39&#45;&gt;40 -->
<g id="edge40" class="edge">
<title>39&#45;&gt;40</title>
<path fill="none" stroke="#000000" d="M469.5,-101.9748C469.5,-95.195 469.5,-84.966 469.5,-76.1331"/>
<polygon fill="#000000" stroke="#000000" points="473.0001,-76.0561 469.5,-66.0561 466.0001,-76.0561 473.0001,-76.0561"/>
</g>
<!-- 41 -->
<g id="node42" class="node">
<title>41</title>
<text text-anchor="middle" x="469.5" y="-3.8" font-family="Times,serif" font-size="14.00" fill="#000000">b</text>
</g>
<!-- 40&#45;&gt;41 -->
<g id="edge41" class="edge">
<title>40&#45;&gt;41</title>
<path fill="none" stroke="#000000" d="M469.5,-50.9748C469.5,-44.195 469.5,-33.966 469.5,-25.1331"/>
<polygon fill="#000000" stroke="#000000" points="473.0001,-25.0561 469.5,-15.0561 466.0001,-25.0561 473.0001,-25.0561"/>
</g>
</g>
</svg>

</div>

</div>

</div>
</div>

</div></section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<h4 id="Generate-New-Tree">Generate New Tree<a class="anchor-link" href="#Generate-New-Tree">&#182;</a></h4><p>Once we have identified the node, one can generate a new tree by replacing that node with another node of similar type from our fragment pool.</p>

</div>
</div>
</div><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[23]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="k">class</span> <span class="nc">LangFuzzer</span><span class="p">(</span><span class="n">LangFuzzer</span><span class="p">):</span>
    <span class="k">def</span> <span class="nf">generate_new_tree</span><span class="p">(</span><span class="bp">self</span><span class="p">,</span> <span class="n">node</span><span class="p">,</span> <span class="n">choice</span><span class="p">):</span>
        <span class="n">name</span><span class="p">,</span> <span class="n">children</span><span class="p">,</span> <span class="nb">id</span> <span class="o">=</span> <span class="n">node</span>
        <span class="k">if</span> <span class="nb">id</span> <span class="o">==</span> <span class="n">choice</span><span class="p">:</span>
            <span class="k">return</span> <span class="n">random</span><span class="o">.</span><span class="n">choice</span><span class="p">(</span><span class="bp">self</span><span class="o">.</span><span class="n">fragments</span><span class="p">[</span><span class="n">name</span><span class="p">])</span>
        <span class="k">else</span><span class="p">:</span>
            <span class="k">return</span> <span class="p">(</span><span class="n">name</span><span class="p">,</span> <span class="p">[</span><span class="bp">self</span><span class="o">.</span><span class="n">generate_new_tree</span><span class="p">(</span><span class="n">c</span><span class="p">,</span> <span class="n">choice</span><span class="p">)</span>
                           <span class="k">for</span> <span class="n">c</span> <span class="ow">in</span> <span class="n">children</span><span class="p">])</span>
</pre></div>

    </div>
</div>
</div>

</div></div><div class="fragment">
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>Again, the red node indicates where the replacement has occurred.</p>

</div>
</div>
</div></div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[24]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">random</span><span class="o">.</span><span class="n">seed</span><span class="p">(</span><span class="mi">1</span><span class="p">)</span>
<span class="n">lf</span> <span class="o">=</span> <span class="n">LangFuzzer</span><span class="p">(</span><span class="n">PEGParser</span><span class="p">(</span><span class="n">VAR_GRAMMAR</span><span class="p">,</span> <span class="n">tokens</span><span class="o">=</span><span class="n">VAR_TOKENS</span><span class="p">),</span> <span class="n">mystrings</span><span class="p">)</span>
<span class="n">tree</span><span class="p">,</span> <span class="n">node</span> <span class="o">=</span> <span class="n">lf</span><span class="o">.</span><span class="n">candidate</span><span class="p">()</span>
</pre></div>

    </div>
</div>
</div>

</div><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[25]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="k">def</span> <span class="nf">hl_predicate</span><span class="p">(</span><span class="n">_d</span><span class="p">,</span> <span class="n">nid</span><span class="p">,</span> <span class="n">_s</span><span class="p">,</span> <span class="n">_a</span><span class="p">):</span> <span class="k">return</span> <span class="n">nid</span> <span class="ow">in</span> <span class="p">{</span><span class="n">node</span><span class="p">}</span>
</pre></div>

    </div>
</div>
</div>

</div></div><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[27]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">new_tree</span> <span class="o">=</span> <span class="n">lf</span><span class="o">.</span><span class="n">generate_new_tree</span><span class="p">(</span><span class="n">tree</span><span class="p">,</span> <span class="n">node</span><span class="p">)</span>
<span class="k">for</span> <span class="n">s</span> <span class="ow">in</span> <span class="p">[</span><span class="n">tree_to_string</span><span class="p">(</span><span class="n">i</span><span class="p">)</span> <span class="k">for</span> <span class="n">i</span> <span class="ow">in</span> <span class="p">[</span><span class="n">tree</span><span class="p">,</span> <span class="n">new_tree</span><span class="p">]]:</span>
    <span class="nb">print</span><span class="p">(</span><span class="n">s</span><span class="p">)</span>
<span class="n">display_tree</span><span class="p">(</span><span class="n">new_tree</span><span class="p">,</span> <span class="n">node_attr</span><span class="o">=</span><span class="n">highlight_node</span><span class="p">(</span><span class="n">hl_predicate</span><span class="p">))</span>
</pre></div>

    </div>
</div>
</div>

<div class="output_wrapper">
<div class="output">


<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>a=1;b=2;c=a+b
a=1;b=2;b=2
</pre>
</div>
</div>

<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Generated by graphviz version 2.40.1 (20161225.0304)
 -->
<!-- Title: %3 Pages: 1 -->
<svg width="464pt" height="533pt"
 viewBox="0.00 0.00 464.00 533.00" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="scale(1 1) rotate(0) translate(4 529)">
<title>%3</title>
<polygon fill="#ffffff" stroke="transparent" points="-4,4 -4,-529 460,-529 460,4 -4,4"/>
<!-- 0 -->
<g id="node1" class="node">
<title>0</title>
<text text-anchor="middle" x="198.5" y="-513.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;start&gt;</text>
</g>
<!-- 1 -->
<g id="node2" class="node">
<title>1</title>
<text text-anchor="middle" x="198.5" y="-462.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statements&gt;</text>
</g>
<!-- 0&#45;&gt;1 -->
<g id="edge1" class="edge">
<title>0&#45;&gt;1</title>
<path fill="none" stroke="#000000" d="M198.5,-509.9748C198.5,-503.195 198.5,-492.966 198.5,-484.1331"/>
<polygon fill="#000000" stroke="#000000" points="202.0001,-484.0561 198.5,-474.0561 195.0001,-484.0561 202.0001,-484.0561"/>
</g>
<!-- 2 -->
<g id="node3" class="node">
<title>2</title>
<text text-anchor="middle" x="134.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statement&gt;</text>
</g>
<!-- 1&#45;&gt;2 -->
<g id="edge2" class="edge">
<title>1&#45;&gt;2</title>
<path fill="none" stroke="#000000" d="M189.0566,-458.9748C179.3197,-451.2157 163.9137,-438.939 151.9526,-429.4075"/>
<polygon fill="#000000" stroke="#000000" points="153.984,-426.551 143.9822,-423.0561 149.6216,-432.0254 153.984,-426.551"/>
</g>
<!-- 12 -->
<g id="node13" class="node">
<title>12</title>
<text text-anchor="middle" x="198.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">;</text>
</g>
<!-- 1&#45;&gt;12 -->
<g id="edge12" class="edge">
<title>1&#45;&gt;12</title>
<path fill="none" stroke="#000000" d="M198.5,-458.9748C198.5,-452.195 198.5,-441.966 198.5,-433.1331"/>
<polygon fill="#000000" stroke="#000000" points="202.0001,-433.0561 198.5,-423.0561 195.0001,-433.0561 202.0001,-433.0561"/>
</g>
<!-- 13 -->
<g id="node14" class="node">
<title>13</title>
<text text-anchor="middle" x="260.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statements&gt;</text>
</g>
<!-- 1&#45;&gt;13 -->
<g id="edge13" class="edge">
<title>1&#45;&gt;13</title>
<path fill="none" stroke="#000000" d="M207.6483,-458.9748C216.9894,-451.291 231.7162,-439.177 243.2544,-429.6859"/>
<polygon fill="#000000" stroke="#000000" points="245.8147,-432.1119 251.3142,-423.0561 241.3678,-426.7058 245.8147,-432.1119"/>
</g>
<!-- 3 -->
<g id="node4" class="node">
<title>3</title>
<text text-anchor="middle" x="117.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;assignment&gt;</text>
</g>
<!-- 2&#45;&gt;3 -->
<g id="edge3" class="edge">
<title>2&#45;&gt;3</title>
<path fill="none" stroke="#000000" d="M131.9916,-407.9748C129.6814,-401.0443 126.1699,-390.5097 123.1821,-381.5464"/>
<polygon fill="#000000" stroke="#000000" points="126.5014,-380.4361 120.0187,-372.0561 119.8607,-382.6498 126.5014,-380.4361"/>
</g>
<!-- 4 -->
<g id="node5" class="node">
<title>4</title>
<text text-anchor="middle" x="33.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;identifier&gt;</text>
</g>
<!-- 3&#45;&gt;4 -->
<g id="edge4" class="edge">
<title>3&#45;&gt;4</title>
<path fill="none" stroke="#000000" d="M105.1055,-356.9748C91.8295,-348.9143 70.5237,-335.9787 54.5986,-326.3099"/>
<polygon fill="#000000" stroke="#000000" points="56.3097,-323.2542 45.9453,-321.0561 52.6768,-329.2377 56.3097,-323.2542"/>
</g>
<!-- 6 -->
<g id="node7" class="node">
<title>6</title>
<text text-anchor="middle" x="89.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">=</text>
</g>
<!-- 3&#45;&gt;6 -->
<g id="edge6" class="edge">
<title>3&#45;&gt;6</title>
<path fill="none" stroke="#000000" d="M113.3685,-356.9748C109.4808,-349.8936 103.5274,-339.05 98.5391,-329.9641"/>
<polygon fill="#000000" stroke="#000000" points="101.5291,-328.1375 93.6484,-321.0561 95.3931,-331.5063 101.5291,-328.1375"/>
</g>
<!-- 7 -->
<g id="node8" class="node">
<title>7</title>
<text text-anchor="middle" x="132.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 3&#45;&gt;7 -->
<g id="edge7" class="edge">
<title>3&#45;&gt;7</title>
<path fill="none" stroke="#000000" d="M119.7133,-356.9748C121.7295,-350.1196 124.7829,-339.7383 127.4002,-330.8392"/>
<polygon fill="#000000" stroke="#000000" points="130.8137,-331.6374 130.2776,-321.0561 124.0981,-329.6622 130.8137,-331.6374"/>
</g>
<!-- 5 -->
<g id="node6" class="node">
<title>5</title>
<text text-anchor="middle" x="33.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">a</text>
</g>
<!-- 4&#45;&gt;5 -->
<g id="edge5" class="edge">
<title>4&#45;&gt;5</title>
<path fill="none" stroke="#000000" d="M33.5,-305.9748C33.5,-299.195 33.5,-288.966 33.5,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="37.0001,-280.0561 33.5,-270.0561 30.0001,-280.0561 37.0001,-280.0561"/>
</g>
<!-- 8 -->
<g id="node9" class="node">
<title>8</title>
<text text-anchor="middle" x="95.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 7&#45;&gt;8 -->
<g id="edge8" class="edge">
<title>7&#45;&gt;8</title>
<path fill="none" stroke="#000000" d="M127.0405,-305.9748C121.7939,-298.743 113.7002,-287.5868 107.0256,-278.3866"/>
<polygon fill="#000000" stroke="#000000" points="109.6872,-276.095 100.9819,-270.0561 104.0212,-280.2056 109.6872,-276.095"/>
</g>
<!-- 9 -->
<g id="node10" class="node">
<title>9</title>
<text text-anchor="middle" x="95.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 8&#45;&gt;9 -->
<g id="edge9" class="edge">
<title>8&#45;&gt;9</title>
<path fill="none" stroke="#000000" d="M95.5,-254.9748C95.5,-248.195 95.5,-237.966 95.5,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="99.0001,-229.0561 95.5,-219.0561 92.0001,-229.0561 99.0001,-229.0561"/>
</g>
<!-- 10 -->
<g id="node11" class="node">
<title>10</title>
<text text-anchor="middle" x="95.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;number&gt;</text>
</g>
<!-- 9&#45;&gt;10 -->
<g id="edge10" class="edge">
<title>9&#45;&gt;10</title>
<path fill="none" stroke="#000000" d="M95.5,-203.9748C95.5,-197.195 95.5,-186.966 95.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="99.0001,-178.0561 95.5,-168.0561 92.0001,-178.0561 99.0001,-178.0561"/>
</g>
<!-- 11 -->
<g id="node12" class="node">
<title>11</title>
<text text-anchor="middle" x="95.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">1</text>
</g>
<!-- 10&#45;&gt;11 -->
<g id="edge11" class="edge">
<title>10&#45;&gt;11</title>
<path fill="none" stroke="#000000" d="M95.5,-152.9748C95.5,-146.195 95.5,-135.966 95.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="99.0001,-127.0561 95.5,-117.0561 92.0001,-127.0561 99.0001,-127.0561"/>
</g>
<!-- 14 -->
<g id="node15" class="node">
<title>14</title>
<text text-anchor="middle" x="224.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statement&gt;</text>
</g>
<!-- 13&#45;&gt;14 -->
<g id="edge14" class="edge">
<title>13&#45;&gt;14</title>
<path fill="none" stroke="#000000" d="M255.1881,-407.9748C250.0833,-400.743 242.2084,-389.5868 235.7141,-380.3866"/>
<polygon fill="#000000" stroke="#000000" points="238.46,-378.2074 229.8337,-372.0561 232.7412,-382.2442 238.46,-378.2074"/>
</g>
<!-- 24 -->
<g id="node25" class="node">
<title>24</title>
<text text-anchor="middle" x="279.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">;</text>
</g>
<!-- 13&#45;&gt;24 -->
<g id="edge24" class="edge">
<title>13&#45;&gt;24</title>
<path fill="none" stroke="#000000" d="M263.3035,-407.9748C266.0635,-400.5663 270.3578,-389.0395 273.8313,-379.716"/>
<polygon fill="#000000" stroke="#000000" points="277.1793,-380.7547 277.3906,-370.162 270.6197,-378.3109 277.1793,-380.7547"/>
</g>
<!-- 25 -->
<g id="node26" class="node">
<title>25</title>
<text text-anchor="middle" x="339.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statements&gt;</text>
</g>
<!-- 13&#45;&gt;25 -->
<g id="edge25" class="edge">
<title>13&#45;&gt;25</title>
<path fill="none" stroke="#000000" d="M272.1567,-407.9748C284.5258,-399.9897 304.3062,-387.22 319.236,-377.5818"/>
<polygon fill="#000000" stroke="#000000" points="321.2923,-380.4203 327.7955,-372.0561 317.4957,-374.5393 321.2923,-380.4203"/>
</g>
<!-- 15 -->
<g id="node16" class="node">
<title>15</title>
<text text-anchor="middle" x="224.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;assignment&gt;</text>
</g>
<!-- 14&#45;&gt;15 -->
<g id="edge15" class="edge">
<title>14&#45;&gt;15</title>
<path fill="none" stroke="#000000" d="M224.5,-356.9748C224.5,-350.195 224.5,-339.966 224.5,-331.1331"/>
<polygon fill="#000000" stroke="#000000" points="228.0001,-331.0561 224.5,-321.0561 221.0001,-331.0561 228.0001,-331.0561"/>
</g>
<!-- 16 -->
<g id="node17" class="node">
<title>16</title>
<text text-anchor="middle" x="168.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;identifier&gt;</text>
</g>
<!-- 15&#45;&gt;16 -->
<g id="edge16" class="edge">
<title>15&#45;&gt;16</title>
<path fill="none" stroke="#000000" d="M216.237,-305.9748C207.8826,-298.3663 194.7586,-286.4141 184.384,-276.9658"/>
<polygon fill="#000000" stroke="#000000" points="186.547,-274.2017 176.7969,-270.0561 181.8337,-279.3771 186.547,-274.2017"/>
</g>
<!-- 18 -->
<g id="node19" class="node">
<title>18</title>
<text text-anchor="middle" x="224.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">=</text>
</g>
<!-- 15&#45;&gt;18 -->
<g id="edge18" class="edge">
<title>15&#45;&gt;18</title>
<path fill="none" stroke="#000000" d="M224.5,-305.9748C224.5,-299.195 224.5,-288.966 224.5,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="228.0001,-280.0561 224.5,-270.0561 221.0001,-280.0561 228.0001,-280.0561"/>
</g>
<!-- 19 -->
<g id="node20" class="node">
<title>19</title>
<text text-anchor="middle" x="267.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 15&#45;&gt;19 -->
<g id="edge19" class="edge">
<title>15&#45;&gt;19</title>
<path fill="none" stroke="#000000" d="M230.8448,-305.9748C237.0692,-298.5923 246.7417,-287.1203 254.5881,-277.8142"/>
<polygon fill="#000000" stroke="#000000" points="257.359,-279.9574 261.1292,-270.0561 252.0073,-275.4452 257.359,-279.9574"/>
</g>
<!-- 17 -->
<g id="node18" class="node">
<title>17</title>
<text text-anchor="middle" x="168.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">b</text>
</g>
<!-- 16&#45;&gt;17 -->
<g id="edge17" class="edge">
<title>16&#45;&gt;17</title>
<path fill="none" stroke="#000000" d="M168.5,-254.9748C168.5,-248.195 168.5,-237.966 168.5,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="172.0001,-229.0561 168.5,-219.0561 165.0001,-229.0561 172.0001,-229.0561"/>
</g>
<!-- 20 -->
<g id="node21" class="node">
<title>20</title>
<text text-anchor="middle" x="254.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 19&#45;&gt;20 -->
<g id="edge20" class="edge">
<title>19&#45;&gt;20</title>
<path fill="none" stroke="#000000" d="M265.5818,-254.9748C263.8344,-248.1196 261.1882,-237.7383 258.9198,-228.8392"/>
<polygon fill="#000000" stroke="#000000" points="262.2877,-227.8817 256.4261,-219.0561 255.5046,-229.6108 262.2877,-227.8817"/>
</g>
<!-- 21 -->
<g id="node22" class="node">
<title>21</title>
<text text-anchor="middle" x="254.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 20&#45;&gt;21 -->
<g id="edge21" class="edge">
<title>20&#45;&gt;21</title>
<path fill="none" stroke="#000000" d="M254.5,-203.9748C254.5,-197.195 254.5,-186.966 254.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="258.0001,-178.0561 254.5,-168.0561 251.0001,-178.0561 258.0001,-178.0561"/>
</g>
<!-- 22 -->
<g id="node23" class="node">
<title>22</title>
<text text-anchor="middle" x="254.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;number&gt;</text>
</g>
<!-- 21&#45;&gt;22 -->
<g id="edge22" class="edge">
<title>21&#45;&gt;22</title>
<path fill="none" stroke="#000000" d="M254.5,-152.9748C254.5,-146.195 254.5,-135.966 254.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="258.0001,-127.0561 254.5,-117.0561 251.0001,-127.0561 258.0001,-127.0561"/>
</g>
<!-- 23 -->
<g id="node24" class="node">
<title>23</title>
<text text-anchor="middle" x="254.5" y="-54.8" font-family="Times,serif" font-size="14.00" fill="#000000">2</text>
</g>
<!-- 22&#45;&gt;23 -->
<g id="edge23" class="edge">
<title>22&#45;&gt;23</title>
<path fill="none" stroke="#000000" d="M254.5,-101.9748C254.5,-95.195 254.5,-84.966 254.5,-76.1331"/>
<polygon fill="#000000" stroke="#000000" points="258.0001,-76.0561 254.5,-66.0561 251.0001,-76.0561 258.0001,-76.0561"/>
</g>
<!-- 26 -->
<g id="node27" class="node">
<title>26</title>
<text text-anchor="middle" x="343.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;statement&gt;</text>
</g>
<!-- 25&#45;&gt;26 -->
<g id="edge26" class="edge">
<title>25&#45;&gt;26</title>
<path fill="none" stroke="#000000" d="M340.0902,-356.9748C340.622,-350.195 341.4242,-339.966 342.117,-331.1331"/>
<polygon fill="#000000" stroke="#000000" points="345.6146,-331.2992 342.9074,-321.0561 338.6361,-330.7518 345.6146,-331.2992"/>
</g>
<!-- 27 -->
<g id="node28" class="node">
<title>27</title>
<text text-anchor="middle" x="370.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#ff0000">&lt;assignment&gt;</text>
</g>
<!-- 26&#45;&gt;27 -->
<g id="edge27" class="edge">
<title>26&#45;&gt;27</title>
<path fill="none" stroke="#000000" d="M347.4839,-305.9748C351.2328,-298.8936 356.9735,-288.05 361.7837,-278.9641"/>
<polygon fill="#000000" stroke="#000000" points="364.914,-280.5316 366.4997,-270.0561 358.7275,-277.2564 364.914,-280.5316"/>
</g>
<!-- 28 -->
<g id="node29" class="node">
<title>28</title>
<text text-anchor="middle" x="327.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;identifier&gt;</text>
</g>
<!-- 27&#45;&gt;28 -->
<g id="edge28" class="edge">
<title>27&#45;&gt;28</title>
<path fill="none" stroke="#000000" d="M364.1552,-254.9748C357.9308,-247.5923 348.2583,-236.1203 340.4119,-226.8142"/>
<polygon fill="#000000" stroke="#000000" points="342.9927,-224.4452 333.8708,-219.0561 337.641,-228.9574 342.9927,-224.4452"/>
</g>
<!-- 30 -->
<g id="node31" class="node">
<title>30</title>
<text text-anchor="middle" x="383.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">=</text>
</g>
<!-- 27&#45;&gt;30 -->
<g id="edge30" class="edge">
<title>27&#45;&gt;30</title>
<path fill="none" stroke="#000000" d="M372.4182,-254.9748C374.1656,-248.1196 376.8118,-237.7383 379.0802,-228.8392"/>
<polygon fill="#000000" stroke="#000000" points="382.4954,-229.6108 381.5739,-219.0561 375.7123,-227.8817 382.4954,-229.6108"/>
</g>
<!-- 31 -->
<g id="node32" class="node">
<title>31</title>
<text text-anchor="middle" x="426.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 27&#45;&gt;31 -->
<g id="edge31" class="edge">
<title>27&#45;&gt;31</title>
<path fill="none" stroke="#000000" d="M378.763,-254.9748C387.1174,-247.3663 400.2414,-235.4141 410.616,-225.9658"/>
<polygon fill="#000000" stroke="#000000" points="413.1663,-228.3771 418.2031,-219.0561 408.453,-223.2017 413.1663,-228.3771"/>
</g>
<!-- 29 -->
<g id="node30" class="node">
<title>29</title>
<text text-anchor="middle" x="327.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">b</text>
</g>
<!-- 28&#45;&gt;29 -->
<g id="edge29" class="edge">
<title>28&#45;&gt;29</title>
<path fill="none" stroke="#000000" d="M327.5,-203.9748C327.5,-197.195 327.5,-186.966 327.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="331.0001,-178.0561 327.5,-168.0561 324.0001,-178.0561 331.0001,-178.0561"/>
</g>
<!-- 32 -->
<g id="node33" class="node">
<title>32</title>
<text text-anchor="middle" x="426.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 31&#45;&gt;32 -->
<g id="edge32" class="edge">
<title>31&#45;&gt;32</title>
<path fill="none" stroke="#000000" d="M426.5,-203.9748C426.5,-197.195 426.5,-186.966 426.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="430.0001,-178.0561 426.5,-168.0561 423.0001,-178.0561 430.0001,-178.0561"/>
</g>
<!-- 33 -->
<g id="node34" class="node">
<title>33</title>
<text text-anchor="middle" x="426.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 32&#45;&gt;33 -->
<g id="edge33" class="edge">
<title>32&#45;&gt;33</title>
<path fill="none" stroke="#000000" d="M426.5,-152.9748C426.5,-146.195 426.5,-135.966 426.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="430.0001,-127.0561 426.5,-117.0561 423.0001,-127.0561 430.0001,-127.0561"/>
</g>
<!-- 34 -->
<g id="node35" class="node">
<title>34</title>
<text text-anchor="middle" x="426.5" y="-54.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;number&gt;</text>
</g>
<!-- 33&#45;&gt;34 -->
<g id="edge34" class="edge">
<title>33&#45;&gt;34</title>
<path fill="none" stroke="#000000" d="M426.5,-101.9748C426.5,-95.195 426.5,-84.966 426.5,-76.1331"/>
<polygon fill="#000000" stroke="#000000" points="430.0001,-76.0561 426.5,-66.0561 423.0001,-76.0561 430.0001,-76.0561"/>
</g>
<!-- 35 -->
<g id="node36" class="node">
<title>35</title>
<text text-anchor="middle" x="426.5" y="-3.8" font-family="Times,serif" font-size="14.00" fill="#000000">2</text>
</g>
<!-- 34&#45;&gt;35 -->
<g id="edge35" class="edge">
<title>34&#45;&gt;35</title>
<path fill="none" stroke="#000000" d="M426.5,-50.9748C426.5,-44.195 426.5,-33.966 426.5,-25.1331"/>
<polygon fill="#000000" stroke="#000000" points="430.0001,-25.0561 426.5,-15.0561 423.0001,-25.0561 430.0001,-25.0561"/>
</g>
</g>
</svg>

</div>

</div>

</div>
</div>

</div></div></section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<h4 id="Fuzz">Fuzz<a class="anchor-link" href="#Fuzz">&#182;</a></h4><p>The <code>fuzz()</code> method simply calls the procedures defined before in order.</p>

</div>
</div>
</div><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[28]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="k">class</span> <span class="nc">LangFuzzer</span><span class="p">(</span><span class="n">LangFuzzer</span><span class="p">):</span>
    <span class="k">def</span> <span class="nf">fuzz</span><span class="p">(</span><span class="bp">self</span><span class="p">):</span>
        <span class="n">tree</span><span class="p">,</span> <span class="n">node</span> <span class="o">=</span> <span class="bp">self</span><span class="o">.</span><span class="n">candidate</span><span class="p">()</span>
        <span class="n">modified</span> <span class="o">=</span> <span class="bp">self</span><span class="o">.</span><span class="n">generate_new_tree</span><span class="p">(</span><span class="n">tree</span><span class="p">,</span> <span class="n">node</span><span class="p">)</span>
        <span class="k">return</span> <span class="n">tree_to_string</span><span class="p">(</span><span class="n">modified</span><span class="p">)</span>
</pre></div>

    </div>
</div>
</div>

</div><aside class="notes">

<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>Here is our fuzzer in action.</p>

</div>
</div>
</div>
</aside></div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[29]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">lf</span> <span class="o">=</span> <span class="n">LangFuzzer</span><span class="p">(</span><span class="n">PEGParser</span><span class="p">(</span><span class="n">VAR_GRAMMAR</span><span class="p">,</span> <span class="n">tokens</span><span class="o">=</span><span class="n">VAR_TOKENS</span><span class="p">),</span> <span class="n">mystrings</span><span class="p">)</span>
<span class="k">for</span> <span class="n">i</span> <span class="ow">in</span> <span class="nb">range</span><span class="p">(</span><span class="mi">10</span><span class="p">):</span>
    <span class="nb">print</span><span class="p">(</span><span class="n">lf</span><span class="o">.</span><span class="n">fuzz</span><span class="p">())</span>
</pre></div>

    </div>
</div>
</div>

<div class="output_wrapper">
<div class="output">


<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>x=23;bvar=avar-3*(4+300)
x=23;y=51;z=x*x-(x+y)*(x-y)
x=10;y=20;z=(1.3)*(x-y)
abc=12+(12+3.3)
x=23;y=51;z=y*x-y*y
a=10;b=20;c=34;d=-b+(b*b-4*y)/(2*a)
abc=12+((4+3+(2/a))+3.3)
x=10;y=20;z=(x+y)*(x-y)
abc=12+(3+3.3)
x=10;y=20;z=(x+y)*(x-y)
</pre>
</div>
</div>

</div>
</div>

</div><div class="fragment">
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>How effective was our fuzzing? Let us find out!</p>

</div>
</div>
</div></div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[31]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">trials</span> <span class="o">=</span> <span class="mi">100</span>

<span class="n">lf</span> <span class="o">=</span> <span class="n">LangFuzzer</span><span class="p">(</span><span class="n">PEGParser</span><span class="p">(</span><span class="n">VAR_GRAMMAR</span><span class="p">,</span> <span class="n">tokens</span><span class="o">=</span><span class="n">VAR_TOKENS</span><span class="p">),</span> <span class="n">mystrings</span><span class="p">)</span>
<span class="n">valid</span> <span class="o">=</span> <span class="p">[]</span>
<span class="n">time</span> <span class="o">=</span> <span class="mi">0</span>
<span class="k">for</span> <span class="n">i</span> <span class="ow">in</span> <span class="nb">range</span><span class="p">(</span><span class="n">trials</span><span class="p">):</span>
    <span class="k">with</span> <span class="n">Timer</span><span class="p">()</span> <span class="k">as</span> <span class="n">t</span><span class="p">:</span>
        <span class="n">s</span> <span class="o">=</span> <span class="n">lf</span><span class="o">.</span><span class="n">fuzz</span><span class="p">()</span>
        <span class="k">try</span><span class="p">:</span>
            <span class="n">exec</span><span class="p">(</span><span class="n">s</span><span class="p">,</span> <span class="p">{},</span> <span class="p">{})</span>
            <span class="n">valid</span><span class="o">.</span><span class="n">append</span><span class="p">((</span><span class="n">s</span><span class="p">,</span> <span class="n">t</span><span class="o">.</span><span class="n">elapsed_time</span><span class="p">()))</span>
        <span class="k">except</span><span class="p">:</span>
            <span class="k">pass</span>
        <span class="n">time</span> <span class="o">+=</span> <span class="n">t</span><span class="o">.</span><span class="n">elapsed_time</span><span class="p">()</span>
<span class="nb">print</span><span class="p">(</span><span class="s2">&quot;</span><span class="si">%d</span><span class="s2"> valid strings, that is LangFuzzer generated </span><span class="si">%f%%</span><span class="s2"> valid entries&quot;</span> <span class="o">%</span>
      <span class="p">(</span><span class="nb">len</span><span class="p">(</span><span class="n">valid</span><span class="p">),</span> <span class="nb">len</span><span class="p">(</span><span class="n">valid</span><span class="p">)</span> <span class="o">*</span> <span class="mf">100.0</span> <span class="o">/</span> <span class="n">trials</span><span class="p">))</span>
<span class="nb">print</span><span class="p">(</span><span class="s2">&quot;Total time of </span><span class="si">%f</span><span class="s2"> seconds&quot;</span> <span class="o">%</span> <span class="n">time</span><span class="p">)</span>
</pre></div>

    </div>
</div>
</div>

<div class="output_wrapper">
<div class="output">


<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>61 valid strings, that is LangFuzzer generated 61.000000% valid entries
Total time of 0.011114 seconds
</pre>
</div>
</div>

</div>
</div>

</div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[32]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">gf</span> <span class="o">=</span> <span class="n">GrammarFuzzer</span><span class="p">(</span><span class="n">VAR_GRAMMAR</span><span class="p">)</span>
<span class="n">valid</span> <span class="o">=</span> <span class="p">[]</span>
<span class="n">time</span> <span class="o">=</span> <span class="mi">0</span>
<span class="k">for</span> <span class="n">i</span> <span class="ow">in</span> <span class="nb">range</span><span class="p">(</span><span class="n">trials</span><span class="p">):</span>
    <span class="k">with</span> <span class="n">Timer</span><span class="p">()</span> <span class="k">as</span> <span class="n">t</span><span class="p">:</span>
        <span class="n">s</span> <span class="o">=</span> <span class="n">gf</span><span class="o">.</span><span class="n">fuzz</span><span class="p">()</span>
        <span class="k">try</span><span class="p">:</span>
            <span class="n">exec</span><span class="p">(</span><span class="n">s</span><span class="p">,</span> <span class="p">{},</span> <span class="p">{})</span>
            <span class="n">valid</span><span class="o">.</span><span class="n">append</span><span class="p">(</span><span class="n">s</span><span class="p">)</span>
        <span class="k">except</span><span class="p">:</span>
            <span class="k">pass</span>
        <span class="n">time</span> <span class="o">+=</span> <span class="n">t</span><span class="o">.</span><span class="n">elapsed_time</span><span class="p">()</span>
<span class="nb">print</span><span class="p">(</span><span class="s2">&quot;</span><span class="si">%d</span><span class="s2"> valid strings, that is GrammarFuzzer generated </span><span class="si">%f%%</span><span class="s2"> valid entries&quot;</span> <span class="o">%</span>
      <span class="p">(</span><span class="nb">len</span><span class="p">(</span><span class="n">valid</span><span class="p">),</span> <span class="nb">len</span><span class="p">(</span><span class="n">valid</span><span class="p">)</span> <span class="o">*</span> <span class="mf">100.0</span> <span class="o">/</span> <span class="n">trials</span><span class="p">))</span>
<span class="nb">print</span><span class="p">(</span><span class="s2">&quot;Total time of </span><span class="si">%f</span><span class="s2"> seconds&quot;</span> <span class="o">%</span> <span class="n">time</span><span class="p">)</span>
</pre></div>

    </div>
</div>
</div>

<div class="output_wrapper">
<div class="output">


<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>4 valid strings, that is GrammarFuzzer generated 4.000000% valid entries
Total time of 1.366280 seconds
</pre>
</div>
</div>

</div>
</div>

</div></section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p>That is, our <code>LangFuzzer</code> is rather effective on generating valid entries when compared to the <code>GrammarFuzzer</code>.</p>

</div>
</div>
</div></section></section><section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<h2 id="Grammar-Based-Mutation">Grammar-Based Mutation<a class="anchor-link" href="#Grammar-Based-Mutation">&#182;</a></h2><p>General idea: Take a derivation tree and a matching grammar; apply a random mutation.</p>

</div>
</div>
</div><div class="fragment">
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[34]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">parser</span> <span class="o">=</span> <span class="n">EarleyParser</span><span class="p">(</span><span class="n">EXPR_GRAMMAR</span><span class="p">)</span>
<span class="n">tree</span><span class="p">,</span><span class="o">*</span><span class="n">_</span> <span class="o">=</span> <span class="n">parser</span><span class="o">.</span><span class="n">parse</span><span class="p">(</span><span class="s2">&quot;1 + 2 * 3&quot;</span><span class="p">)</span>
<span class="n">display_tree</span><span class="p">(</span><span class="n">tree</span><span class="p">)</span>
</pre></div>

    </div>
</div>
</div>

<div class="output_wrapper">
<div class="output">


<div class="output_area">

    <div class="prompt"></div>


<div class="output_svg output_subarea ">
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Generated by graphviz version 2.40.1 (20161225.0304)
 -->
<!-- Title: %3 Pages: 1 -->
<svg width="230pt" height="431pt"
 viewBox="0.00 0.00 230.00 431.00" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="scale(1 1) rotate(0) translate(4 427)">
<title>%3</title>
<polygon fill="#ffffff" stroke="transparent" points="-4,4 -4,-427 226,-427 226,4 -4,4"/>
<!-- 0 -->
<g id="node1" class="node">
<title>0</title>
<text text-anchor="middle" x="97.5" y="-411.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;start&gt;</text>
</g>
<!-- 1 -->
<g id="node2" class="node">
<title>1</title>
<text text-anchor="middle" x="97.5" y="-360.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 0&#45;&gt;1 -->
<g id="edge1" class="edge">
<title>0&#45;&gt;1</title>
<path fill="none" stroke="#000000" d="M97.5,-407.9748C97.5,-401.195 97.5,-390.966 97.5,-382.1331"/>
<polygon fill="#000000" stroke="#000000" points="101.0001,-382.0561 97.5,-372.0561 94.0001,-382.0561 101.0001,-382.0561"/>
</g>
<!-- 2 -->
<g id="node3" class="node">
<title>2</title>
<text text-anchor="middle" x="47.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 1&#45;&gt;2 -->
<g id="edge2" class="edge">
<title>1&#45;&gt;2</title>
<path fill="none" stroke="#000000" d="M90.1223,-356.9748C82.7369,-349.4417 71.1768,-337.6503 61.958,-328.2472"/>
<polygon fill="#000000" stroke="#000000" points="64.4079,-325.7466 54.9079,-321.0561 59.4094,-330.6471 64.4079,-325.7466"/>
</g>
<!-- 7 -->
<g id="node8" class="node">
<title>7</title>
<text text-anchor="middle" x="97.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000"> + </text>
</g>
<!-- 1&#45;&gt;7 -->
<g id="edge7" class="edge">
<title>1&#45;&gt;7</title>
<path fill="none" stroke="#000000" d="M97.5,-356.9748C97.5,-350.195 97.5,-339.966 97.5,-331.1331"/>
<polygon fill="#000000" stroke="#000000" points="101.0001,-331.0561 97.5,-321.0561 94.0001,-331.0561 101.0001,-331.0561"/>
</g>
<!-- 8 -->
<g id="node9" class="node">
<title>8</title>
<text text-anchor="middle" x="145.5" y="-309.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;expr&gt;</text>
</g>
<!-- 1&#45;&gt;8 -->
<g id="edge8" class="edge">
<title>1&#45;&gt;8</title>
<path fill="none" stroke="#000000" d="M104.5826,-356.9748C111.6017,-349.517 122.5487,-337.8857 131.3541,-328.53"/>
<polygon fill="#000000" stroke="#000000" points="134.0834,-330.7369 138.3884,-321.0561 128.986,-325.9393 134.0834,-330.7369"/>
</g>
<!-- 3 -->
<g id="node4" class="node">
<title>3</title>
<text text-anchor="middle" x="40.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 2&#45;&gt;3 -->
<g id="edge3" class="edge">
<title>2&#45;&gt;3</title>
<path fill="none" stroke="#000000" d="M46.4671,-305.9748C45.5366,-299.195 44.1326,-288.966 42.9202,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="46.3645,-279.4873 41.5371,-270.0561 39.4295,-280.4392 46.3645,-279.4873"/>
</g>
<!-- 4 -->
<g id="node5" class="node">
<title>4</title>
<text text-anchor="middle" x="27.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;integer&gt;</text>
</g>
<!-- 3&#45;&gt;4 -->
<g id="edge4" class="edge">
<title>3&#45;&gt;4</title>
<path fill="none" stroke="#000000" d="M38.5818,-254.9748C36.8344,-248.1196 34.1882,-237.7383 31.9198,-228.8392"/>
<polygon fill="#000000" stroke="#000000" points="35.2877,-227.8817 29.4261,-219.0561 28.5046,-229.6108 35.2877,-227.8817"/>
</g>
<!-- 5 -->
<g id="node6" class="node">
<title>5</title>
<text text-anchor="middle" x="27.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;digit&gt;</text>
</g>
<!-- 4&#45;&gt;5 -->
<g id="edge5" class="edge">
<title>4&#45;&gt;5</title>
<path fill="none" stroke="#000000" d="M27.5,-203.9748C27.5,-197.195 27.5,-186.966 27.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="31.0001,-178.0561 27.5,-168.0561 24.0001,-178.0561 31.0001,-178.0561"/>
</g>
<!-- 6 -->
<g id="node7" class="node">
<title>6</title>
<text text-anchor="middle" x="27.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">1</text>
</g>
<!-- 5&#45;&gt;6 -->
<g id="edge6" class="edge">
<title>5&#45;&gt;6</title>
<path fill="none" stroke="#000000" d="M27.5,-152.9748C27.5,-146.195 27.5,-135.966 27.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="31.0001,-127.0561 27.5,-117.0561 24.0001,-127.0561 31.0001,-127.0561"/>
</g>
<!-- 9 -->
<g id="node10" class="node">
<title>9</title>
<text text-anchor="middle" x="146.5" y="-258.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 8&#45;&gt;9 -->
<g id="edge9" class="edge">
<title>8&#45;&gt;9</title>
<path fill="none" stroke="#000000" d="M145.6476,-305.9748C145.7805,-299.195 145.9811,-288.966 146.1543,-280.1331"/>
<polygon fill="#000000" stroke="#000000" points="149.655,-280.1228 146.3518,-270.0561 142.6564,-279.9855 149.655,-280.1228"/>
</g>
<!-- 10 -->
<g id="node11" class="node">
<title>10</title>
<text text-anchor="middle" x="97.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 9&#45;&gt;10 -->
<g id="edge10" class="edge">
<title>9&#45;&gt;10</title>
<path fill="none" stroke="#000000" d="M139.2699,-254.9748C132.1046,-247.517 120.9294,-235.8857 111.9406,-226.53"/>
<polygon fill="#000000" stroke="#000000" points="114.2119,-223.8423 104.7598,-219.0561 109.1642,-228.6921 114.2119,-223.8423"/>
</g>
<!-- 14 -->
<g id="node15" class="node">
<title>14</title>
<text text-anchor="middle" x="147.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000"> * </text>
</g>
<!-- 9&#45;&gt;14 -->
<g id="edge14" class="edge">
<title>9&#45;&gt;14</title>
<path fill="none" stroke="#000000" d="M146.6476,-254.9748C146.7805,-248.195 146.9811,-237.966 147.1543,-229.1331"/>
<polygon fill="#000000" stroke="#000000" points="150.655,-229.1228 147.3518,-219.0561 143.6564,-228.9855 150.655,-229.1228"/>
</g>
<!-- 15 -->
<g id="node16" class="node">
<title>15</title>
<text text-anchor="middle" x="194.5" y="-207.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;term&gt;</text>
</g>
<!-- 9&#45;&gt;15 -->
<g id="edge15" class="edge">
<title>9&#45;&gt;15</title>
<path fill="none" stroke="#000000" d="M153.5826,-254.9748C160.6017,-247.517 171.5487,-235.8857 180.3541,-226.53"/>
<polygon fill="#000000" stroke="#000000" points="183.0834,-228.7369 187.3884,-219.0561 177.986,-223.9393 183.0834,-228.7369"/>
</g>
<!-- 11 -->
<g id="node12" class="node">
<title>11</title>
<text text-anchor="middle" x="97.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;integer&gt;</text>
</g>
<!-- 10&#45;&gt;11 -->
<g id="edge11" class="edge">
<title>10&#45;&gt;11</title>
<path fill="none" stroke="#000000" d="M97.5,-203.9748C97.5,-197.195 97.5,-186.966 97.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="101.0001,-178.0561 97.5,-168.0561 94.0001,-178.0561 101.0001,-178.0561"/>
</g>
<!-- 12 -->
<g id="node13" class="node">
<title>12</title>
<text text-anchor="middle" x="97.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;digit&gt;</text>
</g>
<!-- 11&#45;&gt;12 -->
<g id="edge12" class="edge">
<title>11&#45;&gt;12</title>
<path fill="none" stroke="#000000" d="M97.5,-152.9748C97.5,-146.195 97.5,-135.966 97.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="101.0001,-127.0561 97.5,-117.0561 94.0001,-127.0561 101.0001,-127.0561"/>
</g>
<!-- 13 -->
<g id="node14" class="node">
<title>13</title>
<text text-anchor="middle" x="97.5" y="-54.8" font-family="Times,serif" font-size="14.00" fill="#000000">2</text>
</g>
<!-- 12&#45;&gt;13 -->
<g id="edge13" class="edge">
<title>12&#45;&gt;13</title>
<path fill="none" stroke="#000000" d="M97.5,-101.9748C97.5,-95.195 97.5,-84.966 97.5,-76.1331"/>
<polygon fill="#000000" stroke="#000000" points="101.0001,-76.0561 97.5,-66.0561 94.0001,-76.0561 101.0001,-76.0561"/>
</g>
<!-- 16 -->
<g id="node17" class="node">
<title>16</title>
<text text-anchor="middle" x="194.5" y="-156.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;factor&gt;</text>
</g>
<!-- 15&#45;&gt;16 -->
<g id="edge16" class="edge">
<title>15&#45;&gt;16</title>
<path fill="none" stroke="#000000" d="M194.5,-203.9748C194.5,-197.195 194.5,-186.966 194.5,-178.1331"/>
<polygon fill="#000000" stroke="#000000" points="198.0001,-178.0561 194.5,-168.0561 191.0001,-178.0561 198.0001,-178.0561"/>
</g>
<!-- 17 -->
<g id="node18" class="node">
<title>17</title>
<text text-anchor="middle" x="194.5" y="-105.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;integer&gt;</text>
</g>
<!-- 16&#45;&gt;17 -->
<g id="edge17" class="edge">
<title>16&#45;&gt;17</title>
<path fill="none" stroke="#000000" d="M194.5,-152.9748C194.5,-146.195 194.5,-135.966 194.5,-127.1331"/>
<polygon fill="#000000" stroke="#000000" points="198.0001,-127.0561 194.5,-117.0561 191.0001,-127.0561 198.0001,-127.0561"/>
</g>
<!-- 18 -->
<g id="node19" class="node">
<title>18</title>
<text text-anchor="middle" x="194.5" y="-54.8" font-family="Times,serif" font-size="14.00" fill="#000000">&lt;digit&gt;</text>
</g>
<!-- 17&#45;&gt;18 -->
<g id="edge18" class="edge">
<title>17&#45;&gt;18</title>
<path fill="none" stroke="#000000" d="M194.5,-101.9748C194.5,-95.195 194.5,-84.966 194.5,-76.1331"/>
<polygon fill="#000000" stroke="#000000" points="198.0001,-76.0561 194.5,-66.0561 191.0001,-76.0561 198.0001,-76.0561"/>
</g>
<!-- 19 -->
<g id="node20" class="node">
<title>19</title>
<text text-anchor="middle" x="194.5" y="-3.8" font-family="Times,serif" font-size="14.00" fill="#000000">3</text>
</g>
<!-- 18&#45;&gt;19 -->
<g id="edge19" class="edge">
<title>18&#45;&gt;19</title>
<path fill="none" stroke="#000000" d="M194.5,-50.9748C194.5,-44.195 194.5,-33.966 194.5,-25.1331"/>
<polygon fill="#000000" stroke="#000000" points="198.0001,-25.0561 194.5,-15.0561 191.0001,-25.0561 198.0001,-25.0561"/>
</g>
</g>
</svg>

</div>

</div>

</div>
</div>

</div></div></section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<ol>
<li>Pick any node in the tree</li>
<li>Produce a new expansion.</li>
</ol>
<p>We have seen this for <code>LangFuzzer</code> already, right?</p>
<p>How about we factor this out (from the Parser notebook), and have two notebook on mutational (and genetic fuzzing):</p>
<ol>
<li><p><code>LangFuzzer</code> – a chapter on</p>
<ul>
<li>Mutating trees (randomly)</li>
<li>Mutating trees from a given population (the LangFuzz approach)</li>
<li>Tree recombination (and crossover)</li>
</ul>
</li>
<li><p><code>EvoGrammarFuzzer</code> – a chapter on</p>
<ul>
<li>Genetic improvement (using coverage only)</li>
<li>Genetic improvement (using a fitness function from search-based fuzzing)</li>
</ul>
</li>
</ol>

</div>
</div>
</div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[35]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="k">def</span> <span class="nf">mutate_tree</span><span class="p">(</span><span class="n">tree</span><span class="p">,</span> <span class="n">grammar</span><span class="p">):</span>
    <span class="k">pass</span>
</pre></div>

    </div>
</div>
</div>

</div></section></section><section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<h2 id="Lessons-Learned">Lessons Learned<a class="anchor-link" href="#Lessons-Learned">&#182;</a></h2><ul>
<li>We can generate a pool of fragments using the <em>LangFuzz</em> approach, and use it to generate nearly valid strings.</li>
</ul>

</div>
</div>
</div></section></section><section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<h2 id="Next-Steps">Next Steps<a class="anchor-link" href="#Next-Steps">&#182;</a></h2><ul>
<li>In the <a href="EvoGrammarFuzzer.slides.html">chapter on evolutionary fuzzing</a>, we discuss how to systematically evolve a population of inputs through mutation and crossover operations (as discussed in this chapter) to achieve a specific goal such as code coverage.</li>
</ul>

</div>
</div>
</div></section></section><section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<h2 id="Background">Background<a class="anchor-link" href="#Background">&#182;</a></h2><p>Recombining parsed inputs was pioneered by <em>Langfuzz</em> \cite{Holler2012}, which also gave its name to the main class of this chapter.</p>

</div>
</div>
</div></section></section><section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<h2 id="Exercises">Exercises<a class="anchor-link" href="#Exercises">&#182;</a></h2>
</div>
</div>
</div></section><section>
<div class="cell border-box-sizing text_cell rendered"><div class="prompt input_prompt">
</div><div class="inner_cell">
<div class="text_cell_render border-box-sizing rendered_html">
<p><strong>Solution.</strong> Here is a possible solution.  Before we can make use of <code>GrammarFuzzer</code>, we need to change it a little bit. GrammarFuzzer relies on the grammar being in the <code>fuzzing</code> format with the expansions represented as strings. Our <code>LangFuzzer</code> expects the expansions to be a list of tokens. So we fix the output of <code>GrammarFuzzer</code>.</p>

</div>
</div>
</div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[36]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="k">class</span> <span class="nc">LangFuzzer2</span><span class="p">(</span><span class="n">LangFuzzer</span><span class="p">):</span>
    <span class="k">def</span> <span class="nf">__init__</span><span class="p">(</span><span class="bp">self</span><span class="p">,</span> <span class="n">parser</span><span class="p">,</span> <span class="n">strings</span><span class="p">):</span>
        <span class="nb">super</span><span class="p">()</span><span class="o">.</span><span class="fm">__init__</span><span class="p">(</span><span class="n">parser</span><span class="p">,</span> <span class="n">strings</span><span class="p">)</span>
        <span class="bp">self</span><span class="o">.</span><span class="n">gfuzz</span> <span class="o">=</span> <span class="n">GrammarFuzzer</span><span class="p">(</span><span class="n">parser</span><span class="o">.</span><span class="n">grammar</span><span class="p">())</span>

    <span class="k">def</span> <span class="nf">check_diversity</span><span class="p">(</span><span class="bp">self</span><span class="p">,</span> <span class="n">pool</span><span class="p">):</span>
        <span class="k">return</span> <span class="nb">len</span><span class="p">(</span><span class="n">pool</span><span class="p">)</span> <span class="o">&gt;</span> <span class="mi">10</span>

    <span class="k">def</span> <span class="nf">candidate</span><span class="p">(</span><span class="bp">self</span><span class="p">):</span>
        <span class="n">tree</span><span class="p">,</span> <span class="n">nodes</span> <span class="o">=</span> <span class="n">random</span><span class="o">.</span><span class="n">choice</span><span class="p">(</span><span class="bp">self</span><span class="o">.</span><span class="n">trees</span><span class="p">)</span>
        <span class="n">interesting_nodes</span> <span class="o">=</span> <span class="p">[</span>
            <span class="n">n</span> <span class="k">for</span> <span class="n">n</span> <span class="ow">in</span> <span class="n">nodes</span> <span class="k">if</span> <span class="n">nodes</span><span class="p">[</span><span class="n">n</span><span class="p">][</span><span class="mi">0</span><span class="p">]</span> <span class="ow">in</span> <span class="bp">self</span><span class="o">.</span><span class="n">fragments</span>
            <span class="ow">and</span> <span class="n">nodes</span><span class="p">[</span><span class="n">n</span><span class="p">][</span><span class="mi">0</span><span class="p">]</span> <span class="ow">is</span> <span class="ow">not</span> <span class="bp">self</span><span class="o">.</span><span class="n">parser</span><span class="o">.</span><span class="n">start_symbol</span><span class="p">()</span>
            <span class="ow">and</span> <span class="nb">len</span><span class="p">(</span><span class="bp">self</span><span class="o">.</span><span class="n">fragments</span><span class="p">[</span><span class="n">nodes</span><span class="p">[</span><span class="n">n</span><span class="p">][</span><span class="mi">0</span><span class="p">]])</span> <span class="o">&gt;</span> <span class="mi">0</span>
        <span class="p">]</span>
        <span class="n">node</span> <span class="o">=</span> <span class="n">random</span><span class="o">.</span><span class="n">choice</span><span class="p">(</span><span class="n">interesting_nodes</span><span class="p">)</span>
        <span class="k">return</span> <span class="n">tree</span><span class="p">,</span> <span class="n">node</span>

    <span class="k">def</span> <span class="nf">generate_new_tree</span><span class="p">(</span><span class="bp">self</span><span class="p">,</span> <span class="n">node</span><span class="p">,</span> <span class="n">choice</span><span class="p">):</span>
        <span class="n">name</span><span class="p">,</span> <span class="n">children</span><span class="p">,</span> <span class="nb">id</span> <span class="o">=</span> <span class="n">node</span>
        <span class="k">if</span> <span class="nb">id</span> <span class="o">==</span> <span class="n">choice</span><span class="p">:</span>
            <span class="n">pool</span> <span class="o">=</span> <span class="bp">self</span><span class="o">.</span><span class="n">fragments</span><span class="p">[</span><span class="n">name</span><span class="p">]</span>
            <span class="k">if</span> <span class="bp">self</span><span class="o">.</span><span class="n">check_diversity</span><span class="p">(</span><span class="n">pool</span><span class="p">):</span>
                <span class="k">return</span> <span class="n">random</span><span class="o">.</span><span class="n">choice</span><span class="p">(</span><span class="bp">self</span><span class="o">.</span><span class="n">fragments</span><span class="p">[</span><span class="n">name</span><span class="p">])</span>
            <span class="k">else</span><span class="p">:</span>
                <span class="k">return</span> <span class="kc">None</span>
        <span class="k">else</span><span class="p">:</span>
            <span class="k">return</span> <span class="p">(</span><span class="n">name</span><span class="p">,</span>
                    <span class="p">[</span><span class="bp">self</span><span class="o">.</span><span class="n">generate_new_tree</span><span class="p">(</span><span class="n">c</span><span class="p">,</span> <span class="n">choice</span><span class="p">)</span> <span class="k">for</span> <span class="n">c</span> <span class="ow">in</span> <span class="n">children</span><span class="p">])</span>

    <span class="k">def</span> <span class="nf">fuzz</span><span class="p">(</span><span class="bp">self</span><span class="p">):</span>
        <span class="n">tree</span><span class="p">,</span> <span class="n">node</span> <span class="o">=</span> <span class="bp">self</span><span class="o">.</span><span class="n">candidate</span><span class="p">()</span>
        <span class="n">tree_with_a_hole</span> <span class="o">=</span> <span class="bp">self</span><span class="o">.</span><span class="n">generate_new_tree</span><span class="p">(</span><span class="n">tree</span><span class="p">,</span> <span class="n">node</span><span class="p">)</span>
        <span class="n">modified</span> <span class="o">=</span> <span class="bp">self</span><span class="o">.</span><span class="n">gfuzz</span><span class="o">.</span><span class="n">expand_tree</span><span class="p">(</span><span class="n">tree_with_a_hole</span><span class="p">)</span>
        <span class="k">return</span> <span class="n">tree_to_string</span><span class="p">(</span><span class="n">modified</span><span class="p">)</span>
</pre></div>

    </div>
</div>
</div>

</div></section><section>
<div class="cell border-box-sizing code_cell rendered">
<div class="input">
<div class="prompt input_prompt">In&nbsp;[37]:</div>
<div class="inner_cell">
    <div class="input_area">
<div class=" highlight hl-ipython3"><pre><span></span><span class="n">parser</span> <span class="o">=</span> <span class="n">EarleyParser</span><span class="p">(</span><span class="n">VAR_GRAMMAR</span><span class="p">,</span> <span class="n">tokens</span><span class="o">=</span><span class="n">VAR_TOKENS</span><span class="p">)</span>
<span class="n">lf</span> <span class="o">=</span> <span class="n">LangFuzzer2</span><span class="p">(</span><span class="n">parser</span><span class="p">,</span> <span class="n">mystrings</span><span class="p">)</span>
<span class="k">for</span> <span class="n">i</span> <span class="ow">in</span> <span class="nb">range</span><span class="p">(</span><span class="mi">100</span><span class="p">):</span>
    <span class="nb">print</span><span class="p">(</span><span class="n">lf</span><span class="o">.</span><span class="n">fuzz</span><span class="p">())</span>
</pre></div>

    </div>
</div>
</div>

<div class="output_wrapper">
<div class="output">


<div class="output_area">

    <div class="prompt"></div>


<div class="output_subarea output_stream output_stdout output_text">
<pre>a=1;b=2;b=2
a=1.3;b=a-1*b
a=1;b=2;c=4+300
a=1.3;b=a-1*(1.3+3+(2/a))
a=10;b=20;c=34;d=-b+(b*b-4*a*a)/(2*a)
bvar=avar-3*(4+300);y=51;z=x*x-y*y
a=10;b=20;c=34;d=-b+(b*b-4*a*c)/(x+y)
z=x*x-y*y;b=2;c=a+b
x=10;y=20;z=(x+y)*(a-y)
z=(x+y)*(x-y);y=20;z=(x+y)*(x-y)
x=23;y=51;z=x*x-3
x=a;y=51;z=x*x-y*y
a=10;b=20;c=34;d=-b+(b*x-4*a*c)/(2*a)
a=1;b=2;c=y+b
x=23;y=51;z=x*x-(2/a)
a=300;b=2;c=a+b
avar=1.3;a=1.3;b=a-1*(4+3+(2/a))
x=23;y=51;z=x*b-y*y
a=10;b=34;c=34;d=-b+(b*b-4*a*c)/(2*a)
a=1.3;b=a-1*(4+4*a*c+(2/a))
x=23;y=51;z=x*x-y*y
x=23;y=51;z=x*x-y*(x-y)
abc=12+(1.3+3.3)
a=10;b=20;c=34;d=-b+(b*b-1)/(2*a)
avar=1.3;bvar=avar-3*(4+300)
a=1;b=2;c=a+b
abc=12+(avar+3.3)
a=1;b=20;c=a+b
abc=12+(2+3.3)
avar=51;bvar=avar-3*(4+300)
avar=2;bvar=avar-3*(4+300)
x=10;b=20;c=34;d=-b+(b*b-4*a*c)/(2*a)
abc=12+(3*(4+300)+3.3)
a=10;b=20;c=34;d=-b+(b*b-4*a*c)/(4*a*c)
x=23;y=51;d=-b+(b*b-4*a*c)/(2*a)
a=1.3;b=4-1*(4+3+(2/a))
x=2;y=20;z=(x+y)*(x-y)
z=(x+y)*(x-y);b=20;c=34;d=-b+(b*b-4*a*c)/(2*a)
x=23;y=(2/a);z=x*x-y*y
b=2;c=a+b
a=10;b=2;c=34;d=-b+(b*b-4*a*c)/(2*a)
a=1;b=2;c=a+a
avar=1.3;bvar=y-3*(4+300)
x=23;y=51;z=x*2-y*y
x=300;y=20;z=(x+y)*(x-y)
abc=12+10
avar=1.3;bvar=avar-3*(4+(2/a))
x=10;y=20;z=1
a=a;b=20;c=34;d=-b+(b*b-4*a*c)/(2*a)
a=1.3;b=a-1*300
a=10;b=20;c=34;d=-b+(b*(3+3.3)-4*a*c)/(2*a)
x=23;abc=12+(3+3.3);z=x*x-y*y
a=10;b=20;c=2;d=-b+(b*b-4*a*c)/(2*a)
a=1.3;b=a-1*(300+3+(2/a))
x=23;y=51;c=34
a=10;b=20;c=34;d=-b+(b*b-4*a*c)/(b*a)
a=1.3;bvar=avar-3*(4+300)
x=23;y=51;z=(b*b-4*a*c)/(2*a)
x=23;y=51;z=(x+y)*(x-y)
a=1;b=2;c=300+b
x=23;x=51;z=x*x-y*y
x=23;y=51;z=x*x-y*y
a=2;b=20;c=34;d=-b+(b*b-4*a*c)/(2*a)
abc=b+(3+3.3)
a=1;z=2;c=a+b
a=1.3;b=a-1*(4+3+(51))
a=10;b=20;c=34;d=-b+(b*b-4*a*c)/(20)
x=10;y=20;z=(x+10)*(x-y)
a=1;b=10;c=a+b
avar=1.3;abc=12+(3+3.3)
a=1.3;b=a-1*(4+3+4)
a=10;a=1;c=34;d=-b+(b*b-4*a*c)/(2*a)
a=10;b=20;c=34;d=-b+(a-1*(4+3+(2/a)))/(2*a)
avar=1.3;bvar=avar-1.3
a=10;b=20;x=23;y=51;z=x*x-y*y
abc=12+(3+3.3)
a=10;y=20;z=(x+y)*(x-y)
x=23;y=51;z=x*x-y*a
a=1.3;b=a-1*(2/a)
abc=10
a=10;b=20;c=34;d=-b+(b*b-4*a*c)/(3)
b=a-1*(4+3+(2/a))
bvar=avar-3*(4+300);bvar=avar-3*(4+300)
b=1.3;b=a-1*(4+3+(2/a))
x=23;y=51;z=x*x-y*avar
abc=1.3+(3+3.3)
a=10;a=10;b=20;c=34;d=-b+(b*b-4*a*c)/(2*a)
x=3;y=20;z=(x+y)*(x-y)
a=10;b=20;c=34;d=-10+(b*b-4*a*c)/(2*a)
a=1;b=2;c=b+b
a=1.3;b=a-1*(4+3+4*a*c)
a=10;b=20;c=34;d=-b+(b*b-4*(4+300))/(2*a)
avar=3+(2/a);bvar=avar-3*(4+300)
a=10;b=20;c=34;d=-b+(b*b-4*a*c)/(y)
c=34;y=51;z=x*x-y*y
avar=1.3;y=20
abc=12+3+3.3
a=1.3;bvar=avar-3*(4+300)
avar=1.3;bvar=avar-3*(b+300)
a=avar-3*(4+300);b=20;c=34;d=-b+(b*b-4*a*c)/(2*a)
</pre>
</div>
</div>

</div>
</div>

</div></section></section>
</div>
</div>

<script>

require(
    {
      // it makes sense to wait a little bit when you are loading
      // reveal from a cdn in a slow connection environment
      waitSeconds: 15
    },
    [
      "https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.5.0/lib/js/head.min.js",
      "https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.5.0/js/reveal.js"
    ],

    function(head, Reveal){

        // Full list of configuration options available here: https://github.com/hakimel/reveal.js#configuration
        Reveal.initialize({
            controls: true,
            progress: true,
            history: true,

            transition: "slide",

            // Optional libraries used to extend on reveal.js
            dependencies: [
                { src: "https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.5.0/lib/js/classList.js",
                  condition: function() { return !document.body.classList; } },
                { src: "https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.5.0/plugin/notes/notes.js",
                  async: true,
                  condition: function() { return !!document.body.classList; } }
            ]
        });

        var update = function(event){
          if(MathJax.Hub.getAllJax(Reveal.getCurrentSlide())){
            MathJax.Hub.Rerender(Reveal.getCurrentSlide());
          }
        };

        Reveal.addEventListener('slidechanged', update);

        function setScrollingSlide() {
            var scroll = false
            if (scroll === true) {
              var h = $('.reveal').height() * 0.95;
              $('section.present').find('section')
                .filter(function() {
                  return $(this).height() > h;
                })
                .css('height', 'calc(95vh)')
                .css('overflow-y', 'scroll')
                .css('margin-top', '20px');
            }
        }

        // check and set the scrolling slide every time the slide change
        Reveal.addEventListener('slidechanged', setScrollingSlide);

    }

);
</script>

</body>


</html>