/*
Theme Name: Default WB
Theme URI: http://codezilla.ru/
Description: Default theme for Trochine.com
Version: 2.1
Author: Codezilla
Author URI: http://codezilla.ru/
*/


/* Global definitions
----------------------------------- */
* { margin: 0; padding: 0; }

body { text-align: left; background: #f3f3f3; }
	body, button, input.textual, select, textarea { font: 12px/16px Tahoma, Arial, Helvetica, sans-serif; color: #363636; }

button, img, input, label, select { vertical-align: middle; }
	img { -ms-interpolation-mode: bicubic; }

div, textarea, td, th { vertical-align: top; }

fieldset, hr, img { border: 0; }

address { font-style: normal; }

p { margin-bottom: 15px; }

ol { list-style: decimal outside; margin: 0 0 15px 20px; }
	ol li { margin-bottom: 3px; }
ul { list-style: none; }

ins { position: absolute; overflow: hidden; }

table { border-collapse: collapse; }
	th, caption { font-weight: 400; text-align: left; }

a, button, label { cursor: pointer; }

:active, :focus { outline: none; -moz-outline-style: none; }

::selection { color: #fff; background: #059bcd; }
::-moz-selection { color: #fff; background: #059bcd; }

a { color: #6b6b6b; text-decoration: underline; }
	a:hover { color: #000; }

h1, h2, h3, h4, h5, h6 { font: 700 18px/22px Arial, Helvetica, "Trebuchet MS", sans-serif; margin-top: 20px; }

button {
	height: 30px;
	line-height: 30px;
	color: #fff;
	background: #9b9b9b;
	padding: 0 15px;
	border: none;
}
	button:focus, button:hover { color: #000; }

input.textual, select, textarea {
	background: #f4f4f4;
	padding: 6px 7px;
	border: 1px solid #e4e4e4;
	border-top-color: #c8c8c8;
	border-left-color: #c8c8c8;
	padding: 5px 7px 7px\9
}
	input.textual:focus, input.textual:hover, select:focus, select:hover, textarea:focus, textarea:hover { background: #eee; }
	textarea { overflow: auto; resize: none; }



/* Main blocks
----------------------------------- */
.layout { position: relative; width: 990px; margin: 23px auto 0; overflow: hidden; }

.container { position: relative; padding-top: 2px; margin-bottom: 30px; overflow: hidden; }
	.container .square {
		left: 700px;
		top: 77px;
		width: 75px;
		height: 75px;
		background: #9a9a9a;
	}
		.home .container .square { left: 575px; }

.content {
	float: left;
	width: 675px;
	background: #fff;
	padding: 25px 25px 0 0;
	overflow: hidden;
}
	.home .content { width: 350px; margin-left: 175px; padding-left: 25px; overflow: visible; }

.sidebar { float: right; width: 215px; margin-top: -2px; overflow: hidden; }
	.home .sidebar { width: 340px; }



/* Header
----------------------------------- */
.vertical-line {
	left: 774px;
	top: 175px;
	width: 1px;
	height: 100%;
	background: #d5d5d5;
}
	.home .vertical-line { left: 649px; }

.header {
	float: left;
	width: 725px;
	height: 50px;
	background: #9a9a9a url(images/header.jpg) no-repeat;
	padding: 25px 25px 0;
	overflow: hidden;
}
	.home .header { width: 600px; }
	.header h1 { float: left; margin: 0; }
		.header h1 a {
			float: left;
			width: 193px;
			height: 22px;
			text-indent: -9999px;
			background: url(images/logo.png);
			margin-top: -1px;
			overflow: hidden;
		}
			.header h1.en a { height: 17px; background-position: 0 -22px; margin-top: 4px; }
	.header ul, .header ul * { float: right; }
		.header li a {
			position: relative;
			height: 25px;
			font-size: 11px;
			line-height: 23px;
			color: #fff;
			background: #8f8f8f;
			padding: 0 10px;
		}
			.header li ins {
				left: 9px;
				top: 25px;
				width: 9px;
				height: 9px;
				background: url(images/icons.png) 0 -52px;
			}
			.header li.active a { color: #9e9e9e; background: #cbcbcb; text-decoration: none; }
			.header li a:hover { text-decoration: none; }



/* Content
----------------------------------- */
.author { min-height: 175px; overflow: hidden; }

.phone {
	position: relative;
	float: right;
	font: 22px/38px Arial, Helvetica, "Trebuchet MS", sans-serif;
	color: #757575;
	padding-left: 28px;
}
	.phone ins {
		left: 0;
		top: 0;
		width: 20px;
		height: 36px;
		background: url(images/icons.png);
	}

.about { clear: both; color: #2d2d2d; padding: 35px 0 40px 25px; overflow: hidden; }
	.about img { float: left; width: 75px; margin: 3px 25px 10px 0; }
	.about h2 { font-weight: 400; margin: 0 0 8px; }
		.about h2 img { float: none; width: auto; margin: 0; }
	.about p { margin-bottom: 5px; }
	.about a { color: #2d2d2d; }
		.about a:hover { color: #000; text-decoration: none; }

.nav { width: 215px; font: 700 14px/18px Arial, Helvetica, "Trebuchet MS", sans-serif; margin-bottom: 5x; overflow: hidden; }
	.nav li { margin-bottom: 2px; }
		.nav li a { display: block; padding: 4px 0 4px 25px; }
			.nav a:hover { color: #6b6b6b; text-decoration: none; }
			.nav .current-cat a { color: #9e9e9e; text-decoration: none; background: #d5d5d5; }
			.nav ul a, .nav .current-cat ul a {
				font-size: 12px;
				color: #6b6b6b;
				text-decoration: underline;
				background: url(images/icons.png) 35px -62px no-repeat;
				padding: 3px 0 3px 50px;
			}
				.nav .current-cat ul a:hover { text-decoration: none; }
				.nav ul li { margin: 0; }
					.nav ul .current-cat a { background: #d5d5d5 url(images/icons.png) 35px -129px no-repeat; }

.title { background: #e1e1e1; padding: 14px 25px 0; }
	.tabs { padding-top: 18px; }
	.title h2 { font-weight: 400; margin: 0; padding-bottom: 14px; }
		.title h2 a { color: #363636; }
			.title h2 a:hover { text-decoration: none; }
	.title ul { font-size: 11px; margin: -4px 0 0 -8px; padding-left: 8px; overflow: hidden; }
		.title li { float: left; height: 25px; line-height: 21px; padding: 0 10px; }
			.title li:first-child { margin-left: -8px; }
			.title li a:hover { color: #6b6b6b; text-decoration: none; }
			.title li.current-cat { background: #fff; margin: 0; }
				.title .current-cat a { color: #363636; text-decoration: none; }

.excerpt { overflow: hidden; }

.post { margin: 21px 0 25px 25px; }
	.post h1 { font-weight: 400; margin-bottom: 13px; }
	.post h2 { font-size: 16px; line-height: 20px; margin-bottom: 13px; }
	.post h3 { font-size: 14px; line-height: 18px; margin-bottom: 14px; }
	.post h4, .post h5, .post h6 { font-size: 12px; font-weight: 700; line-height: 16px; margin-bottom: 15px; }
	.post ul { list-style: square outside; margin: 0 0 15px 20px; }
		.post li { margin-bottom: 3px; }
	.post blockquote { font-style: italic; color: #777; margin: 0 0 15px 20px; }
		.post blockquote * { font-style: italic; }

.post-meta { color: #8c8c8c; }
	.post .excerpt h3 { margin-top: 15px; }

.video-embed { clear: both; margin: 20px auto 25px; overflow: hidden; }

.alignleft { float: left; margin: 4px 25px 20px 0; }
.alignright { float: right; margin: 4px 0 20px 25px; }
.aligncenter { display: block; margin: 0 auto 25px; }

.projects { margin: 21px 0 25px 25px; }
	.projects dl { margin-bottom: 21px; overflow: hidden; }
		.projects dt {
			float: left;
			width: 150px;
			text-align: right;
			padding: 4px 25px 0 0;
			overflow: hidden;
		}
			.projects dt span {
				display: block;
				height: 150px;
				text-align: left;
				text-indent: -9999px;
				background: #eee;
			}
				.projects dt a:hover span { background: #dfdfdf; }
		.projects dd { overflow: hidden; }
			.projects h3, .project h3 { font-size: 14px; line-height: 18px; margin: 0 0 9px; }
			.projects p, .project p { margin-bottom: 12px; }
			.projects .more, .project .more { margin: 0; overflow: hidden; }
				.projects .more a, .project .more a {
					float: left;
					height: 25px;
					font-size: 11px;
					line-height: 23px;
					color: #fff;
					background: #9a9a9a;
					padding: 0 8px;
				}
					.projects .more a:hover, .project .more a:hover { text-decoration: none; }

.listing { padding-top: 7px; overflow: hidden; }
	.listing li { float: left; padding-right: 1px; }
		.listing li * {
			float: left;
			height: 25px;
			font-size: 13px;
			font-weight: 700;
			line-height: 24px;
			color: #fff;
			text-decoration: none;
			background: #9a9a9a;
			padding: 0 9px 0 10px;
		}
			.listing li span { color: #9e9e9e; background: #d5d5d5; }
				.listing li.range span { color: #999; background: #eee; }
			.listing li a:hover { text-decoration: underline; }

.links { margin: 23px 0 25px 25px; }
	.links li { margin-bottom: 17px; overflow: hidden; }
		.links h3 { font-size: 14px; line-height: 18px; margin: 0; }
		.links h4 { font-size: 12px; font-weight: 400; line-height: 16px; margin: 1px 0 4px; }

.clients dl { margin-bottom: 25px; }
	.clients dt a {
		display: block;
		width: 150px;
		height: 150px;
		text-align: center;
		border: 1px solid #e3e2c7;
		overflow: hidden;
	}
		.clients dt em {
			display: block;
			height: 150px;
			text-align: left;
			text-indent: -9999px;
			background: #eee;
		}
			.clients dt a:hover em { background: #dfdfdf; }
		.clients dt img, .clients dt span { vertical-align: middle; }
		.clients dt span { display: -moz-inline-stack; display: inline-block; height: 150px; vertical-align: middle; }

.news { margin: 25px 0 25px 25px; }
	.news dl {
		display: -moz-inline-stack;
		display: inline-block;
		width: 300px;
		padding: 0 25px 25px 0;
		vertical-align: top;
		overflow: hidden;
	}
		.news dt { position: relative; height: 75px; margin-bottom: 18px; overflow: hidden; }
			.news dt a {
				position: absolute;
				left: 0;
				bottom: 0;
				width: 75px;
				height: 75px;
				overflow: hidden;
			}
				.news dt a span { display: block; height: 75px; text-indent: -9999px; background: #eee; }
					.news dt a:hover span { background: #dfdfdf; }
			.news dt em {
				position: absolute;
				left: 100px;
				bottom: 0;
				font-style: normal;
				color: #8c8c8c;
			}
				.news dt em span { position: static; display: block; }

.secondary { clear: both; margin: -5px 0 30px 175px; overflow: hidden; }
	.secondary .top, .project .pointer { min-height: 42px; background: #d8d8d8; padding: 18px 25px 15px; }
		.secondary .top h2, .project .pointer h2 { font-weight: 400; margin: 0 0 0 -1px; }
		.secondary .top a, .project .pointer a { font-size: 11px; }
	.secondary-inner { float: left; width: 740px; background: #fff; overflow: hidden; }
		.secondary .news { margin-right: -5px; overflow: hidden; }
			.secondary .news dl { float: left; width: 215px; padding-bottom: 5px; }
	.secondary .square {
		position: static;
		float: right;
		width: 75px;
		height: 75px;
		background: #d8d8d8;
	}

.project { position: relative; }
	.project .thumb, .project-inner { width: 100%; margin-bottom: 25px; overflow: hidden; }
		.project .thumb span { display: block; height: 350px; text-indent: -9999px; background: #eee; }
			.project .thumb a:hover span { background: #dfdfdf; }
	.project .pointer { position: absolute; left: -200px; top: 0; width: 149px; }
		.project .pointer ins {
			left: 199px;
			top: 13px;
			width: 16px;
			height: 16px;
			background: url(images/icons.png) 0 -36px;
		}
	.project h3 { margin-bottom: 15px; }

.contactForm-holder { margin-top: 35px; }
#contactForm { margin-top: 25px; }
	#contactForm ul { list-style: none; margin: 0; }
		#contactForm li { margin: 0 0 18px; overflow: hidden; }
			#contactForm label { float: left; width: 130px; padding-top: 5px; }
			#contactForm input { float: left; width: 250px; }
			#contactForm textarea { float: left; width: 460px; height: 300px; }
			#contactForm .error { clear: both; display: block; color: #f00; padding: 3px 0 0 130px; }
				#contactForm .error em { font-style: normal; text-transform: lowercase; }
			#contactForm .contactCopy, #contactForm .contactSubmit { padding-left: 130px; }
				#contactForm .contactCopy label { float: none; padding: 0; }
				#contactForm .contactCopy input { float: none; width: auto; margin-right: 8px; }
			#contactForm .screenReader { position: absolute; left: -999px; top: -999px; }
	.contactForm-holder .info, .contactForm-holder .tick { background: #d4ebaf; margin-left: -25px; padding: 9px 10px 9px 25px; }
	.contactForm-holder .alert { background: #ffd9c8; margin-left: -25px; padding: 9px 10px 9px 25px; }

.spinner {
	position: absolute;
	width: 16px;
	height: 16px;
	background: url(images/spinner.gif);
	margin: 7px 0 0 5px;
	visibility: hidden;
}



/* Footer
----------------------------------- */
.footer {
	font-size: 11px;
	color: #2d2d2d;
	margin-right: 215px;
	padding: 20px 0 40px;
	border-top: 27px solid #9a9a9a;
	overflow: hidden;
}
	.home .footer { margin: 0 340px 0 175px; }
	.footer p { margin: 0; }
		.footer .dev { float: right; }
			.footer .dev a { font-weight: 700; }

.twitter {
	position: absolute;
	right: 0;
	font-size: 11px;
	margin-top: -30px;
	padding-top: 42px;
	text-align:right;
}
	.twitter ins {
		right: 0;
		top: 0;
		width: 129px;
		height: 41px;
		background: #f1f1f1 url(images/twitter.png);
	}



/* Hacks
----------------------------------- */
@-moz-document url-prefix() {
button { padding-bottom: 2px; }
}

@media all and (-webkit-min-device-pixel-ratio:0) {
body:first-of-type button { line-height: 28px; }
}

.social-links{
padding:5px 0px;
overflow:hidden;
}

.social-links-right li{
float:right !important;
}

.social-links li{
float:left;
overflow:hidden;
}

.social-links li.facebook-like iframe{
margin:3px 0px;
}