Супер тонкий шрифт Arial CSS?

Question

Я работаю над заголовком своего веб-сайта, и мне очень нравится внешний вид тонкого шрифта, который используется во второй части названия здесь: http://tympanus.net/Development/AnimatedHeaderBackgrounds/ Я загрузил источник и играл с ним. В названии использовался шрифт Arial (хотя он и не определен) где бы то ни было, и когда я интегрировал то же форматирование в свой код, тонкая часть намного толще. Я немного искал исходный код и обнаружил, что всякий раз, когда я определяю семейство шрифтов, тонкая часть становится намного толще. Мне нужно определить его на моем сайте, так как используются несколько шрифтов. Здесь что-то не хватает?

CSS:

.main-title { 
    position: absolute; 
    margin: 0; 
    padding: 0; 
    color: #f9f1e9; 
    text-align: center; 
    top: 50%; 
    left: 50%; 
    -webkit-transform: translate3d(-50%,-50%,0); 
    transform: translate3d(-50%,-50%,0); 
    text-transform: uppercase; 
    letter-spacing: 0.1em; 
} 

.main-title .thin { 
    font-weight: 100; 
} 

HTML:

<h1 class="main-title">Connect <span class="thin">Three</span></h1> 

Answer 1

ли вы импортировать веб-шрифт?

@import url(http://fonts.googleapis.com/css?family=Raleway); 

https://jsfiddle.net/zn3n2gep/