body {
background:#DEE0E1 url('bg/bg.png') repeat-x; 
margin:0px;
padding:0px;
font-family:verdana;
font-size:12px;
color: #416271;
}
h1{
padding:5px 0 5px 0;
margin:0px;
font-size:18px;
color:#FFFFFF;
}
h2{
padding:5px 0 5px 0;
margin:0px;
font-size:18px;
color:#f7951e;
}
h3{
padding:0 0 5px 0;
margin:0px;
font-size:12px;
color:#59cef9;
}
h4{
padding:0 0 10px 0;
margin:0px;
font-size:14px;
color:#7ea743;
}
p{
text-align:justify;
padding:2px 0 2px 0;
margin:0px;
line-height:15px;
}
p.white{
color:#FFFFFF;
}
p.green{
color:#d4f0ba;
}
p.clear{
clear:both;
padding:10px 0 0 0;
}
img.left_img{
border:1px #cae6c6 solid;
float:left;
margin:0 10px 0 0 ;
}
img.box_img{
float:left;
padding:0 20px 0 0 ;
}
#main_container{
width:980px;
height:auto;
margin:auto;
background-color:#666;
    
}
#header{
 width:980px;
height:auto;
margin:auto;
background-color:#494748;
}
#logo{
height:38px;
padding:10px;
background:#494748 url('images/logo_1.gif') no-repeat ;
float:left;
width:315px;
color:#fff;

}
#lang{
float:right;
position: relative;
right:155px;
background:url(images/en.gif) no-repeat;padding:4px;
position:absolute;width:15px;height:10px
    
}
/*----------------------menu-------------------------*/
#menu{
width:625px;
height:38px;
padding:10px;
float:right;
background-color:#494748;
text-align:left 
/*url(navi_bg.jpg) no-repeat;*/
}
#menu ul{
list-style:none;padding:1px;margin: auto;display:block;
}
#menu ul li{
list-style:none;display:inline;float:right;width:auto;height:42px;padding:0px;line-height:42px; font-family:Arial, Helvetica, sans-serif; font-size:13px;
}
#menu ul li a{
height:42px; width: auto;float:left;text-decoration:none;padding:0 0 0 25px; margin:0px 3px 0px 3px;color:#fff;
}
#menu ul li a:hover{
height:42px;width: auto;text-decoration:none;color: #fff;padding:0 0 0 25px; background:url(images/menu_arrow.gif) no-repeat left;
}
#menu ul li a.current{
height:42px;width: auto;float:left;text-decoration:none;padding:0px;color: #fff;padding:0 0 0 25px; background:url(images/menu_arrow.gif) no-repeat left;
}

ul.l_menu{
  list-style-type:none;
  display: block;
  margin-left:-20px
}
ul.l_menu a{
 color: #FFF;
 text-decoration: none
}
ul.l_menu li{
    padding-bottom:2px; 
}


.main_layout{background-color:#666 }
/*----------------product box-----------*/
.product{
    float:left;
     width:980px;
    clear:both;
    }
.product_header{width: 980px;; height: 125px;  background: #e3e3e3;} 

/*----------------product box-----------*/
.product-current-item{font-weight:bold}
#short_introduction{
    background-color:#45565d;
    padding:10px;
    clear:both;
    float:left;
    color:#FFF;    
    
}
#events{
    background-color:#E3E3E3;
     padding-top:10px;
     padding-bottom:10px;     
    clear:both;
    float:left;
    color:#000;
     width:980px;
}
#events-tag{font-weight:bold; }
#short_introduction,#latest_product{
   font-family:verdana;  font-weight:normal; font-size:11px; line-height:15px;
   width:930px;
}
.morelink a { 
	color:#778cb0;
	display:block;
	text-align:right;
	padding:2px;
	font-size:0.75em;
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
}
/* ------------------------ GALLERY ---------------------*/

