@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&display=swap');
        @import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');
        @import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');
        @media (max-width: 600px) {
            .card-top-right {
              top: 5px;
              right: 0px;
              margin-right: auto;
              margin-left:auto;
            }
            table, thead, tbody, th, td, tr {
            display: block;
            }
            tr {
            margin-bottom: 1rem;
            }
            td::before {
            content: attr(data-label);
            font-weight: bold;
            display: block;
            }
          
        }
        html, body {
          height: 97%;
          margin: 0;
          font-family:'Rajdhani','Roboto Condensed','Orbitron',"Tahoma",Consolas;
          font-size:1rem;
        }
        body {
        background-image: url('../../images/textura-quadric-gray.svg'); /* caminho do seu arquivo */
        background-repeat: repeat;
        background-size: 30px 23px;
        background-color:rgba(255, 255, 255, 0.9);
        color: #fff;
        }
        .navbar-brand {
        background-image: url('../../images/logo-placar-av.svg'); /* caminho do seu arquivo */
        background-repeat: no-repeat;
        background-size: 113px 39px;
        /*background-color:rgba(255, 255, 255, 0.5);*/
        background-position:-30px 0px;
        color: #f8f9fa;
        }
        .card {
            background-color: #3c3c3c;
            border: 1px solid #444;
            margin-bottom: 20px;
        }
        
        .content-data{
            background-color: #DDD !important;
           border-top: solid 4px #4dabf7;
           border-bottom: solid 4px #fa5252;
           border-left:1px solid #AAA;
           border-right:1px solid #AAA;
           box-shadow:0px 0px 10px 5px rgb(40 40 40 / 20%);
        }
        .card{
           background-color: #444 !important;   
        }
        .text-blue { color: #4dabf7 !important; }
        .text-red { color: #fa5252 !important; }
        .text-light { color: #f8f9fa !important; }
        .text-black { color: #222 !important; }
        label { color: #dee2e6 !important; }
        
        .header-page {
            background-color: #DDD !important;
            color: #333 ;  
            box-shadow:0px 12px 12px 12px rgb(40 40 40 / 20%);
        }
        .header-page a{
                text-decoration: none !important;
                color: #333 ;
        }    
        .footer-page {
           background-color: #2c3034 !important; 
           color: #555 !important;
        }
        .best-time{
            --bs-table-bg-type:#727 !important;
            background-color:#727 !important;
            color:#fff !important;
            border-bottom:solid 2px #A5A !important;
        }
        .div-borda-direita {
          background-image: url('../../images/3cores.svg'); /* caminho do seu arquivo */
          background-repeat: no-repeat;
          background-size: 200px 110%;
          background-position: 102%;
        }
        .div-borda-direita-b {
          background-image: url('../../images/3cores-b.svg'); /* caminho do seu arquivo */
          background-repeat: no-repeat;
          background-size: 200px 500px;
          background-position: 102%;
        }
        .div-borda-direita-c {
          background-image: url('../../images/3cores-c.svg'); /* caminho do seu arquivo */
          background-repeat: no-repeat;
          background-size: 200px 300px;
          background-position: 102%;
        }
        .destaque-piloto{
            --bs-table-bg-type:#ADFF2F !important;
            background-color:#ADFF2F !important;
            color:#000 !important;
            border-bottom:solid 2px #00FF00 !important;
        }
        .destaque-piloto-linha{
            border-top:solid 2px #00FF00 !important;
            border-bottom:solid 2px #00FF00 !important;
        }
        .fadein {
          opacity: 0;
          background-color: #FFF;
          transition: opacity 3s ease-in;
        }
        .fadein.anim-visible {
            background-color: #DDD;
          opacity: 1;
        }
        .card-top-right {
          position: fixed;
          top: 20px;
          right: 1%;
          background: #ADFF2F;
          color: #000;
          border: 1px solid #ccc;
          padding: 15px;
          border-radius: 10px;
          box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
          z-index: 1000 !important;
          max-width: 600px;
          transition: opacity 0.3s ease;
          opacity: 1;
        }
        .hidden {
          transition: opacity 0.3s ease;
          opacity: 0;
          display: none;
        }