@import "reset.css";
/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

/* Left & Right alignment */

.left { float:left;}
.right { float:right;}
.clear{ clear:both}
.right_20 { margin-right:15px}
.right_21 { margin-right:21px}
.left_20{ margin-left:20px}
.bottom_10{ margin-bottom:10px!important}

.red{ color:#f00}

/* Global properties ======================================================== */

body{ border:0; color:#aaa; line-height:18px; font-family:Arial; font-size:12px;  background:#000; margin:0; orphans:0}
.bg_body{ background:#000  url(../images/bg_body.jpg) center center no-repeat; width:100%; height:100%; min-height:800px; position:absolute}
.main_box{ position:relative; min-width:1000px;  z-index:1; width:100%;}

a{ color:#fff; text-decoration: underline; outline:none}
a:hover{ text-decoration: none}
.main { overflow:hidden; position: absolute;  width:862px; z-index:1; min-height:800px; }

/* ============================= content ====================== */

.box{ height:235px;}
a.logo{ display:block; height:82px;  background:url(../images/logo.png) left top no-repeat}
#content{  position:relative; z-index:1;  height:486px; }

.cc_menu{	width:900px;	height:486px;	position:relative;	overflow:hidden; z-index:1; }
.cc_item{	width:143px;	height:486px;	float:left;	position:relative;  overflow:hidden; background: url(../images/bg_pin.png) left top repeat; margin-right:1px; padding-left:1px}
.cc_item > img{ position:absolute; left:-143px; z-index:0}
.pad_content{ padding:10px 40px 40px 45px; display:block; visibility:visible}
.cc_title{	color:#eaeaea;	font-size:20px;	top:0px;	left:0; line-height:20px;	 padding: 10px inherit; display:block;	z-index:0; height:40px; font-family:Georgia; text-transform:uppercase; text-align:center; background:#000; padding-top:20px; margin-top:280px}
.cc_submenu ul{	list-style:none; width:163px;	margin:0;	padding:0;	overflow:hidden; text-align:left; background: url(../images/bg_menu_page_right.png) 148px 415px no-repeat;	position:absolute;	left:0px; bottom:0; z-index:1000; height:486px; }
.cc_submenu ul li{  position: absolute; width:143px; height:190px; z-index:1000; left:0; bottom:0; cursor:pointer!important; background:url(../images/bg_menu_page.png) 10px 300px no-repeat; padding-top:296px}
.cc_submenu ul li strong{ color:#fff; font-size:28px; font-family: 'ThyssenJRegular'; padding-left:30px; font-weight:normal; display:block}
.cc_submenu ul li span{ display:block; padding-left:30px; color:#939393; font-size:12px; font-family: 'ThyssenJRegular'; padding-top:10px; text-transform:uppercase; }
.cc_submenu ul:hover li span{ color:#fff; text-shadow:1px 0px 1px #000}

.back{ position:absolute; right:-160px;z-index:20; top:-30px}
.back div{ display: none}


.cc_content{	width:722px;	height:486px;	position: absolute!important; left:-862px; overflow:hidden; top:0; background:url(../images/bg_content.png) right top repeat}
div.section{ width:722px; position:absolute; left:-862px}


.cc_content_1 span.cc_back, .cc_content_2 span.cc_back, .cc_content_3 span.cc_back, .cc_content_4 span.cc_back, .cc_content_5 span.cc_back,.cc_content_6 span.cc_back
 { background: url(../images/back.png) left top no-repeat; width:138px; height:37px; color:#8b8b8b; font-size:14px; font-family: 'ThyssenJRegular'; text-transform:uppercase; text-align:left; padding-left:10px; line-height:37px}

.cc_content_1 span.cc_back:hover, .cc_content_2 span.cc_back:hover, .cc_content_3 span.cc_back:hover, .cc_content_4 span.cc_back:hover, .cc_content_5 span.cc_back:hover,.cc_content_6 span.cc_back:hover
 { opacity:.85; color:#fff}

span.cc_back{ position:absolute; top:-36px; right:10px; width:160px; height:32px; cursor:pointer; display:block; z-index:120 }

img.photo{  padding:3px; background:#484848; border:1px #646464 solid; margin-top:4px; margin-bottom:5px}
img.photo:hover{ border:1px #949494 solid} 

.name_page{ position:absolute; z-index:0; height:40px; left:0; top:465px; width:150px; text-align:center; text-transform:uppercase; text-decoration:none; color:#808080; font-size:20px; line-height:40px; letter-spacing:-0.03em; cursor:pointer;}

div.footer{ padding-top:40px; position:relative; height:35px; color:#6b6b6b; font-size:14px; font-family: 'ThyssenJRegular'; }

div.footer div.social{ float:right;}
div.footer div.social a{ display: inline-block; width:31px; height:31px; background-position:top; background-repeat:no-repeat; margin-right:4px; opacity:.6}
div.footer div.social a:hover{ opacity:1}
div.footer div.social a.bg_1{ background-image:url(../images/social.png); }
div.footer div.social a.bg_2{ background-image:url(../images/social_2.png); }
div.footer div.social a.bg_3{ background-image:url(../images/social_3.png); }


/* ============================= Content ====================== */

.grid_255{ width:255px;}
.grid_190{ width:190px;}
.grid_150{ width:150px;}
.grid_50{ width:48%;}
.grid_360{ width:370px;}
.grid_220{ width:220px;}
.grid_290{ width:290px;}

.grid_300{ width:300px;}
.grid_340{ width:340px;}
.grid_320{ width:320px;}


.border_right{ border-right:1px #242424 solid;}
.border_bottom{ border-bottom:1px #242424 solid;}

.text{ padding:15px 30px 5px 28px; color:#cdcdcd; font-size:12px; font-family:Arial, Helvetica, sans-serif; line-height:18px}
.text big{ color:#fff}
h1{ font-size:30px; color:#d8d8d8; margin:0; padding:0; font-weight:normal; margin-bottom:15px;  line-height:33px; white-space:nowrap; letter-spacing:-0.03em; font-family: 'ThyssenJRegular'; margin-top:15px}


a.more{ cursor:pointer; text-transform: uppercase; text-decoration:none;  font-size:16px; color:#646464; line-height:25px; font-family: 'ThyssenJRegular'; display:block; padding-top:10px}
a.more:hover{ text-decoration:none; color:#fff}
.scroll-pane div.clear{ margin-bottom:16px}


.scroll{ overflow-y:scroll; padding-right:20px}
.pad_content strong{  color:#fff; line-height:20px; display:block; padding-bottom:5px; text-transform:none}
a.link{ font-size:12px; color:#fff;}
div.video_block{ float:left; width:275px; height:175px; margin-right:25px}
div.video_block > strong{ display:block; color:#646464; font-size:16px; text-transform:uppercase;font-family: 'ThyssenJRegular'; font-weight:normal}
div.video_block > a { position:relative; display:block}
div.video_block > a > span{ display:block; position:absolute; width:265px; height:143px; background:url(../images/video_hover.png) left 145px no-repeat; left:0; top:0}
div.video_block > a:hover > span{ display:block; position:absolute; width:270px; height:151px; background:url(../images/video_hover.png) 4px 8px no-repeat;}


/* ============================= Dialog ====================== */

.ui-dialog { position: absolute; padding: .2em; width: 300px; overflow: hidden; }
.ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative;  }
.ui-dialog .ui-dialog-title { float: left; margin: .1em 16px .1em 0; } 
.ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; }
.ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; }
.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; }
.ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1; font-size:12px; font-family:Arial }
.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; }
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; }
.ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; }
.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; }
.ui-draggable .ui-dialog-titlebar { cursor: move; }


/*================= Contacts =========================*/

.pad_content .notification_error{ height: auto;width:300px;padding: 2px;background: #1e1e1e; text-align: left; color:#f00; margin-bottom:2px; border: 1px solid #4b4b4b;
 margin-bottom:10px}
.pad_content .notification_ok{ border: 0px ; height: auto; width: 300px; padding: 8px; background: #383838; text-align: center;  } 
.pad_content .info_fieldset { border: 0px  }
.pad_content .info_fieldset legend { border: 1px #4b4b4b solid;  color: black;   font: 13px Verdana;  padding: 2px 5px 2px 5px; }

.pad_content .pin { width:90px; height:30px; background:#383838; text-align:center; line-height:28px; color:#fff; cursor:pointer; text-decoration:none; margin-top:15px; text-transform:uppercase; font-size:12px;display:block; margin-bottom:10px; font-weight:bold; border:1px #4b4b4b solid; cursor:pointer!important}
.pad_content .pin:hover{ text-decoration:none; color:#fff; cursor:pointer}

/* Label */
.pad_content label  { width: 85px;  margin: 0px; float: left; text-align: left; }

/* Input, Textarea */
.pad_content input{ margin: 0px; padding: 0px;  float: left; border: 1px solid #4b4b4b;  color: #fff; background:#383838; font: 12px Arial, Helvetica, Arial, sans-serif; height:30px; margin-bottom:6px; width:200px }

.pad_content textarea{margin: 0px; padding: 0px;  float: left; background:#383838; border: 1px solid #4b4b4b;  color: #d9d4d1;   font: 12px Arial, Helvetica, Arial, sans-serif; height:70px; margin-bottom:3px; width:200px }


/*===================== Scroll =====================*/
.scroll-pane {	overflow:hidden; }
.jScrollPaneContainer {	position: relative;	overflow:hidden	;	z-index: 1;}



.jScrollPaneTrack {	position: absolute;	cursor: pointer;	right: 0;	top: 0;	background: #282828; width:15px!important; }
.jScrollPaneDrag {	position: absolute;	background:#e8e8e8 url(../images/centr_scroll.gif) 50% 50% no-repeat;	cursor: pointer;	overflow: hidden;	right:0px;	width:13px!important; margin-top:1px; opacity:.8; border:1px #676767 solid;}
 
.jScrollPaneDrag:hover{ opacity:1}
.jScrollPaneDragTop { position: absolute;	top: 0;	left: 0; overflow: hidden; height:0px;}
.jScrollPaneDragBottom { overflow: hidden; height:0px; }

a.jScrollArrowUp {	display: block;	position: absolute;	z-index: 1;	top: 0;	right: 0px;	text-indent: -2000px; overflow: hidden;	height: 15px; background:url(../images/top.gif) left top no-repeat; width:15px!important;opacity:.8}

a.jScrollArrowDown { display: block; position: absolute; z-index: 1; bottom: 0;	right: 0px;	text-indent: -2000px; overflow: hidden; height: 15px; background:url(../images/foot.gif) left top no-repeat; width:15px!important; opacity:.8}

a.jScrollArrowUp:hover, a.jScrollArrowDown:hover{ opacity:1}



@font-face {
    font-family: 'ThyssenJRegular';
    src: url('thysen-webfont.eot');
    src: url('thysen-webfont.eot?#iefix') format('embedded-opentype'),
         url('thysen-webfont.woff') format('woff'),
         url('thysen-webfont.ttf') format('truetype'),
         url('thysen-webfont.svg#ThyssenJRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*===================== video =====================*/