@font-face {
    font-family: 'Metropolis';
    src: url('../web/EOT/Metropolis-Regular.eot'),
         url('../web/WOFF/Metropolis-Regular.woff') format('woff'),
         url('../ttf/Metropolis-Regular.ttf') format('truetype'); 
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}
@font-face {
    font-family: 'Metropolis Light';
    src: url('../web/EOT/Metropolis-ExtraLight.eot'),
         url('../web/WOFF/Metropolis-ExtraLight.woff') format('woff'),
         url('../ttf/Metropolis-ExtraLight.ttf') format('truetype'); 
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}
@font-face {
    font-family: 'Metropolis Light';
    src: url('../web/EOT/Metropolis-ExtraLightItalic.eot'),
         url('../web/WOFF/Metropolis-ExtraLightItalic.woff') format('woff'),
         url('../ttf/Metropolis-ExtraLightItalic.ttf') format('truetype'); 
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}
@font-face {
    font-family: 'Metropolis Thin';
    src: url('../web/EOT/Metropolis-Thin.eot'),
         url('../web/WOFF/Metropolis-Thin.woff') format('woff'),
         url('../ttf/Metropolis-Thin.ttf') format('truetype'); 
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}
@font-face {
    font-family: 'Metropolis Thin';
    src: url('../web/EOT/Metropolis-ThinItalic.eot'),
         url('../web/WOFF/Metropolis-ThinItalic.woff') format('woff'),
         url('../ttf/Metropolis-ThinItalic.ttf') format('truetype'); 
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}