﻿.btn_menu_nechet
{
float: left;
margin-right: -20px;
margin-top: 60px;
width: 130px;
height: 70px;
line-height: 54px;
text-align: center;
font-family: Aquarelle;
font-size: 22px;
font-weight: 400;
}

.btn_menu_chet
{
float: left;
margin-right: -20px;
margin-top: 70px;
width: 130px;
height: 70px;
line-height: 54px;
text-align: center;
font-family: Aquarelle;
font-size: 20px;
font-weight: 400;
}

.btn_menu_nechet:hover,
.btn_menu_chet:hover
{
cursor: pointer;
}

#art_studiya
{
position: absolute;
width: 600px;
left: 100px;
line-height: 60px;
font-size: 24px;
font-family: arial_rounded;
color: #FFFFFF;
text-shadow: 0px 0px 8px black, 0 0 1em;
}

#tim,
#shows,
#news,
#photo,
#price,
#kontakti
{
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-ms-transition: 0.5s;
-o-transition: 0.5s;
color: #000000;
}

#tim:hover,
#shows:hover,
#news:hover,
#photo:hover,
#price:hover,
#kontakti:hover
{
color: #FFFFFF;
}

#tim
{
background-image: url(menu/tim.png);
background-repeat: no-repeat;
}

#tim:hover
{
background-image: url(menu/tim2.png);
background-repeat: no-repeat;
}

#shows
{
background-image: url(menu/shows.png);
background-repeat: no-repeat;
}

#shows:hover
{
background-image: url(menu/shows2.png);
background-repeat: no-repeat;
}

#news
{
background-image: url(menu/otzivy.png);
background-repeat: no-repeat;
}

#news:hover
{
background-image: url(menu/otzivy2.png);
background-repeat: no-repeat;
}

#photo
{
background-image: url(menu/photo.png);
background-repeat: no-repeat;
}

#photo:hover
{
background-image: url(menu/photo2.png);
background-repeat: no-repeat;
}

#price
{
background-image: url(menu/price.png);
background-repeat: no-repeat;
}

#price:hover
{
background-image: url(menu/price2.png);
background-repeat: no-repeat;
}

#kontakti
{
background-image: url(menu/kontakti.png);
background-repeat: no-repeat;
}

#kontakti:hover
{
background-image: url(menu/kontakti2.png);
background-repeat: no-repeat;
}

#logo
{
background-image: url(../imgfon/logo.png);
background-size: cover;
  width: 60px;
height: 60px;  /* начальное значение */
  -moz-animation-name: blinked; /* имя используемого @-правила анимации */
  -moz-animation-duration: 1.5s; /* продолжительность эффекта - 2 секунды */
  -moz-animation-iteration-count: infinite; /* повторять бесконечно */ 
  -moz-animation-direction: alternate; /* при повторе постепенно возвращаться к начальному состоянию */
  /* далее -  все то же самое для Chrome и Safari */
  -webkit-animation-name: blinked; 
  -webkit-animation-duration: 0.7s;
  -webkit-animation-iteration-count: infinite; 
  -webkit-animation-direction: alternate;
  margin: auto;
  margin-top: 0px;
}

#logo_container
{
height: 60px;
width: 60px;
position: absolute;
margin-left: 35px;
margin-top: 2px;
}

/* правило для браузеров Mozilla */
@-moz-keyframes blinked {
  to 
  {
  width: 30px;
  height: 30px;
  margin-top: 15px;}
} 
/* правило для браузеров Chrome и Safari */
@-webkit-keyframes blinked {
  to   
  {
  width: 30px;
  height: 30px;
  margin-top: 15px;}
}