﻿@charset "utf-8";
/* ================================================== */
/* Main styles */
/* ================================================== */

/* Подключаем шрифты */
/*@import url('https://fonts.googleapis.com/css?family=PT+Sans:400,400i,700,700i&subset=cyrillic');*/

html {
	margin: 0; padding:0;
}
body {
	margin: 0;
	padding: 0;
	font-family: Arial, Tahoma, sans-serif;
	font-size: 13px;
	line-height: 18px;
	min-width: 320px;
	overflow-x: hidden;
	/*color: #2f2f2f;
	background: #fbfbfb url(/i/bg.png) repeat-x;*/
}
table {
	font-size: 14px;
	border-collapse: collapse;
	border-spacing: 0px;	
}
img { border: 0; behavior: url(""); }

table.border, table.border td, table.border th {
	border: 1px solid #000000;
}

p { margin: 0 0 10px 0; padding: 0; }

h1, h2, h3, .myraid {
	font-family: "Myriad Pro", sans-serif;
	/*font-family: 'PT Sans', sans-serif;*/
}

h1 {
	color: #333333;
	/*font-family: Arial Narrow;*/
	font-size: 40px;
	padding: 0;
	margin: 14px 0;
	font-weight: normal;
	font-style: italic;
	letter-spacing:-1px;
}

h2 {
	color:#333333;
	/*font-family: Arial Narrow;*/
	font-size: 30px;
	padding: 0;
	margin: 12px 0;
	font-weight: normal;
	font-style: italic;
	letter-spacing:-1px;
}

h3 {
	color:#333333;
	/*font-family: Arial Narrow;*/
	font-size: 18px;
	padding: 0;
	margin: 8px 0;
	font-weight: bold;
	font-style: italic;
}

h4 {
	color: #333;
	font-size: 18px;
	padding: 0;
	margin: 0;
	font-weight: normal;
}

a {color:#0070b0;}
a:hover {text-decoration: none;}

ul { padding: 0; margin: 0 0 10px 0; }
ul ul { padding: 0; margin: 0 0 0 0; }
ul li {
	padding: 0;
	margin: 4px 0 4px 10px;
	list-style: none;
	padding-left: 20px;
	background: url("li1.gif") 0 9px no-repeat;
}
ul ul li { background: url("") 0 9px no-repeat; }
ul ul ul li { background: url("") 0 9px no-repeat; }
ol { margin: 0 0 10px 0; padding: 0; }
ol ol { padding: 0; margin: 0 0 0 0; }
ol li {
	padding: 0;
	margin: 4px 0 4px 16px;
	list-style-position: inside;
	list-style-type: decimal;
}
ol ol li { list-style-type: lower-greek; }
ol ol ol li { list-style-type: lower-roman; }
/* -------------------------------------------------- */

/* ================================================== */
/* User styles */
/* ================================================== */

#wrap{
	width: auto;
	min-width: 1000px;
	overflow: hidden;
	background: url("_.html") 50% 0% no-repeat;
}

.hdr1{
	display:inline-block;	color: #333333;
	/*font-family: Arial Narrow;*/
	font-size: 40px;
	padding: 0;
	font-weight: normal;
	font-style: italic;
	letter-spacing:-2px;
	line-height: 41px;
}

.block_gray{
	background: #f2f2f2;
	padding: 18px;	
}

.block_tr{
	padding: 18px;	
}

/*
a.link1{
	display: inline-block; padding:0;
	height: 16px;
	line-height: 16px;	font-size: 12px;
	position: relative;
	color: #0082d2;
}

a.link1.checked, a.link1:hover{
	background: #0082d2;
	color: #fff;
	text-decoration: none;
}
a.link1 .l, a.link1 .r{
	position: absolute;	top: 0px;
	width: 3px;	height: 16px;
	background: none;
}
a.link1 .l{	left: -3px; border-top-left-radius: 3px; border-bottom-left-radius: 3px;}
a.link1 .r{	right: -3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px;}
a.link1:hover .l, a.link1.checked .l, a.link1:hover .r, a.link1.checked .r{	background: #0082d2;}
*/

