<style type="text/css">

.izo1 {
  display: inline-block;
}

.izo1:hover img {
  opacity: 0;
}

.izo1:hover {
  background: url("http://site.com/image/Moskva_hover.jpg") no-repeat 50% 50%;
  background-size: 100%, auto;
  margin-bottom: 10px; 
  width: 100%; 
  height: auto; 
  max-width: 330px; 
  max-height: 330px;
}

.izo2 {
  display: inline-block;
}

.izo2:hover img {
  opacity: 0;
}

.izo2:hover {
  background: url("http://site.com/image/sankt-peterburg_hover.jpg") no-repeat 50% 50%;
  background-size: 100%, auto;
  margin-bottom: 10px; 
  width: 100%; 
  height: auto; 
  max-width: 330px; 
  max-height: 330px;
}

.izo3 {
  display: inline-block;
}

.izo3:hover img {
  opacity: 0;
}

.izo3:hover {
  background: url("http://site.com/image/TVER_hover.jpg") no-repeat 50% 50%;
  background-size: 100%, auto;
  margin-bottom: 10px; 
  width: 100%; 
  height: auto; 
  max-width: 330px; 
  max-height: 330px;
}

</style>

<div style="text-align: center;">
<p style="text-align: center; font-size: 32px; color: #ffffff; font-family: 'Open Sans';">Пожалуйста выберите Ваш город</p>
</div>

<div style="text-align: center;">
<div class="text-center col-lg-4 col-md-4 col-sm-4 col-xs-12">
	<a href="http://site.com/Moscow" class="izo1">
		<img src="http://site.com/image/Moskva.jpg" style="margin-bottom: 10px; width: 100%; height: auto; max-width: 330px; max-height: 330px;" />
	</a>
</div>

<div class="text-center col-lg-4 col-md-4 col-sm-4 col-xs-12">
	<a href="http://site.com/sankt-peterburg" class="izo2">
		<img alt="" src="http://site.com/image/sankt-peterburg.jpg" style="margin-bottom: 10px; width: 100%; height: auto; max-width: 330px; max-height: 330px;" />
	</a>
</div>

<div class="text-center col-lg-4 col-md-4 col-sm-4 col-xs-12">
	<a href="http://site.com/Tver" class="izo3" >
		<img alt="" src="http://site.com/image/TVER.jpg" style="margin-bottom: 10px; width: 100%; height: auto; max-width: 330px; max-height: 330px;" />
	</a>​
</div>
</div>