h1{
        font-family: Roboto;
        font-size: 44pt;
      }

      h2{
        font-family: Roboto;
        font-size: 37pt;
      }

      @media (max-width: 767px) {
        h1 {
          font-size: 34pt;
          text-align: center;
          }
      }

      @media (max-width: 767px) {
        h2 {
          font-size: 38pt;
          text-align: center;
          }
      }

      @media (max-width: 767px) {
        #comp {
          display: none;
          }
 
        .botao{
          display: flex;
          justify-content: center;
          margin-bottom: 10px;
          }

          .logo{
          justify-content: center;
          }
      }

       h2 .h2{
        font-family: Roboto;
        font-size: 27pt;
      }

      h3{
        font-family: Roboto;
        font-size: 34pt;
      }

      body{
        font-family: Roboto, sans-serif;
      }

      .nav-masthead .nav-link {
        color: rgba(255, 255, 255);
        border-bottom: .25rem solid transparent;
      }

      .nav-masthead .nav-link:hover,
      .nav-masthead .nav-link:focus {
        border-bottom-color: rgba(255, 204, 0);
      }

      .nav-masthead .nav-link + .nav-link {
        margin-left: 1rem;
      }

      .nav-masthead .active {
        color: #fff;
        border-bottom-color: #fff;
      }

      .bd-placeholder-img {
        font-size: 1.25rem;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
      }

      @media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
      }

      .b-example-divider {
        height: 3rem;
        background-color: rgba(224, 37, 51);
        border: solid rgba(224, 37, 51);
        border-width: 1px 0;
        box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
      }

      .b-example-vr {
        flex-shrink: 0;
        width: 1.5rem;
        height: 100vh;
      }

      .bi {
        vertical-align: -.125em;
        fill: currentColor;
      }

      .nav-scroller {
        position: relative;
        z-index: 2;
        height: 2.75rem;
        overflow-y: hidden;
      }

      .nav-scroller .nav {
        display: flex;
        flex-wrap: nowrap;
        padding-bottom: 1rem;
        margin-top: -1px;
        overflow-x: auto;
        text-align: center;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
      }

       @media (max-width: 767px) {
        #contactos {
          padding: 10px;
          }
      }

      footer{
        padding: 10px;
      }

      .card{
        padding: 15px;
        margin: 15px;
        border-radius: 10px;
        border: none;
      }

      .card-produto:hover{
        transition: 0.5s;
        background: #FFCC00;
        cursor: pointer;
      }

      .pad{
        padding: 10px;
      }

      a {
        color: #909294;
        text-decoration: none;
        transition: 0.3s;
      }

      a:hover {
        color: #FFCC00;
      }

      .bg-baixo {
        background-color: #222;
      }