/*

github.com style (c) Vasily Polovnyov <vast@whiteants.net>

*/

    .hljs {
      display: block;
      overflow-x: auto;
      padding: 0.5em;
      color: #333;
      background: #f8f8f8;
    }

    .hljs-comment,
    .hljs-quote {
      color: #998;
      font-style: italic;
    }

    .hljs-keyword,
    .hljs-selector-tag,
    .hljs-subst {
      color: #333;
      font-weight: bold;
    }

    .hljs-number,
    .hljs-literal,
    .hljs-variable,
    .hljs-template-variable,
    .hljs-tag .hljs-attr {
      color: #008080;
    }

    .hljs-string,
    .hljs-doctag {
      color: #d14;
    }

    .hljs-title,
    .hljs-section,
    .hljs-selector-id {
      color: #900;
      font-weight: bold;
    }

    .hljs-subst {
      font-weight: normal;
    }

    .hljs-type,
    .hljs-class .hljs-title {
      color: #458;
      font-weight: bold;
    }

    .hljs-tag,
    .hljs-name,
    .hljs-attribute {
      color: #000080;
      font-weight: normal;
    }

    .hljs-regexp,
    .hljs-link {
      color: #009926;
    }

    .hljs-symbol,
    .hljs-bullet {
      color: #990073;
    }

    .hljs-built_in,
    .hljs-builtin-name {
      color: #0086b3;
    }

    .hljs-meta {
      color: #999;
      font-weight: bold;
    }

    .hljs-deletion {
      background: #fdd;
    }

    .hljs-addition {
      background: #dfd;
    }

    .hljs-emphasis {
      font-style: italic;
    }

    .hljs-strong {
      font-weight: bold;
    }

    /* --- EXAMPLES --- */

    div.example-title {
      min-width: 7.5em;
      color: #b9ab2d;
    }

    div.example-title span {
      text-transform: uppercase;
    }

    aside.example,
    div.example,
    div.illegal-example {
      padding: 0.5em;
      margin: 1em 0;
      position: relative;
      clear: both;
    }

    div.illegal-example {
      color: red
    }

    div.illegal-example p {
      color: black
    }

    aside.example,
    div.example {
      padding: .5em;
      border-left-width: .5em;
      border-left-style: solid;
      border-color: #e0cb52;
      background: #fcfaee;
    }

    aside.example div.example {
      border-left-width: .1em;
      border-color: #999;
      background: #fff;
    }

    aside.example div.example div.example-title {
      color: #999;
    }

    /* --- Best Practices --- */

    div.practice {
      border: solid #bebebe 1px;
      margin: 2em 1em 1em 2em;
    }

    span.practicelab {
      margin: 1.5em 0.5em 1em 1em;
      font-weight: bold;
      font-style: italic;
      background: #dfffff;
      position: relative;
      padding: 0 0.5em;
      top: -1.5em;
    }

    p.practicedesc {
      margin: 1.5em 0.5em 1em 1em;
    }

    @media screen {
      p.practicedesc {
        position: relative;
        top: -2em;
        padding: 0;
        margin: 1.5em 0.5em -1em 1em;
      }
    }

 /*****************************************************************
 * ReSpec 3 CSS
 * Robin Berjon - http://berjon.com/
 *****************************************************************/
    /* Override code highlighter background */

    .hljs {
      background: transparent !important;
    }
    /* --- INLINES --- */

    em.rfc2119 {
      text-transform: lowercase;
      font-variant: small-caps;
      font-style: normal;
      color: #900;
    }

    h1 acronym,
    h2 acronym,
    h3 acronym,
    h4 acronym,
    h5 acronym,
    h6 acronym,
    a acronym,
    h1 abbr,
    h2 abbr,
    h3 abbr,
    h4 abbr,
    h5 abbr,
    h6 abbr,
    a abbr {
      border: none;
    }

    dfn {
      font-weight: bold;
    }

    a.internalDFN {
      color: inherit;
      border-bottom: 1px solid #99c;
      text-decoration: none;
    }

    a.externalDFN {
      color: inherit;
      border-bottom: 1px dotted #ccc;
      text-decoration: none;
    }

    a.bibref {
      text-decoration: none;
    }

    cite .bibref {
      font-style: normal;
    }

    code {
      color: #C83500;
    }

    th code {
      color: inherit;
    }
    /* --- TOC --- */

    .toc a,
    .tof a {
      text-decoration: none;
    }

    a .secno,
    a .figno {
      color: #000;
    }

    ul.tof,
    ol.tof {
      list-style: none outside none;
    }

    .caption {
      margin-top: 0.5em;
      font-style: italic;
    }
    /* --- TABLE --- */

    table.simple {
      border-spacing: 0;
      border-collapse: collapse;
      border-bottom: 3px solid #005a9c;
    }

    .simple th {
      background: #005a9c;
      color: #fff;
      padding: 3px 5px;
      text-align: left;
    }

    .simple th[scope="row"] {
      background: inherit;
      color: inherit;
      border-top: 1px solid #ddd;
    }

    .simple td {
      padding: 3px 10px;
      border-top: 1px solid #ddd;
    }

    .simple tr:nth-child(even) {
      background: #f0f6ff;
    }
    /* --- DL --- */

    .section dd>p:first-child {
      margin-top: 0;
    }

    .section dd>p:last-child {
      margin-bottom: 0;
    }

    .section dd {
      margin-bottom: 1em;
    }

    .section dl.attrs dd,
    .section dl.eldef dd {
      margin-bottom: 0;
    }

    .respec-hidden {
      display: none;
    }

    #respec-ui {
      position: fixed;
      top: 20px;
      right: 20px;
      width: 202px;
      text-align: right;
    }

    #respec-pill,
    .respec-info-button {
      background: #fff;
      height: 2.5em;
      color: rgb(120, 120, 120);
      border: 1px solid #ccc;
      box-shadow: 1px 1px 8px 0 rgba(100, 100, 100, .5);
    }

    .respec-info-button {
      border: none;
      border-radius: 2em;
      margin-right: 1em;
      min-width: 3.5em;
    }

    #respec-pill:disabled {
      margin: 10px auto;
      font-size: 2.8px;
      position: relative;
      text-indent: -9999em;
      border-top: 1.1em solid rgba(40, 40, 40, 0.2);
      border-right: 1.1em solid rgba(40, 40, 40, 0.2);
      border-bottom: 1.1em solid rgba(40, 40, 40, 0.2);
      border-left: 1.1em solid #ffffff;
      transform: translateZ(0);
      animation: respec-spin 1.1s infinite linear;
      box-shadow: none;
    }

    #respec-pill:disabled,
    #respec-pill:disabled:after {
      border-radius: 50%;
      width: 10em;
      height: 10em;
    }

    @keyframes respec-spin {
      0% {
        transform: rotate(0deg);
      }
      100% {
        transform: rotate(360deg);
      }
    }

    #respec-pill:hover,
    #respec-pill:focus {
      color: rgb(0, 0, 0);
      transition: color .2s
    }

    #respec-menu {
      font-family: sans-serif;
      background: #fff;
      box-shadow: 1px 1px 8px 0 rgba(100, 100, 100, .5);
      width: 200px;
      display: none;
      text-align: left;
      margin-top: 5px;
      font-size: .8em;
    }

    .respec-save-button {
      background: #fff;
      border: 1px solid #000;
      border-radius: 5px;
      padding: 5px;
      margin: 5px;
      display: block;
      width: 100%;
      color: #000;
      text-decoration: none;
      text-align: center;
      font-size: inherit;
    }

    #respec-ui button:focus,
    #respec-pill:focus,
    .respec-option:focus {
      outline: 0;
      outline-style: none;
    }

    #respec-ui button.respec-pill-error {
      background-color: red;
      color: white;
    }

    #respec-ui button.respec-pill-warning {
      background-color: orange;
      color: white;
    }

    #respec-menu button.respec-option {
      background: white;
      border: none;
      width: 100%;
      text-align: left;
      font-size: inherit;
      padding: 1.2em 1.2em;
    }

    #respec-menu button.respec-option:hover {
      background-color: #eeeeee;
    }

    .respec-cmd-icon {
      padding-right: .5em;
    }

    #respec-ui button.respec-option:last-child {
      border: none;
      border-radius: inherit;
    }

    @media print {
      .removeOnSave {
        display: none;
      }
    }


    .human-readable-example {
      background-color: transparent;
      border-collapse: collapse;
      border-spacing: 0px;
      color: #333;
      width: 100%;
    }

    .human-readable-example td {
      padding: 6px 3px 6px 3px;
    }

    .human-readable-example tr:first-child td:first-child {
      width: 25%;
    }

    .human-readable-example tr:nth-child(even) {
      background-color: #F7F7F7;
    }

    .human-readable-example tr:nth-child(odd) {
      background-color: #FFFFFF;
    }

    #bp-summary ul {
      list-style-type: none;
      padding-left: 0;
      line-height: 1.6em;
      background-color: #FCFAEE;
    }

    .hidden {
      display: none
    }

    ul.benefitsList li.icon {
      display: inline;
      list-style-type: none;
    }

    ul.benefitsList li.icon img {
      padding: 0;
      margin-right: 1em;
      max-width: 60px;
      max-height: 70px;
    }

    ul.benefitsList li.icon img.comprehensionIcon,
    ul.benefitsList li.icon img.discoverabilityIcon,
    ul.benefitsList li.icon img.interoperabilityIcon,
    ul.benefitsList li.icon img.processabilityIcon {
      max-width: 80px;
    }

    ul.benefitsList li.icon img.discoverabilityIcon,
    ul.benefitsList li.icon img.interoperabilityIcon,
    ul.benefitsList li.icon img.processabilityIcon {
      max-width: 73px;
    }

