*{
    padding: 0%;
    margin: 0%;
}

:root{
    --color1:#f26b21;
    --color2:#f78e31;
    --color3:#fbb040;
    --color4:#fcec52;
    --color5:#cbdb47;
    --color6:#99ca3c;
    --color7:#208b3a;
    --color8:#f73131;
}


body{
    display: flex;
    flex-direction: column;
}

footer{
    background-color: var(--color7);
    width: 100%;
}

img{
    padding-top: 2%;
    text-align: center;
    display:block;
    margin:auto;
}
/* Quitar las viñetas */
ul{
    list-style: none;
}

/* Lista principal */
.nav{
    background-color:var(--color2);
    display: flex;
    justify-content:space-evenly;
    position: fixed;
    width: 100%;
}

/* Listas dentro de las listas principales */
.nav li a{
    background-color:var(--color2);
    color: whitesmoke;
    text-decoration: none;
    text-align: center;
    padding: 10% 10%;
    display: block;
    min-width: 100%;
    font-family: Arial, Helvetica, sans-serif;
}

/* Forma de las lists dentro de nav */
.nav > li {
    width: 10%;
}

/* Diseño de recuadros dentro de nav */
.nav li a:hover{
    background-color: var(--color8);
}

/* Ajustes de posición en las listas dentro de nav */
.nav li ul {
    display:none;
    position:absolute;
    min-width: 10%;
    max-height: 10%;
}

.nav li:hover > ul {
display:block;
}
.nav li ul li {
    position:unset;
}
 
/* Margen */
section{
    padding-left: 20%;
    padding-right: 20%;
    padding-bottom: 2%;
    text-align: justify;
    text-indent: 2em;
    font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
h1{
    padding-bottom: 1%;
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    text-align: center;
}
.sec1{
    background-color:var(--color3);
    padding-top: 3%;
}

.sec2{
    background-color:var(--color4);
}

.sec3{
    background-color:var(--color5);
}

.sec4{
    background-color:var(--color6);
}

.fondo1{
    background-color:#fdab30 ;
}

.fondo2{
    background-color:#fae844 ;
}

.fondo3{
    background-color:#b9ce03 ;
}

.fondo4{
    background-color:#88c418 ;
}

.helado{
    float: inherit;
    padding-left: 3%;
}

.naruto{
    float: inherit;
}