* {
  margin: 0;
  padding: 0;

  
}



body {
color: white;
background: rgb(35, 25, 51);
display:grid ;
padding: 0px;
margin: 0px;
height: 900px;
 font-family:   Verdana, Geneva, Tahoma, sans-serif;
}

header {
  background-color: #D16732;
  justify-content: center;
  text-align: center;
  
}

footer {
  display: grid;
    
  justify-content: center;
  text-align: center;
  background-color: #3d667e;
  
  margin-top: 400px;
  padding: 25px;
}



h2 {
  
  text-align: center;
}


button {
background-color: #2d6a6e;
color: #fde3c5;
font-weight: bold;
font-family:  Verdana, Geneva, Tahoma, sans-serif;
font-Size: 1em;
border: solid 5px #b6c76d;
border-radius: 15px;
padding: 10px;
}

.Opções {
position: relative;
margin: 0;
display: block;


}

#imgbga {
    opacity: 1; /* Ensure the image starts fully visible */
    transition: opacity 0.5s ease; /* Smooth transition for opacity */
}

.Opções .containerop{
display: inline-flex;
flex-wrap: wrap;

justify-content: center;


margin: 20px 20px 0px 30px;
}

.Opções .containerop .quadro{
display: inline-block;
width: 300;
height: 250;
border: 10px solid #ed7e22;
overflow:hidden;
cursor: pointer;
padding: 5px 5px 5px 5px;
margin: 5;
border-radius: 25px;
background-color:#F7E2B3;
}

.Opções .containerop .quadro video{
height:190px;
transition: .2s linear;
}

.Opções .containerop .quadro:hover video{
transform: scale(1.1);
}

.Opções .containerop .quadro img{
    height: 200px;
    transition: opacity .5s ease;
    transition: .2s linear; /* Add transition for opacity */
}

.Opções .containerop .quadro:hover img{
transform: scale(1.1);
}

a {
text-decoration: none;
color: #f86f39;
font-family:   Verdana, Geneva, Tahoma, sans-serif;
font-weight: bolder;
font-size: 1.3em;
}

p {
  font-size: 1.3em;
}