/* *************************************************************
These styles are for the lists of benefits
************************************************************** */

    #benefitsTables {
      width: 100%;
      margin: 0 auto;
    }

    .benefit-list-panel {
      border-radius: 1em;
      /*(padrão)*/
      -moz-border-radius: 1em;
      /*(navegadores Flock e Firefox)*/
      -webkit-border-radius: 1em;
      /*(navegadores Chrome e Safari)*/
      padding: 0.2em 1em;
    }

    .benefit-list-panel ul {
      list-style-type: none;
      padding-left: 0;
    }

    .benefit-list-panel ul li {
      font-size: smaller;
      line-height: 1.4em;
    }

    .benefit-list-panel p.benefitsPanelTitle {
      font-weight: bold;
      text-transform: uppercase;
      text-align: center;
    }

    #benefitListReuse {
      background: #B0CC9B;
      border: 1px solid #387F05;
    }

    #benefitListAccess {
      background: #E8F1FA;
      border: 1px solid #81B3E0;
    }

    #benefitListTrust {
      background: #E6BE9F;
      border: 1px solid #BF5B0E;
    }

    #benefitListDiscoverability {
      background: #CCBEB5;
      border: 1px solid #7F5C46;
    }

    #benefitListProcessability {
      background: #C5B5DE;
      border: 1px solid #6E46AD;
    }

    #benefitListInteroperability {
      background: #F3E09A;
      border: 1px solid #E0B200;
    }

    #benefitListLinkability {
      background: #B9C1CC;
      border: 1px solid #50637F;
    }

    #benefitListComprehension {
      background: #B3B3B3;
      border: 1px solid #404040;
    }

