@import url("reset.css");

body,html {height:100%}
body {color:#3f3f3f; background:#fff url(../img/bg-t.png) repeat-x 0 0; font:12px Tahoma,Verdana,Helvetica,'MS Sans Serif',sans-serif}
td,th {color:#3f3f3f; font:1em Tahoma,Verdana,Helvetica,'MS Sans Serif',sans-serif}
input,textarea,option,select {color:#5a5a5a; font:1em Tahoma,Verdana,Helvetica,'MS Sans Serif',sans-serif}

/* // ---- typography ---- // */

.b-title {color:#4c4b4b; font-size:20px; font-weight:normal; padding-bottom:13px}

a {color:#4c4b4b; text-decoration:underline}
a:hover {text-decoration:none}



.img-title {position:relative; color:#aaa; font-size:15px; line-height:17px; overflow:hidden}
	.img-title i {position:absolute; top:0; left:0; width:100%; height:100%}
	/* // ---- titles ---- // */
	.blog-title {width:94px; height:19px}
		.blog-title i {background:url(../img/title-blog.png)}
	.small-about {width:114px; height:19px}
		.small-about i {background:url(../img/title-aboutsmall.png)}
	/* -- ---- titles ---- -- */
/* -- ---- typography ---- -- */

#minWidth {position:relative; min-width:1000px; height:auto !important; height:100%; min-height:100%; background:url(../img/bg-b.png) repeat-x 0 100%}
.maincont {margin:0 auto; width:1000px}

.outer {position:relative}

/* // ---- top ---- // */
.top {padding:36px 0 32px 93px}
	.top .logo {}
/* -- ---- top ---- -- */

.o-tp {position:relative; z-index:2; height:7px; background:url(../img/o-tp-bg.png) repeat-x 0 0; font-size:1px}
	.o-tp i {position:absolute; top:0; background:url(../img/o-tp-crn.png); width:19px; height:19px}
	.o-tp .l {left:0}
	.o-tp .r {right:0; background-position:100% 0}

.o-md {position:relative; z-index:1; background:url(../img/o-md.png) repeat-y 0 0; padding:0 13px}
	.omd {background-color:#fff}

.o-bt {position:relative; margin-right:20px; font-size:1px; height:12px}
	.o-bt i {display:block; height:12px}
	.o-bt .l {background:url(../img/o-bt-l.png)}
	.o-bt .r {position:absolute; right:-20px; width:20px; background:url(../img/o-bt-r.png)}

/* // ---- vis block ---- // */
.vis-block {height:303px}
	.vis-block a {display:block; height:303px}
/* -- ---- vis block ---- -- */

/* // ---- navigation ---- // */
.navigation {position:relative; width:25%}
	.navigation ul {position:relative; margin-right:-400%; width:400%}
		.navigation ul li {float:left; width:25%}
	.navigation ul a, .navigation ul .hr {position:relative; margin:0 -2px 0 2px; display:block; color:#eee; height:40px; padding:6px 0 0 0; background:#000 url(../img/nav-bg.png) no-repeat 100% 0; font-size:17px}
		.navigation ul a span, .navigation ul .hr span {position:relative; display:block; height:19px; overflow:hidden; font-size:17px; line-height:17px; left:22px}
			.navigation ul a span i, .navigation ul .hr span i {position:absolute; top:0; left:0; width:100%; height:19px}
	.navigation ul a:hover, .navigation ul .hr {color:#191919; background-color:#d9d9d9}
		.navigation ul a:hover span i, .navigation ul .hr span i {background-position:0 -19px}
	.navigation .nav-1 {margin-left:0 !important}
	.navigation .nav-1 span {width:56px}
		.navigation .nav-1 span i {background-image:url(../img/nav-1.png)}
	.navigation .nav-2 span {width:54px}
		.navigation .nav-2 span i {background-image:url(../img/nav-2.png)}
	.navigation .nav-3 span {width:93px}
		.navigation .nav-3 span i {background-image:url(../img/nav-3.png)}
	.navigation .nav-4 {background-image:none !important; margin-right:0 !important}
	.navigation .nav-4 .b i {margin-right:0}
	.navigation .nav-4 span {width:76px}
		.navigation .nav-4 span i {background-image:url(../img/nav-4.png)}
	.navigation .b {position:absolute; left:-999em; top:-999em; width:100%; font-size:1px}
		.navigation .b i {display:block; height:4px; background-color:#191919; margin-right:2px}
	.navigation ul a:hover .b, .navigation ul .hr .b {top:49px; left:0}
/* -- ---- navigation ---- -- */

.middle {background:url(../img/middle-brd.png) no-repeat 0 -408px}
.grid50col {background-position:470px 24px; padding:30px 0}
	.grid50col .long-col {float:left; width:453px; height:auto !important; min-height:432px; height:432px}
		.grid50col .longcol {padding:0 0 0 66px}
	.grid50col .side-col {float:right; width:448px}

.grid2col {background-position:668px 24px; padding:30px 0 10px}
	.grid2col .long-col {float:left; width:650px; height:auto !important; min-height:432px; height:432px}
		.grid2col .longcol {padding:0 0 0 82px}
	.grid2col .longcol .b-title {margin-left:-19px}
	.grid2col .side-col {float:right; width:239px; padding-top:42px}


/* // ---- blog list ---- // */
.blog-list {padding:15px 0 22px 15px}
	.blog-list dd {padding-bottom:14px}
	.blog-list .all-read {padding-top:5px}
/* -- ---- blog list ---- -- */

.latest-work {padding:0 0 38px 15px}
	.latest-work a {text-decoration:none}
	.latest-work img {margin-bottom:8px}
	.latest-work small {display:block; font-size:12px; text-decoration:underline}

.phone-block {position:relative; margin-left:-21px}

/* // ---- inner black ---- // */
.inner-black {position:relative; margin-right:-13px}
	.inner-black .in-b {position:relative}
		.inner-black .in-b i {display:block}
		.inner-black .in-b .r {position:relative; float:right}
	.inner-black .in-tp {position:relative; z-index:2; height:9px; background:#191919 url(../img/inner-black-bg.png) repeat-y 100% 0; margin-right:4px; font-size:1px}
		.inner-black .in-tp .l {position:absolute; left:0; top:0; width:19px; height:19px; background:url(../img/inner-black-tl.png)}
		.inner-black .in-tp .r {right:-4px; width:4px; height:9px; background:url(../img/inner-black-tr.png)}
	.inner-black .in-md {position:relative; z-index:1; background:url(../img/inner-black-md.png) repeat-y 100% 0}
		.inner-black .in-bg {background:url(../img/inner-black-md-l.png) repeat-y 0 0; padding:0 4px}
		.inner-black .inmd {position:relative; background:#191919 url(../img/inner-black-bg.png) repeat-y 100% 0}
	.inner-black .in-bt {position:relative; z-index:2; height:9px; background:url(../img/inner-black-bt.png); margin-right:15px; font-size:1px}
		.inner-black .in-bt .l {position:absolute; left:0; top:-15px; width:19px; height:24px; background:url(../img/inner-black-bl.png)}
		.inner-black .in-bt .r {right:-15px; width:15px; height:9px; background:url(../img/inner-black-br.png)}
/* -- ---- inner black ---- -- */

.briefly-block {padding:19px 0 14px 4px}
	.briefly-block .inmd {color:#b6b6b6; padding:0 18px 0 26px}
	.briefly-block h3 {position:relative; top:-2px; color:#d40000; font-size:25px; font-weight:normal; padding-bottom:12px}
	.briefly-block p {padding-bottom:25px}
	.briefly-block p.cfix {padding:0 20px 17px 0}
		.briefly-block p.cfix a {color:#d40000; text-decoration:none}
			.briefly-block p.cfix a span {border-bottom:1px dashed}
	.briefly-block .r-link {float:right; background:url(../img/ar-r.gif) no-repeat 100% 0; padding:1px 20px 3px 0}
		.briefly-block .r-link a {}
	.briefly-block .l-link {float:left; background:url(../img/ar-l.gif) no-repeat 0 0; padding:1px 0 3px 20px}

.advice-block {}
	.advice-block .img-title {width:73px; height:19px; margin-bottom:8px}
		.advice-block .img-title i {background:url(../img/title-advice.gif)}
	.advice-block ul {padding-left:69px}
		.advice-block ul .img-cover {position:relative; float:left; left:-50px; margin:3px -50px 0 0}
	.advice-block .i-view {padding-bottom:5px}

/* // ---- bottom ---- // */
.bottom {color:#313131; font-size:10px}
	.main-page .bottom {padding:10px 0 30px 103px}
	.second-page .bottom {padding:19px 0 30px 56px}
.bottom-additional {position:relative; margin-left:-24px; padding-bottom:15px}
	.bottom-additional li {float:left; padding-right:23px}
	.bottom-additional .all-read {padding-top:10px}
/* -- ---- bottom ---- -- */



/* // ---- editor styles ---- // */
.for-editor {}
	.for-editor h2 {font-size:16px; font-weight:normal; padding-bottom:14px}
	.for-editor p {padding-bottom:16px}
/* -- ---- editor styles ---- -- */

.side-nav {color:#eee; font-size:16px}
	.side-nav ul {padding:5px 0 22px 21px}
		.side-nav ul li {padding:4px 10px 4px 26px}
			.side-nav ul li.hr {background:url(../img/side-hr.gif) no-repeat 0 5px}
	.side-nav a {color:#eee}

/* // ---- sec nav ---- // */
.sec-nav {position:relative; padding:12px 0 79px 143px}
	.secnav {font-size:16px}
		.secnav ul {position:relative; width:100%}
		.secnav ul li {float:left; margin:0 3px 0 0}
			.secnav ul ul {position:absolute; display:block; left:-999em; right:auto; top:-999em; width:650px; background-color:#d9d9d9}
		.secnav a {position:relative; z-index:2; display:block; color:#646464; padding:2px 6px 3px}
			.secnav a i {position:absolute; top:-999em; left:50%; margin-left:-8px; width:17px; height:9px; background:url(../img/secnav-crn.png); font-size:1px}
			.secnav a:hover, .secnav .sfHover a {color:#fff; background-color:#9c0000; text-decoration:none}
				.secnav .sfHover a i {top:auto; bottom:-9px}
		.secnav .sfHover ul {z-index:1; top:34px; left:0; font-size:14px}
			.secnav .sfHover ul ul {top:25px}
				.secnav ul ul a {padding:3px 6px 5px; color:#646464 !important; background-color:transparent !important; text-decoration:underline !important}
					.secnav ul ul a:hover, .secnav ul ul li.sfHover a {color:#fff !important; background-color:#000 !important; text-decoration:none !important}
				.secnav ul ul li {position:relative}
					.secnav ul ul ul {width:200px; background-color:#000; padding:5px 0}
						.secnav ul ul ul li {float:none; padding:2px 10px 4px; font-size:12px}
						.secnav ul ul li.sfHover ul a {display:inline; float:none !important; color:#fff; background-color:transparent !important; padding:0; text-decoration:underline !important}
							.secnav ul ul li.sfHover ul a:hover {text-decoration:none !important}
/* -- ---- sec nav ---- -- */

.two-col {padding:7px 14px 20px 63px; height:auto !important; height:381px; min-height:381px; background:url(../img/middle-brd.png) no-repeat 50% 0}
	.two-col {}
	.two-col .width50 {width:420px}

.services {}
	.services dt, .latest-works dt {color:#4c4b4b; font-size:20px; padding-bottom:13px}
	.services dd {padding-bottom:24px}

.services-more {padding-bottom:30px}

.type-works {font-size:14px}
	.type-works li {padding-bottom:16px}
	.type-works ul {font-size:12px; padding:4px 0 0 8px; margin-bottom:-2px}
		.type-works ul li {padding-bottom:2px}

.latest-works {}
	.latest-works dd, .list-works-dd li {background:url(../img/li.gif) no-repeat 0 7px; padding:0 0 7px 7px}
	.latest-works .all-work, .list-works-dd .all-work {font-size:11px; background-image:none !important; padding-top:35px}

.list-works-dd {padding-left:8px}
.list-works-dd .all-work {position:relative; margin-left:-11px; padding-top:0}


.trash {position:relative; clear:both; text-align:right; padding-right:20px}
	.trash a {display:-moz-inline-stack; display:inline-block; background:url(../img/ico-trash.png) no-repeat 0 0; height:34px; line-height:34px; padding-left:35px}

.portfolio-small {position:relative; background-position:50% 15px}
	.portfolio-small dt {font-size:19px}

/* // ---- portfolio card ---- // */
.portfolio-card {background:url(../img/middle-brd.png) no-repeat 655px 0; height:auto !important; height:408px; min-height:408px; padding-bottom:20px}
	.portfolio-card .long-col {float:left; width:655px}
				.portfolio-card .longcol {padding:30px 0 0 0}
			.portfolio-card .longcol p {padding-bottom:30px}
	.portfolio-card .side-col {float:right; width:278px}
		.portfolio-card .sidecol {padding:24px 20px 0 0}
.portfolio-card h1 {color:#4c4b4b; font-size:21px; font-weight:normal}
.portfolio-card h2 {color:#4c4b4b; font-size:17px; font-weight:normal; padding:10px 0}
.portfolio-card p {padding-bottom:14px}
/* -- ---- portfolio card ---- -- */

/* // ---- contact card ---- // */
.contact-card {padding:30px 30px 80px 67px}
	.contact-card .img-title {margin-bottom:19px}
.feedback {float:left; width:411px}
	.feedback .inputs {padding-bottom:10px}
	.feedback .inputs input, .feedback .inputs textarea {border:1px solid #bcbcbc; padding:2px 5px; width:399px}
	.feedback .inputs textarea {height:238px}
	.feedback .btn {text-align:right}
	.contact-card .side-col {position:relative; margin-top:-3px; float:right; width:410px}
/* -- ---- contact card ---- -- */

.scrollable-content {position:relative; width:100%; overflow:hidden}
	.scrollable-content ul {position:relative; width:5000px}
		.scrollable-content ul li {float:left; width:405px}