@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Chewy&family=Sigmar+One&family=Sniglet&display=swap');

body, h1,ul {
    margin: 0;
    padding: 0;
}

body {
background-color: rgb(238, 238, 106);

}

p{
    color: black;
    background-color: beige;
    font size: 20px;
    padding: 15px;
    font-family: 'Sniglet', cursive;
}

h1{
    color: lightblue;
    background-image: none;
    font-size: 90px;
    text-align:center;
    font-family: 'Chewy', cursive;

}
h2{
    font-family: 'Bebas Neue', cursive;
}
h3{
    background-color: antiquewhite;
    font-family: 'Chewy', cursive;
    padding: 2px;
    
}
 
h4{
    color: black;
    font-size: 50px;
    text-align: center;
    font-family: 'Sigmar One', cursive;

}

h8{
    font-family: 'Chewy', cursive;
}
/* selectores personalizados */

.destacado {
color: rgb(130, 206, 181);
background-color: beige;
font-size:20px;
list-style: none;
text-align: center;
padding: 5px;
}

.subtitulo {
    color: orangered;
    font-size: 30px;
    border: 2px solid rgb(238, 238, 106);
}

.contenedor { 
    width: 90%;
    margin: 0 auto 0 auto;
    background-color: white;
}

.menu {
    background-color:rgb(130, 206, 181) ;
    font-family: 'Bebas Neue', cursive;
    font-size: 20px;

}

.menu ul {
    list-style: none;
    text-align: center;
   
}

.menu li {
    display: inline-block;
    padding: 10px;
}
.menu a {
    color: rgb(155, 75, 0);
    text-decoration: none;
}
.menu a:hover {
    color: azure;
}

.cabeza{
    background-image: url(../img/star.jpg) 
}



.cuerpo2{
    border: 2px solid rgb(255, 123, 0);
}
.cuerpo3{
    border: 2px solid rgb(255, 123, 0);
}
.cuerpo4{
    border: 2px solid rgb(255, 123, 0);
}
.cuerpo5{
    border: 2px solid rgb(255, 123, 0);
}
.cuerpo6{
    border: 2px solid rgb(255, 123, 0);
}
.adaptable1{
    width: 100%;
}
.adaptable2{
    width: 30%;
    display: block;
    margin:auto
}
.adaptable3 {
    width: 50%;
    display: block;
    margin:auto

}
.adaptable4 {
    width: 70%;
    display: block;
    margin:auto
}
.adaptable5 {
    width: 70%;
    display: block;
    margin:auto
}


.centrar {
    display: block;
    margin:auto
    
}

.flecha{
    width: 05%;
    }