/* CSS Document */
* {margin:0;padding:0}

/* mac hide \*/ 
html,body{height:100%;width:100%; background-color:#FFFFFF;}
/* end hide */

body {
background-color: white;
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
margin:0;
padding:0;
background:url(pics/fon_top.jpg) top repeat-x;
height:100%;
}

#menu_v{margin-right:auto; margin-left:auto; width:720px;}

#menu_v ul {
list-style:none;
height:59px;
padding:0px;
margin-top:0;
padding-top:0;
}
#menu_v ul li { /* это родительский элемент нашей кнопки */
float:left;
background:url(pics/button1.jpg) no-repeat top left;
margin-left:40px;
margin-right:0;
font-weight:bold;
/* устанавливаем фон - картинку при наведении курсором на кнопку*/
}
#menu_v a {
background:url(pics/button.jpg) top left no-repeat;
height:59px;
width:150px;
display:block;
font-size:14px;
color:black;
line-height:50px;
text-align:center;
text-decoration:none;
}

#menu_v a:hover {
background:none;
color:black;
text-decoration:none;
}

#menu_pf ul {
list-style:none;
padding:0px;
margin-top:0px;
padding-top:0;
float:left;
}
#menu_pf ul li { /* это родительский элемент нашей кнопки */
background: url(pics/PHOTO2.jpg) no-repeat top left;
margin-left:0;
margin-right:0;
font-size:12px;
font-weight:normal;
color: #666666;
/* устанавливаем фон - картинку при наведении курсором на кнопку*/
}
#menu_pf a {
background:url(pics/PHOTO1.jpg) top left no-repeat;
height:185px;
width:150px;
display:block;
font-size:12px;
color: #666666;
text-align:left;
text-decoration:none;
}

#menu_pf a:hover {
background:none;
color:#c33;
text-decoration:none;
}

/* Меню Главное вверху */

.menu {
  height: 31px;				/* Высота вкладок */
  padding: 0px 0px;			/* Поля по вертикали и горизонтали */
  font-family: Arial, sans-serif;	/* Шрифт надписи */			
  font-weight: bold;			/* Жирное начертание */
  font-size: 12px;			/* Размер шрифта надписи */
  color:black;
 
}
 .menu DIV {
  float:left;
  width: 100px;			/* Ширина вкладки */
  height: 31px;			/* Высота вкладки */
  margin-right: 10px;		/* Расстояние между вкладками */
  text-align: center;		/* Выровнять надпись по центру */

}

 .menu A {
  color:black;
  text-decoration:none;
  display: block;		/* Ссылка как блочный элемент */
  width: 100%;			/* Ссылка на всю ширину вкладки */
  height: 100%;			/* Ссылка на всю высоту вкладки */
  padding: 7px 0px;		/* Поля для размещения текста по центру */
}

 .menu A:hover {
 color: #999; 
 background:url("pics/button1.gif") no-repeat;
}

a.menu span{
display:none;/*собственно прячем тултип - пока мышь не наведена*/
font-size:10px;
color: #999999;
font-weight:normal;
}
a.menu:hover{
position:relative;/*Ставим точку отсчета для тултипа внутрь данной ссылки*/
z-index:23;/*это нужно что бы тултип показывался поверх этой и других ссылок*/
}
a.menu:hover span{
display:block;/*показываем тултип при наведении*/
position:absolute;
top:35px;
left:25px;/*три строки для позиции тултипа относительно левого верхнего угла ссылки*/
z-index:22;/*мне 22 + см. выше*/
background: none;/*фон, что бы было видно тултип*/
}

#container{
width:720;
height:auto;
padding-top:40px;
}

.photo_box{
height:130px;
width:130px;
background:url(pics/photo_box2.gif) no-repeat;
vertical-align:middle;
text-align:center;
display:table;
margin-bottom:10px;
margin-right:30px;
padding-top:0px;
float:left;
}

.inner {
	width:100%;
	display:table-cell;
	vertical-align:middle;
	position:relative;
	padding-top:0px;
}

