Li no forum que a resolução é colocar todo o código dentro do head do HTML, mas porque é preciso colocar o nome da fonte também no arquivo CSS. Não entendi muito bem porque tive que repetir as informações do CSS no HTML sendo que esse arquivo do CSS seria justamente para evitar colocar tudo no head do HTML... segue o meu código que funcionou:
<head>
<title>Biografia - Amanda Santos</title>
<meta charset="UTF-8">
<link rel="icon" href="favicon.png">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Crimson+Text:400,400italic,600">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans+Condensed:700">
<style>
h2 {
font-family: "Arial";
font-size: 20px;
}
h1{
font-size: 40px;
background-color: rgb(133, 25, 68);
color: rgb(255, 255, 255);
text-align: center;
}
h1, h2{
font-family: "Open Sans Condensed", sans serif;
}
body{
background-color: #F2FFFC;
}
p{
text-align: justify;
font-family: "Crimson Text", serif;
}
</style>
</head>