@import "reset.css";
body { font-family:Arial;font-size:14px;line-height:20px;color:#fff;text-align:left; background:#060a0f; margin:0; padding:0; }

a       { color:#ddd; text-decoration:underline; outline:none}
a:hover { color:#fff; text-decoration:none;}


.left{ float:left}
.right{ float:right}
.clear  {clear:both;}

.left_20{ margin-left:20px}
.left_30{ margin-left:30px}
.right_20{ margin-right:20px}

.grid_50{ width:49%;}
.grid_540{ width:540px}
.grid_420{ width:420px}
.grid_222{ width:222px}
.grid_360{ width:360px;  height:320px; position: absolute; bottom:300px; right:50px}

/*   -----------------------------------------------------------------------------*/ 
.centr{ width:1000px; margin:0 auto; position:relative;}
div.pages{ min-height:709px; position:relative; width:100%; min-width:1000px;}
div.page_1{ background:#b1df4b url(../images/bg_1.gif) left bottom repeat-x}
div.page_2{ background:#fdc13a url(../images/bg_2.gif) left bottom repeat-x}
div.page_3{ background:#ed6fcf url(../images/bg_3.gif) left bottom repeat-x}
div.page_4{ background:#73a4e6 url(../images/bg_4.gif) left bottom repeat-x}
div.page_5{ background:#21385a url(../images/bg_5.gif) left bottom repeat-x; padding-bottom:180px}


a.next img{ position:absolute; right:40px; bottom:80px; z-index:2}
a.top img{ position:absolute; right:40px; top:80px; z-index:2}

div.page_2 .centr{ background:url(../images/bg_page_2_centr.jpg) right bottom no-repeat; min-height:710px}
div.page_5 .centr img.mail_box{ position:absolute; right:0; top:60px; z-index:2}

/* ----  menu   ----*/
div.menu{ height:75px; background:url(../images/bg_menu.png) left top repeat-x; width:100%; min-width:1000px; position: absolute; top:40px; left:0; z-index:10}
div.menu > a.right{ height:34px; line-height:34px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; text-decoration:none; display:block;
font-family: 'ThyssenJRegular'; font-size:20px; color:#fff; width:105px; text-align:center; margin-right:16px; margin-top:20px; cursor:pointer}

div.menu > a.right.bg_1:hover{ background:#5f5f5f}
div.menu > a.right.bg_2:hover{ background:#638fcf}
div.menu > a.right.bg_3:hover{ background:#be479d}
div.menu > a.right.bg_4:hover{ background:#e0751a}
div.menu > a.right.bg_5:hover{ background:#64930b}
a.active{ border:1px #f00 solid}

/* ---  content   ---*/ 

h1{ font-size:45px; line-height:45px; font-family: 'CairoRegular'; font-weight: normal; padding-top:45px; padding-bottom:22px}
h2{ font-size:55px;font-family: 'BallparkWeiner'; font-weight:normal; line-height:55px; text-align:center;  padding-bottom:22px; padding-top:40px}


#page_1 .centr{ padding-top:160px}
#page_2 .centr, #page_3 .centr, #page_4 .centr, #page_5 .centr{ padding-top:50px}

.slogan_1{ font-size:48px; color:#fff; line-height:48px; font-family: 'BallparkWeiner';}
.slogan_2{ text-transform:uppercase; font-size:54px; line-height:54px; color:#fff; font-family: 'CairoRegular'; padding:10px 0px}
.slogan_3{ font-size:35px; color:#fff; line-height:40px; font-family: 'ThyssenJRegular'; padding-bottom:12px}
.slogan_4{ font-size:30px; color:#fff5dd; line-height:30px; font-family: 'ThyssenJRegular'; text-transform:uppercase; text-align:center;}
.slogan_5{ text-transform:uppercase; font-size:60px; line-height:60px; color:#ffcf71;  font-family: 'ThyssenJRegular'; padding:10px 0px; text-align:center}
.slogan_6{ font-size:35px; color:#fff5dd; line-height:40px;  padding-bottom:12px; text-transform:uppercase; text-align:center; font-family: 'CairoRegular';}
.slogan_7{ font-size:33px; text-transform:uppercase;font-family: 'ThyssenJRegular'; line-height:33px; text-align:center}
.slogan_8{ font-size:50px; text-transform:uppercase; text-align: center;font-family: 'CairoRegular'; line-height:50px; padding-top:10px}

.read{ font-size:16px; text-transform:uppercase; color:#90b941;font-family: 'ThyssenJRegular'; display:block; text-decoration:none; text-align:center; line-height:47px; height:47px; width:132px; background:url(../images/bg_read.png) left top no-repeat; margin-top:14px; cursor:pointer}

.read_2{ font-size:16px; text-transform:uppercase; color:#fab836;font-family: 'ThyssenJRegular'; display:block; text-decoration:none; text-align:center; line-height:47px; height:47px; width:132px; background:url(../images/bg_read_2.jpg) left top no-repeat; margin-top:14px; cursor:pointer; margin-left:109px}

.read_3{ font-size:16px; text-transform:uppercase; color:#e669c7;font-family: 'ThyssenJRegular'; display:block; text-decoration:none; text-align:center; line-height:47px; height:47px; width:132px; background:url(../images/bg_read_3.jpg) left top no-repeat; margin-top:20px; cursor:pointer; margin-bottom:10px}


.more{ font-size:16px; text-transform:uppercase; color:#fff5dd;font-family: 'ThyssenJRegular'; display:block; text-decoration:none; text-align:center; line-height:47px; height:47px; width:100px; margin-top:8px; cursor:pointer;}

img.products{ opacity:.86}
img.products:hover{ opacity:1}

.bg_i_phone{ background:url(../images/bg_page_1_sl.png) left top no-repeat}
.scroll-pane strong, b{ text-transform:uppercase; display:block; padding-bottom:10px; font-weight:normal}
big{ font-size:14px; color:#a2c6ff; text-transform:uppercase; display:block;}

div.page_5 a{ color:#88b7ff}

div.text{ padding-right:20px; padding-left:10px; padding-top:90px}

div.balls{ margin-right:28px; min-height:200px; padding-top:45px}

div.ball_1{ background:url(../images/ball_1.png) left top no-repeat}
div.ball_2{ background:url(../images/ball_2.png) left top no-repeat}
div.ball_3{ background:url(../images/ball_3.png) left top no-repeat}
div.ball_4{ background:url(../images/ball_4.png) left top no-repeat}


/* ------    FOOTER      -----------*/ 
.copy{ color:#757575; font-size:18px; padding-left:34px; background:url(../images/bg_copy.png) left 50% no-repeat; line-height:30px; margin-top:30px}
.copy a{ color:#b8b8b8!important}



/*   -----------------------------------------------------------------------------*/ 



/*====================== Read More ====================*/
.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 =========================*/

.notification_error{ height: auto;width: 96%;padding: 2px;background: #dbe1e3; text-align: left; color:#f00; margin-bottom:2px; border: 1px solid #a3b5b9;  border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;}
.notification_ok{ border: 1px solid #a3b5b9 ; height: auto; width: 96%; padding: 8px; background: #dbe1e3; text-align: center; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; color:#1b3d45} 

.button { display:block; background: url(../images/bg_send.gif) left top repeat-x; width:140px; height:50px; text-decoration:none; text-align:center; line-height:50px; font-size:20px; color:#fff;  font-family:Arial; margin-top:10px; opacity:.9; cursor:pointer; border:0; float:left}
.button:hover{ text-decoration:none; opacity:1}

a.reset{ width:140px; height:50px; text-align:center;line-height:50px; color:#fff!important; background:#4b6e74; display:block; float:left ; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin-top:10px; margin-right:10px;  border-radius: 5px; text-decoration:none; font-size:20px!important}
a.reset:hover{ background:#3a585e}

/* Label */
label  { width: 90px;  margin: 0px; float: left; text-align: left; line-height:55px;}

/* Input, Textarea */
input{ margin: 0px; padding: 0px;  float: left; border: 1px solid #0d1727;  color: #9eaec8; background:#122035; font: 14px Arial, Helvetica, Arial, sans-serif; height:55px; margin-bottom:3px; width:400px;border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin-bottom:5px; line-height:55px; border-bottom:1px #35445b solid; padding-left:5px}

textarea{margin: 0px; padding: 0px;  float: left; background:#122035; border: 1px solid #0d1727;  color: #9eaec8;   font: 14px Arial, Helvetica, Arial, sans-serif; height:150px; margin-bottom:3px; width:400px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;margin-bottom:5px ; line-height:55px; padding-left:5px}
@font-face {
    font-family: 'BallparkWeiner';
    src: url('ballw__-webfont.eot');
    src: url('ballw__-webfont.eot?#iefix') format('embedded-opentype'),
         url('ballw__-webfont.woff') format('woff'),
         url('ballw__-webfont.ttf') format('truetype'),
         url('ballw__-webfont.svg#BallparkWeiner') format('svg');
    font-weight: normal;
    font-style: normal;

}

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

}

@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;

}
/*================= Gallery  IPhone =========================*/
.loader{  	width:70px; 	height:70px; 	position:fixed; 	top:50%; 	left:50%; 	margin:-35px 0px 0px -35px; 	opacity:0.8; 	z-index:1000; 	background:#fff url(../images/loader.gif) no-repeat center center; 	-moz-border-radius:15px; 	-webkit-border-radius:15px; 	border-radius:15px; 	-moz-box-shadow:0px 0px 5px #999; 	-webkit-box-shadow:0px 0px 5px #999; 	box-shadow:0px 0px 5px #999; }

/* Preview Slider Gallery Style */
.ps_container{  	display:none; 	margin:0px auto 0px auto; 	position:relative;z-index:0; 		width:520px; 	height:490px; }
.ps_image_wrapper{	overflow:hidden; 	position: absolute; 	margin:0 auto; z-index:0; width:208px; height:272px; 	right:31px; 	top:38px; }
.ps_image_wrapper img{	position:absolute; 	z-index:0; } 
.ps_prev, .ps_next{	width:30px;	height:90px; 	position:absolute; 	top:375px; 	margin-top:-40px; 	cursor:pointer; 	opacity:0.7; }
.ps_prev{	background:#000; 	left:20px; display:none}
.ps_next{ 	background:#555; 	right:20px; display:none}
.ps_prev:hover, .ps_next:hover{ 	opacity:1; }
 ul.ps_nav{ 	list-style:none; 	margin:0; 	padding:0; 	 	margin:20px auto ; 	position: absolute; left:50%; bottom:0; margin-left:-110px	 } 
 ul.ps_nav li{ 	float:left; }
ul.ps_nav li a{	display:block;  	text-indent:-9000px; 	width:14px; 	height:14px; 	outline:none; 	padding:0px 3px; 	background:transparent url(../images/dot.png) no-repeat  center 0px; }
ul.ps_nav li a:hover,ul.ps_nav li.selected a{	background-position:50% 100%;  }
ul.ps_nav li.ps_preview{ 	display:none; 	width:88px; 	height:66px; 	top:-95px; 	left:-40px; /*First item, next ones is leftDot - 0.5*wThis + 0.5*wDot, i.e. second one is (16 - 42.5 + 8) = -18.5 */	position:absolute; }
ul.ps_nav li.ps_preview span{	background:transparent url(../images/triangle.png) no-repeat top center; 	width:15px; 	height:6px; 	position:absolute; 	top:76px; 	left:38px;}
.ps_preview_wrapper{ 	width:88px; 	height:66px; 	border:5px solid #fff; 	overflow:hidden; 	position:relative; 	-moz-box-shadow:0px 0px 5px #999; 	-webkit-box-shadow:0px 0px 5px #999; 	box-shadow:0px 0px 5px #999; }
.ps_preview_wrapper img{	position:absolute;  	top:0px; 	left:0px;}

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

.scroll_1 img{ height:143px}
.scroll_2 img{ height:93px}

.jScrollPaneTrack {	position: absolute;	cursor: pointer;	right: 1px;	top: 0;	background: url(../images/bg_scroll.png) 50% top repeat-y; width:14px!important; opacity:1}
.jScrollPaneDrag {	position: absolute;	background:#ea8d26  url(../images/bg_2.gif) left 38% repeat-x;	cursor: pointer;	overflow: hidden;	right:0px;	width:14px!important; opacity:1!important; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; border:1px #c37126 solid; z-index:1; border-top:0px #ccc solid; border-left:0px #ccc solid}

.jScrollPaneDrag:hover{ }
.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: 17px; background:url(../images/top.jpg) left top no-repeat; width:15px!important;}

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

a.jScrollArrowUp:hover{   }
 a.jScrollArrowDown:hover{   }