body {
  background-image: url('https://pa1.aminoapps.com/6900/3e79182c43b0f99ed179a6a2174c07f783d789a3r1-383-299_hq.gif');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

@font-face {
 font-family:blood;
 src: url('bloodcrowe.ttf') format('truetype'), url('bloodcrowc.ttf') format(truetype);
}
@font-face {
 font-family:blood1;
 src: url('bloodcrowc.ttf') format(truetype);
}

.aguiar:hover {
  background-color:black ;
  background-image: url('https://images.vexels.com/media/users/3/155304/isolated/preview/90b5b6fdee2a9517bfba696cfa1359b4-respingo-de-sangue-liso.png');
}

.dalmo:hover {
  background-color:black ;
  background-image: url('https://images.vexels.com/media/users/3/155304/isolated/preview/90b5b6fdee2a9517bfba696cfa1359b4-respingo-de-sangue-liso.png');
}

.jae:hover {
  background-color:black ;
  background-image: url('https://images.vexels.com/media/users/3/155304/isolated/preview/90b5b6fdee2a9517bfba696cfa1359b4-respingo-de-sangue-liso.png');
}

.kemi:hover {
  background-color:black ;
  background-image: url('https://images.vexels.com/media/users/3/155304/isolated/preview/90b5b6fdee2a9517bfba696cfa1359b4-respingo-de-sangue-liso.png');
}
.laby:hover {
  background-color:black ;
  background-image: url('https://images.vexels.com/media/users/3/155304/isolated/preview/90b5b6fdee2a9517bfba696cfa1359b4-respingo-de-sangue-liso.png');
}

.henri:hover {
  background-color:black ;
  background-image: url('https://images.vexels.com/media/users/3/155304/isolated/preview/90b5b6fdee2a9517bfba696cfa1359b4-respingo-de-sangue-liso.png');
}


.grupo {
  margin: 10px auto;
  box-shadow: 2px 4px 6px rgba(27, 12, 26, 0.5);
  background-color: red;
  padding: 150px;
  max-width: 100%;
  background-image: url('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSY3uR8vku-AJq1Dl7GQ9QKcfyPeR3aErrcbg&s');
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
}

h1 {
  font-family: 'blood', Times, serif;
  font-size: 60px;
  text-align: center;
  color: Maroon;
}

p {
  font-family: 'blood1', Times, serif;
  font-size: 20px;
 color: white; 
 letter-spacing: 2px;
}

h3 {
  font-family: 'blood', Times, serif;
  font-size: 40px;
  text-align: center;
  color:white;
  text-shadow: 2px 3px 2px #000;
}

h4 {
  font-family: 'blood', Times, serif;
  font-size: 30px;
  text-align: left;
  color: white;
}

.historia {
  border: 1px solid black;
  margin: 30px auto;
  box-shadow: 2px 4px 6px rgba(27, 12, 26, 0.5);
  padding: 50px;
  width: 1000px;
  background-color: rgba(255, 255, 255, 0);
  backdrop-filter: blur(10px);
}
  
  
.aguiar {
  border: 1px solid black;
  margin: 30px auto;
  box-shadow: 2px 4px 6px rgba(27, 12, 26, 0.5);
  padding: 20px;
  width: 10px;
  background-color: rgba(255, 255, 255, 0);
  backdrop-filter: blur(10px);
  flex: 1;
   overflow: hidden;
   cursor: pointer;
  transition: background-color 0.3s ease;
}

.p1 {
   margin-left: 20px;
   flex: 1;
}

.coluna1 {
  display: flex; /* Faz com que os itens filhos fiquem um ao lado do outro */
  align-items: center;
  margin-left: 20px;
  margin-right: 20px;
}

.aguiarimg{
  width: 250px; 
  height: 200px; 
  object-fit: cover;
}

 .dalmoimg {
  width: 250px; 
  height: 200px; 
  object-fit: cover;
 
  float: right;
  }

.dalmo {
  border: 1px solid black;
  margin: 30px auto;
  box-shadow: 2px 4px 6px rgba(27, 12, 26, 0.5);
  padding: 30px;
  width: 15px;
  background-color: rgba(255, 255, 255, 0);
  backdrop-filter: blur(10px);
  background-image: url('');
  flex: 1;
  overflow: hidden;
  cursor: pointer;
  transition: background-color 0.3s ease;
  }
  
  
  .coluna2 {
  display: flex;
  align-items: center;
  margin-left: 20px;
  margin-right: 20px;
  }
  
  .p2 {
   margin-left: 20px;
   flex: 1;
  }

  
.jae {
 border: 1px solid black;
  margin: 30px auto;
  box-shadow: 2px 4px 6px rgba(27, 12, 26, 0.5);
  padding: 30px;
  width: 10px;
  background-color: rgba(255, 255, 255, 0);
  backdrop-filter: blur(10px);
  flex: 1;
   overflow: hidden;
   cursor: pointer;
  transition: background-color 0.3s ease;
}

.coluna3 {
  display: flex; /* Faz com que os itens filhos fiquem um ao lado do outro */
  align-items: center;
  margin-left: 20px;
  margin-right: 20px;
}

.jaeimg{
  width: 250px; 
  height: 200px; 
  object-fit: cover;
}

.kemi {
 border: 1px solid black;
  margin: 30px auto;
  box-shadow: 2px 4px 6px rgba(27, 12, 26, 0.5);
  padding: 30px;
  width: 10px;
  background-color: rgba(255, 255, 255, 0);
  backdrop-filter: blur(10px);
  flex: 1;
   overflow: hidden;
   cursor: pointer;
  transition: background-color 0.3s ease;
}

.coluna4 {
  display: flex; /* Faz com que os itens filhos fiquem um ao lado do outro */
  align-items: center;
  margin-left: 20px;
  margin-right: 20px;
}

.kemiimg{
  width: 250px; 
  height: 200px; 
  object-fit: cover;
}

.laby {
 border: 1px solid black;
  margin: 30px auto;
  box-shadow: 2px 4px 6px rgba(27, 12, 26, 0.5);
  padding: 30px;
  width: 10px;
  background-color: rgba(255, 255, 255, 0);
  backdrop-filter: blur(10px);
  flex: 1;
   overflow: hidden;
   cursor: pointer;
  transition: background-color 0.3s ease;
}

.coluna5 {
  display: flex; /* Faz com que os itens filhos fiquem um ao lado do outro */
  align-items: center;
  margin-left: 20px;
  margin-right: 20px;
}

.labyimg{
  width: 250px; 
  height: 200px; 
  object-fit: cover;
}

.henri {
border: 1px solid black;
  margin: 30px auto;
  box-shadow: 2px 4px 6px rgba(27, 12, 26, 0.5);
  padding: 20px;
  width: 10px;
  background-color: rgba(255, 255, 255, 0);
  backdrop-filter: blur(10px);
  flex: 1;
   overflow: hidden;
   cursor: pointer;
  transition: background-color 0.3s ease;
}

.coluna6{
  display: flex; /* Faz com que os itens filhos fiquem um ao lado do outro */
  align-items: center;
  margin-left: 20px;
  margin-right: 20px;
}

.henriimg{
  width: 250px; 
  height: 200px; 
  object-fit: cover;
}