#navi
{
 width: 100%;
 overflow: hidden;       /* очень важно для определения размеров блока div*/
 background-color:#deeaf5;
}

/*======================= MENU */

/*-------------- menu_g1*/
.menu_g1
{
 overflow: hidden;   /* очень важно для определения размеров блока div*/
 font: bold 1.05em / 1.3em Arial, sans-serif;
 color:  #111111;
 height: 45px;
 max-width: 994px;
 padding: 0px 35px;
 background-color:#deeaf5;
}

.menu_g1 ul
{
 margin: 0px;
 padding: 0px;
 list-style: none;
}

.menu_g1 li
{
 display: block;
 float: left;
 width: 110px;
 text-align: center;
 margin: 2px;
 _padding: 0px 0px;
 
}

.menu_g1 li a
{
 display: block;
 position: relative;
 color: #1d4085;
 text-decoration: none;
 padding: 7px 0px;
 background-color:#fff;
 border-radius:12px 12px 12px 12px;
 box-shadow: 0 4px 10px -5px #00000070;
 overflow: hidden;
}

.menu_g1 li a:hover
{
 display: block;
 position: relative;
 color: #1d4085;
 text-decoration: none;
 padding: 7px 0px;
 background-color:#679ac9;
 border-radius:12px 12px 12px 12px;
 box-shadow: 0 4px 10px -5px #00000070;
 transition: 0.2s;
 overflow: hidden;
 color: #fff;
 
}
.menu_g1 li span
{
 display: block;
 color: #fff;
 padding: 7px 0px;
 background-color:#1d4085;
 border-radius:12px 12px 12px 12px;
 }
/*--------------------------*/

/*-------------- menu_g2*/
.menu_g2
{
 font: bold 1.05em / 1.2em Arial, sans-serif;
 color:  #111111;
 background-color:#deeaf5;
 height: 45px;
 max-width: 994px;
 clear: both;        /* очень важно для определения размеров блока div*/
 padding: 0px 35px;
 overflow: hidden;   /* очень важно для определения размеров блока div*/
}

.menu_g2 ul
{
 _font: bold 1em/2em  Arial, sans-serif;
 margin: 0px;
 padding: 0px;
 list-style: none;
}

.menu_g2 li
{
 display: block;
 float: left;
 width: 110px;
 margin: 2px;
 _padding: 0px 1px;
 text-align: center;
}

.menu_g2 li a
{
 display: block;
 color: #111111;
 text-decoration: none;
 padding: 7px 0px;
 background-color:#fff;
 border-radius:12px 12px 12px 12px;
 box-shadow: 0 4px 10px -5px #00000070;
}

.menu_g2 li a:hover
{
display: block;
 color: #fff;
 background-color:#679ac9;
 font-variant: normal;
 padding: 7px 0px;
 border-radius:12px 12px 12px 12px;
}

.menu_g2 li span
{
 display: block;
 color: #fff;
 padding: 7px 0px;
 background-color:#1d4085;
 border-radius:12px 12px 12px 12px;
}
/*--------------------------*/






@media only screen and (max-width : 1100px)
{
 #navi
 {
  width: 100%;
  min-height: 240px;
  background-color:#deeaf5;

 }
 /*-----------g1---------------*/
 .menu_g1
 {
  font: bold 1.2em / 1.3em Arial, sans-serif;
  color:  #111111;
  height: 120px;
  width: 660px;
  padding: 0px 55px;
  background-color:#deeaf5;


 }

 .menu_g1 ul
 {
  margin: 0px;
  padding: 0px;
  list-style: none;
 }

 .menu_g1 li
 {
  position: relative;
  display: block;
  float: left;
  width: 150px;
  text-align: center;
  margin: 5px;

 }

 .menu_g1 li a
 {
  display: block;
  position: relative;
  color: #1d4085;
  text-decoration: none;
  padding: 8px 0px;
  background-color:#fff;
  border-radius:12px;
  overflow: hidden;
 }

 .menu_g1 li a:hover
 {
  display: block;
  position: relative;
  text-decoration: none;
  padding: 8px 0px;
  background-color:#679ac9;
  border-radius:12px;
  transition: 0.2s;
  overflow: hidden;
  color: #fff;

 }
 .menu_g1 li span
 {
  display: block;
  position: relative;
  text-decoration: none;
  padding: 8px 0px;
  background-color:#1d4085;
  border-radius:12px;
  transition: 0.2s;
  overflow: hidden;
  color: #fff;

   }
 /*-----------g2---------------*/
 .menu_g2
 {
  position: relative;
  font: bold 1.2em / 1.3em Arial, sans-serif;
  color:  #111111;
  height: 120px;
  width: 660px;
  padding: 0px 55px;
  background-color:#deeaf5;
 }

 .menu_g2 ul
 {
  _font: bold 1em/2em  Arial, sans-serif;
  margin: 0px;
  padding: 0px;
  list-style: none;
 }

 .menu_g2 li
 {
  display: block;
  float: left;
  width: 150px;
  margin: 5px;
  text-align: center;

 }

 .menu_g2 li a
 {
  display: block;
  color: #111111;
  text-decoration: none;
  padding: 8px 0px;
  background-color:#fff;
  border-radius: 12px;

 }

 .menu_g2 li a:hover
 {
  display: block;
  color: #fff;
  background-color:#679ac9;
  font-variant: normal;
  padding: 8px 0px;
  border-radius: 12px;
 }

 .menu_g2 li span
 {
  display: block;
  color: #fff;
  padding: 8px 0px;
  background-color:#1d4085;
  border-radius: 12px;
 }


}