#footer{
width:100%;
height:90px;
background:url(pics/footer.jpg) repeat-x;
padding:0;
margin-left:auto; 
margin-right:auto;
margin-bottom:0;
margin-top:0;
vertical-align:bottom;
}

#footer p{font-size:12px; color:#999999}

.clearer{clear:both;}

.left{width:160px;
font-size:12px;
color:#999999;
float:right;}

#content{
width:auto;
margin-left:250px;
margin-top:0px;
}

#content2{
width:auto;
margin-left:100px;
margin-top:0px;
}

#title_pf{float:left;
width:21px;
margin-top:0px;
margin-left:40px;}

* html .inner{
  height:1%;
}

.article{
font-size:12px;
color:#000000;
padding:10px;
text-align:justify;
border:1px #999999 dashed;
float:left;
width:440px;
line-height:18px;
margin-bottom:20px;}

.article p{width:420px;
margin:0; padding:0;}

.article h1{font-size:24px;
padding-bottom:3px;
padding-top:0;
margin-top:0;
color:#c33;
font-weight:normal;border-bottom:1px #999999 dashed;
display:inline;
}

.article a{color:#c33;
text-decoration:none;}

.article a:hover{color:#666666;}

#article{border:0;
padding-top:0;
padding-bottom:0;
}

.article2{
font-size:12px;
color:#000000;
padding:10px;
text-align:justify;
border:1px #999999 dashed;
float:left;
width:100%;
line-height:18px;
margin-bottom:20px;}

.article2 p{width:100%;
margin:0; padding:0;}

.article2 h1{font-size:24px;
padding-bottom:3px;
padding-top:0;
margin-top:0;
color:#c33;
font-weight:normal;border-bottom:1px #999999 dashed;
display:inline;
}

.article2 a{color:#c33;
text-decoration:none;}

.article2 a:hover{color:#666666;}

#article2{border:0;
padding-top:0;
padding-bottom:0;
}


#article_main{
width:100%;}

#article_main p{
width:100%;}

.first_letter {
	font-size: 24px;
	color: #c33;
}

#first_letter{color:#000000;}

/* Меню для вэб-портфолио*/

#menu_web ul {
list-style:none;
padding:0px;
margin-top:0px;
padding-top:0;
float:left;
}
#menu_web ul li { /* это родительский элемент нашей кнопки */
background: url(pics/PHOTO2_web.jpg) no-repeat top left;
margin-left:0;
margin-right:0;
font-size:12px;
font-weight:normal;
color: #666666;
margin-bottom:40px;
/* устанавливаем фон - картинку при наведении курсором на кнопку*/
}
#menu_web a {
background:url(pics/PHOTO1_web.jpg) top left no-repeat;
height:300px;
width:260px;
display:block;
font-size:12px;
color: #666666;
text-align:left;
text-decoration:none;
}

#menu_web a:hover {
background:none;
color:#c33;
text-decoration:none;
}

#webdiz{
width:435px;
height:62px;
padding:0;
margin-left:auto; 
margin-right:auto;
margin-bottom:0;
margin-top:0px;
vertical-align:bottom;
}

#webdiz ul {
list-style:none;
height:62px;
padding:0px;
margin-top:0;
padding-top:0;
}
#webdiz ul li { /* это родительский элемент нашей кнопки */
float:left;
background:url(pics/but_diz_1.jpg) no-repeat top left;
margin-left:0;
margin-right:0;
font-weight:bold;
display:block;
/* устанавливаем фон - картинку при наведении курсором на кнопку*/
}
#webdiz a {
background: url(pics/but_diz_2.jpg) top left no-repeat;
height:62px;
width:435px;
display:block;
font-size:14px;
color:black;
line-height:56px;
text-align:center;
text-decoration:none;
}

#webdiz a:hover {
background:none;
color:black;
text-decoration:none;
}

.adv2{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#999999; padding:10px; margin:10px 0; border:1px #CCCCCC solid; background: url(pics/adv.gif) #fff top left no-repeat; text-align:left; clear:both; width:440px;}

.adv{color: #999;}

.notice p{margin-left:20px; 
         padding-left:15px;
		 border-left:2px #c33 solid;}