Красивое новое вертикальное меню с изменением картинки при наведении

.mh-menu {  
height: 385px;  
width: 600px;  
margin-left: 0px;  
position: relative;  
}  
.mh-menu li {  
width: 300px;  
list-style:none;  
}  
.mh-menu li a {  
display: block;  
width: 280px;  
padding: 0px 10px;  
text-align: right;  
position: relative;  
z-index: 10;  
background: #fff;  
height: 97px;  
border-right: 1px solid #ddd;  
background-color: rgba(255, 255, 255, 0.8);  
text-decoration:none;  
}  
.mh-menu li:nth-child(1):hover a {  
background-color: rgba(174, 54, 55, 0.9);  
}  
.mh-menu li:nth-child(2):hover a {  
background-color: rgba(195, 210, 67, 0.9)  
}  
.mh-menu li:nth-child(3):hover a {  
background-color: rgba(211, 132, 57, 0.9);  
}  
.mh-menu li:nth-child(4):hover a {  
background-color: rgba(142, 116, 99, 0.9);  
}  
.mh-menu li a span {  
display:block;  
}  
.mh-menu li a span:first-child {  
font-weight: 700;  
font-size: 16px;  
color: #ddd;  
padding-top: 10px;  
font-family:'Alegreya SC', Georgia, serif;  
}  
.mh-menu li a span:nth-child(2) {  
font-weight: 400;  
font-style: italic;  
font-size: 28px;  
font-family:'Alegreya SC', Georgia, serif;  
-webkit-transition: color 0.2s linear;  
-moz-transition: color 0.2s linear;  
-o-transition: color 0.2s linear;  
-ms-transition: color 0.2s linear;  
transition: color 0.2s linear;  
}  
.mh-menu li:hover span:nth-child(2) {  
color: #fff;  
}  
.mh-menu li img {  
position: absolute;  
z-index: 1;  
left: 0px;  
top: 0px;  
opacity: 0;  
-webkit-transition: left 0.4s ease-in-out, opacity 0.6s ease-in-out;  
-moz-transition: left 0.4s ease-in-out, opacity 0.6s ease-in-out;  
-o-transition: left 0.4s ease-in-out, opacity 0.6s ease-in-out;  
-ms-transition: left 0.4s ease-in-out, opacity 0.6s ease-in-out;  
transition: left 0.4s ease-in-out, opacity 0.6s ease-in-out;  
}  
.mh-menu li:hover img {  
left: 300px;  
opacity: 1;  
}

<ul class="mh-menu">  
<li>  
<a href="http://gigabytes.clan.su/"><span>Мы несём добро в сеть</span> <span>GiG-PRO.RU</span></a>  
<img src="Ссылка на картинку" style="height:388px;width:450px;" alt="GiG-PRO.RU" />  
</li>  
<li>  
<a href="http://gigabytes.clan.su/"><span>Зима, холод, брррр</span> <span>GiGabYtes.Clan.Su</span></a>  
<img src="Ссылка на картинку 2" style="height:388px;width:450px;" alt="GiGabYtes.Clan.Su" />  
</li>  
<li>  
<a href="http://gigabytes.clan.su/"><span>Осень, осень ...</span> <span>Осень</span></a>  
<img src="Ссылка на картинку 3" style="height:388px;width:450px;" alt="image03" />  
</li>  
<li>  
<a href="http://gigabytes.clan.su/"><span>Красиво и прекрасно ...</span> <span>Но холодно</span></a>  
<img src="Ссылка на картинку 4" style="height:388px;width:450px;" alt="image04" />  
</li>  
</ul>