html, body {
	width:100%;
	height:100%;/* для ие6, т.к. не понимает min-height */
	color:#333;
	font-size: 13px;
	font-family: Arial, Helvetica, sans-serif;
	text-align:justify;
}

body {
	padding:0px;
	margin:0px;
	background: #eeeeee url(../img/fon.jpg);
}

article {
	-webkit-column-count:2;
	-moz-column-count:2;
	column-count:2;
	
	-webkit-column-gap:50px;
	-moz-column-gap:50px;
	column-gap:50px;
	
	max-height: 255px;
	overflow:hidden;
}

a img {
	border: 0px none; 
}

.all {
	width:900px;
	height:640px;
	margin: 0px auto;
	margin: -343px auto 0px -450px;
	position: absolute;
    top: 50%;
	left:50%
	/*background: url(../img/test/test1.jpg);*/
}


.header {
	width:900px;
	height:215px;
	margin-top:-12px;
	float:left;
}

.section {
	width:795px;
	height:24px;
	margin-left:105px;
	float:left;
}

.menu {
	width:80px;
	height:400px;
	margin-top:-3px;
	float:left;
}

.rama {
	width:820px;
	height:400px;
	float:left;
	background-image:url(../img/ramka.png);
}
.rama2 {
	width:820px;
	height:400px;
	float:left;
}

.textfield {
	width:600px;
	height:250px;
	padding:0px;
	margin: 35px 100px 70px 120px;
	/*background-color:#3F0;*/
}
.gallery {
	width:650px;
	height:400px;
	padding:0px;
	margin:15px 0 0 60px;
	float:left;
}




/*Кнопки Новости-Форум-Обратная связь*/
.novosti {
	width:80px;
	height:80px;
	margin-top:20px;
	margin-left:-13px; /*расстояние от Облака поиска*/
	float:left;
	z-index:3;
	overflow: hidden;
}
.novosti a {
    background: url(../img/novosti.png) no-repeat; /* Путь к файлу с исходным рисунком  */
    display: block; /*  Рисунок как блочный элемент */
    width: 80px; /* Ширина рисунка */
    height: 80px; /*  Высота рисунка */
	cursor: pointer;
   }
.novosti a:hover {
    background: url(../img/novosti2.png) no-repeat; /* Путь к файлу с заменяемым рисунком  */
   }
   
   
.kontakt {
	width:80px;
	height:80px;
	margin-top:33px;
	margin-left:-9px; /*расстояние от Новостей*/
	float:left;
	z-index:3;
}
.kontakt a {
    background: url(../img/kontakt.png) no-repeat; /* Путь к файлу с исходным рисунком  */
    display: block; /* Рисунок как блочный элемент */
    width: 80px; /* Ширина рисунка */
    height: 80px; /* Высота рисунка */
	cursor: pointer;
   }
.kontakt a:hover {
    background: url(../img/kontakt2.png) no-repeat; /* Путь к файлу с заменяемым рисунком  */
   }
   
   

.forum {
	width:80px;
	height:80px;
	margin-top:24px;
	margin-left:-15px; /*расстояние от Контактов*/
	float:left;
	z-index:3;
}
.forum a {
    background: url(../img/forum.png) no-repeat; /* Путь к файлу с исходным рисунком  */
    display: block; /*  Рисунок как блочный элемент */
    width: 80px; /* Ширина рисунка */
    height: 80px; /*  Высота рисунка */
	cursor: pointer;
   }
.forum a:hover {
    background: url(../img/forum2.png) no-repeat; /* Путь к файлу с заменяемым рисунком  */
   }
   
.logo {
	width:170px;
	height:40px;
	margin-top:162px;
	margin-left:-102px;
	margin-right:5px;
	float:left;
	z-index:3;
}
.logo a {
    background: url(../img/logo.png) no-repeat; /* Путь к файлу с исходным рисунком  */
    display: block; /*  Рисунок как блочный элемент */
    width: 170px; /* Ширина рисунка */
    height: 40px; /*  Высота рисунка */
	cursor: pointer;
   }
   
   
.dom {
	width:202px;
	height:215px;
	float:left;
	z-index:3;
}
.dom a {
    background: url(../img/dom.png) no-repeat; /* Путь к файлу с исходным рисунком  */
    display: block; /*  Рисунок как блочный элемент */
    width: 202px; /* Ширина рисунка */
    height: 215px; /*  Высота рисунка */
	cursor: pointer;
   }
   
   
.rad {
	width:323px;
	height:215px;
	margin-left:-25px;
	float:left;
	z-index:3;
    background: url(../img/raduga.png) no-repeat; /* Путь к файлу с исходным рисунком  */
}
   
   
.zay {
	width:105px;
	height:105px;
	margin-top:102px;
	margin-left:75px;
	float:left;
	z-index:3;
}
.zay a {
	width:105px;
	height:105px;
	display: block;
	background: url(../img/menu/zayacNew.png) 0 0 no-repeat;
	animation:fly 5s infinite;
	cursor: pointer;
}
.zay a:hover {
    -webkit-animation: move  .5s steps(4) infinite;
    animation: move  .5s steps(4) infinite;
}
@-webkit-keyframes move {
  from { background-position: 0 0; }
  to   { background-position: -420px 0; }
}
@keyframes move {
  from { background-position: 0 0; }
  to   { background-position: -420px 0; }
}