.link2 {
	color:#0082D2; 
	padding:0px; 
	text-decoration:none;	cursor:pointer;
	margin:0px; 
	font-size:12px;
	border-bottom: 1px dashed #0082D2; 
}
.link2:hover {
	border:none;
}

.user_table {
	margin-bottom: 20px;
	font-size: 12px;
	border-collapse: collapse;
	border-spacing: 0px;
}
.user_table th {
	color: #FFF;
	font-weight: bold;
	background: #0070b0;
	text-align: center;
}
.user_table tr {	background-color: #FFFFFF;}
.user_table tr:nth-child(odd){	background-color: #f0f0f0;}
.user_table td, .user_table th{ padding: 4px;}
.user_table td{ font-size:11px;}


/********************** Header ****************************/

#header{
	padding: 0;
	background: url("left_tr.png") 50% 0% repeat-y;
}

#hdr_mdl{
	width:1000px;
	margin:0 auto; padding:30px 0 28px 0; 
	overflow:hidden;
}

#logo, #logo_text, #phone{
	display:block; float:left;	
}
#logo{
	width:238px;
	height:80px;
	background: url("logo.gif") no-repeat;	
}

#logo_text{
	list-style:none;
	padding: 12px 0 0 18px; margin:0;
	font-size:13px;
	font-style:italic;
}
#logo_text li{
	margin: 0;	padding: 1px 0 0 0; 
	color:#222;
	font-family: Calibri, Arial Narrow;
	font-style:italic; font-size:14px;
	background: none;
}
#phone{
	font-style:italic;
	padding: 20px 0 0 120px;
	text-align: right;
	letter-spacing:-1px;
}

#phone .code{
	font-size: 18px;
	color: #5dadc2;
}

#phone .num{
	font-size: 30px;
	font-weight: bold;
	color: #046ba7;
}

#phone .descr{
	margin: -2px 0 0 0;
	display: block;
	color: #222;
	font-size: 16px;
	font-style:italic;
	letter-spacing:-1px;
}

#order, #sitemap{
	display:block;
	padding: 17px 0 0 19px;
	height: 33px; color: #52504b;
	font-size: 18px; font-style:italic;
}
#order{	float:right; padding: 17px 30px 0 19px;}
#sitemap{
	float:right;
	background: url("") 0% 50% no-repeat;
}
#order span, #sitemap span{
	display:inline-block; cursor: pointer;
	background: url("dash.gif") 0% 16px repeat-x;
}
#order span:hover, #sitemap span:hover{
 background:none;
}


/*********************** Top Menu ********************/
#top_menu{
	width: 1000px;
	margin: auto;
	overflow: hidden;
}

#top_menu ul{
	display:block; list-style:none;
	overflow:hidden; float:left;
	padding:0; margin:0;
}
#top_menu ul li{
	display:block; float:left;
	overflow:hidden;
	margin: 0; padding: 0 34px 0 5px;
	background: none;
}

#top_menu .mnu_item{
	display:block; height: 33px;
	padding: 17px 4px 0 14px;
	position: relative;
}

#top_menu .checked .mnu_item{
	background:#78c5d8;
}

#top_menu a{
	display: inline-block;	height: 20px;
	font-size: 18px; font-style:italic;
	position: relative;
	color: #52504b;
	background: url("line_b.gif") 0% 16px repeat-x;
}

#top_menu .checked a{
	color: #fff;
	background: none;
	text-decoration: none;
}

#top_menu a:hover{
	background: none !important;
}

#top_menu li .l, #top_menu li .r{
	position: absolute;	top: 0px;
	height: 50px;	background: none;
}
#top_menu li .l{	left: -5px; background-position: 0% 0; width:5px;}
#top_menu li .r{	right: -26px; background-position: 100% 0; width:26px;}
#top_menu li.checked .l, #top_menu li.checked .r{	background-image:url("top_mnu_lr.gif");}