.gallery { padding-top:5px; margin:0;  height:150px; border-bottom: 5px solid #f1f1f1 }

.gallery_title a { font-weight: bold; }
.gallery_more {color: #666; text-align: left;}
.gallery_more a { text-decoration:none;font-size: 0.9em; color:#0A246A  }


/* ------------------------ Popup ------------------*/
.PopBoxImageSmall{border: none 0px white;cursor: url("images/magplus.cur"), pointer;}
.PopBoxImageLarge{   border: solid thin #CCCCFF; cursor: url("images/magminus.cur"), pointer;}


.woo-image { padding:2px; margin:0; width:200px; height:140px;}

/*---------------------Event*/

.event { padding-top:5px; margin:0;  height:110px; border-bottom: 5px solid #f1f1f1 }
	

/*--------------------------main_content-------------------*/
#main_content{
width:auto;
height:auto;
clear:both;
background-color:#fff;
border:1px solid #E3E3E3;
}

#product_content{
width:435px;
height:auto;
margin:5px;
float:left;
padding:0px;
background-color:#fff;
height:310px;
}

#product_page_content{
height:auto;
margin:5px;
padding:0px;
background-color:#fff;
float:left;
width:770px;
clear:both;

}

.products_box{
height:130px;
width:125px;
float: left;
padding:5px;
background-color:#FFF;
border:1px solid #E3E3E3;
margin:2px;
}

.products_box img{margin-left:4px;   padding:5px; vertical-align:middle; width:100px;height:100px;}


/* --------------------------- Product page ------------*/
#main_body_proudut_content{  
            position:relative;
	     width: 100%;   	   
	    margin:0 auto;
	    background-color:#666666;
	    /*z-index: 10;*/ /* to display the correct background */
	    padding-top: 0px;
            clear: both;
}
.left_nav{
  position: relative;
	    float: left;
	    /*left:0px;*/
	    width:200px;
	    /*min-height:600px;*/
	    background-color:#666666;
	    text-align:left;
	    z-index: 5;	
	    padding-top:0px;         
}
	
.left_nav .block-inner{
width:192px;
background-color: #666666;
padding-bottom: 2px;
}
#left_nav .block-inner{
		width:192px;
                -moz-box-shadow:3px 3px 3px #333333;
		-webkit-box-shadow: 3px 3px 3px #333333;
		boxshadow: 3px 3px 3px #333333;
		background-color: #666666;
		zoom:1;
		filter: progid:DXImageTransform.Microsoft.DropShadow(color=#333333, offx=1, offy=1);
		padding-bottom: 5px;
		
	}
.main{
    position: relative;	    
	    float: left;
	    width: 780px;
	    background-color:#f1f1f1;
	    font-family: verdana;
	    font-size: 13px;
	    /*left: 200px;*/
	    /*min-height: 700px;*/
	    /*padding:15px;*/
}
.main_inner{clear:both;border:1px solid #000;padding-bottom:4px }
.clearfix{clear:both;height:0;display:block }
.breadcrumb {
  clear: both;    
  padding: 5px;
    
}

.breadcrumb>a{
font-size: 11px;
text-decoration: none;
}
.breadcrumb>a:hover{
text-decoration: underline;
}
	

h3.block-title{
  padding-left:7px;
  padding-top:7px;
  font-family:verdana;
  font-size:14px;
  font-weight: normal;
  color:#f1f1f1;
  font-weight:bold;  
}
.block-title a{color: #FFF;text-decoration:none }
        
/*-----------------------------Quick Links ------------*/
#quick_links{
width:523px;
height:310px;
margin:5px;
float:left;
padding:0px;
background-color:#e3e5e9;
overflow:auto
}
#quick_links p{font-weight:bold; padding:5px;font-weight: 900;color:#000;}
#quick_links li{padding: 5px; font: 12px/1.3 Verdana, "Lucida Grande", Arial, Helvetica, Sans-Serif; float: left;margin:0;}
#quick_links li a { color: #000; text-decoration:none }
#quick_links li  a:hover { background: none; }
#quick_links li:hover {background-color: #fff; color:#000 }

#quick_links ul{
background-color:#000;
border:1px solid #e3e3e3;
list-style-type:none;
margin-left:-5px
}

/*-----------------------------footer------------------*/

#footer #sitemap{background-color:#333; padding-top:5px;  margin:0px 0 0 0px;font-family:verdana;  font-weight:normal; font-size:9px;clear:both }
#footer #sitemap .block{float:left;width:160px;margin-right:0px;margin-left:60px;}
#footer #sitemap .last{margin-right:0; width:20px; }
#footer #sitemap ul{padding:0;}
#footer #sitemap ul ul{margin: 0 0 4px 5px; padding-top:0;}
#footer #sitemap ul li{line-height:20px;list-style-type:none  }
#footer #sitemap ul li a {color:#fff;text-decoration:none }
#footer #sitemap ul li a:hover{text-decoration:underline;}
#footer #sitemap h4{color:#FFF;padding:0; margin-bottom:5px;}
/*#footer .bevel{background:url(bevel-footer.gif) repeat-x top right;height:1px;width:100%;border:0;margin-top:1px;}*/

#footer{
clear:both;
 width:980px;
color: #fff;
background-color:#666;
padding:0px 0 3px;

}
.copyright{
float:left;
padding:5px;
color:#FFF;
font-family:verdana;  font-weight:normal; font-size:9px;
}
.footer_links{
float:right;
padding:5px;
font-family:verdana;  font-weight:normal; font-size:9px;
background-color:#666;
color:#999;
}
.footer_links a{
text-decoration:none;
color: #fff;
padding-left:10px;
}
.footer_links a:hover{
text-decoration:underline;
color: #fff;
}



/*********************/


#content {
  width: 800px;
  padding: 50px;
  margin: 0 auto;
  display: block;
  font-size: 1.2em;
}

