Logo not displaying properly

go here to see my problem,
https://www.insurgentcamp.com

here is the test “logo”:
https://www.insurgentcamp.com/logo.jpg
(a random image I am trying to get to display at this time until my official logo is completed)

Here is the relevant code I am playing with:

/* begin Logo */
div.art-logo
{
  display: block;
  position: absolute;
  left:50%;
  float: left;
  top: 37px;
  width: 748px;

}

h1.art-logo-name
{
  display: block;
  text-align: center;
  left:-50%;
  position: relative;
}

h1.art-logo-name, h1.art-logo-name a, h1.art-logo-name a:link, h1.art-logo-name a:visited, h1.art-logo-name a:hover
{
  font-size: 41px;
  text-decoration: none;
  padding: 0;
  margin: 0;
  color: transparent !important; /*changed by AS from color: #1C1C1C !important; */
  text-indent: -9999px; /* added by AS - get rid of any text */
  background-image:url('https://www.insurgentcamp.com/logo.jpg'); /*added by AS trying to add custom logo...*/
}

/* end Logo */

Thank you whoever can help.