/*********************** Bottom Menu ********************/
#mmenu{
	display:block; clear:both;
	list-style: none;
	margin: 0;	padding: 32px 0 0 0;
	overflow:hidden;
}

#mmenu li{
	display:block; float:left;
	background: none; height: 24px;
	padding: 10px 18px 0 6px; margin:0;
}

#mmenu li a {
	position: relative;
	display: inline-block;
	font-size: 24px;
	font-style:italic;
	letter-spacing:-1px;
	color:#222; 
	text-decoration:none;
	background: url("line_b.gif") 0% 20px repeat-x;
}
#mmenu li a::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: -2px;
	width: 100%;
	height: 1px;
	background-color: #000;
}
#mmenu li a:hover::after {display: none;}
#mmenu li a.checked::after {background-color: #046ba7;}
#mmenu li a:hover, #mmenu li a.checked{
	background:none;
}

#mmenu li a.checked{ 
	font-weight:bold; 
	color:#046ba7;
}

ul.submenu{
	display: block; clear:both;
	list-style: none;
	margin: 0;	padding: 20px 0 0 0;
	overflow:hidden;
}

ul.submenu li{
	display:block; float:left;
	background: none; height: 24px;
	padding: 10px 16px 0 8px; margin:0;
}

ul.submenu li a{
	display: inline-block;	
	font-size: 18px;
	letter-spacing:-1px;
	color:#222;
	/*background: url(/i/line_b.gif) 0% 16px repeat-x;*/
}

ul.submenu a:hover, ul.submenu a.checked{
	background:none;
}

.submenu li a.checked{ 
	font-weight:bold; 
	color:#046ba7;
}
/*
.mmnu_link{
	display: block;
	font-size: 20px;

	text-decoration: none;
}

.mmnu_link:hover, .mmnu_link.checked{
	color: #0082d2;
}
*/

/****************** Middle ****************************/
#middle{
	overflow: hidden;
	background: url("page_bg.png") 0% 0% repeat;
	padding: 0 0 0 0;
}
#page{
	overflow: hidden;
	width:1000px; margin: 0 auto;
}
#content{
	padding: 0 0 20px 14px;
}
.costom .note{
	margin:6px 0 6px -14px; width:625px;
	padding: 14px 0 18px;
	position:relative;
	font-size:15px;
	font-style:italic;
	letter-spacing:-1px;
	line-height: 22px;
}
.note_top, .note_bottom{
	position:absolute; left:0px;
	width: 100%;
}

.note_top{
	top:0px; height: 16px;
	background: url("") 0px 0px no-repeat;
}
.note_bottom{
	bottom:0px; height: 20px;
	background: url("") 0px -20px no-repeat;
}
.note div{
	padding: 0 18px;
	background: url("") 0px 0px repeat-y;	
}
.note div cufon{
	padding: 6px 0 0 0;
}


.client_list table{
	width: 100%;
}

.client_list td{
	text-align: center;
	vertical-align: middle;
	padding: 5px;
}

.client_list a{
	overflow: hidden; display:inline-block;
}

.center_block{ margin:0 348px 0 0;}
.right_block{ float:right; width:330px;}
.right_block p{	font-style:italic;}

/****************** Rightbar ****************************/
#rightbar{
	float: right;
	padding: 0 0 0 18px;
	width: 320px;
}

#rightbar .note{
	width:320px;
	letter-spacing:normal;
	line-height:inherit;
}

#rightbar .note.Open{
	display:block;
}

#rightbar .note_top{
	background: url("") 0px 0px no-repeat;
}
#rightbar .note_bottom{
	background: url("") 0px -20px no-repeat;
}
#rightbar .note div{
	padding: 0 14px; font-style:normal;
	font-size: 13px; line-height: 18px;
	background: url("") 0px 0px repeat-y;	
}
.note div cufon{
	padding: 6px 0 0 0;
}


.advantages div{
	overflow: hidden;
	padding: 10px 0 10px 0;
}

.advantages div img{
	margin-right: 10px;
}