/*Форма поиска*/
.oblako {
	width:150px;
	height:86px;
	margin-top:39px;
	margin-left:-26px;
	background: url(../img/obl.png) no-repeat;
	float:left;
	z-index:1;
}
.search {
	width:69px;
	height:30px;
	background: url(../img/searchtext.jpg) no-repeat;
	color:#FFF;
	border: 0px none;
	outline: none; /* Убираем свечение в Chrome и Safari */
    -webkit-appearance: none; /* Убираем рамку в Chrome и Safari */
	margin-top:26px;
	margin-left:30px;
	float:left;
	z-index:2;
}
.button {
	width:30px;
	height:30px;
	background: url(../img/search.jpg) no-repeat;
	border: 0px none;
	outline: none; /* Убираем свечение в Chrome и Safari */
    -webkit-appearance: none; /* Убираем рамку в Chrome и Safari */
	margin-top:28px;
	float:left;
	z-index:3;
	cursor: pointer;
}






/*Анимированные пункты меню*/
.kollektiv {
	width:80px;
	height:80px;
	float:left;
	z-index:2;
	overflow: hidden;
}
.kollektiv a {
	width:80px;
	height:80px;
	display: block;
	background: url(../img/menu/kollektivNew.png) 0 0 no-repeat;
	animation:fly 6s infinite;
	cursor: pointer;
}
.kollektiv a:hover {
    -webkit-animation: move2  .6s steps(6) infinite;
    animation: move2  .6s steps(6) infinite;
}

@-webkit-keyframes move2 {
  from { background-position: 0 0; }
  to   { background-position: -480px 0; }
}
@keyframes move2 {
  from { background-position: 0 0; }
  to   { background-position: -480px 0; }
}




.group {
	width:80px;
	height:80px;
	float:left;
	z-index:2;
	overflow: hidden;
}
.group a {
	width:80px;
	height:80px;
	display: block;
	background: url(../img/menu/groupNew.png) 0 0 no-repeat;
	animation:fly 3s infinite;
	cursor: pointer;
}

.group a:hover {
    -webkit-animation: move6  .3s steps(3) infinite;
    animation: move6  .3s steps(3) infinite;
}

@-webkit-keyframes move6 {
  from { background-position: 0 0; }
  to   { background-position: -240px 0; }
}
@keyframes move6 {
  from { background-position: 0 0; }
  to   { background-position: -240px 0; }
}



.document {
	width:80px;
	height:80px;
	float:left;
	z-index:2;
	overflow: hidden;
}
.document a {
	width:80px;
	height:80px;
	display: block;
	background: url(../img/menu/documentNew.png) 0 0 no-repeat;
	animation:fly 6s infinite;
	cursor: pointer;
}

.document a:hover {
    -webkit-animation: move5  .6s steps(5) infinite;
    animation: move5  .6s steps(5) infinite;
}

@-webkit-keyframes move5 {
  from { background-position: 0 0; }
  to   { background-position: -400px 0; }
}
@keyframes move5 {
  from { background-position: 0 0; }
  to   { background-position: -400px 0; }
}


.doctor {
	width:80px;
	height:80px;
	float:left;
	z-index:2;
	overflow: hidden;
}
.doctor a {
	width:80px;
	height:80px;
	display: block;
	background: url(../img/menu/doctorNew.png) 0 0 no-repeat;
	animation:fly 7s infinite;
	cursor: pointer;
}
.doctor a:hover {
    -webkit-animation: move3  .7s steps(5) infinite;
    animation: move3  .7s steps(5) infinite;
}

@-webkit-keyframes move3 {
  from { background-position: 0 0; }
  to   { background-position: -400px 0; }
}
@keyframes move3 {
  from { background-position: 0 0; }
  to   { background-position: -400px 0; }
}




.piramida {
	width:80px;
	height:80px;
	float:left;
	z-index:2;
	overflow: hidden;
}
.piramida a {
	width:80px;
	height:80px;
	display: block;
	background: url(../img/menu/piramida2New.png) 0 0 no-repeat;
	animation:fly 5s infinite;
	cursor: pointer;
}

.piramida a:hover {
    -webkit-animation: move1  .5s steps(5) infinite;
    animation: move1  .5s steps(5) infinite;
}

@-webkit-keyframes move1 {
  from { background-position: 0 0; }
  to   { background-position: -400px 0; }
}
@keyframes move1 {
  from { background-position: 0 0; }
  to   { background-position: -400px 0; }
}