/* BASIC RESET */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input{margin:0; padding:0;}

/* SOCIAL ICONS - GENERAL */
.social { list-style:none; margin:0px auto; width:270px; }
.social li { display:inline; float:right; background-repeat:no-repeat; }
.social li a { display:block; width:270px; height:68px; padding-right:0px; position:relative; text-decoration:none; }


li.about { background-image:url("img/about.png"); }
li.services { background-image:url("img/services.png"); }
li.info { background-image:url("img/info.png"); }
li.portfolio { background-image:url("img/portfolio.png"); }
li.contacts { background-image:url("img/contacts.png"); }

a img {
	border:none;	/* убирает рамку вокруг картинок-ссылок */
}
a {outline:none}	/* убирает рамку вокруг ссылок */
* {padding: 0; margin: 0}
html { height: 100%; overflow: auto; }
body { height: 100%; background-image: url(../img/background.jpg);}

/* основной блок. растягивается на всю страницу по вертикали. */
div.main {
	width: 613px;
	min-height: 100%;
	margin: 0 auto;
	position: relative;
/*	background: #ccc;*/
}

/* общий блок. В нем располагаются блок логотипа и блок меню. */
div.cont {
	position:absolute;
	top: 50%;
	margin-top: -170px;
	width: 613px;
	height: 340px;
/*	background:#06C;*/
}
/* блок внутри общего блока. Это блок с логотипом слева. */
div.cont_left_logo {
	width: 286px;
	height: 116px;
	margin-top: 120px;
	float:left;
/*	background:#CC0;*/
}

/* блок внутри общего блока. Это блок с вертикальной черной полоской. */
div.cont_center {
	width: 1px;
	height: 340px;
	float:left;
	margin-left: 56px;
	background:#000;
}
/* блок внутри общего блока. Это блок с меню справа. */
div.cont_right_menu {
	width: 270px;
	height: 340px;
	float:right;
/*	background:#639;*/
}
/* блок внутри блока меню справа. Это блок одной кнопки. */
div.cont_right_menu_button {
	width: 270px;
	height: 68px;
	float:right;
	margin-top: 13px;
/*	background:#FCC;*/
}

/* копирайт внизу страницы. */
div.footer {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 266px;
	height: 20px;
	margin-left:210px;
	text-align:center;
/*	background-color: #0cf;*/
}
/* пустой блок центрального контейнера. Необходим для того, чтобы блоки не наезжали друг на друга */
div.empty_cont {
	height: 360px;
/*	background:#0FC;*/
}
/* пустой блок копирайта */
div.empty_footer {
	height: 20px;
/*	background:#0C3;*/
	}

/* Качели логотипа - начало */
@-webkit-keyframes tada{
	0%{-webkit-transform:scale(1)
	}
10%,20%{
	-webkit-transform:scale(0.9) rotate(-3deg)
	}
30%,50%,70%,90%{
	-webkit-transform:scale(1.1) rotate(3deg)
	}
40%,60%,80%{
	-webkit-transform:scale(1.1) rotate(-3deg)
	}
100%{
	-webkit-transform:scale(1) rotate(0)
	}
}@-moz-keyframes tada{
	0%{-moz-transform:scale(1)
	}
10%,20%{
	-moz-transform:scale(0.9) rotate(-3deg)
	}
30%,50%,70%,90%{
	-moz-transform:scale(1.1) rotate(3deg)
	}
40%,60%,80%{
	-moz-transform:scale(1.1) rotate(-3deg)
	}
100%{
	-moz-transform:scale(1) rotate(0)
	}
}@keyframes tada{
	0%{transform:scale(1)
	}
10%,20%{
	transform:scale(0.9) rotate(-3deg)
	}
30%,50%,70%,90%{
	transform:scale(1.1) rotate(3deg)
	}
40%,60%,80%{
	transform:scale(1.1) rotate(-3deg)
	}
100%{
	transform:scale(1) rotate(0)
	}
}.logo img{
	width:286px;
	height:116px;
	vertical-align:middle;
	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	animation-timing-function:ease
	}
.logo a:hover img{
	-webkit-animation-name:tada;
	-moz-animation-name:tada;
	animation-name:tada
	}
/* Качели логотипа - конец */