This is actually quite easy. I viewed your source code &...
<html>
<head>
<style type="text/css">
table.shadow {
align: center
}
td.shadow-top {
height: 16px;
background-image: url(/borders/shadow/top.gif)
}
td.shadow-topRight {
width: 16px;
height: 16px;
background-image: url(/borders/shadow/topRight.gif)
}
td.shadow-right {
width: 16px;
background-image: url(/borders/shadow/right.gif)
}
td.shadow-bottomRight {
width: 16px;
height: 16px;
background-image: url(/borders/shadow/bottomRight.gif)
}
td.shadow-bottom {
height: 16px;
background-image: url(/borders/shadow/bottom.gif)
}
td.shadow-bottomLeft {
width: 16px;
height: 16px;
background-image: url(/borders/shadow/bottomLeft.gif)
}
td.shadow-left {
width: 16px;
background-image: url(/borders/shadow/left.gif)
}
td.shadow-topLeft {
width: 16px;
height: 16px;
background-image: url(/borders/shadow/topLeft.gif)
}
td.shadow-center {
background-color: white
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Untitled Document</title>
<link rel="stylesheet" href="../clients/templates/ozmo_templates/style.css" type="text/css" />
</head>
<body>
<table class="shadow" border="0"
cellspacing="0" cellpadding="0" align="center">
<tr>
<td class="shadow-topLeft"></td>
<td class="shadow-top"></td>
<td class="shadow-topRight"></td>
</tr>
<tr>
<td class="shadow-left"></td>
<td class="shadow-center">/clients/templates/ozmo_templates/header.jpg</td>
<td class="shadow-right"></td>
</tr>
<tr>
<td class="shadow-left"></td>
<td class="shadow-center">
</p>
<p align="center">
SAVE ABOVE IN HEADER & BELOW IN FOOTER.
</p>
<p align="center"></p></td>
<td class="shadow-right"></td>
</tr>
<tr>
<td class="shadow-bottomLeft"></td>
<td class="shadow-bottom"></td>
<td class="shadow-bottomRight"></td>
</tr>
</table>
</body>
</html>
There are of course a few things you may want to change/move around since there's already content/variables in the header & footer.php. I hope that paints a picture.
I also suggest throwing your CSS into a seperate style sheet.