@import url("reset.css");

body,html {height:100%}
body {color:#808080; background-color:#000; font:11px 'Trebuchet MS',Helvetica,'MS Sans Serif',sans-serif}
td,th {color:#808080; font:1em 'Trebuchet MS',Helvetica,'MS Sans Serif',sans-serif}
input,textarea,option,select {color:#000; font:1em Arial,Helvetica,'MS Sans Serif',sans-serif}

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

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

.fBold {font-weight:bold;}

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

#minWidth {position:relative; min-width:1000px; width:100%; height:100%; display:table}
.center-block {display:table-cell; vertical-align:middle}
	.centerblock {position:relative; background:#000 url(../img/bg.gif) 50% 0; height:407px}
		.centerblock .over-block {position:relative; width:100%; height:407px; overflow:hidden}

.outer {position:relative; z-index:89; min-width:1000px; max-width:1280px; height:407px; margin:0 auto}

#line-1 {position:absolute; z-index:3; font-size:1px; overflow:hidden; top:0; left:-1px; width:1px; height:407px; background:#393939}
#line-2 {position:absolute; z-index:2; font-size:1px; overflow:hidden; top:0; left:100%; width:3px; height:407px; background:#393535}
#line-3 {position:absolute; z-index:1; font-size:1px; overflow:hidden; top:-2px; left:0; width:100%; height:2px; background:#313131}
#sh-1, #sh-2, #sh-3, #sh-4 {position:absolute; z-index:1; font-size:1px; overflow:hidden; top:0; left:0; width:100%; height:407px; display:none}
.sh-o-0 {background:url(../img/m-1.png) no-repeat 50% 50%}
.sh-o-1 {background:url(../img/m-2.png) no-repeat 50% 50%}
.sh-o-2 {background:url(../img/m-3.png) no-repeat 50% 50%}
.sh-o-3 {background:url(../img/m-4.png) no-repeat 50% 50%}
.sh-o-4 {background:url(../img/m-5.png) no-repeat 50% 50%}
.sh-o-5 {background:url(../img/m-6.png) no-repeat 50% 50%}
.sh-o-6 {background:url(../img/m-7.png) no-repeat 50% 50%}

.pl {font-size:1px; position:absolute; left:-999em; top:-999em; width:1px; height:1px}


.logo {position:absolute}

.develop {position:absolute; left:0; top:417px; width:100%; font:9px Arial,Helvetica; text-transform:uppercase}
	.develop .outer {height:auto}
	.develop a {position:absolute; left:8%; color:#1a1a1a}
	.develop a:hover {color:#333; text-decoration:none}
  .develop .quicktime {color:#666; font-family:Tahoma,Verdana; text-transform:none; right:9%; text-align:right; left:auto !important; padding:4px 95px 4px 0; white-space:nowrap; background:url(../img/quicktime_download.gif) no-repeat 100% 0;}  

/* // ---- main page ---- // */
.main-page {}
	.main-page .logo {left:8%; top:124px}
	.main-page .rec {position:absolute; left:85%; top:128px; color:#a51717; font-size:14px; background:url(../img/rec.gif) no-repeat 0 5px; padding-left:14px}
	.main-page .bat {position:absolute; left:72%; top:151px; color:#999; font-size:14px; padding-left:36px; background:url(../img/bat.gif) no-repeat 0 2px}
	.main-page .clock {position:absolute; left:72%; color:#999; font-size:14px; top:128px}
	.main-page .lang-bar {position:absolute; left:31%; top:128px; width:330px; font-size:12px}
		.main-page .lang-bar li {float:left; padding-right:16px}
		.lang-bar a {color:#999}
/* -- ---- main page ---- -- */

.line-top {position:absolute; left:9%; top:102px; width:82%; height:1px; overflow:hidden; font-size:1px; background:url(../img/line.gif)}
.second-page .logo {left:9%; top:58px}
.second-page h1 {position:absolute; left:33%; top:69px; color:#fff; font-size:18px; font-weight:normal; white-space:nowrap; text-transform:uppercase}
.second-page .content-block {position:absolute; left:33%; width:35%; top:136px}
.second-page .content-long {position:absolute; left:33%; width:58%; top:136px}
.second-page .develop a {left:9%}
.second-page .lang-bar {position:absolute; right:9%; width:30%; top:74px; font-size:12px}
	.second-page .lang-bar li {float:right}

/* // ---- editor styles ---- // */
.for-editor {}
	.for-editor h2 {color:#ff1d1d; font-size:16px; font-weight:normal; padding-bottom:11px}
	.for-editor p {padding-bottom:12px}
/* -- ---- editor styles ---- -- */

.scroller {position:relative; overflow:auto; outline:none}
.scroller .hscrollerbase {background:url(../img/hscroll-bar.gif) repeat-x 0 0; height:7px}
	.scroller .hscrollerbar {background:url(../img/hscroll-track.gif) repeat-x 50% 0; cursor:pointer; cursor:hand; top:0; height:7px; padding:0 12px}
	.scroller .hscrollerbasebeg {width:12px !important; height:7px; background-image:url(../img/hscroll-ar.gif)}
	.scroller .hscrollerbaseend {width:12px !important; height:7px; background:url(../img/hscroll-ar.gif) 100% 0}
.scroller .vscrollerbase {background:url(../img/vscroll-bar.gif) repeat-y 0 0; width:7px}
	.scroller .vscrollerbar {background:url(../img/vscroll-track.gif) repeat-y 50% 0; cursor:pointer; cursor:hand; top:0; width:7px; padding:12px 0}
	.scroller .vscrollerbasebeg {height:12px !important; width:7px; background-image:url(../img/vscroll-ar.gif)}
	.scroller .vscrollerbaseend {height:12px !important; width:7px; background:url(../img/vscroll-ar.gif) 0 100%}
#scroll-cblock {height:240px}
	#scroll-cblock .for-editor {padding-right:20px}

/* // ---- archive block ---- // */
.archive {position:absolute; left:70%; top:136px; width:21%}
	.archive h3 {color:#fff; font-size:16px; font-weight:normal; padding-bottom:11px}
	.archive li {padding-bottom:12px}
/* -- ---- archive block ---- -- */

/* // ---- prev next ---- // */
.prev-next {}
	.prev-page {}
	.next-page i {left:-4px}
	.prev-next .disabled {cursor:default}
		.prev-next .disabled i {top:0}
	.prev-next a {float:left; position:relative; display:block; width:4px; height:7px; overflow:hidden; margin-right:11px; font-size:1px}
		.prev-next a i {position:absolute; top:-7px; width:8px; height:14px; background-image:url(../img/ar-prevnext.gif)}
/* -- ---- prev next ---- -- */

/* // ---- navigation ---- // */
.navigation {position:absolute; left:9%; width:17%; top:138px; font-size:12px; text-transform:uppercase}
	.navigation li {background:url(../img/ar.gif) no-repeat 0 8px; padding:0 0 0 8px}
		.navigation li.active {background-image:none}
			.navigation li.active ul {display:block}
		.navigation a, .navigation .hr {display:block; color:#fff; text-decoration:none; padding:1px 4px 0}
			.navigation a:hover {color:#000; background-color:#fff; text-decoration:none}
			.navigation .hr {font-weight:normal; color:#000 !important; background:#fff !important}
	.navigation ul {padding:1px 0 5px}
		.navigation ul li {padding:0 0 1px; font-size:11px; background-image:none}
		.navigation ul li a, .navigation ul li .hr {padding-left:20px;background:#343434 url(../img/subnav-bg.gif)}
		.navigation ul li a:hover, .navigation ul li .hr {background:#fff}
		.navigation ul li .hr {background:#fff url(../img/subnav-bg-h.gif) no-repeat 12px 7px !important}
/* -- ---- navigation ---- -- */

/* // ---- photo one ---- // */
.photo-one {position:absolute; top:139px; left:70%; width:21%; text-align:right}
	.photo-one img {border:1px solid #747474}
	.photo-one small {display:block; font-size:11px; padding-top:10px}
/* -- ---- photo one ---- -- */

#portfolio-main {position:absolute; top:132px; left:33%; width:58%; height:242px}
	#portfolio-main .item-row {width:210px; padding-right:7px; line-height:13px}
	#portfolio-main td {color:#808080; vertical-align:top}
	#portfolio-main h2 {color:#fff; font-size:11px; font-weight:normal; padding-bottom:8px}
	#portfolio-main .ph {padding-bottom:12px}
		#portfolio-main .ph img {border:1px solid #777}
	#portfolio-main .title, .portfolio-second .title {color:#fff}
	#portfolio-main p, .portfolio-second p {padding-bottom:10px}
	.tls-portf {}
		.tls-portf li {float:left; padding-right:15px}

.portfolio-second {position:absolute; left:33%; width:50%; top:136px; color:#808080; line-height:13px}
	.portfolio-second table, .portfolio-second table .txt {width:100%; vertical-align:top}
	.portfolio-second .view-work {padding:5px 24px 0 0; vertical-align:top}
	.portfolio-second h2, .see-other h2 {color:#fff; font-size:16px; font-weight:normal; padding-bottom:11px; line-height:normal}
	.portfolio-second .see-all {position:absolute; bottom:-4px}

.see-other {position:absolute; right:9%; width:65px; top:136px}
	.see-other ul {padding-bottom:4px}
		.see-other li {padding-bottom:11px}
	.see-other img {border:1px solid #7e7e7e}

.contact-page {position:absolute; top:129px; left:33%}
	.contact-page .cont-card {position:absolute; top:36px; left:29px; width:200px}
		.contact-page .cont-card p {padding-bottom:10px}

/* // ---- about ---- // */
.ab-m {position:absolute; width:18%; padding:14px 0 0 57px; height:auto !important; height:55px; min-height:55px}
	.about-1 {left:33%; top:134px; background:url(../img/about-1.png) no-repeat 0 0;}
	.about-2 {left:67%; top:181px; background:url(../img/about-2.png) no-repeat 0 0;}
	.about-3 {left:47%; top:264px; background:url(../img/about-3.png) no-repeat 0 0;}
.about-long {width:52%}
/* -- ---- about ---- -- */