#content h2 {
  line-height: 1.5em;
}


/* Add curved borders to various elements */

#contactForm, .statusMessage, input[type="submit"], input[type="button"] {
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;  
  border-radius: 10px;
}


/* Style for the contact form and status messages */

#contactForm, .statusMessage {
  color: #666;
  background-color: #ebedf2;
  background: -webkit-gradient( linear, left bottom, left top, color-stop(0,#dfe1e5), color-stop(1, #ebedf2) );
  background: -moz-linear-gradient( center bottom, #dfe1e5 0%, #ebedf2 100% );  
  border: 1px solid #aaa;
  -moz-box-shadow: 0 0 1em rgba(0, 0, 0, .5);
  -webkit-box-shadow: 0 0 1em rgba(0, 0, 0, .5);
  box-shadow: 0 0 1em rgba(0, 0, 0, .5);
  opacity: .95;
}


/* The form dimensions */

#contactForm {
  width: 40em;
  height: 33em;
  padding: 0 1.5em 1.5em 1.5em;
  margin: 0 auto;
}


/* Position the form in the middle of the window (if JavaScript is enabled) */

#contactForm.positioned {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin-top: auto;
  margin-bottom: auto;
}


/* Dimensions and position of the status messages */

.statusMessage {
  display: none;
  margin: auto;
  width: 30em;
  height: 2em;
  padding: 1.5em;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.statusMessage p {
  text-align: center;
  margin: 0;
  padding: 0;
}


/* The header at the top of the form */

#contactForm h2 {
  font-size: 2em;
  font-style: italic;
  letter-spacing: .05em;
  margin: 0 0 1em -.75em;
  padding: 1em;
  width: 19.5em;  
  color: #aeb6aa;
  background: #dfe0e5;
  border-bottom: 1px solid #aaa;
  -moz-border-radius: 10px 10px 0 0;
  -webkit-border-radius: 10px 10px 0 0;  
  border-radius: 10px 10px 0 0;
}


/* Give form elements consistent margin, padding and line height */

#contactForm ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

#contactForm ul li {
  margin: .9em 0 0 0;
  padding: 0;
}

#contactForm input, #contactForm label {
  line-height: 1em;
}


/* The field labels */

label {
  display: block;
  float: left;
  clear: left;
  text-align: right;
  width: 28%;
  padding: .4em 0 0 0;
  margin: .15em .5em 0 0;
  font-weight: bold;
}


/* The fields */

input, textarea {
  display: block;
  margin: 0;
  padding: .4em;
  width: 67%;
  font-family: "Georgia", serif;
  font-size: 1em;
  border: 1px solid #aaa;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;    
  border-radius: 5px;
  -moz-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
  -webkit-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
  box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
  background: #fff;
}

textarea {
  height: 13em;
  line-height: 1.5em;
  resize: none;
}


/* Place a border around focused fields, and hide the inner shadow */

#contactForm *:focus {
  border: 1px solid #66f;
  outline: none;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
}


/* Display correctly filled-in fields with a green background */

input:valid, textarea:valid {
  background: #dfd;
}


/* The Send and Cancel buttons */

input[type="submit"], input[type="button"] {
  float: right;
  margin: 2em 1em 0 1em;
  width: 10em;
  padding: .5em;
  border: 1px solid #666;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;  
  border-radius: 10px;
  -moz-box-shadow: 0 0 .5em rgba(0, 0, 0, .8);
  -webkit-box-shadow: 0 0 .5em rgba(0, 0, 0, .8);
  box-shadow: 0 0 .5em rgba(0, 0, 0, .8);
  color: #fff;
  background: #0a0;
  font-size: 1em;
  line-height: 1em;
  font-weight: bold;
  opacity: .7;
  -webkit-appearance: none;
  -moz-transition: opacity .5s;
  -webkit-transition: opacity .5s;
  -o-transition: opacity .5s;
  transition: opacity .5s;
}

input[type="submit"]:hover,
input[type="submit"]:active,
input[type="button"]:hover,
input[type="button"]:active {
  cursor: pointer;
  opacity: 1;
}

input[type="submit"]:active, input[type="button"]:active {
  color: #333;
  background: #eee;
  -moz-box-shadow: 0 0 .5em rgba(0, 0, 0, .8) inset;
  -webkit-box-shadow: 0 0 .5em rgba(0, 0, 0, .8) inset;
  box-shadow: 0 0 .5em rgba(0, 0, 0, .8) inset;
}

input[type="button"] {
  background: #f33;
}


/* Header/footer boxes */

.wideBox {
  clear: both;
  text-align: center;
  margin: 70px;
  padding: 10px;
  background: #ebedf2;
  border: 1px solid #333;
}

.wideBox h1 {
  font-weight: bold;
  margin: 20px;
  color: #666;
  font-size: 1.5em;
}