
 @font-face { font-family: Handwritten;
 
  src: url('fontes/Handwritten.ttf');
 
  format('ttf'); }

html {font-family: Georgia }
  

    body { background-color: #000;
}

h2, h3, h4, h5, h6 {color: green}

.ttl { color: #a2d500; font-size: 90px;
  margin-bottom: -100; align-content: center; justify-content: center;
  
  grid-row: 1; grid-column: 2 / 4;
}
  
.ttl7 {color:white;
  text-align:center; justify-content: center; margin-top: -100px;
  grid-row: 2; grid-column: 2; }


a {color: #5300AD;}
    
    #cab { border: solid #a2d500 3px; 
    margin: 50px; margin-bottom:0;
    
      display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: 90% 1fr;
align-items: center; }
  
    #pagina { background-color: white;
    
    border: solid #a2d500 3px; 
     max-width: 100%; height: fit-content;
     
     display: grid;
grid-template-columns: 3fr 1fr;
grid-template-rows: 1fr 70% 3fr;

     margin: 50px; margin-top:0;}
     
 .ult-atlz { padding: 3px; margin:0; grid-column: 1 / 1;
 grid-row: 1 / 2;
 
background-color:white; color: #2E004D; font-size: 19px; text-align: center; }    

    #menu { background-color: #000; color:white; border: solid #a2d500 3px;
      margin: 50px; margin-top:0; margin-bottom: 0;
      
      display: flex; 
      flex: 1;}
    
   .bt-menu { gap: 0; margin:0;
    font-size: 17px; color: white; 
    background-color: #1F0953; flex:1}
    
       .bt-menu-atv { gap: 0; margin:0;
    font-size: 17px; color: black; 
    background-color: #a2d500; flex:1}
    
    .link-menu {color: white; text-decoration: none; cursor: default; }
    
        .link-menu-atv {color: black; text-decoration: none; cursor: default; }

     
    .ttl-glr { font-size: 11px; font-weight: bold; text-align: center; color: #a2d500; }
    
      
.lat { grid-column: 2; 
grid-row: 1 / 4; 
  color: black; text-align: justify;
  width: auto;
  background-color: #fff; border-left: solid #a2d500 3px;
  padding: 10px;
  }
   
#lat-h3 { color: #1C2B00; 
width: 100%;
text-align: center; }

#icone { width: 300px;
  height: auto;
   grid-area: 1 / 1 / 3 / 2; }


  
#pesq { margin: 0; margin-top: 0; padding: 7px;
width: 400px; height: auto;
background-color: #FFF59D; 
font-size: 17px; text-align: left; color: #9F9B81; border-left: solid #a2d500 3px}


    #mural { width: 100%;
      height: fit-content;
      background: white;
      border-top: none;
      border-bottom: none;
      border-right: solid #a2d500 3px;
      padding: 0; 
     display: grid; 
grid-column: 1/3; grid-row: 2;
     
     align-items: center; }
      
      .mrl-compl { grid-column: 1 / 3; grid-row: 3; 
      
      width: fit-content; height: fit-content;
      font-size: 14px;
      color: black; 
      background-color: gray;
      
      justify-content: center; 
      align-content: center; 
      text-align: center;}
    
      
    
    article { margin-bottom: -1px; padding-left: 3px; width: 100%;
      height: fit-content;
      border: 1px solid #000; border-left: none; border-right: none;}
    
    
    article p { color: #333;
      margin-top: 0; }
    
    article .data { display: none; }
    
    
 /* ======= DISPOSITIVOS MÓVEIS =======*/
    
    @media (max-width: 768px) {
      
  html {
    font-size: 14px;
  }
  
  #cab { height: fit-content;
    margin: 15px;
    margin-bottom: -3px;
    display: grid;
grid-template-columns: 80px 70%;
grid-template-rows: 100px 0px;
  }

  .ttl {
    font-size: 40px;
    text-align:center;
    margin-left: 14px;
    grid-column: 2; grid-row: 1;
  }

  .ttl7 {
    margin-top: -55px;
    grid-column: 2; grid-row: 2;
  }

  #icone { margin: 0;
    width: 100px; margin-right: 0;
    grid-column: 1; grid-row: 1/2;
  }

  #pagina {
    margin: 15px;
    margin-top: 0;
    grid-template-columns: auto;
    grid-template-rows: auto auto auto;
  }

  .ult-atlz { font-size: 17px; height: fit-content; padding: 3px; margin:0;
  grid-column: 1;
  grid-row: 1; }

  #menu {
    margin: 15px;
    margin-top: 0;
    margin-bottom: -3px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto auto auto;
    column-gap: 0;
  }

  .bt-menu { width: auto; flex: 1;
    font-size: 14px; margin: 0;
    padding: 3px;
  }
  

  .lat { border-left: none; border-top: solid #000 3px;
    grid-column: 1;
    grid-row: 3;
    width: auto;
    padding: 8px;
  }


  .mrl-compl {
    grid-column: 1;
    width: 100%;
    font-size: 13px;
  }

  #mural {
    grid-column: 1;
    grid-row: auto;
  }

  article {
    font-size: 13px;
  }

  article p {
    margin-top: 5px;
  }
}

    
    
     
    


 