.gallery_container {
	width: 370px; 
	margin: 20px auto 20px auto; 
	position: relative; 
	border: 0px solid #000;
}
.gallery{
          margin:0; padding:0;
          overflow:hidden; /* Clears the floats */
          width:100%; /* IE and older Opera fix for clearing, they need a dimension */
          list-style:none;
}
.gallery li {
            float:left;
            display:inline; /* For IE so it doesn't double the 1% left margin */
            width:72px;
            margin:0 0 0 0; padding:0 0 0 0;
            height:73px; /* Height of img (75) + 2 times 3px padding + 2 times 1px border = 83px */
            position:relative; /* This is the key */
            background:url(45degree.png);
			
}
.gallery a,
.gallery img{
              display:block;
              width:100%;
}

a img{ border:none; } /* A small fix */

.gallery a:link,
.gallery a:visited,
.gallery a:focus,
.gallery a:hover,
.gallery a:active{
              padding:3px;
              background:#9A090D;
              width:60px; height:60px;
              border:0px solid #FFCC00; /* We blend the border with the bg, as if it isn't there */
              position:absolute; top:50%; left:50%; /* position it so that image's top left corner is in the center of the list item */
              margin:-30px 0 0 -30px; /* Pull the image into position with negative margins (margins value is half of the width of the image) */
}
.gallery a:hover{
			border: 0px;
              border-color:#ffcc00;
			  background:#FFCC00;
}

/* These are all optional, for decoration purpouses only */
/*
.gallery{
              border-bottom:2px solid #000;
              padding-bottom:10px;
              margin-top:10px;
}*/