/******************* Footer ***************************/
#footer_bg{
	background: url("ftr_bg.jpg") 50% 0% no-repeat;
}

#footer{
	min-width: 1000px; height: 168px;
	padding: 18px 0 0 0; 	position:relative;	
	background: url("ftr_strip.png") 0% 100% repeat-x;	
}
#footer_mdl{
	width: 1000px; margin: 0 auto;
	position:relative;
}
.ftr_block{
	padding:  0 0 0 10px;
	float: left; height:117px;
}
.ftr_block h2{
	font-size: 24px;
	margin: 12px 0 10px 0;
}
#present{width: 330px;}
#footer .pdf{
	padding: 0 8px 0 0;
	display:block; float:left; overflow:hidden;
}
#footer .ftr_text{
	display:block; float:left;
	line-height: 22px;
}

#address{width: 330px;}
#social{float:right; width: 304px;}
#social .icon{
	display:inline-block;
	width:18px; height:18px;
	margin-right: 10px;
	text-decoration:none;
}
#fb{ background:url("") no-repeat;}
#tw{ background:url("") no-repeat;}
#vk{ background:url("") no-repeat;}
#company{
	clear:both;
	padding:16px 8px;
	color:#726f6d;
}

/***************** Этапы создания сайта ************************/
#stages{
	width:420px; height:162px;
	position: relative;
	background: url("") 160px 2px no-repeat;
	overflow: hidden;
}
#stages span{
	position: absolute;
	font-family: Arial;
	color: #323232;
	font-size: 17px;
	width: 140px;
}
#stages .stage1 {left:300px; top:0px;}
#stages .stage2 {left:10px; top:30px;}
#stages .stage3 {left:300px; top:108px;}
#stages .stage4 {left:56px; top:138px;}


/***************** Форма заявки ************************/
#form_order {position:relative; padding-top:53px;}
#form_order .form_caption{
	position:absolute; left:0px; top:0px;
	height:54px; width:257px;
	background:#f2f2f2 url("") no-repeat;
}
#form_order .form_caption h1{margin: 20px 0 0 54px;}

#form_order form{
	background:#f2f2f2;
	border: 1px solid #e0e0e0;
	padding: 14px;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
	border-bottom-left-radius: 3px;	
}
#form_order td{ vertical-align:top;}

#form_order .checkbox{
	vertical-align:middle; height:20px; 
	padding: 0 0 10px 0;
}

/***************** Продвижение сайтов ************************/
#advancement{
	position: relative; width: 944px; height: 345px;
	background: url("") 0 0 no-repeat; 
	margin: 0 auto;
	color: #FFF;
}

#advancement h2{
 font-size:17px; color:#FFF;
 margin: 10px 0;
}

/***************** Проекты ************************/
.pr_table{	width:100%;}
.pr_table td{	width:50%; vertical-align:top;}
.pr_table td p{ font-style:italic; padding-right:60px;}
.pr_link td{vertical-align:middle;}
.pr_link img{padding: 0px 10px 0 0;}

#layouts{
	margin: 40px 0 0 0;	padding: 0;
	width: 620px;
	position: relative;
}
#layouts .scrollArea{
	margin: 0;
	position: relative;	
	overflow: hidden;
	height: 500px;
}
#layouts .item{
	position: absolute;
	overflow: hidden;
	width: 100%;
	padding: 0;	margin: 0;	
	text-align:center;
}
#layouts .item_img{	padding: 20px 0 0 0; position:relative;}
#layouts .item_img img{	border: 5px solid #e7e7e7;}
#layouts .layout_name{
	height: 40px;
	font-style: italic;
	color: #8a8a8a;	
	line-height: 40px;
}
#layouts .arrNext, #layouts .arrPrev{
	display: block;	
	position: absolute;	
	cursor: pointer;
	top: 0px;
	width:18px; height:40px;
	z-index: 1;	
}
#layouts .arrNext{	right: 0px;	background: url("") 0% 50% no-repeat;	}
#layouts .arrPrev{	left: 0px;	background: url("") 0% 50% no-repeat;	}
#layouts .arrNext:hover, #layouts .arrPrev:hover{	background-position: -18px 50%;	}
#layouts .item_hide{	visibility:hidden;}
.img_loader{
	position: absolute; z-index: 1;
	width: 100%; height: 36px;
	top: 40%;	left: 0%;
	background: url("") 50% 50% no-repeat;
}

