/* 
    Document   : style
    Created on : 28.02.2010, 0:22:35
    Author     : Alex Kozyukov
    Description:
        Purpose of the stylesheet follows.
*/

/* -------------------->>> GLOBAL <<<---------------------*/
* {	margin:0; padding:0; outline: 0}
html, body {height:100%}
body {background: url(../img/bg/body-bg.jpg) #070707 no-repeat top center; color:#AAA; font: 10px/20px Georgia, serif; height:100%}
h1, h2 {font-family: "Trebuchet MS", sans-serif}
h1 {color: #e19930; font-size: 32px; font-weight: normal; line-height: 40px; margin: 0 0 20px}
h1.underlined {height:36px; border-bottom: 1px solid #282828}
h2 {color: #DDD; font-size: 22px; font-weight: normal; line-height: 40px}
p {font-size: 14px; line-height: 20px; margin-bottom: 20px}
a {color:#3888FF; text-decoration:none}

/* ------------------>>> Main parts <<<-------------------*/
#header, #navi {width: 940px; margin: 0 auto}
#main_block {background-color:#181818; border-left:1px solid #282828; border-right:1px solid #282828; margin: 0 auto; position: relative; width: 938px}

/* -------------------->>> Header <<<---------------------*/
#header {position:relative}
#logo {overflow: hidden}
#logo a {display: block; height: 100px; width: 420px; margin: 20px 40px}
#logo a span {display: none}

#language{position:absolute; opacity:0.2; top:-20px; right:60px;}
	#language a{display:block; width:64px; height:64px;}
	#language .russian{background: url(../img/other/lang_rus.png)}
	#language .english{background: url(../img/other/lang_eng.png)}

/* ------------------>>> Navigation <<<-------------------*/
#navi {height:100px; position:absolute; top:140px; left:50%; margin-left:-290px; width:580px}
#navi ul {list-style-type:none; margin: 34px auto 0; overflow:visible; width:610px}
#navi ul li {float:left; font: 20px "Trebuchet MS", sans-serif; margin: 0 5px; position:relative}
#navi ul li a {border:1px solid transparent; display:block; color: #AAA; padding: 4px 9px; -webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px}
#navi ul li a:hover {border: 1px solid #171717; background-color: rgba(128,128,128, 0.05); color: #DDAA66}
#navi ul li a.active {color: #e19930}
#navi ul li ul {display:none; position:absolute; width:auto; background-color:#3b3830; margin:0; padding:4px 0; -webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px}
#navi ul li ul li {display:list-item; float:none}
#navi ul li ul a {font-size:14px}
#navi ul li ul a:hover {background-color: #443F38; border: 1px solid #333}

/* -------------------->>> Poster <<<---------------------*/
#poster {position: absolute; top:0}
#poster img {margin: 0 60px}

/* -------------------->>> Content <<<--------------------*/
#content {margin-top: 100px; padding:320px 60px 60px 60px}
	#leftCol, #rightCol, #wideCol {margin-bottom:60px}
	#leftCol {float:left}
	#rightCol {float:right}
	#wideCol {clear:both}

/* ---------------->>> Section Links <<<------------------*/
.slWrapper {width:320px; height: 120px; overflow: hidden; margin-bottom:20px}
.slImgLink {float:left; margin-right: 20px}
.slImgLink img {border:none}

/* --------------------->>> Blog <<<----------------------*/
.postWrapper {clear:both; position: relative; margin-bottom: 40px; width: 440px}
.postTitle {font-size: 22px; line-height: 40px}
.postDate {color: #444; font-size: 12px; line-height: 20px; margin: -10px 0 10px}
.postText {}
.postTags {clear: both}

/* -------------------->>> Gallery <<<--------------------*/
#pageText {float:right; width:480px}
#gallerySelector {float: left; margin-left: -10px; width: 320px}
	.gsBlock {clear: both}
	.gsBlock .label{ color: #888; display:block; font:22px "Trebuchet MS", sans-serif; padding:20px}
.thumbsWrapper {clear:both; margin-left:-10px}
.thumb {float:left; display:block; border:3px solid #CCC; padding:2px; margin:9px; background-color:#333; width:60px; height:60px;  -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px}
.marginned {margin:0 7px 14px}
.thumb:hover	{background-color:#222;	border-color:#C79750}
.thumb img {border:0}

#thumbsContainer{border:1px solid #333; height:86px; overflow:hidden; padding:10px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px}
	.thumbsSubContainer{}
	#thumbsContResize{cursor:pointer; height:20px; margin:0 auto 40px; width:40px; background: url(../img/other/tc_resize_icon.png) no-repeat}
		#thumbsContResize:hover{background-position: -40px 0}
		#thumbsContResize.expanded{margin-top:-20px; background-position: 0 -20px}
		#thumbsContResize.expanded:hover{background-position: -40px -20px}

/* --------------------->>> Tabs <<<----------------------*/
#tabNavigation {padding-left:10px}
	#tabNavigation li{background: url(../img/other/tab-nav.jpg); border-bottom:1px solid #282828; list-style:none; margin:0 2px; float:left; text-align:center; width:220px; height:40px; overflow:hidden}
	#tabNavigation li.active{border-bottom:1px solid #181818}
	#tabNavigation a {font:18px/40px "Trebuchet MS", sans-serif; margin: 0 10px}
#tabBody {border:1px solid #282828; margin-top:40px; padding:40px 40px 60px; width:736px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px}

/* --------------------->>> Forms <<<---------------------*/
#mailForm {width:320px}
	#mailForm #username {display: none}/* Spam protection */
	#mailForm label {color:#555; display:block; font:14px/20px "Trebuchet MS", sans-serif}
	#mailForm #mailAuthor, #mailForm textarea {background-color:transparent; border:1px solid #282828; color:#AAA; padding:8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px}
	#mailForm textarea {}
	#mailForm .submit {background-color:#333; border:1px solid #181818; color:#AAA; font-size:18px; float:right; padding:4px 8px; cursor:pointer; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px}

/* -------------------->>> Footer <<<---------------------*/
#footer {background: url(../img/bg/bottom.jpg) no-repeat top center; padding: 80px 0}
#footer span {background: url(../img/other/footer_lines.png) no-repeat; color: #444; font: 12px/18px "Trebuchet MS", sans-serif; display: block; height: 21px; width: 400px; margin: 0 auto; padding: 3px; text-align: center}

/* ---------------->>> Helpful classes <<<----------------*/
.hidden {display: none}
.clearFloat {clear: both}
.dashed {border-bottom: 1px dashed;}
#ajaxLoading {background: rgba(16,16,16, 0.5) url(../img/other/ajax-loader.gif) no-repeat center center; border:2px solid transparent; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; display: none; position:absolute; left:50%; top:50%; width:200px; height:100px; margin-left:-100px; margin-top:-50px; z-index:999}
.floatLeft {float:left}
.floatRight {float:right}
.padding20 {padding:20px}
.width440 {width:440px}
.colorGreen {color:#339966}
.colorGray {color:#666}