/*======================================================
RESET
======================================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    overflow-x:hidden;
    background:#ffffff;
    font-family:Arial, Helvetica, sans-serif;
}

/*======================================================
PORTADA
======================================================*/

.hero{

    position:relative;

    width:100%;

}

.portada{

    width:100%;

    height:auto;

    display:block;

}

/*======================================================
BOTÓN
======================================================*/

.boton{

    position:absolute;

    left:50%;

    bottom:70px;

    transform:translateX(-50%);

    width:78px;

    height:78px;

    border-radius:50%;

    background:#FFFFFF;

    border:2px solid #C8A96A;

    display:flex;

    justify-content:center;

    align-items:center;

    text-decoration:none;

    box-shadow:0 8px 18px rgba(0,0,0,.20);

    z-index:9999;

    transition:.30s;

    animation:flotar 2s infinite;

}

.boton span{

    color:#C8A96A;

    font-size:34px;

    font-weight:bold;

}

.boton:hover{

    transform:translateX(-50%) scale(1.08);

}

/*======================================================
ANIMACIÓN BOTÓN
======================================================*/

@keyframes flotar{

    0%{

        transform:translate(-50%,0px);

    }

    50%{

        transform:translate(-50%,-10px);

    }

    100%{

        transform:translate(-50%,0px);

    }

}

/*======================================================
SECCIONES
======================================================*/

.seccion{

    width:100%;

}

.imagen-seccion{

    width:100%;

    height:auto;

    display:block;

}