Background img sticking to the sticky footer

1

Hi guys!

I was wondering if it’s possible to make an background image stick at the bottom with my sticky footer?

http://www.grafikk-design.no/taksthuset/tjenester.html

CSS code:

/**HTML 5**/
 

html, body {
	height: 100%;
	margin:0;
	padding:0;
}

section, header, footer, aside, article, nav {
	display: block;
}

.content {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto 0;
	overflow:hidden;
}

/**FONTFACE**/

@font-face {
	font-family: 'BergamoStdRegular';
	src: url(../BergamoStd-Regular-webfont.eot);
	src: local('☺'), url(../BergamoStd-Regular-webfont.woff) format('woff'), url(../BergamoStd-Regular-webfont.ttf) format('truetype'), url('BergamoStd-Regular-webfont.svg#webfont31qx6I9T') format('svg');
	font-weight: normal;
	font-style: normal;
}

/**GENERAL**/

body {	
	background: url(../images/bg_top.jpg) repeat-x;
	font-family: serif;
	background-color: #eceff0;
}

a {
	text-decoration: none;
	color: #425776;
}

p {
	font-size: 13px;
	font-family: helvetica, sans-serif;
	font-weight: lighter;
	line-height: 16px;
	color: #425776;
	padding-left: 8px;
}

h1 {
	font-family: BergamoStdRegular;
	font-size: 27px;
	font-weight: normal;
	color: #425776;
	padding-left: 8px;
	margin-bottom: -13px;
}

h2 {
	font-family: BergamoStdRegular;
	font-size: 23px;
	font-weight: normal;
	color: #425776;
	line-height: 2px;
	padding-left: 8px;
	margin-top: 50px;
	
}

h3 {
	font-size: 14px;
	font-weight: bold;
	color: #ffffff;
}

h4 {
	font-size: 13px;
	color: #ffffff;
	font-family: BergamoStdRegular;
	font-weight: normal;
}

ul {
	overflow: hidden;
}

li {
	margin-left: 0;
	list-style: none;
}

.container_24 {
	padding-left: 5px;
	padding-right: 5px;
	position: relative;
}

/**HEADER**/

header {
	padding-top: 35px;
}

/**NAV**/

header nav {
	padding-left: 8px;
	overflow: hidden;
	margin-top: 43px;
	height: 30px;
	line-height: 30px;
}

header nav li {
	float: left;
	margin-right: 20px;
}

header nav li:before {
	content: '|';
	padding-right: 20px;
	color: #c4c7ca;
	text-shadow: 0 0 2px #f7fbfe;
}

header nav li:first-child::before {
	content: '|';
	padding-right: 20px;
	color: #c4c7ca;
	text-shadow: 0 0 2px #f7fbfe;
}

header nav li:last-child::after {
	content: '|';
	margin-left: 20px;
	color: #c4c7ca;
	text-shadow: 0 0 2px #f7fbfe;
}

header nav a {
	font-family: BergamoStdRegular;
	font-size: 12px;
	color: #425776;
}

header nav a:hover, nav .selected {
	color: #ced4da;
	text-decoration: none;
	-webkit-transition: color .5s;
	-moz-transition: color .5s;
	-o-transition: color .5s;
	transition: color .5s;	
}

/**LOGO**/

#logo {
	position: absolute;
	top: 30px;
	right: 20px;
}

/**MAIN**/

#main {
	background: url(../images/bg_logo.png) bottom right no-repeat;
	clear: both;
	overflow: hidden;
	padding-top: 85px;
	padding-bottom: 97px;
}

#mainImage {
	padding-top: 65px;
	padding-bottom: 100px;
}

#secondary {
	margin-top: 123px;
}

#third {
	padding-top: 57px;
}

#fourth {
	padding-top: 57px;
}

#fifth {
	padding-top: 57px;
}

#sixth {
	padding-top: 57px;
}

#seventh {
	padding-top: 25px;
}

#eight {
	padding-top: 21px;
}

/**FOOTER**/
	
.footer {
	position: relative;
	clear: both;
	margin-top: -97px;
	width: 100%;
	background: url(../images/bg_footer.jpg) repeat-x;
	overflow: hidden;
	height: 97px;
	line-height: 97px;
}

#mntf a {
	float: left;
	padding-left: 8px;
	margin-top: 22px;
}

#copyright {
	float: right;
	padding-top: 35px;
	
}

HTML:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="css/reset.css" rel="stylesheet" />
<link href="css/960_24_col.css" rel="stylesheet" />
<link href="css/text.css" rel="stylesheet" />
<link rel="stylesheet" href="css/style.css"/>

		<title>Velkommen til Taksthuset Vestfold</title>
		<style>
			section, header, footer, aside, article, nav { display: block; }

		</style>
	</head>
<body>

<div class="content">
	<header class="container_24">
		<nav class="grid_16">
			<ul>
				<li>
					<a href="tjenester.html">TJENESTER</a>
				</li>
				<li>
					<a href="priser.html">PRISER</a>
				</li>
				<li>
					<a href="omoss.html">OM OSS</a>
				</li>
				<li>
					<a href="kontakt">KONTAKT OSS</a>
				</li>
			</ul>
		</nav>
	
		<div id="logo">
			<a href="index.html"><img src="images/logo.png" /></a>
		</div>
	</header>
	
	<div id="main" class="container_24">
		<div id="primary" class="grid_13">
			<h1>Tjenester vi kan hjelpe deg med:</h1>
				<img src="images/breakline.jpg" />
					<h2>Verditakst</h2>
					<p>Verditakst er en verdivurdering av det aktuelle objekt, med
					spesifisering av alle egenskaper ved objektet som kan ha
					avgjørende betydning for den endelige anslåtte verdi.
					Verdisettingen vil være basert på skjønn, samt markedssituasjonen
					for det aktuelle objekt. Verdien ansettes på takseringsdagen.</p>
				
					<h2>Tilstandsrapport</h2>
					<p>Tilstandsrapport er en detaljert beskrivelse av den tekniske og
					vedlikeholdsmessige tilstand. Rapporten beskriver
					tilstandssvekkelser og er uavhengig av markedskonjunkturene.</p>
					
					<h2>Skadetakst</h2>
					<p>Skadetakst gir en detaljert beskrivelse av en skade på et objekt,
					med utarbeidelse av kostnadsoverslag for utbedring av skaden.
					En skadetakst utarbeides som regel i forbindelse med et
					forsikringsoppgjør.</p>
		</div>
	</div>
		
</div>	


	
	<div class="footer">
		<section class="container_24">
			<div id="mntf" class="grid_16">
				<a href="http://www.ntf.no"><img src="images/mntf_logo.png" /></a>
			</div>
			
			<div id="copyright" class="grid_8">
				<h4>Copyright '11 Taksthuset Vestfold  - All Rights Reserved</h4>
			</div>
		</section>
	</div>
</body>
</html>