/*
 * trendless.ru main styles
 * Author: Zolotov Nikita (nikita at infolio.ru)
 *
 */

/* =Layout
----------------------------------------------*/
#container{
	width: 944px;
	margin: 0 auto;
	}
#header{
	position: relative;
	padding: 35px 0;
	}
#wrapper{
	float: left;
	width: 100%;
	}
	#wrapper #content{
		margin-right: 208px;
		padding: 0 100px 0 35px;
		}
#navigation{
	float: left;
	width: 208px;
	margin-left: -208px;
	}
#footer{
	clear: left;
	width: 100%;
	padding: 3em 0;
	}

/* =Header
----------------------------------------------*/
#header h1{
	margin-left: 35px;
	}
	#header h1 a,
	#header h1 strong{
		display: block;
		position: relative;
		width: 157px;
		height: 66px;
		overflow: hidden;
		border: none;
		}
		#header h1 a span,
		#header h1 strong span{
			position: absolute;
			left: 0;
			top: 0;
			width: 157px;
			height: 66px;
			background: url('../img/logo.png') no-repeat;
			}
#main-menu{
	position: absolute;
	left: 248px;
	top: 30px;
	width: 309px;
	height: 47px;
	background: #fec300;
	}
	#main-menu li{
		float: left;
		height: 47px;
		text-transform: uppercase;
		list-style: none;
		}
		#main-menu li a,
		#main-menu li em{
			display: block;
			position: relative;
			width: 111px;
			height: 47px;
			overflow: hidden;
			color: #fff;
			border: none;
			}
			#main-menu li a span,
			#main-menu li em span{
				position: absolute;
				top: 0;
				left: 0;
				width: 111px;
				height: 47px;
				background: url('../img/main_menu.png') no-repeat 0 0;
				}
			#main-menu li a:hover span{
				background-position: 0 -47px;
				}
			#main-menu.active-company .company a span,
			#main-menu.active-company .company em span{
				background-position: 0 -94px !important;
				}
		#main-menu .services a,
		#main-menu .services a span,
		#main-menu .services em,
		#main-menu .services em span{ width: 80px; }
		#main-menu .services a span{ background-position: -111px 0; }
		#main-menu .services a:hover span{ background-position: -111px -47px; }
		#main-menu.active-services .services a span,
		#main-menu.active-services .services em span{ background-position: -111px -94px !important; }
		
		#main-menu .support a,
		#main-menu .support a span,
		#main-menu .support em,
		#main-menu .support em span{ width: 118px; }
		#main-menu .support a span{ background-position: -191px 0; }
		#main-menu .support a:hover span{ background-position: -191px -47px; }
		#main-menu.active-support .support a span,
		#main-menu.active-support .support em span{ background-position: -191px -94px !important; }

#header p{
	position: absolute;
	top: 33px;
	left: 580px;
	font-size: .8125em;
	}
#auth{
	position: absolute;
	left: 773px;
	top: 53px;
	}
	#auth a{
		border: none;
		background: none;
		}

/* =Navigation
----------------------------------------------*/
#navigation h2{
	width: 192px;
	height: 35px;
	padding: 5px 0 0 15px;
	font: normal 1.3125em Tahoma, Helvetica, sans-serif;
	color: #fff;
	background: #a4a4a4 url('../img/sub_menu.png') no-repeat;
	}
#navigation .sub-menu{
	width: 177px;
	margin-bottom: 1.25em;
	padding: .75em 15px .625em 15px;
	color: #fec300;
	background: url('../img/sub_menu.png') no-repeat left bottom;
	}
	#navigation .sub-menu li{
		margin-bottom: .75em;
		font-size: .8125em;
		list-style: none;
		}
		#navigation .sub-menu li a{
			color: #393939;
			border: none;
			background: none;
			}
		#navigation .sub-menu li a:hover{
			border-bottom: 1px solid;
			}
			#navigation .sub-menu li ul{
				padding: 1em 0 1px 10px;
				}
				#navigation .sub-menu li li{
					margin-bottom: .5em;
					font-size: 1em;
					line-height: 1.2
					}
	#navigation .sub-menu .kids{
		margin: -25px -15px .75em 0;
		}
		#navigation .sub-menu .kids img{
			position: relative;
			top: 3px;
			left: 6px;
			}
