/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/**
 * Remove default margin.
 */
body {
  margin: 0; }

/* fallback */
/*@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: local('Material Icons'), local('MaterialIcons-Regular'), url(2fcrYFNaTjcS6g4U3t-Y5ZjZjT5FdEJ140U2DJYC3mY.woff2) format('woff2');
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}*/


 @font-face {
        font-family: 'Material Icons';
        font-style: normal;
        font-weight: 400;
        src: url(MaterialIcons-Regular.eot); /* For IE6-8 */
        src: local('Material Icons'),
             local('MaterialIcons-Regular'),
             url(2fcrYFNaTjcS6g4U3t-Y5ZjZjT5FdEJ140U2DJYC3mY.woff2) format('woff2'),
             url(MaterialIcons-Regular.woff) format('woff'),
             url(MaterialIcons-Regular.ttf) format('truetype');
      }

      .material-icons {
        font-family: 'Material Icons';
        font-weight: normal;
        font-style: normal;
        font-size: 24px;  /* Preferred icon size */
        display: inline-block;
        width: 1em;
        height: 1em;
        line-height: 1;
        text-transform: none;
        letter-spacing: normal;
        word-wrap: normal;
        white-space: nowrap;
        direction: ltr;

        /* Support for all WebKit browsers. */
        -webkit-font-smoothing: antialiased;
        /* Support for Safari and Chrome. */
        text-rendering: optimizeLegibility;

        /* Support for Firefox. */
        -moz-osx-font-smoothing: grayscale;

        /* Support for IE. */
        font-feature-settings: 'liga';
      }
      
