Como usar fuentes .woff en mi sitio web

Lo primero es ubicar en el sistema de archivos del sitio web los archivos fuente woff. Lo recomendable es crear un directorio fonts dentro de tu hoja de estilos css.

Lo siguiente sería definir en el archivo css las fuentes:

por ejemplo:

@font-face {
    font-family: "mifuente";
    src: url("fonts/fuente.woff") format('woff');
}

@font-face {
    font-family: "mifuente";
    src: url("fonts/fuente-bold.woff") format('woff');
    font-weight: bold;
}

@font-face {
    font-family: "mifuente";
    src: url("fonts/fuente-boldoblique.woff") format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: "mifuente";
    src: url("fonts/fuente-oblique.woff") format('woff');
    font-style: italic;
}

Por último para aplicar la fuente en código html, en este caso un div:

<div class="micapa">
    <b>Esto esta escrito con fuente-bold.woff</b>
    <br/>
    <b><i>this will be written with fuente-boldoblique.woff</i></b>
    <br/>
    <i>this will be written with fuente-oblique.woff</i>
    <br/>
    this will be written with fuente.woff
</div>

y en el css:

.micapa{
    font-family: mifuente;
}

Cambiar color del menú hamburguesa (hamburger menu)

Si utilizas el framework Foundation y te preguntas como cambiar el color del menú que aparece para dispositivos móviles o de baja resolución de pantalla (hamburger menu).

Mediante css, en el archivo foundation.css.Encuentra el menu-icon span donde cambiaras la propiedad box-shadow estableciendo los colores que deseas para tu menú hamburguesa.