/*fuentes*/

a {
  font-family: "Sigmar", sans-serif;
  font-weight: 400;
  font-style: normal;
}

h1 {
 font-family: "Sigmar", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #4CA4F6;
  text-decoration: underline;
  }
  
h2 {
 font-family: "Sigmar", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: grey;
  text-decoration: underline;
  }
  
h3 {
    font-family: "Nova Mono", monospace;
  font-weight: 400;
  font-style: normal;
  color: grey;
  text-decoration: none; 
    
    }

p {
  font-family: "Nova Mono", monospace;
  font-weight: 400;
  font-style: normal;
  color: #4CA4F6;
  text-decoration: none; 
  }
  
li {
    font-family: "Nova Mono", monospace;
    font-weight: 400;
    font-style: normal;
    color: #4CA4F6;
 
    }
/*estructura*/

body {
background-image:url("https://files.catbox.moe/a7lo1a.png");
}

.estructura {
 background-color: white; 
  align-items: center; 
  text-align: center; 
  width: 100%;
  }
  
.menu {
  display: flex; 
  height: 70px; 
  background-color: white; 
  align-items: center; 
  padding: 10px; 
  }
  
  .menu li a {
    text-decoration: none;
    color: #4CA4F6;
    padding: 20px;
    display: block;
    font-weight: 400;
    font-style: normal;


}

.menu li {
   display: inline-block;
   text-align: center;
}
.menu li a:hover {
    background-color: #4CA4F6;
    color: white; 
    

}

.logo {
  display: flex; 
  align-items: center; 
  margin-right: 10px; 
  }
  
header {
    background-image:url("https://files.catbox.moe/fhtexu.png");
    width: 100%;
    height: 20em;
    user-select: none;
    background-size: cover;
    background-position: 80% center;
    background-color: black;
    
     }
     
     
     
main {
  margin: 2em auto;
    max-width: 800px;
    padding: 0 2em;
    display: block;
   background-color: white; 
   overflow: auto; 
   }

footer {
  text-align: center; 
  position: center; 
  width: 100%;
  bottom: 0; 
  background-color: #4CA4F6;
  }
  
  footer h3 {
    font-size: 25px; 
    padding: 10px 0; 
    font-family: "Nova Mono", monospace;
    font-weight: 400;
    font-style: normal;
    color: white; 
    
    }
footer p {
  padding: 3px 0; 
  font-size: 14px;
  color: white; 
  
  }
  
  footer .seccion-1 {
    padding: 10px 0; 
    background-color: #4CA4F6;
    color: white; 
    
    
    }
    
    footer .seccion-1 a{
    display: block; 
    color: white; 
    text-decoration:none; 
     font-family: "Nova Mono", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 14px; 
    
    
    }
    
    footer .seccion-2 {
      background-color:#4CA4F6;
      padding: 10px 0;
      color: white; 
    
      }
      
    @media (min-width:800px) {
      footer .seccion-1 {
        display: flex;
        }
      footer .seccion-1 div {
        flex-grow: 1; 
        }
      }
      
    @media (max-width:766) {
      img {
        overflow: scroll; 
        }
      }
        
    /*about us*/
    
    .questions{
      text-decoration:none; 
      font-size: 14px; 
      text-align: left; 
      align-items: left;
       }
       
    /*characters*/
    
    .gallery {
      display: flex; 
      flex-wrap: wrap; 
      gap: 170px;
      border-radius: 10px;
      transition: .3s ease; 
      align-items: center; 
      } 
      
    .gallery details > summary,
.gallery img {
  border: 2px solid #6A6873;
}
      
      .gallery:hoover {
        transform:scale (1.02); 
        
        }
        
.btn {
  text-decoration: none; 
  padding:1.2rem 3rem; 
  background-color: #4CA4F6; 
  border-radius: 25px; 
  color: white; 
  transition: all 0.3s;
  
  }
        
.btn:hoover {
  background-color: white; 
  color:#4CA4F6
  transition: scale (1.2);
  }
  
  /*aboutheauthor*/
  
  .profile {
    border: 4px dashed #4CA4F6; 
    padding: 6px;
    width: 300px;
    float: left;
    margin: 10px;
    margin-right: 5px;
    
    }
  .about {
  border: 4px dashed  #4CA4F6;
   padding: 10px;
    width:  400px;
    height: 300px;
    float: right;
    margin: 10px;
    overflow: auto;
    position: left;
    
  }
  
  .fandom {
    padding: 6px;
    width: 300px;
    height: 220px;
    float: left;
    margin: 10px;
    margin-right: 5px;
    border: 4px dashed #4CA4F6;
    overflow: scroll;
    }
    
    .kinnie {
      padding: 6px;
    width: 220px;
    height: 220px;
    float: left;
    margin: 10px;
    margin-right: 5px;
    border: 4px dashed #4CA4F6;
    overflow: scroll;   
      
      }
    
    .band {
      padding: 6px;
    width: 170px;
    height: 220px;
    float: left;
    margin: 10px;
    margin-right: 5px;
    border: 4px dashed #4CA4F6;
    overflow: scroll;   
    }
      
    /*world*/
    
    .clasificacion {
      display: flex;
      flex-wrap: wrap; 
      gap:20px;
      border: 5px dashed #4CA4F6
      float: center; 
      position: center; 
      }