Someone tell me how to add a logo to my site.

I’m desperately trying to add a logo to my site. I have no PHP experience but can follow instructions very well.

The php I have under header is as follows…

/* =Header
----------------------------------------------- */
#header {
	background:url(images/header-bg.jpg) left bottom repeat-x;
	padding-bottom:20px;
}
#header .top-bg, #footer {
	background:url(images/header-top-footer-bg.jpg) repeat-x;
	clear: both;
}
#header .top-bg {
	background-position:center bottom;
	height:16px;
	border-bottom:4px solid #ccc;
}
/* Logo Tile */
#header .logo-wrap {
	padding-left:20px;
	float:left;
	margin-top:54px;
	min-width: 610px;
}
#site-logo {
    display: inline-block;
    float: left;
    padding-bottom: 0;
}
#site-logo a img {
    float: left;
    height: auto;
    max-width: 100%;
    padding-right: 20px;
}
#site-details {
    display: inline-block;
    float: left;
    padding-right: 20px;
}
h1#site-title {
	font-size: 45px;
	font-family: 'Lobster';
	font-weight:normal;
	padding-bottom:0px;
}
h1#site-title a {
	line-height:54px;
}
h1#site-title a:hover {
	color: #444444;
}
h2#site-description {
	font:14px Arial, Helvetica, sans-serif;
	color:#666;
	padding:8px 0 0 0;
}

/* Social-Search */
#header .social-search {
	float: right;
	width: 306px;
	padding-right: 20px;
	margin-top: 40px;
}
ul.social-profile {
	list-style: none;
	margin: -10px 0 0;
}
#header ul.social-profile {
	float: right;
}
ul.social-profile li {
	float: left;
	margin: 10px 10px 0 0;
}

#header ul.social-profile li {
	margin: 10px 0 0 10px;
}
ul.social-profile li a {
	text-indent: -99999px;
}
ul.social-profile li a {
	background: url(images/social-profile.png) right bottom no-repeat;
    display: block;
	height: 33px;
    width: 33px;
	text-indent: -99999px;

[Please use code buttons when posting code; and use pastebin for lengthy code ]

I have no ideas what any of that means. Can someone just tell me how to upload a logo PLEASE!!!!!