body {
  font: normal 16px/1.65 Roboto, sans-serif;
  color: #303030;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -moz-font-smoothing: antialiased;
  -o-font-smoothing: antialiased; }

h1 {
  display: inline-block;
  margin: 0 0 -10px;
  font-family: "Roboto Mono", serif;
  font-size: 48px;
  font-weight: 400; }

h2 {
  margin: 0 0 40px;
  color: #007aff;
  font-family: "Droid Serif", serif;
  font-size: 28px;
  font-weight: 400;
  text-align: center; }

h3 {
  font-size: 18px; }
  h3 .number {
    display: inline-block;
    float: left;
    margin-right: 10px;
    background-color: #007aff;
    color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    text-align: center; }

h4 {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 400;
  text-transform: uppercase; }

ul {
  padding-left: 20px; }

p {
  margin: 0 0 10px; }

.red {
  color: #ff3b30; }

.blue {
  color: #007aff; }

section {
  padding: 90px 0; }
  section.gray {
    background-color: #e9eef3;
    border-top: 1px solid #cbd0d4;
    border-bottom: 1px solid #cbd0d4; }
  section#hero {
    background: #007aff;
    color: #fff; }
    section#hero span {
      display: inline-block; }
      section#hero span.pronunciation {
        margin-bottom: 20px;
        font-family: "Roboto Mono", serif;
        font-size: 18px; }
      section#hero span.noun {
        font-style: italic;
        opacity: 0.5; }
      section#hero span p {
        margin: 0; }
  section#icons h3 {
    text-align: center; }
  section#icons img {
    display: block;
    height: 100px;
    margin: 0 auto 20px; }
  section#anatomy .anatomy-text {
    padding-right: 45px; }
  section#anatomy .shadow {
    height: 871px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15); }
  section#anatomy .screenshots {
    position: relative;
    height: 871px; }
    section#anatomy .screenshots .slick-slide {
      position: relative; }
    section#anatomy .screenshots .slick-slide:focus {
      outline: none; }
    section#anatomy .screenshots img {
      display: block;
      max-width: 100%; }
      section#anatomy .screenshots img:focus {
        outline: none;
        box-shadow: none; }
    section#anatomy .screenshots .block {
      position: absolute;
      width: 100%;
      bottom: 0;
      padding: 20px 30px;
      background-color: rgba(0, 0, 0, 0.75);
      color: #fff; }
      section#anatomy .screenshots .block p {
        margin: 0;
        font-size: 14px; }
    section#anatomy .screenshots .control {
      position: absolute;
      margin-top: -18px;
      top: 50%; }
      section#anatomy .screenshots .control img {
        width: 20px;
        height: 35px;
        opacity: 0.5;
        cursor: pointer; }
        section#anatomy .screenshots .control img:hover {
          opacity: 1; }
      section#anatomy .screenshots .control#left-control {
        left: -35px; }
      section#anatomy .screenshots .control#right-control {
        right: -35px;
        -moz-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg); }
  section#faq h3 {
    margin: 0 0 -1px;
    border: 1px solid #cbd0d4; }
    section#faq h3 a {
      display: block;
      padding: 10px 30px;
      color: inherit;
      text-decoration: none; }
    section#faq h3.expanded {
      background-color: #e9eef3; }
  section#faq .panel-body {
    margin-bottom: -1px;
    padding: 30px;
    border: 1px solid #cbd0d4; }
    section#faq .panel-body p:last-of-type {
      margin: 0; }

footer {
  height: 200px;
  background-color: #303030; }

@media (max-width: 1199px) {
  section#anatomy .shadow, section#anatomy .screenshots {
    height: 714px; } }
@media (max-width: 991px) {
  section#anatomy .shadow, section#anatomy .screenshots {
    height: 541px; } }
@media (max-width: 767px) {
  h1 {
    font-size: 44px; }

  h2 {
    font-size: 30px; }

  h3 {
    font-size: 16px; }

  section {
    padding: 50px 0; }
    section#anatomy {
      padding-bottom: 0; }
      section#anatomy .shadow, section#anatomy .screenshots {
        height: auto;
        box-shadow: none; }
        section#anatomy .shadow .control, section#anatomy .screenshots .control {
          z-index: 10;
          top: 40%;
          padding: 15px 5px;
          background: #fff;
          border: 1px solid #e6ecf0; }
          section#anatomy .shadow .control#right-control, section#anatomy .screenshots .control#right-control {
            right: -15px; }
          section#anatomy .shadow .control#left-control, section#anatomy .screenshots .control#left-control {
            left: -15px; }

  .feature {
    margin-bottom: 40px; }
    .feature:last-of-type {
      margin-bottom: 0; } }

/*# sourceMappingURL=landing-page-example.css.map */