How to change header image text to my own logo

After reading so many other posts, I still do not have an answer to my issue. I would like to replace the header text and image with my own logo. The link to my site is https://www.rockitmomma.com. Thank you so much for any help!!

Here is the css code for the header:
/* =Header
————————————————————– */

#header {
background:#8f8f8f;
border-bottom:1px solid #000;
padding: 0 0 0 0;
margin:0 auto;
width:100%;
}
#site-title {
font-size: 55px;
line-height: 55px;
margin: 15px 0 15px 0;
text-align:center;
width: 100%;
}
#site-title a {
color:#e02444;
font-family: Arial, Helvetica, sans-serif;
text-decoration: none;
text-shadow: #000 1px 1px 3px;
}

#site-description{
clear:both;
color:#fff;
display:block;
font-family: Arial, Helvetica, sans-serif;
font-size: 35px;
margin: -5px 0 20px 0;
text-align:center;
text-shadow: #000 1px 1px 3px;
}

/* This is a custom header image */
# branding {
clear:both;
padding: 15px 0;
color: #e02444
}