@charset "UTF-8";

/* CSS Document */



html, body { height: 100%; }

html, body, table, th, tr, td, ul, li, h1, h2, p, input { padding: 0; margin: 0; border-collapse: collapse; }

img { border: 0; display:block; }

a { outline: 0; }



body { font-family: Arial, Helvetica, sans-serif; font-size: 12px; background-color: #000000; }



/* fonts */

#page { font-size: 12px; }





#page { position:relative; width: 100%; height: 100%; min-width: 980px; min-height: 800px; display: none;}



/* nav */

#nav { position: absolute; top: 100px; left: 0px; z-index: 9001; width:330px;}

#nav ul { list-style: none; padding-left: 20px; }

#nav li { padding-bottom: 30px; }

#nav li span { display: none; }



#menu { position: absolute; top: 200px; left: 0;z-index: 9000; height: 109px; }



#nav-1 { display: block; background: url(../images/en/nav-0.png); width: 196px; height: 51px; }

#nav-2 { display: block; background: url(../images/en/nav-1.png); width: 305px; height: 51px; }

#nav-3 { display: block; background: url(../images/en/nav-2.png); width: 250px; height: 51px; }

#nav-4 { display: block; background: url(../images/en/nav-3.png); width: 271px; height: 51px; }

#nav-1:hover, #nav-1.active { background: url(../images/en/nav-0-on.png); }

#nav-2:hover, #nav-2.active { background: url(../images/en/nav-1-on.png); }

#nav-3:hover, #nav-3.active { background: url(../images/en/nav-2-on.png); }

#nav-4:hover, #nav-4.active { background: url(../images/en/nav-3-on.png); }





/* content */



#content-wrapper { position: relative; height: 100%; width: 100%; overflow: hidden;  min-height: 705px; }



.content { width: 0; height: 0; overflow: hidden; position: absolute; top: 0; left: 0; min-width:980px; min-height: 800px; }

.content-bg { position: absolute; top: 0; left: 0; z-index: -1 }



.scontent { color: #FFF; text-align: justify; }





/* right col */

#content-1 > .right-col { background: url(../images/right-col-bg-1.png) bottom; margin-bottom: 95px; width: 350px; height: 100%; position: absolute; top: 0; right: 30px; z-index: 9002;}

#content-1 > .right-col > .img { padding: 50px 0 20px 70px; }

#content-1 > .right-col > .title { padding: 0 0 0 0px; }

#content-1 > .right-col > .txt { padding: 18px 80px 20px 80px; color: #FFF; text-align: justify; }



/* services */

#content-2 { position: relative; }

#content-2 > .title { width:276px; margin: 40px auto 0 auto; }

#content-2 .panel { position: absolute; top: 120px; width: 100%; }

#content-2 .sub-nav { text-align: center; margin: 0 auto 0 auto; }

#content-2 .nav-wrapper { position: absolute; top: 600px; left:auto; text-align: center; width: 100%;}

#content-2 .container { position: relative; width: 613px; height:468px; margin: 20px auto 10px auto; overflow: visible; }

#content-2 .frame { position: absolute; }

#content-2 .shadow { position: absolute; top:-10px; left: -10px; }

#content-2 .btn-left { position:absolute; left: -71px; top: 180px; }

#content-2 .btn-right { position:absolute; left: 623px; top: 180px; }

#content-2 .txt{ position: absolute; top: 410px; left: 15px; width: 580px; color: #FFF; text-align: justify; }

#content-2 .img-containter{ position: absolute; top: 12px; left: 12px; }

#content-2 .img-containter img { position: absolute; }



.ss { display: inline-block; width: 134px; height: 93px; }

.ss span { display: none; }



#ss-0 { background: url(../images/en/ss-0.png); }

#ss-1 { background: url(../images/en/ss-1.png); }

#ss-2 { background: url(../images/en/ss-2.png); }

#ss-3 { background: url(../images/en/ss-3.png); }

#ss-4 { background: url(../images/en/ss-4.png); }

#ss-5 { background: url(../images/en/ss-5.png); }

#ss-6 { background: url(../images/en/ss-6.png); }

#ss-0:hover, #ss-0.active { background: url(../images/en/ss-0-on.png); }

#ss-1:hover, #ss-1.active { background: url(../images/en/ss-1-on.png); }

#ss-2:hover, #ss-2.active { background: url(../images/en/ss-2-on.png); }

#ss-3:hover, #ss-3.active { background: url(../images/en/ss-3-on.png); }

#ss-4:hover, #ss-4.active { background: url(../images/en/ss-4-on.png); }

#ss-5:hover, #ss-5.active { background: url(../images/en/ss-5-on.png); }

#ss-6:hover, #ss-6.active { background: url(../images/en/ss-6-on.png); }



/* products */

#content-3 > .title { width:276px; margin: 40px auto 0 auto; }

#content-3 .panel { position: absolute; bottom: 120px; width: 100%; text-align: center; }

#content-3 .container { background:url(../images/products-bg.png); width:237px; height:209px; margin: 0 auto 10px auto; }

#content-3 .txt { text-align: left; padding:15px; text-align: justify; }

#content-3 .sub-nav { display:inline-block; *display:inline; text-align: center; }

#content-3 .btn-left { display:inline-block; *display:inline; padding-right: 5px; }

#content-3 .btn-right { display:inline-block; *display:inline; }



#content-3 .ss { display: inline-block; width: 16px; height: 16px; background: url(../images/dot.png) no-repeat; padding-bottom: 6px; padding-right: 5px; }

#content-3 .ss:hover, #content-3 .ss.active { background: url(../images/dot-on.png) no-repeat; }

#content-3 .ss span { display: none; }



/* offices */

#content-4 > .right-col { background: url(../images/office-bg.png) bottom; margin-bottom: 95px; width: 350px; height: 100%; position: absolute; top: 0; right: 30px; z-index: 9002;}

#content-4 > .right-col > .container { background: url(../images/offices-txt-bg.png) no-repeat; width:365px; height:265px; margin: 40px 0px 0px 13px; }

#content-4 > .right-col > .container .txt { padding: 30px 70px 0 30px; text-align: justify; }



#content-4 .sub-nav {  }



#content-4 .ss { display: block; padding-left: 20px; height:auto; width: auto; color: #FFF; padding-bottom: 8px; font-weight:bold; text-decoration:none}

#content-4 .ss:hover, #content-4 .ss.active { background: url(../images/pin.png) no-repeat; }

#content-4 .ss span { display: inline; }

#content-4 a { text-decoration:none; color:#000000}





/* contacts */

#content-5 > .right-col { background: url(../images/contact-bg.png) bottom; margin-bottom: 95px; width: 350px; height: 100%; position: absolute; top: 0; right: 30px; z-index: 9002;}

#content-5 > .right-col > .img { padding: 50px 0 20px 70px; }

#content-5 > .right-col > .title { padding: 50px 0 10px 0px; }

#content-5 > .right-col > .txt { padding: 18px 80px 20px 80px; color: #FFF; }

#content-5 > .right-col > .txt > h1 { font-size: 14px; padding-bottom: 10px; }

#content-5 > .right-col > .txt > p { padding-bottom: 10px; }

#content-5 > .right-col > .txt > #btn-enquiry { display: block; margin: 0 0 0 -10px; }



#content-5 .col-wrapper { position: relative; display: block; width: 900px; height: 100%; margin-right: 100px; float:right; overflow: hidden;  min-height: 705px;  }



#content-5 .right-col-2 { background: url(../images/contact-bg-2.png) bottom no-repeat; padding: 40px 0 0 80px; margin-bottom: 95px; width: 760px; height: 100%; position: absolute; top: 0; right: 0px; z-index: 9001; }

#content-5 .right-col-2 form { padding-top: 20px; }

#content-5 .right-col-2 input[type=text]  { width: 200px; border: 1px solid #999; }

#content-5 .right-col-2 textarea { width: 300px; height: 200px; border: 1px solid #999; }





/* careers */

#content-6 > .right-col { background: url(../images/careers-bg.png) bottom; margin-bottom: 95px; width: 382px; height: 100%; position: absolute; top: 0; right: 30px; z-index: 9002;}

#content-6 > .right-col .title { padding: 20px 0 0 0px; }

#content-6 > .right-col .txt { padding: 0px 0px 10px 0px; color: #FFF; text-align:justify; }

#content-6 > .right-col .txt h1 { font-size: 14px; padding-bottom: 10px; }

#content-6 > .right-col .txt p { font-size: 12px; padding-bottom: 10px; }

#content-6 > .right-col .txt #btn-enquiry { display: block; margin: 0 0 0 -10px; }



#content-6 > .right-col .sub-nav { margin: 0 0px 0 0px; }

#content-6 > .right-col .sub-nav h1 { color: #96926C; background-color:#DFDCB4; font-size: 12px; padding: 2px 10px 2px 10px; margin-bottom: 8px; }

#content-6 > .right-col .sub-nav p { margin-bottom: 8px; padding: 0 0 0 10px; }

#content-6 > .right-col .sub-nav p a { color: #FFF; }



#content-6 .col-wrapper { position: relative; display: block; width: 900px; height: 100%; margin-right: 100px; float:right; overflow: hidden;  min-height: 705px;  }



#content-6 .right-col-2 { background: url(../images/careers-bg-2.png) bottom no-repeat; padding: 40px 0 0 80px; margin-bottom: 95px; width: 560px; height: 100%; position: absolute; top: 0; right: 0px; z-index: 9001; }

#content-6 .right-col-2 .txt { width: 180px; padding: 0 0 0px 0px; text-align:justify; }

#content-6 .right-col-2 .txt h1 { padding-bottom: 10px; font-size: 12px; color: #96926C; }

#content-6 .right-col-2 .txt p { padding-bottom: 10px; }

#content-6 .right-col-2 a img { padding-left: 30px; padding-top: 10px; }



#content-6 a { text-decoration:none; color:#000000; }

/* sitemap */

#sitemap { position: fixed; top: 0; width: 100%; height: 100%; z-index: 9999; display: none; }

#sitemap > .bg { background:#000; width: 100%; height: 100%; position: absolute; top: 0; }

#sitemap > .list { background: #313234; border: 4px #FFF solid; top: 0; position: relative; margin: 10% auto 0 auto; width: 1000px; padding: 20px; }

#sitemap > .list h1 { color: #FFF; font-size: 12px; padding-bottom: 10px; }

#sitemap > .list a { color: #FFF; }

#sitemap > .list > ul { list-style: none; }

#sitemap > .list > ul > li { float: left; padding-right: 30px; }

#sitemap > .list > ul > li > ul { list-style: none; padding-top: 10px; }

#sitemap > .list > ul > li > ul > li {  padding-bottom: 10px; color: #FFF; }

#sitemap > .list > ul > li.clear { float: none; clear:left; }



/* comingsoon */

#comingsoon { position: fixed; top: 0; width: 100%; height: 100%; z-index: 10001; display: none; }

#comingsoon > .bg { background:#000; width: 100%; height: 100%; position: absolute; top: 0; }

#comingsoon > .txt { color: #FFF; background: #313234; border: 4px #FFF solid; top: 0; position: relative; margin: 20% auto 0 auto; width: 500px; padding: 20px; text-align:center; padding: 60px 0 60px 0; }





#footer-wrapper { width: 100%; height: 95px; position: absolute; bottom: 0; background: #999; border-top: 3px solid #FFF; z-index: 10000 !important; }



#footer { position: relative; width: 100%; min-width:980px; margin: 0 auto 0 auto; color: #FFF; }

#footer a { text-decoration: none; color: #FFF; }

#footer a:hover { color: #000; }



#logo { position: absolute; top: 17px; left: 40px; }

#logo a { display: block; background: url(../img/logo.png) no-repeat; width:192px; height:67px; }

#logo a > span { display:none; }



#bottom-nav { position: absolute; top: 40px; width: 500px; left: 34%;  font-size: 12px; overflow: visible;  margin: 0 auto 0 auto; }

#bottom-nav ul { list-style: none; position: absolute; }

#bottom-nav ul li { float: left; background: url(../images/dot.jpg) no-repeat; padding: 1px 0 0 20px; margin-left: 15px; width: 100px;}



#lang { position: absolute; top: 40px; right: 40px; font-size: 12px; }



#statement { position: absolute; top: 70px; right: 40px; font-size: 10px; }



/* misc */

.italic { font-style: italic; }

.bold { font-weight: bold; }



.customScrollBox > .content { }