ul#chatting-menu{
	width: 203px;
	height: 28px;
	margin-bottom: .75em;
	background: #fec300;
	}
	ul#chatting-menu li{
		float: left;
		height: 28px;
		margin: 0;
		padding: 0;
		text-transform: uppercase;
		list-style: none;
		background: none;
		}
		#chatting-menu li a,
		#chatting-menu li em{
			display: block;
			position: relative;
			width: 53px;
			height: 28px;
			overflow: hidden;
			color: #fff;
			border: none;
			}
			#chatting-menu li a span,
			#chatting-menu li em span{
				position: absolute;
				top: 0;
				left: 0;
				width: 53px;
				height: 28px;
				background: url('../img/chatting_menu.png') no-repeat 0 0;
				}
			#chatting-menu li a:hover span{
				background-position: 0 -28px;
				}
		#chatting-menu .forum a,
		#chatting-menu .forum a span,
		#chatting-menu .forum em,
		#chatting-menu .forum em span{ width: 62px; }
		#chatting-menu .forum a span{ background-position: -53px 0; }
		#chatting-menu .forum a:hover span{ background-position: -53px -28px; }
		
		#chatting-menu .interesting a,
		#chatting-menu .interesting a span,
		#chatting-menu .interesting em,
		#chatting-menu .interesting em span{ width: 88px; }
		#chatting-menu .interesting a span{ background-position: -115px 0; }
		#chatting-menu .interesting a:hover span{ background-position: -115px -28px; }

/* =Footer
----------------------------------------------*/
#footer .copyright,
#footer .tel{
	float: left;
	font-size: .75em;
	}
#footer .copyright{
	width: 566px;
	padding: 0 0 1em 65px;
	}
	#footer .copyright p,
	#footer ul,
	#footer li{
		display: inline;
		}
	#footer ul{
		margin-left: 2em;
		}
		#footer li{
			margin-right: .5em;
			}
#footer .tel{
	width: 300px;
	}
#footer a{
	color: #393939;
	}
#footer a.fn{
	color: #393939;
	border: none;
	background: none;
	}

/* =Common
----------------------------------------------*/
.hidden{
	display: none;
	visibility: hidden;
	}
.nowrap{
	white-space: nowrap;
	}
a.simple{
	border: none;
	background: none;
	}
a.underlined{
	color: #fff;
	border: none;
	text-decoration: underline;
	}
a.dashed{
	text-decoration: none;
	border-bottom: 1px dashed;
	}
#header h1 a span,
#main-menu li a span,
#chatting-menu li a span{
	cursor: pointer;
	}

/* =Content
----------------------------------------------*/
#content .index-promo-wrapper{
	margin-bottom: 2em;
	}
	#content .index-promo{
		float: left;
		width: 667px;
		margin-right: 18px;
		}
	#content .index-promo-wrapper .news{
		position: relative;
		float: left;
		width: 228px;
		height:	359px;
		padding: 5px 15px 20px 15px;
		overflow: hidden;
		background: url('../img/news.png') no-repeat;
		}
		#content .index-promo-wrapper .news h2{
			margin: 0 0 1em 0;
			font: normal 1.3125em Tahoma, Helvetica, sans-serif;
			color: #fff;
			}
		#content .index-promo-wrapper .news dt{
			line-height: 1.2;
			}
			#content .index-promo-wrapper .news dt a{
				color: #393939;
				border-bottom: none;
				}
			#content .index-promo-wrapper .news dt a:hover{
				border-bottom: 1px dotted;
				}
		#content .index-promo-wrapper .news .archive{
			position: absolute;
			bottom: 0;
			width: 228px;
			padding: 1em 0;
			border-bottom: 1px solid #e3e3e3;
			background: #fff;
			}
#content #chatting-menu{
	margin-left: 65px;
	}