/* *******************************************
We reuse the 2 column style (for screens > 600 wide) from the list of BPs
to create the columns for the lists of benefits
********************************************** */

    @media screen and (min-width: 600px) {
      #bp-summary ul,
      #benefitsTables {
        column-count: 2;
        -moz-column-count: 2;
        -webkit-column-count: 2;
        column-gap: 1em;
      }
      /* We need to re-set the column number to 1 so that within each panel there is only 1 column */
      #benefitsTables .benefit-list-panel {
        column-count: 1;
        -moz-column-count: 1;
        -webkit-column-count: 1;
        margin: .1em;
        display: inline-block;
        /* This prevents single lists spanning multiple columns, thank you http://stackoverflow.com/questions/6682501/css3-columns-widows-orphans */
        width: 90%;
        /* For somr reason some of the panels are wider than others, this stops that heppening */
      }
    }
    /* And we can go to three columns for bigger screens */

    @media screen and (min-width: 850px) {
      #benefitsTables {
        column-count: 3;
        -moz-column-count: 3;
        -webkit-column-count: 3;
        column-gap: 1em;
      }
    }
    /* Styles for the BPs themsevles */

    .practice,
    #tempPractice {
      padding-left: 1em;
      background-color: #FCFAEE;
      border: thin solid #CCC;
      /*border-radius: 10px;*/
      margin-bottom: 1.5em;
    }

    #tempPractice .tempPracticelab {
      background-color: #dfffff;
      position: relative;
      top: -1.5em;
      font-weight: bold;
    }

    .practice p.practicedesc,
    #tempPractice p.tempPracticedesc {
      font-style: italic;
      border-bottom: thin solid black;
      position: relative;
      top: -1.5em;
      margin: 0 2em -1em 1em;
    }

    .subhead {
      font-weight: bold;
      margin-top: 1em;
    }

    .benefits .stamp {
      height: 52px;
      width: 52px;
      margin-right: 4px;
      margin-bottom: 4px;
    }

    .benefits .stamp-template {
      height: 82px;
      width: 82px;
      margin-right: 4px;
      margin-bottom: 4px;
    }

    .practice dl dt #tempPractice dl dt {
      font-weight: normal;
    }

    figure {
      text-align: center;
    }

    figure#contextDiagram {
      width: 60%;
      margin: 0 auto;
    }

    figure figcaption {
      text-align: center;
      font-style: italic;
    }

    table#uripatternstable,
    table.bptable {
      border-collapse: collapse;
      caption-side: bottom;
    }

    table#uripatternstable th,
    table#uripatternstable td,
    table.bptable th,
    table.bptable td {
      border: 1px solid black;
      padding: 0.3em;
    }

    table#uripatternstable caption,
    table.bptable caption {
      margin: 0.5em;
      font-style: italic;
    }

    .stmt {
      padding: 3pt
    }

    .stmt1 {
      column-count: 2;
      -moz-column-count: 2;
      -webkit-column-count: 2;
      column-gap: 1em;
      background-color: #FCFAEE;
    }

    .expand {
      display: block;
      cursor: pointer;
    }

    .expand:hover {
      color: #3D3D3D;
    }

    .expand:before {
      font-weight: bold;
      content: "\25C6  Example (click to expand or collapse)";
    }

    .expand+input {
      display: none;
    }

    .expand+input+* {
      display: none;
    }

    .expand+input:checked+* {
      display: block;
    }

    .benefits-itens {
      width: 100%;
      margin: 0 auto;
    }

    .benefits-itens .item {
      border-radius: 22px;
      /*(padrão)*/
      -moz-border-radius: 22px;
      /*(navegadores Flock e Firefox)*/
      -webkit-border-radius: 22px;
      /*(navegadores Chrome e Safari)*/
      width: 28%;
      padding: 20px;
      margin: 2px;
      font-size: 13px;
      line-height: 150%;
      float: left;
    }

    .benefits-itens .item .title {
      font-size: 16px;
      font-weight: 800;
      text-transform: uppercase;
      text-align: center;
    }

    .benefits-itens .reuse {
      background: #B0CC9B;
      border: 1px solid #387F05;
    }

    .benefits-itens .access {
      background: #E8F1FA;
      border: 1px solid #81B3E0;
    }

    .benefits-itens .trust {
      background: #E6BE9F;
      border: 1px solid #BF5B0E;
      float: right;
    }

    .benefits-itens .discoverability {
      background: #CCBEB5;
      border: 1px solid #7F5C46;
    }

    .benefits-itens .processability {
      background: #C5B5DE;
      border: 1px solid #6E46AD;
    }

    .benefits-itens .interoperability {
      background: #F3E09A;
      border: 1px solid #E0B200;
      float: right;
    }

    .benefits-itens .linkability {
      background: #B9C1CC;
      border: 1px solid #50637F;
    }

    .benefits-itens .comprehension {
      background: #B3B3B3;
      border: 1px solid #404040;
      float: right;
    }

    @media screen and (min-width: 1024px) {
      .benefits-itens .item {
        margin-left: 1.6%;
      }
    }

    @media screen and (max-width: 900px) {
      .benefits-itens .item {
        clear: both;
        display: inline-block;
        float: left !important;
        width: 90%;
      }
    }