Por que el filtro de CSS afecta al texto y no a la imagen, el background esta dentro del body, o es el mismo body, como consigo aplicar este filtro solo a el background? Alguna manera de manejar el backgroun aparte, ya intente ponerlo como etiqueta en el body e igual se modifica todo el texto y no la imagen.
.titulo{
font-family: 'Rokkitt', serif;
text-align: center;
margin-top: 5%;
overflow: hidden;
font-size: 50px;
}
<!DOCTYPE html>
<html class="window"lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<link href="css/estilo.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Stylish&display=swap" rel="stylesheet">
</head>
<body>
<style>
body {
background: url("http://i.imgur.com/yqPxEl7.jpg");
background-repeat: no-repeat;
background-size: cover;
filter: blur(0.1rem);
}
</style>
<div class="titulo">
<h1>Sample text</h1>
</div>
</body>
</html>