Background image CSS path using slim php folder structure - php

Question

I'm trying to do a simple background image on a page in my SlimPHP web app.
In my CSS file (which is loaded fine) I have:
.image1 {
background-color: transparent;
background: url("image1.jpg");
}
and my structure is:
-- project
-- app
-- routes
-- templates
-- www
-- css
-- stylesheet.css
-- image1.jpg
-- js
-- i
-- image1.jpg
In the network tab I get 403 Forbidden because slim is trying to access it as a page.
I have tried a few variations such as background-image, "../i/image1.jpg", but always get the same issues.
I can't find any other questions anywhere like this so there must be something simple I am missing!
I know SlimPHP fairly well but do not have much experience in CSS so any help would be appreciated!
Thanks
Additional:
Example of page request:
$app = new \Slim\Slim(array(
'templates.path' => '../templates',
));
$app->container->singleton('log', function () {
$log = new \Monolog\Logger('slim-skeleton');
$log->pushHandler(new \Monolog\Handler\StreamHandler('../logs/app.log', \Monolog\Logger::DEBUG));
return $log;
});
$app->view(new \Slim\Views\Twig());
$app->view->parserOptions = array(
'charset' => 'utf-8',
'cache' => realpath('../templates/cache'),
'auto_reload' => true,
'strict_variables' => false,
'autoescape' => true
);
$app->view->parserExtensions = array(new \Slim\Views\TwigExtension());
// Twig
$loader = new Twig_Loader_Filesystem(dirname(dirname(__FILE__)) . '/templates');
$twig = new Twig_Environment($loader);
/**
* Default home page
*/
$app->get('/', function() use ($app) {
$app->redirect('/home');
});
/**
* Index page
*/
$app->get('/home', function() use ($app, $twig) {
$params['page_title'] = 'home';
$template = $twig->loadTemplate('routes/index.html.twig');
$template->display($params);
});