.bg {
  background: #fff;
  opacity: 0.7;
  padding: 2vw 5vw;
  margin: 5vw 0;
  border: 1px solid #000;
}

#intro h1 {
  font-size: 9vw;
  font-weight: 100;
  font-family: 'Helvetica Neue', sans-serif;
}

a {
  color: #9c2600;
}

#intro h2,
#outro h2 {
  font-size: 12vw;
}

#intro h2,
#outro h1 {
  font-size: 6vw;
}

:host /deep/ .slide > div {
  width: 100%;
}

:host /deep/ .slide {
  background: transparent;
}

#sausage-pre {
  background: url(pics/sausage-pre.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#not-like-sausage {
  background: url(pics/sausage2.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#babel-types {
  background: url(pics/park.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#babel-traverse .bg,
#babel-transform .bg,
#renoir .bg {
  margin: 30vw 0;
}

#babel-traverse {
  background: url(pics/girl-reading-1890.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#babel-transform {
  background: url(pics/doggie.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#debugger-pre {
  background: url(pics/debugger.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#renoir {
  background: url(pics/renoir.png) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#babel-remove-debugger {
  background: url(pics/cat.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#babel-fit {
  background: url(pics/the-garden.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#parser {
  background: url(pics/parser.png) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#links-5-cool-things {
  background: url(pics/bg-links.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#panda {
  background: url(pics/panda.webp) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

.henry-zhu {
  background: url(pics/patreon.png) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
  width: 70vw;
}

.babylon {
  background: url(pics/babylon.png) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
  width: 70vw;
}

.babylon {
  background: url(pics/babylon.png) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
  width: 70vw;
}

.success-complete-disco {
  margin-top: 20px;
  width: 500px;
  height: 300px;
  background: url(pics/success/disco.webp);
  background-repeat: no-repeat;
  background-size: cover;
}

.success-complete-husky {
  margin-top: 20px;
  width: 500px;
  height: 300px;
  background: url(pics/success/happy.webp);
  background-repeat: no-repeat;
  background-size: cover;
}

.success-complete-dancing {
  margin-top: 20px;
  width: 500px;
  height: 300px;
  background: url(pics/success/dancing-dog.webp);
  background-repeat: no-repeat;
  background-size: cover;
}

.github {
  background: url(pics/github.png) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
  width: 70vw;
}

.opencollective {
  background: url(pics/opencollective.png) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
  width: 70vw;
}

#eslint {
  background: url(pics/debugger.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
}

#kirjs {
  background: url(pics/kirjs.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
}

#intro,
#outro {
  background: url(pics/landscape-with-trees-1.jpg) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
}

.bad-tree {
  background: url(pics/tree.gif) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
}

#venok img {
  width: 384px;
  height: 288px;
  margin: 0 auto;
}

.ast-explorer-link:hover {
  font-size: 5vw;
}

.ast-explorer-link {
  padding-top: 25px;
  font-size: 10px;
}

.description.description.description {
  margin: 0;
  margin-top: 20px;
  padding: 0;
  font-size: 0;
}

#debugger-regex /deep/ .solution:hover:before {
  color: red;
  font-size: 3vw;
}

:host /deep/ #debugger-regex .solution {
}

.ast-preview-helper-list li:hover {
  color: #444;
}

.ast-preview-helper-list li {
  font-size: 20px;
  text-decoration: dashed;
  cursor: pointer;
  color: #999;
  border-bottom: 1px #ddd dashed;
}

.ast-preview {
  font-size: 30px;
}

.two-button {
  background: url(pics/button-1.png) no-repeat;
  background-size: 50% auto;
  display: inline-block;
  height: 50vh;
  font-size: 5vw;
  border: 0 solid;
  padding: 0;
  margin: 0;
}

.two-button2 {
  background: url(pics/two-button2.gif) no-repeat;
  background-size: 50% auto;
  display: inline-block;
  height: 50vh;
  font-size: 5vw;
  border: 0 solid;
  padding: 0;
  margin: 0;
}

.two-button3 {
  background: url(pics/two-button3.gif) no-repeat;
  background-size: 100% auto;
  display: inline-block;
  height: 100vh;
  font-size: 5vw;
  border: 0 solid;
  padding: 0;
  margin: 0;
}

.link-number {
  display: inline-block;
  font-size: 8vw;
  border-radius: 50%;
  width: 10vw;
  height: 10vw;
  text-align: center;
  margin-bottom: 10vh;
}

.collie.display {
  background: url(pics/collie.webp) no-repeat;
}

.collie {
  background-size: 100% auto;
  display: inline-block;
  height: 40vh;
  font-size: 5vw;
  width: 50vw;
}

.btn-bar {
  line-height: 3vw;
}

.btn-bar:hover .font-size {
  display: block;
  font-size: 4vw;
}

.btn-bar .font-size {
  display: none;
}

.twitter {
  color: #444;
  font-size: 3vw;
  margin: 2vw;
}
