link scrolling photobanner

[mktalternativa]

hola estoy usando este codigo

http://designshack.net/articles/css/...tephotobanner/

para un scroll de imagenes pero no puedo agregarles link, hao esto y no funciona que puede ser?

Código:

 <div id="container">
	
	    
	    <div class="photobanner">
	    	<a href="http://67.23.231.40/~baldia/?page_id=101&hor=1">	<img src="wp-content/themes/brownaldia/img/01.jpg" class="first"></a>
	<a href="http://67.23.231.40/~baldia/?page_id=101&hor=2"><img src="wp-content/themes/brownaldia/img/02.jpg" ></a>
	<a href="http://67.23.231.40/~baldia/?page_id=101&hor=3"><img src="wp-content/themes/brownaldia/img/03.jpg" ></a>
	<a href="http://67.23.231.40/~baldia/?page_id=101&hor=3"><img src="wp-content/themes/brownaldia/img/04.jpg" ></a>
	<img src="wp-content/themes/brownaldia/img/05.jpg" >
	<img src="wp-content/themes/brownaldia/img/06.jpg" >
	<img src="wp-content/themes/brownaldia/img/07.jpg" >
	<img src="wp-content/themes/brownaldia/img/08.jpg" >
	<img src="wp-content/themes/brownaldia/img/09.jpg" >
	<img src="wp-content/themes/brownaldia/img/10.jpg" >
	<img src="wp-content/themes/brownaldia/img/11.jpg" >
	<img src="wp-content/themes/brownaldia/img/12.jpg" >
	<img src="wp-content/themes/brownaldia/img/01.jpg" >
	<img src="wp-content/themes/brownaldia/img/02.jpg" >
	<img src="wp-content/themes/brownaldia/img/03.jpg" >

	    </div>
	</div>

css

Código:

#container {
    width: 960px;
    overflow: hidden;
    margin: 20px auto 0 auto;
    background: white;
}


/*photobanner*/
 
.photobanner {
    height: 100px;
    width: 3550px;

}


/*keyframe animations*/
.first {
    -webkit-animation: bannermove 30s linear infinite;
       -moz-animation: bannermove 30s linear infinite;
        -ms-animation: bannermove 30s linear infinite;
         -o-animation: bannermove 30s linear infinite;
            animation: bannermove 30s linear infinite;
}
 
@keyframes "bannermove" {
 0% {
    margin-left: 0px;
 }
 100% {
    margin-left: -2125px;
 }
 
}
 
@-moz-keyframes bannermove {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -2125px;
 }
 
}
 
@-webkit-keyframes "bannermove" {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -2125px;
 }
 
}
 
@-ms-keyframes "bannermove" {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -2125px;
 }
 
}
 
@-o-keyframes "bannermove" {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -2125px;
 }
 
}


.photobanner {
    height: 100px;
    width: 3550px;
  
}
 
.photobanner img {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
	max-width:50px;
	padding: 0 30px 0 30px;
}
 
.photobanner img:hover {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
    cursor: pointer;
 
    -webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 3px 5px rgba(0,0,0,0.2);
    box-shadow: 0px 3px 5px rgba(0,0,0,0.2);
}

.photobanner:hover .first{
    -webkit-animation-play-state:paused;
    -moz-animation-play-state:paused;
    -ms-animation-play-state:paused;
    animation-play-state:paused;
}