@import "reset.css";
body { 
    font-family:Arial;
    font-size:12px;
    line-height:18px;
    color: #FFF;
    //color:#b8b8b8;
    text-align:left; 
    padding:0; margin:0; height:100%; 
    background:#0c0c0c url(../images/bg_site.jpg) 50% 30% no-repeat
}

article, aside, details, figcaption, figure, .footer, .header, hgroup, menu, .nav, output, section, summary {	display:block;}
html, body {	height:100%;}

h1{ margin:0; padding:0}

/*  ----------------------      ScrollBar Styles--------------------------------------*/
.scroll-pane {overflow:hidden; padding-right:20px}
.jScrollPaneContainer { 	position: relative; 	overflow:hidden	; 	z-index: 1; background:url(../images/) right top no-repeat}
//.jScrollPaneContainer { 	position: relative; 	overflow:hidden	;	z-index: 1; background:url(../images/bg_scroll.png) right top no-repeat}

#page5 .jScrollPaneContainer, #page2 .jScrollPaneContainer{background: url(../images/bg_scroll_small.png) right top no-repeat;}

.jScrollPaneTrack { 	position: absolute;  	cursor: pointer;
                     right: 0; 	top: 0; 	background:none;
                     width:25px!important 
}
.jScrollPaneDrag {  	position: absolute; 	background:#7b7b7b ;
                     cursor: pointer; 	overflow: hidden;
                     left:1px; 	width:15px!important;
                     border:1px solid; border-bottom-color:#2e2e2e;  border-top-color:#c2c2c2;
                     border-left-color:#999999;  border-right-color:#4f4f4f; 
                     -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
}  
.jScrollPaneDragTop {  	position: absolute; 	top: 0; 	left: 0; 	overflow: hidden; 	height:0px; } 
.jScrollPaneDragBottom {  	position: absolute; 	bottom: 0; 	left: 0; 	overflow: hidden; 	height:0px;  }

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

a.jScrollArrowDown {  	display: block; 	position: absolute; 	z-index: 1; 	bottom: 0;  right:2px; text-indent: -2000px; 	overflow: hidden; 	height: 25px; background: url(../images/bg_scroll_pin.png) 1px  -21px  no-repeat;  width:26px!important}

a.jScrollArrowUp:hover{ background-position:right top}
a.jScrollArrowDown:hover{ background-position:right -21px}	


.scroll-pane img.photo{  height:87px; margin-bottom:9px}

/*==== GLOBAL =====*/
#main {
    width:980px;
    margin:0 auto;
    position:relative;
    top:30%;
    padding:	0;
    margin-bottom:20px
}