#content .promo{
	position: relative;
	width: 387px;
	height: 441px;
	margin: 0 -100px 0 -35px;
	padding: 40px 290px 0 40px;
	color: #454545;
	background: #d1e300 url('../img/promo_bg.png') no-repeat left bottom;
	}
	#content .promo h2{
		position: relative;
		width: 365px;
		height: 148px;
		margin: 0 0 .4em 0;
		overflow: hidden;
		font-size: 2em;
		color: #fff;
		}
		#content .promo h2 span{
			position: absolute;
			top: 0;
			left: 0;
			width: 365px;
			height: 148px;
			background: url('../img/text/promo.png') no-repeat;
			}
	#content .promo p{
		margin-bottom: 2.5em;
		font-size: .9375em;
		line-height: 1.3;
		}
	#content .promo ul{
		width: 100%;
		}
		#content .promo li{
			float: left;
			margin: 0 23px .75em 0;
			padding: 0;
			list-style: none;
			white-space: nowrap;
			background: none;
			}
			#content .promo li a{
				position: relative;
				float: left;
				height: 28px;
				padding: 8px 0 0 12px;
				color: #fff;
				border: none;
				background: url('../img/promo_menu.png') no-repeat;
				}
			#content .promo li span{
				position: absolute;
				right: -13px;
				top: 0;
				width: 13px;
				height: 36px;
				background: url('../img/promo_menu.png') no-repeat right top;
				}
	#content .promo h3{
		position: absolute;
		left: 452px;
		top: 19px;
		width: 233px;
		height: 235px;
		margin: 0;
		overflow: hidden;
		font-size: 1em;
		color: #c605b2;
		}
		#content .promo h3 span{
			position: absolute;
			top: 0;
			left: 0;
			width: 233px;
			height: 235px;
			background: url('../img/text/promo_star.png') no-repeat;
			}
	#content .promo .cat{
		position: absolute;
		right: 18px;
		bottom: -38px;
		width: 252px;
		height: 269px;
		background: url('../img/cat.jpg') no-repeat;
		}
#content .description-list{
	font-size: 1em;
	}
	#content .description-list li{
		padding: 0;
		background: none;
		}
		#content .description-list .image{
			float: left;
			width: 180px;
			}
		#content .description-list .description{
			margin-left: 180px;
			}
			#content .description-list p,
			#content .description-list ul{
				font-size: .8125em;
				}
			#content .description-list h3{
				margin-top: 0;
				}
			#content .description-list li li{
				margin-left: -22px;
				padding-left: 22px;
				background: url('../img/list_item.gif') no-repeat 0 .8em;
				}
#content .rule-text{
	font-size: .75em;
	color: #676767;
	}
#content dl.news{
	}
	#content .news dd{
		margin-bottom: 1em;
			}
		#content .news p{
			margin: 0;
			}
		#content .news .date,
		#content dl.news dt{
			margin-top: .25em;
			font-size: .9em;
			color: #999;
			}
#content .date{
	margin-top: 2em;
	color: #999;
	}
#content .calendar{
	margin-bottom: 1em;
	font-size: 1em;
	}
	#content .calendar dt{
		float: left;
		padding-right: 15px;
		font-size: .8125em;
		color: #636363;
		}
	#content .calendar dd{
		position: relative;
		top: -12px;
		float: left;
		}
		#content .calendar ul{
			margin: 0;
			font-size: .75em;
			}
			#content .calendar li{
				position: relative;
				float: left;
				height: 19px;
				width: 55px;
				margin: 0;
				padding: 12px 17px 1px 17px;
				background: none;
				}
				#content .calendar li .months{
					display: none;
					position: absolute;
					left: 0;
					top: 32px;
					width: 55px;
					padding: 3px 17px 0 17px;
					background: url('../img/month_menu.png') no-repeat 0 -32px;
					}
					#content .calendar li .months div{
						position: absolute;
						left: 0;
						bottom: -14px;
						width: 89px;
						height: 14px;
						background: url('../img/month_menu.png') no-repeat left bottom;
						}
				#content .calendar li ul{
					font-size: 1em;
					}
					#content .calendar li li{
						float: none;
						padding: 0 0 2px 0;
						background: none;
						}
			#content .calendar li.active{
				background: url('../img/month_menu.png') no-repeat;
				}
				#content .calendar li.active > a{
					color: #393939;
					border: none;
					}
