CSS Browser compatibility problems - Safari

Question

I just published my portfolio site and it looks/functions fine in Firefox and Chrome, but is COMPLETELY screwed in safari and I don't even want to check IE.
It previews in Safari browser out of Dreamweaver fine too, which really confuses me since that what I was going off of.  The flash elements don't work correctly, the Spry menu bar and accordions don't work. None of the hover classes work.  The image thumbnails which use lightbox don't display.  And the content section isn't even visible.  I don't even know where to start.  Any help/suggestions would be much appreciated.  Here is some code:
Site:  http://damon9.com
CSS
@charset "UTF-8";
/* CSS Document */
<style type="text/css">
#wrapper{
margin: 0 auto;
width: 100%;
#Table_01 {
position:relative;
left:0px;
top:0px;
width:1280px;
height:900px;
margin: 0 auto;
#apDiv1 {
position:absolute;
left:563px;
top:187px;
width:10px;
height:217px;
z-index:1;
body {
background-color: #000;
#index-01 {
position:absolute;
left:0px;
top:0px;
width:1280px;
height:107px;
#index-02 {
position:absolute;
left:0px;
top:107px;
width:223px;
height:297px;
#Damonx20Carlstrom {
position:absolute;
left:223px;
top:107px;
width:350px;
height:66px;
#PowerButton {
position:absolute;
left:574px;
top:108px;
width:159px;
height:177px;
#index-05 {
position:absolute;
left:732px;
top:107px;
width:548px;
height:25px;
#index-06 {
position:absolute;
left:732px;
top:132px;
width:107px;
height:55px;
#Creativex20Portfolio {
position:absolute;
left:839px;
top:132px;
width:239px;
height:41px;
#index-08 {
position:absolute;
left:1078px;
top:132px;
width:202px;
height:272px;
#index-09 {
position:absolute;
left:223px;
top:173px;
width:350px;
height:14px;
#index-10 {
position:absolute;
left:839px;
top:173px;
width:239px;
height:14px;
#index-11 {
position:absolute;
left:223px;
top:187px;
width:16px;
height:217px;
#Home a{
background-image:url(../images/Home.jpg);
position:absolute;
left:239px;
top:187px;
width:80px;
height:32px;
#Home a:link{
position:absolute;
text-decoration: none;
background-image:url(../images/Home.jpg);
width:80px;
height:32px;
#Home a:visited{
position:absolute;
text-decoration: none;
background-image:url(../images/Home.jpg);
width:80px;
height:32px;
#home a:hover{
position:absolute;
text-decoration: none;
background-image:url(../images/Home_hover2.jpg);
width:80px;
height:32px;
#index-13 {
position:absolute;
left:319px;
top:187px;
width:30px;
height:217px;
#About a{
background-image:url(../images/About.jpg);
position:absolute;
left:349px;
top:187px;
width:77px;
height:32px;
#about a:link {
position:absolute;
text-decoration: none;
background-image:url(../images/About.jpg);
width:77px;
height:32px;
#about a:visited {
position:absolute;
text-decoration: none;
background-image:url(../images/Digital.jpg);
width:77px;
height:32px;
#about a:hover {
position:absolute;
text-decoration: none;
background-image:url(../images/About_hover2.jpg);
width:77px;
height:32px;
#index-15 {
position:absolute;
left:426px;
top:187px;
width:36px;
height:217px;
#Resume a{
position:absolute;
background-image:url(../images/Resume.jpg);
left:462px;
top:187px;
width:101px;
height:32px;
#Resume a:link{
position:absolute;
text-decoration: none;
background-image:url(../images/Resume.jpg);
width:101px;
height:32px;
#Resume a:visited{
position:absolute;
text-decoration: none;
background-image:url(../images/Resume.jpg);
width:101px;
height:32px;
#Resume a:hover{
position:absolute;
text-decoration: none;
background-image:url(../images/Resume_hover2.jpg);
width:101px;
height:32px;
#index-17 {
position:absolute;
left:563px;
top:187px;
width:10px;
height:217px;
#index-18 {
position:absolute;
left:732px;
top:187px;
width:20px;
height:217px;
#Print {
position:absolute;
left:752px;
top:187px;
width:77px;
height:32px;
#index-20 {
position:absolute;
left:829px;
top:187px;
width:38px;
height:217px;
#Art a{
position:absolute;
background-image:url(../images/Art.jpg);
left:867px;
top:187px;
width:63px;
height:32px;
#Art a:link{
position: absolute;
text-decoration: none;
background-image:url(../images/Art.jpg);
width:63px;
height:32px;
#Art a:visited{
position: absolute;
text-decoration: none;
background-image:url(../images/Art.jpg);
width:63px;
height:32px;
#Art a:hover{
position: absolute;
text-decoration: none;
background-image:url(../images/Art_hover2.jpg);
width:63px;
height:32px;
#index-22 {
position:absolute;
left:930px;
top:187px;
width:52px;
height:217px;
#Digital {
position:absolute;
left:982px;
top:187px;
width:84px;
height:32px;
z-index: 20;
#index-24 {
position:absolute;
left:1066px;
top:187px;
width:12px;
height:217px;
#index-25 {
position:absolute;
left:239px;
top:219px;
width:80px;
height:185px;
#index-26 {
position:absolute;
left:349px;
top:219px;
width:77px;
height:185px;
#index-27 {
position:absolute;
left:462px;
top:219px;
width:101px;
height:185px;
#index-28 {
position:absolute;
left:752px;
top:219px;
width:77px;
height:185px;
#index-29 {
position:absolute;
left:867px;
top:219px;
width:63px;
height:185px;
#index-30 {
position:absolute;
left:982px;
top:219px;
width:84px;
height:185px;
#index-31 {
position:absolute;
left:573px;
top:285px;
width:159px;
height:119px;
#index-32 {
position:absolute;
left:0px;
top:404px;
width:211px;
height:496px;
#index-34 {
position:absolute;
left:1091px;
top:404px;
width:189px;
height:496px;
#NewPortfolioSite-32 {
position:absolute;
left:0px;
top:404px;
width:211px;
height:796px;
h2,h3,h4,h5,h6,p{
font-family: Helvetica, Arial, "Trebuchet MS", sans-serif;
letter-spacing: 1px;
h2 {
color: #FFF;
font-size: 16px;
h3 {
font-size: 14px;
color: #FFF;
h4 {
font-size: 12px;
color: #FFF;
h5 {
font-size: 10px;
color: #FFF;
p{
font-size: 12px;
color: #FFF;
/*Style is used for flash pieces*/
h1 {
padding: 20px;
#Content {
position:absolute;
padding-left: 35px;
padding-right: 35px;
padding-top: 10px;
padding-bottom: 15px;
background-image:url(../images/FrontContent2_S1.png) ;
float:left;
left:211px;
top:404px;
width:810px;
height:738px;
z-index: 20;
background-repeat:no-repeat;
#BackContent {
position:absolute;
background-image:url(../images/BackContent.jpg);
left:-80px;
top:172px;
width:810px;
height:738px;
z-index: 1;
#NewPortfolioSite-34 {
position:absolute;
left:1091px;
top:404px;
width:189px;
height:796px;
#Footer {
position:absolute;
left:-80px;
top:911px;
width:880px;
height:58px;
text-align: right;
#Footer p{
text-align:right;
font-size: 12px;
padding-right: 235px;
padding-top: 5px;
letter-spacing: 1px;
#NewPortfolioSite2-31 {
position:absolute;
left:239px;
top:234px;
width:54px;
height:170px;
#space {
position:absolute;
left:293px;
top:234px;
width:242px;
height:244px;
z-index: 10;
#NewPortfolioSite2-33 {
position:absolute;
left:535px;
top:234px;
width:28px;
height:170px;
#NewPortfolioSite2-15 {
position:absolute;
left:133px;
top:-47px;
width:36px;
height:47px;
#NewPortfolioSite2-13 {
position:absolute;
left:24px;
top:-47px;
width:30px;
height:47px;
#NewPortfolioSite2-25 {
position:absolute;
left:239px;
top:219px;
width:80px;
height:15px;
#NewPortfolioSite2-26 {
position:absolute;
left:-54px;
top:-15px;
width:77px;
height:15px;
#NewPortfolioSite2-27 {
position:absolute;
left:462px;
top:219px;
width:101px;
height:15px;
#FlashID {
position:absolute;
left:1px;
top:0px;
width:242px;
height:244px;
z-index: 10;
#FlashID2 {
position:absolute;
width: 159px;
height: 178px;
z-index:  20;
top: 0px;
left: -1px;
#PWbutton {
position:absolute;
left:573px;
top:107px;
width:159px;
height:178px;
z-index: 1;
#Spaceback {
position: absolute;
left: 1px;
top: 0px;
width: 242px;
height: 244px;
z-index: 1;
#Menubar1 li, #MenuBar2 li {
font-family:"Helvetica", Arial, Trebuchet MS, sans-serif;
letter-spacing: 1px;
font-weight:100;
#vlightbox1 h1, h2, h3, h4, h5, h6{
font-weight:100;
ul, ol, dl { position: relative; }
#timelapse {
padding-left: ;
#specialeffects{
#autodesk{
padding-left: ;
#me{
position: absolute;
float: left;
padding-left: 120px;
padding-top:25px;
z-index: auto;
#description{
float: right;
position: absolute;
padding-top: 100px;
padding-right: 50px;
padding-left: 420px;
line-height: 24px;
#description p{
letter-spacing: 2px;
float: right;
#aboutcontent {
padding-right: 40px;
padding-left: 40px;
#socialmedia2 {
background-image:url(../images/socialmedia2.png);
position:absolute;
float: right;
left:656px;
top:5px;
width:214px;
height:43px;
z-index: 20;
#iconrow{
padding: 6px;
padding-left: 18px;
#linkedin{
float: left;
padding-right: 5px;
#twitter {
float: left;
padding-right: 5px;
#facebook {
float: left;
padding-right: 5px;
#buscard{
float: right;
padding-right: 190px;
a img{
border: none;
</style>

Answer 1

I wonder if adding a position and z-index to it would help.
Adding a position and z-index to anything rarely helps!  I think the problem is more systemic than that.  But I'm not a Flash person so I don't really know.