/***************** Pager ************************/
.pager{
	padding: 0 4px;
}

.pager_select{
	padding: 0 4px;
	background: #0082d2; color: #fff;
}


/***************** Project list ************************/
#projects_all td{
	padding: 0 0 20px 0;
}
.project_list {
	position:relative;
	margin:0px; padding:2px; 
	overflow:hidden;
	width:210px; height: 210px;
	border: 1px solid #DFDFDF;
	background: #fff;
}
.project_list .name {
	display: block;	
	position:absolute; top:2px; left:2px;
	width:210px; height:210px;
	color: #fff; text-decoration:none;
	font-size:13px; 
	font-style:italic; font-weight:bold;
	z-index: 2; cursor: pointer;
}

.project_list .name div{
	display: none;
}

.project_list .name span{
	display: table-cell;
	width:180px; height:210px;	
	vertical-align:middle; text-align:left;
	padding: 0 10px 0 20px;
	background: url("") repeat;
}

.project_list .image {
/*	position:absolute; top:2px; left:2px;
	height:100px; overflow:hidden;
	z-index:0; */
}

.project_list .text1 {position:relative; float:left; color:#969696; font-size:11px; width:200px; margin-bottom:40px;}
.project_list .text2 {position:absolute; float:left;}
.project_list .text3 {position:absolute; right:0px;}
.row_hide { display: none;}
.proj_loader{ position:relative; height: 50px;}
.proj_loader.loading{
	background: url("") 50% 50% no-repeat;
}
.proj_loader .pagerCount {display:none;}
/*
.progect_top {position:relative; clear:both; height:20px;}
.progect_top .left {position:absolute; left:0px; top:0px;}
.progect_top .right {position:absolute; right:0px; top:0px;}
*/
#feedback-block {background: #F2F2F2;border-radius: 18px;-moz-border-radius: 18px;-webkit-border-radius: 18px;  behavior: url(""); padding:18px 18px 18px 18px;}

/* ================================================== */
/* Forms */
/* ================================================== */
form { margin: 0; padding: 0; }
form .title {
	display: block;
	padding: 0 0 4px 4px;
}

.textbox {
	border: 1px solid #969696;
	font-size: 12px;
	padding: 3px; margin: 0;
	width: 280px;
}
textarea {
	border: 1px solid #969696;
	font-size: 12px;
	padding: 3px;
	width: 280px;

}
.select {
	font-size: 13px;
	font-family: Tahoma;
	width: 406px;
}
.button {
	border: 1px solid #B0B0B0;
	font-size: 12px;
	font-family: Arial;
	background: #EBEBEB;
	color: #000000;
	font-weight: bold;
	padding: 3px 10px 3px 10px;
	cursor: pointer;
}
.file		{ height: 21px; }
.fi_button { 
position:relative; top:0px; left:0px; 
padding:0px; margin:0px; 
text-align:right; 
background:URL("") no-repeat; 
width:65px; height:22px; overflow:hidden; 
background: url("") left top no-repeat; 
float: left; 
cursor: pointer;
}
.fi_button:hover	{ background-position: left bottom; }
.fi_file	{ padding-left: 6px; float: left; height: 21px; font: normal 11px/13px 'Tahoma',sans-serif !important; color: #777; padding-top: 5px; }
.file input {
height:20px; 
position:absolute; right:0px; 
opacity: 0; filter: alpha(opacity=0); 
}

/* -------------------------------------------------- */

.as_wrapper {overflow:hidden; padding:40px 0 0 0;}
.ind-h3 {margin-top: 28px;}
.about_head {width: 290px;}
#kwicks .kwick {position: static !important;}