z-index image in front

Hello,

My image wont show in front of the black background of a solid.

here is the php:

<div id="sidebar-midden">

	<div class="navigatie">
	<?php
      echo '<a href="' . get_permalink( $post_id = 308 ) . '" title="' . esc_attr( $thumbnail->post_title ) . '">';
      echo get_the_post_thumbnail($post_id = 308, array(262,), $attr );
      echo '</a>';
	?>
</div>

and here is the css:

.navigatie {
	background-color: #000;
	float: left;
	width: 264px;
	height: 345px;
	margin-left: 0px;
	margin-top: 0px;
	position: relative;

	overflow: hidden;
	z-index: -1;

}
#sidebar-midden {
   float: left; background: url('images/verleden.png') no-repeat;
   position: relative;
   background-color: none;
   float: left;
   text-align: left;
   width: 324px;
   height: 405px;
   margin-left: 14px;
   z-index:1;
}

what am i doing wrong? thanks for any help.