a       {text-decoration:none; cursor:pointer; outline:none; color:#FFF}
a:link  {  text-decoration:none;}
a:hover { text-decoration:none;}
a:active{ text-decoration:none;}
a.links{ color:#FFF;}

.clear  {clear:both;}
.left{ float:left;}
.right{ float:right}
.red { color:#FF0000;}

.top_10{ margin-top:10px}
.right_20{ margin-right:20px}
.omega{ text-align:right}

/* black transparent background */
.bg_black{
    background:url(../images/bg1.png);
    border-radius: 15px;
    padding: 10px 10px 20px 10px;
    margin: 10px;
}
/* brands-image hover style... */

.flip{ width:95px; height:95px;
       margin: 10px}
.flip > .front{
    position:absolute;
    transform: perspective( 95px ) rotateY( 0deg );
    background: #b1b1b1; width:95px; height:95px; border-radius: 5px;
    backface-visibility: hidden;
    transition: transform .5s linear 0s;
}
.flip > .back{
    position:absolute;
    transform: perspective( 95px ) rotateY( 180deg );
    background: #d1d1d1; width:95px; height:95px; border-radius: 5px;
    backface-visibility: hidden;
    transition: transform .5s linear 0s;
}
.flip:hover > .front{
    transform: perspective( 95px ) rotateY( -180deg );
}
.flip:hover > .back{
    transform: perspective( 95px ) rotateY( 0deg );
}

/*   -------------------------------  changed  ------------------------*/ 
//#content li.page{ width:980px; height:551px; background:url(../images/bg_content.png)  top no-repeat; display:block}
#content li.page{
    width:980px; height:551px; 
    //width:980px; height:551px; 
    background:url(../images/image_name.png) top no-repeat; 
    display:block;
    background-repeat: no-repeat;
    background-size:100% 100%;
}
div.wrapper{ position:relative; top:-50px; }

.pad_content{ 
    padding:55px 35px 45px 40px;
}
.pad_content h1{ font-size:30px; background:url(../images/bg_h1.png) left top no-repeat; 
                 padding-left:18px; height:30px; line-height:30px; color:#fff;
                 left:-20px; margin-bottom:10px; position:relative; padding-bottom:20px;
}
.pad_content h1 span{ display:block; height:52px; width:100%; 
                      background:url(../images/bg_h1_span.png) top right no-repeat; 
                      padding-right:30px;
                      padding-top:8px
}

b{ display:block; text-transform:uppercase; color:#00a8ec}
b.upp{ text-decoration:underline; padding-top:10px;}

a.more{ background: url(../images/bg_menu_span.png) left 50% no-repeat; display:block; width:125px; height:18px; text-decoration:none; text-align:center; font-size:18px; color:#fff; text-transform:uppercase; margin-top:14px; line-height:18px; padding-top:0px}
a.more:hover{ text-decoration:none}

img.photo{ margin-top:4px}
.mar_b{ margin-bottom:12px}

/* ---------------------------   Layout    -----------------------------------------*/ 
.grid_1{ width:395px}
.grid_2{ width:220px}
/*.grid_new{ width: 147px}*/
.grid_new{ width: 110px;}
.brand-img{
    width: 95px;
    height: 95px;
    opacity: 1;
    float: left;
    margin: 5px;
    border-radius: 5px;
}
.grid_news{
    width: 100%;
}

/* -----------------------------ANIMA-----------------------------------------------*/ 
#anima{ padding-right:15px}
#anima a{display: block;	text-decoration: none; float:right; padding-top:10px; padding-right:5px}

/*----- other -----*/
.extra-wrap {
    overflow:hidden;
    height:100%; width:100%}

/*======================== header ==================*/
.header {
    width:200px;
    height:228px;
    position:relative;
    margin-left:15px;
    padding-right:30px;
    z-index:100
}

.bg_left{ position:relative; float:left; width:15px; height:100%;}

.header h1 {
    position:absolute;
    left:0px;
    top:0;
    z-index:10;
    margin:0; padding:0;
    float:left
}                                                                                                                                                                                                                                              
.header h1 a.logo{font-size:33px; color:#fdfdfd!important; display:block;  text-decoration:none!important; background:url(../images/bg_main_15.png) 0px top  no-repeat; height:228px; width:200px; padding-left:10px}
.header h1 a.logo:hover{ color:#fdfdfd!important}
.header h1 a.logo span{ display:block; color:#212121; font-size:20px; text-transform:uppercase; padding-top:5px; padding-left:5px}
.header h1 a.logo strong{ padding-top:80px; display:block; font-size:34px; color:#212121; text-transform:uppercase; line-height:34px; height:34px; padding-left:5px}
.header .nav {
    position: relative;
    left:0px!important;
    top:70px;
    z-index:1;	
    height:84px;
    background:url(../images/bg_menu.png) 100% top  no-repeat; float:right!important; width:100%; overflow:hidden; 
}
.header .nav li {
    height:83px;
    border-right:none;
    width:150px; background:url(../images/bg_line.png) 100%  center no-repeat; float:right; padding-top:1px
}
.header .nav li a {
    display:block;
    height:83px;
    background:none;
    text-decoration:none!important; font-size:16px; font-weight:bold;  text-transform:uppercase; text-align:center;
    background: none; width:150px; margin-left:-6px; color:#ddd
}
.header .nav li a span{
    display:block;
    height:20px;
    background: none;
    font-size:18px;  text-decoration:none ;text-transform:uppercase; line-height:20px; padding-top:33px; padding-bottom:30px;
    width:135px; background:url(../images/bg_menu_span.png) 14px 55% no-repeat; padding-left:8px;

}
.header .nav li.active a,  .header .nav li a:hover{
    background: url(../images/bg_hover_menu.png) top repeat;

}
.header .nav li.active a.contacts,  .header .nav li a.contacts:hover{
    background: url(../images/contact_hover.png) right top no-repeat;

}
.header a.shattle {
    position: absolute;
    display:block;
    width:35px;
    height:50px;
    background:url(../images/shattle.png) -40px 100% no-repeat;
    z-index:1000;
    float:right;  right:-18px; top:84px; 
}

.hidden a.shattle{
    background:url(../images/shattle.png) 0 0 no-repeat;	position: absolute;	display:block;	width:75px;	height:50px;  right:-60px; top:90px; z-index:100; float:right
}

/*===== gallery =====*/
.gallery {

}
.gallery #pic,
.gallery #thumbs,
.gallery #thumbs li {
    float:left;
}
.gallery #pic img{ }
.gallery #thumbs{  	width:320px; 	float:right; 	overflow:hidden; 	margin-bottom:30px; 	position:relative; }

#thumbs>ul.first{ width:680px; position:relative; float:left }		
#thumbs>ul.first>li { float:left; width:320px; 		} 										
#thumbs li ul.second { float:left; width:380px; height:350px; padding-left:30px;}
#thumbs li ul.second li { margin-bottom:8px; display:block; float:left; width:140px; height:105px; }
#thumbs li ul.second li a{ width:160px; display:block}					
#thumbs li ul.second li a img{}					
#thumbs li ul.second li{ 	margin-right:0px }
.next { float:right }

div.pinn{ position:absolute; left:650px; top:465px; width:250px}
a.gall{background: url(../images/bg_menu_span.png) right 50% no-repeat; display:block; width:125px; height:22px; text-decoration:none; text-align:center; font-size:18px; color:#fff; text-transform:uppercase; margin-top:14px; line-height:18px; float:right}
a.gall_2{background: url(../images/bg_menu_span_2.png) left -85% no-repeat; display:block; width:125px; height:22px; text-decoration:none; text-align:center; font-size:18px; color:#fff; text-transform:uppercase; margin-top:14px; line-height:18px; float:left}
a.gall:hover, a.gall_2:hover{ text-decoration:underline}

/*==========================================*/
.footer{ width:970px; height:53px; position: fixed; left:50%; margin-left:-490px; background: url(../images/bg_footer.gif) top repeat-x; font-size:12px; color:#919191; border-left:1px #2d2d2d solid; line-height:50px; padding-left:10px; bottom:0; min-width:970px ; z-index:1000}

*+html{
    overflow-x:hidden;
}
a.privacy{ color:#fff; text-decoration:underline}
a.privacy:hover{ color:#fff; text-decoration:none}

/*==========  contacts  =====================*/
.notification_error{ height: auto;width: 96%;padding: 4px;background: #2e2e2e; text-align: left; color:#f00; margin-bottom:5px; border: 1px solid #000; }
.notification_ok{ border: 0px #879295 solid; height: auto; width: 96%; padding: 8px; background: #2e2e2e; text-align: center; color:#fff} 
.info_fieldset { border: 0px #879295 solid; }
.info_fieldset legend { border: 0px #879295 solid;  color: black;   font: 13px Verdana;  padding: 2px 5px 2px 5px; -moz-border-radius: 3px; }

input.button { background: url(../images/bg_menu_span.png) left 80% no-repeat; display:block; width:80px; height:22px; text-decoration:none; text-align:center; font-size:16px; color:#fff; text-transform:uppercase; margin-top:14px; line-height:18px; font-weight:bold}
input.button:hover{ text-decoration: underline; cursor:pointer;}

/* Label */
label  { width: 75px;  margin: 0px; float: left; text-align: left; }
/* Input, Textarea */
input{ margin: 0px; padding: 0px;  float: left; border: 1px solid #0c0c0c;  color: #fff; background:#2e2e2e; font: 12px Arial, Helvetica, Arial, sans-serif; height:20px; margin-bottom:3px; width:300px }
textarea{margin: 0px; padding: 0px;  float: left; background:#2e2e2e; border: 1px solid #0c0c0c;  color: #fff;   font: 12px Arial, Helvetica, Arial, sans-serif; height:110px; margin-bottom:3px; width:300px }

/*====================== 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; }

/*====================== Fonts ====================*/
.fs_p11{
    font-size: 11pt;
}