/*********************************************
 * GLOBAL STYLES
 *********************************************/
body {
  background-color: #2b2b2b;
}
.reveal {
  font-family: "Helvetica Neue", "Segoe UI", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  font-size: 36px;
  font-weight: 100;
  letter-spacing: -0.02em;
  color: #eeeeee;
}
::selection {
  color: white;
  background: #cecece;
}
.reveal .slides>section, .reveal .slides>section>section {
  line-height: 1.5;
}

/*********************************************
 * HEADERS
 *********************************************/
.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 {
  margin: 0.8em 0 0.2em 0;
  color: #fff;
  font-family: "Helvetica Neue", "Segoe UI", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  font-weight: 100;
  letter-spacing: 0.02em;
}
.reveal h1 {
  font-size: 2.83em;
}
.reveal h2 {
  font-size: 2em;
}
.reveal h3 {
  font-size: 1.41em;
}
.reveal h4 {
  font-size: 1em;
}
.reveal h1:first-child, .reveal h2:first-child, .reveal h3:first-child, .reveal h4:first-child, .reveal h5:first-child, .reveal h6:first-child {
  margin-top: 0;
}

/*********************************************
 * TEXT-LEVEL
 *********************************************/
.reveal p {
  font-size: 0.7em;
  line-height: 1.5;
}
.reveal p.normal, .reveal p.left, .reveal div.left

/* backward compatible */
{
  text-align: left;
}
.reveal abbr[title] {
  border-bottom: 1px dotted rgba(255, 255, 255, 0.3);
  cursor: help;
}
.reveal strong, .reveal b {
  font-weight: 400;
  color: #90ee90;
}
.reveal em {
  font-style: normal;
  color: #f0e68c;
}
.reveal sup, .reveal sub {
  font-size: 50%;
}
.reveal pre {
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: none;
}
.reveal pre, .reveal code, .reveal kbd {
  font-family: Monaco, Consolas, monospace;
}
.reveal pre code {
  padding: 8px 10px;
  font-size: 1.2rem;
}
.reveal small {
  line-height: 1.5;
  vertical-align: baseline;
  color: #ccc;
}
.reveal .alert {
  padding: 0 3px;
  border-radius: 3px;
  background-color: #c00;
  color: #fff;
}

/*********************************************
* LINKS
*********************************************/
.reveal a:not(.image) {
  color: #13daec;
  text-decoration: none;
  -webkit-transition: color .15s ease;
  -moz-transition: color .15s ease;
  -ms-transition: color .15s ease;
  -o-transition: color .15s ease;
  transition: color .15s ease;
}
.reveal a:not(.image):hover {
  color: #71e9f4;
  border: none;
}
.reveal .roll span:after {
  color: #fff;
  background: #0d99a5;
}

/*********************************************
* IMAGES
*********************************************/
.reveal section img {
  margin: 8px 0px;
  background: #fff;
  border: 4px solid #eeeeee;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear;
}
.reveal a:hover img {
  background: rgba(255, 255, 255, 0.2);
  border-color: #13daec;
}
.reveal section img.transparent {
  border: none;
  background-color: transparent;
}

/*********************************************
* NAVIGATION CONTROLS
*********************************************/
.reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled {
  border-right-color: #13daec;
}
.reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled {
  border-left-color: #13daec;
}
.reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled {
  border-bottom-color: #13daec;
}
.reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled {
  border-top-color: #13daec;
}
.reveal .controls div.navigate-left.enabled:hover {
  border-right-color: #71e9f4;
}
.reveal .controls div.navigate-right.enabled:hover {
  border-left-color: #71e9f4;
}
.reveal .controls div.navigate-up.enabled:hover {
  border-bottom-color: #71e9f4;
}
.reveal .controls div.navigate-down.enabled:hover {
  border-top-color: #71e9f4;
}

/*********************************************
* PROGRESS BAR
*********************************************/
.reveal .progress {
  background: rgba(0, 0, 0, 0.2);
}
.reveal .progress span {
  background: #13daec;
  -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
  -moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
  -ms-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
  -o-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
  transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
}

/*********************************************
* SLIDE NUMBER
*********************************************/
.reveal .slide-number {
  color: #13daec;
}

/*********************************************
* TABLES
*********************************************/
.reveal table {
  margin: 1em auto;
  border-collapse: collapse;
  border-spacing: 0;
}
.reveal table th {
  font-weight: 400;
}
.reveal table th, .reveal table td {
  border: 2px solid #555;
  padding: 0.4em 0.8em;
  text-align: center;
  vertical-align: middle;
}
.reveal th img, .reveal td img {
  display: block;
  margin: 0;
}

/*********************************************
* LISTS
*********************************************/
.reveal ul, .reveal ol {
  margin-bottom: 1em;
}
.reveal ul li {
  list-style-type: square;
}

/*********************************************
* FIGURES
*********************************************/
.reveal figure {
  margin: 1em auto;
}
.reveal figcaption {
  color: #ccc;
  font-size: 0.6em;
}

/*********************************************
* HELPERS
*********************************************/
.pull-right {
  float: right;
}
.pull-left {
  float: left;
}

/*********************************************
* FAVICON
*********************************************/
.favicon {
  display: inline-block;
  width: 24px;
  height: 24px;
  margin: 5px;
  border: 1px solid rgba(0, 0, 0, 0.8);
  background-position: center;
  background-repeat: no-repeat;
  background-color: rgba(255, 255, 255, 0.9);
}
.favicon:hover {
  background-color: #fff;
}
.favicon.weibo {
  background-image: url(../../img/favicon/weibo.png);
}
.favicon.twitter {
  background-image: url(../../img/favicon/twitter.png);
}
.favicon.lync-in {
  background-image: url(../../img/favicon/lync.in.png);
}
@media screen and (max-width: 500px) {
  .reveal {
    font-size: 60px;
  }
}