#content .map{
	width: 100%;
	font-size: 1em;
	}
	#content .map li{
		float: left;
		padding: 0 35px 1px 0;
		background: none;
		}
		#content .map li a{
			font-size: 1.125em;
			}
		#content .map ul{
			font-size: .75em;
			}
			#content .map li li{
				float: none;
				padding: 0 0 1px 1em;
				}
				#content .map li li a{
					font-size: 1em;
					}
				#content .map li li a:link{
					color: #555;
					}
				#content .map li li a:visited{
					color: #105a72;
					}
				#content .map ul ul{
					margin-bottom: 0;
					font-size: 1em;
					}
	#content .map .company{
		width: 160px;
		height: 32em;
		}
	#content .map .services{
		width: 130px;
		height: 32em;
		}
	#content .map .support{
		width: 240px;
		padding-right: 0;
		height: 32em;
		}
	#content .map .gallery{
		width: 160px;
		}
	#content .map .forum{
		width: 130px;
		}
		#content .map .company a{ color: #fec300; }
		#content .map .services a{ color: #cade00; }
		#content .map .support a{ color: #00bae3; }
		#content .map .gallery a{ color: #ff8f00; }
		#content .map .forum a{ color: #ff0088; }
		#content .map .interesting a{ color: #6b00ff; }

#content .files{
	font-size: .75em;
	}
	#content .files li{
		padding: 0;
		background: none;
		}
#content a.file{
	display: block;
	min-height: 16px;
	padding-left: 35px;
	text-decoration: underline;
	border: none;
	}
#content a.file:link{
	color: #555;
	}
	#content .doc{ background: url('../img/ico/files/doc.gif') no-repeat 0 2px; }
	#content .pdf{ background: url('../img/ico/files/pdf.gif') no-repeat 0 2px; }

#content table{
	}
	#content table .numeric{
		text-align: right;
		}
	#content table .numeric-4{
		width: 4em;
		}

/* =Forms
---------------------------------------------*/
#content form{
	}
	#content form .message{
		margin-left: -1em;
		padding: .5em 1em .625em 1em;
		border: 1px solid #ccc;
		}
	#content form p{
		margin-bottom: 1.5em;
		}
	#content form.correct p{
		margin-bottom: 1em;
		}
	#content form h3{
		margin-bottom: 1em;
		}
	#content form label{
		float: left;
		clear: left;
		width: 185px;
		padding-right: 15px;
		}
	#content form label.short{
		text-align: right;
		}
	#content form.short label{
		width: 100px;
		}
	#content form.short span{
		display: block;
		margin-left: 115px;
		}
	#content form .text{
		float: left;
		width: 380px;
		}
	#content form.correct .text{
		color: #000;
		}
	#content form .select{
		float: left;
		width: 385px;
		}
	#content form .date span{
		float: left;
		margin-right: 20px;
		}
	#content form .several span{
		float: left;
		}
		#content form .several label{
			float: none;
			padding-right: 1em;
			}
	#content form .several .series{
		width: 200px;
		}
		#content form .several .series input{
			width: 80px;
			}
		#content form .several .number label{
			width: 50px;
			}
		#content form .several .number input{
			width: 320px;
			}
	#content .another{
		line-height: 2;
		}
	#content form .tip,
	#content form .error{
		clear: left;
		display: block;
		margin-left: 200px;
		font-size: .9em;
		line-height: 2.5;
		}
	#content form .error{
		line-height: 1.4;
		color: #f90000;
		}
	#content form .submit{
		float: right;
		font-size: 1.3em;
		}
	#content form.short .submit{
		float: none;
		margin-left: 115px;
		}
	#content form .back{
		margin-top: .5em;
		}

/* =Clearfix
---------------------------------------------*/
.clearfix:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}
.clearfix {
	display: inline-block;
	}
/* Holly Hack Targets IE Win only \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End Holly Hack */