body.icons-docs {
  font-family: Roboto, monospace;
  font-size: 16px;
  line-height: 28px;
  color: rgba(0, 0, 0, 0.7);
  /* icons listing */ }
  body.icons-docs .material-icons {
    width: 1em;
    height: 1em; }
  body.icons-docs .material-icons.md-18 {
    font-size: 18px; }
  body.icons-docs .material-icons.md-24 {
    font-size: 24px; }
  body.icons-docs .material-icons.md-36 {
    font-size: 36px; }
  body.icons-docs .material-icons.md-48 {
    font-size: 48px; }
  body.icons-docs .material-icons.md-dark {
    color: rgba(0, 0, 0, 0.54); }
  body.icons-docs .material-icons.md-dark.md-inactive {
    color: rgba(0, 0, 0, 0.26); }
  body.icons-docs .material-icons.md-light {
    color: white; }
  body.icons-docs .material-icons.md-light.md-inactive {
    color: rgba(255, 255, 255, 0.3); }
  body.icons-docs .material-icons.orange600 {
    color: #FB8C00; }
  body.icons-docs #page-container #page-inner-container {
    padding-top: 60px; }
    @media screen and (max-width: 360px)  {
      body.icons-docs #page-container #page-inner-container {
        padding-top: 24px; } }
  body.icons-docs header-alterada-01 {
    background: #03a9f4;
    font-family: 'Roboto', sans-serif; }
  body.icons-docs .noninitial-chapter .header-alterada-01-wrapper, body.icons-docs .header-alterada-01-wrapper.qp-ui-peekaboo.qp-ui-peekaboo-active {
    left: 32px; }
  body.icons-docs h1, body.icons-docs a {
    color: #03a9f4; }
  body.icons-docs h1 {
    font-size: 30px; }
    @media screen and (max-width: 360px)  {
      body.icons-docs h1 {
        font-size: 24px; } }
  body.icons-docs h2 {
    font-size: 24px; }
  body.icons-docs h3 {
    font-size: 16px;
    font-weight: 500; }
  body.icons-docs h2, body.icons-docs h3 {
    color: #03a9f4;
    padding-top: 24px; }
  body.icons-docs pre {
    font-family: 'Roboto Mono', monospace;
    border: 1px solid #eee; }
  body.icons-docs h1, body.icons-docs h2, body.icons-docs h3, body.icons-docs h4, body.icons-docs .header-alterada-01-wrapper .header-alterada-01-title {
    max-width: 760px; }
  body.icons-docs h1, body.icons-docs h2, body.icons-docs h3, body.icons-docs h4, body.icons-docs p {
    margin: 0 auto 28px auto; }
    @media screen and (max-width: 820px)  {
      body.icons-docs h1, body.icons-docs h2, body.icons-docs h3, body.icons-docs h4, body.icons-docs p {
        margin-left: 16px;
        margin-right: 16px; } }
  @media screen and (max-width: 360px)  {
    body.icons-docs h1, body.icons-docs h2, body.icons-docs h3, body.icons-docs h4 {
      margin-left: 0;
      margin-right: 0;
      margin-bottom: 8px; } }
  body.icons-docs h1 {
    padding-top: 24px; }
  body.icons-docs p {
    color: rgba(0, 0, 0, 0.7);
    font-size: 16px;
    line-height: 28px; }
    @media screen and (max-width: 820px)  {
      body.icons-docs p {
        font-size: 13px;
        line-height: 20px; } }
  body.icons-docs hr {
    margin: 24px 0;
    height: 64px;
    display: block; }
  body.icons-docs ul {
    font-size: 16px;
    line-height: 28px; }
    @media screen and (max-width: 360px)  {
      body.icons-docs ul {
        font-size: 13px;
        line-height: 20px; } }
  body.icons-docs ul, body.icons-docs table, body.icons-docs pre, body.icons-docs .icons-preview-code {
    display: block;
    width: 760px;
    margin: 32px auto; }
    @media screen and (max-width: 820px)  {
      body.icons-docs ul, body.icons-docs table, body.icons-docs pre, body.icons-docs .icons-preview-code {
        width: auto;
        margin: 40px 0 32px 0;
        overflow-x: scroll; } }
    @media screen and (max-width: 360px)  {
      body.icons-docs ul, body.icons-docs table, body.icons-docs pre, body.icons-docs .icons-preview-code {
        width: 100%;
        margin: 16px 0 16px 0; } }
  body.icons-docs .img {
    max-width: 840px;
    margin: 40px auto 32px auto;
    display: block; }
    @media screen and (max-width: 360px)  {
      body.icons-docs .img {
        margin: 40px 0 32px 0;
        width: 100%; } }
  body.icons-docs li, body.icons-docs ul {
    color: rgba(0, 0, 0, 0.7);
    font-size: 16px;
    line-height: 28px; }
    @media screen and (max-width: 360px)  {
      body.icons-docs li, body.icons-docs ul {
        font-size: 13px;
        line-height: 20px; } }
  body.icons-docs code, body.icons-docs kbd, body.icons-docs pre, body.icons-docs samp {
    font-size: 16px;
    line-height: 28px; }
    @media screen and (max-width: 820px)  {
      body.icons-docs code, body.icons-docs kbd, body.icons-docs pre, body.icons-docs samp {
        font-size: 12px;
        line-height: 18px; } }
  body.icons-docs table {
    background: white;
    border: 1px solid #eee;
    border-radius: 2px;
    margin-bottom: 32px;
    border-collapse: initial; }
  body.icons-docs table thead {
    font-size: 16px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.54);
    line-height: 56px; }
    @media screen and (max-width: 820px)  {
      body.icons-docs table thead {
        font-size: 13px;
        line-height: 20px; } }
  body.icons-docs table tbody {
    font-size: 16px;
    line-height: 48px;
    color: rgba(0, 0, 0, 0.87); }
    @media screen and (max-width: 820px)  {
      body.icons-docs table tbody {
        font-size: 13px;
        line-height: 20px; } }
  @media screen and (max-width: 820px)  {
    body.icons-docs table tbody td {
      padding-top: 8px;
      padding-bottom: 8px; } }
  body.icons-docs th {
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  body.icons-docs td, body.icons-docs th {
    padding: 0 24px; }
  body.icons-docs .toc {
    border: none;
    padding-left: 20px; }
    body.icons-docs .toc h1 {
      font-size: 16px;
      line-height: 28px;
      padding-bottom: 12px;
      margin-bottom: 0;
      font-weight: 400;
      color: #757575; }
      @media screen and (max-width: 360px)  {
        body.icons-docs .toc h1 {
          margin-left: 8px; } }
    body.icons-docs .toc ul {
      list-style: none;
      list-style-type: none;
      margin-top: 0;
      padding-left: 16px;
      border-left: 5px solid #B3E5FC; }
    body.icons-docs .toc li {
      font-size: 16px;
      line-height: 30px;
      list-style-type: none;
      padding: 0; }
      body.icons-docs .toc li:last-child {
        line-height: 30px; }
  body.icons-docs footer {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
    flex-flow: row;
    -webkit-flex-flow: row;
    height: 114px;
    background: #eee;
    font-size: 16px; }
    @media screen and (max-width: 820px)  {
      body.icons-docs footer {
        font-size: 13px;
        height: 72px; } }
    body.icons-docs footer .links {
      flex: 1 1 0;
      -webkit-flex: 1 1 0;
      justify-content: flex-end;
      -webkit-justify-content: flex-end;
      text-align: right;
      margin-top: 56px;
      margin-bottom: 32px;
      margin-right: 72px; }
      @media screen and (max-width: 820px)  {
        body.icons-docs footer .links {
          margin-top: 24px;
          margin-bottom: 24px;
          margin-right: 32px; } }
    body.icons-docs footer .links .dot {
      display: inline-block;
      width: 24px;
      text-align: center; }
      @media screen and (max-width: 360px)  {
        body.icons-docs footer .links .dot {
          width: 8px; } }
    body.icons-docs footer .links a {
      text-decoration: none;
      color: black;
      opacity: .54; }
    body.icons-docs footer .links a:hover {
      opacity: .8; }
    body.icons-docs footer .logo {
      flex: 0 1 auto;
      -webkit-flex: 0 1 auto;
      margin-top: 48px;
      margin-left: 72px; }
      @media screen and (max-width: 820px)  {
        body.icons-docs footer .logo {
          margin-top: 24px;
          margin-left: 32px; } }
    body.icons-docs footer .google-logo {
      width: 90px;
      height: 36px; }
      @media screen and (max-width: 820px)  {
        body.icons-docs footer .google-logo {
          width: 60px;
          height: 24px; } }
  body.icons-docs .icons-preview-code {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
    flex-flow: row;
    -webkit-flex-flow: row;
    border: 1px solid #f0f0f0;
    padding: 0;
    background-color: white; }
    body.icons-docs .icons-preview-code .icons-preview {
      display: -webkit-box;
      /* OLD - iOS 6-, Safari 3.1-6 */
      display: -ms-flexbox;
      /* TWEENER - IE 10 */
      display: -webkit-flex;
      /* NEW - Chrome */
      display: flex;
      /* NEW, Spec - Opera 12.1, Firefox 20+ */
      flex-flow: column;
      -webkit-flex-flow: column;
      flex: 0 1 auto;
      -webkit-flex: 0 1 auto;
      align-items: center;
      -webkit-align-items: center;
      background-color: #f9f9f9;
      width: 128px;
      padding: 16px; }
      @media screen and (max-width: 820px)  {
        body.icons-docs .icons-preview-code .icons-preview {
          width: 72px;
          padding: 16px; } }
    body.icons-docs .icons-preview-code .icons-preview i {
      display: block; }
    body.icons-docs .icons-preview-code .icons-code {
      flex: 1 1 0;
      -webkit-flex: 1 1 0;
      background-color: white;
      padding: 16px; }
      body.icons-docs .icons-preview-code .icons-code pre, body.icons-docs .icons-preview-code .icons-code code {
        margin: 0;
        width: 100%; }
    body.icons-docs .icons-preview-code .icon-caption {
      font-size: 13px;
      margin-top: 8px; }
      @media screen and (max-width: 820px)  {
        body.icons-docs .icons-preview-code .icon-caption {
          margin-top: 4px;
          font-size: 11px; } }
    body.icons-docs .icons-preview-code .icons-dark-bg {
      background-color: #333; }
      body.icons-docs .icons-preview-code .icons-dark-bg .icon-caption {
        color: #fff; }
  body.icons-docs .icon-list {
    padding: 0;
    margin-left: 0;
    width: 1000px;
    background-color: white; }
    body.icons-docs .icon-list .icon-list-header-alterada-01 {
      padding-top: 16px;
      padding-bottom: 16px;
      border-bottom: 1px solid #ddd;
      font-weight: 500; }
      body.icons-docs .icon-list .icon-list-header-alterada-01 .caption {
        display: block;
        text-align: center;
        font-size: 11px;
        width: 96px; }
    body.icons-docs .icon-list .icon-list-item {
      display: -webkit-box;
      /* OLD - iOS 6-, Safari 3.1-6 */
      display: -ms-flexbox;
      /* TWEENER - IE 10 */
      display: -webkit-flex;
      /* NEW - Chrome */
      display: flex;
      /* NEW, Spec - Opera 12.1, Firefox 20+ */
      list-style: none;
      align-items: center;
      -webkit-align-items: center;
      padding-left: 24px;
      border-bottom: 1px solid #f0f0f0; }
      body.icons-docs .icon-list .icon-list-item img, body.icons-docs .icon-list .icon-list-item i.material-icons {
        display: block;
        box-sizing: border-box;
        margin: 36px;
        width: 24px;
        height: 24px; }
      body.icons-docs .icon-list .icon-list-item img.svg48, body.icons-docs .icon-list .icon-list-item img.png48, body.icons-docs .icon-list .icon-list-item i.md-48 {
        display: block;
        box-sizing: border-box;
        width: 48px;
        height: 48px;
        margin: 24px; }
      body.icons-docs .icon-list .icon-list-item .svg, body.icons-docs .icon-list .icon-list-item .png {
        opacity: 0.7; }
      body.icons-docs .icon-list .icon-list-item .icon-name {
        flex: 1 1 0;
        -webkit-flex: 1 1 0;
        font-size: 11px;
        padding-left: 16px; }
    body.icons-docs .icon-list .icon-list-hidden {
      display: none; }
  body.icons-docs .crosshair.vertical {
    position: absolute;
    background-color: red;
    opacity: 0.5;
    height: 100%;
    width: 1px;
    user-select: none;
    pointer-events: none;
    top: 0;
    left: 0; }
  body.icons-docs .crosshair.horizontal {
    position: absolute;
    background-color: red;
    opacity: 0.5;
    height: 1px;
    width: 100%;
    user-select: none;
    pointer-events: none;
    top: 0;
    left: 0; }