body {
    margin: 0;
    padding: 20px;
    font-family: Arial, sans-serif;
    background-color: #f3f3f3;
}
body {
    margin: 0;
    padding: 20px;
    font-family: Arial, sans-serif;
    background-color: #f3f3f3;
}

.cabecalho {
    max-width: 900px;
    margin: auto;
    padding: 20px;
    background-color: white;
    border: 1px solid #ccc;
    border-radius: 10px;
}

.container {
    max-width: 900px;
    margin: auto;
}

.exercicio {
    margin-top: 20px;
    padding: 20px;
    background-color: white;
    border: 1px solid #ccc;
    border-radius: 10px;
}





.test {
    list-style-type: upper-roman;
}

.lart {
    width: 200px;
}

.test1 {
    list-style-type: square;
}
.li {
list-style-image: url('./estrela.png'); 

}
.ex4 {
    list-style-position: inside;
}

.ex4 li {
    border: 1px solid black;
}
.alerta {
    border: 2px solid red;
    border-radius: 8px;
    background-color: #ffe5e5;
    padding: 15px;
}
.botao {
    border: 3px dashed blue;
    background-color: #eeeeee;
    font-weight: bold;
}
.moldura {
    width: 350px;
    height: 160px;
    background-color: lightgreen;
    border: 5px dashed blue;
      background-image: url('Screenshot 2026-08-15 105441.png');
   
    border-radius: 10px 30px 20px 40px;
}
.ani2 {
    border-collapse: collapse;
    padding: 12px;
    
}
.caixa {
    width: 320px;
    background-color: lightyellow;

    border: 4px solid black;
    outline: 4px solid orange;

    text-align: center;
    padding: 10px;
    outline-style : solid ;
outline-color : green ;
outline-width : 4px ;
outline-offset : 20px ;
}
div {
width : 200px ;
height : 100px ;
 border : 4px solid black ;
 margin : 50px ;
}
#div1 {
outline-style : solid ;
 outline-color : red;
 outline-width : 4px ;
 }

 #div2 {
 outline-style : dashed ;
 outline-color : blue ;
 outline-width : 2px ;
 outline-offset : -2px ;
}

#div3 {
 outline-style : solid ;
outline-color : green ;
outline-width : 4px ;
 outline-offset : 20px ;
}
.cartao {
    width: 300px;
    padding: 20px;
    background-color: white;

    box-shadow: 5px 5px 15px ;
}

.div10 {
    width: 300px;
    padding: 20px;

    background-color: white;

    box-shadow: 5px 5px 15px gray;
}
.div11 {
    width: 300px;
    padding: 20px;
     background: white;
    border-style: solid;
    background-color: white;
  
    box-shadow: 5px 5px 15px gray;
    border-width: 10px;
}
.bloco-logo {
  width: 65%;
  margin-left: auto;
  margin-right: auto;
}

.menu {
  list-style: none;   /* remove os marcadores padrão */
  margin: 0;
  padding: 20px;
}

.menu li {
  display: inline-block;   /* itens lado a lado */
  margin-right: 10px;
}

.menu a {
  display: inline-block;
  background-color: #2e86de;   /* azul do print */
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  padding: 10px 20px;
  border-radius: 6px;
}

.menu a:hover {
  background-color: #1b5fa8;   /* azul mais escuro no hover */
}