@charset "utf-8";
/* CSS Document */

body {
	background:url(../img/bg/broroma_bgsite.jpg) fixed top center;
	font-family:Tahoma;
	font-weight:normal;
	color:#666;
	font-size:12px;
	margin-top:0px;
}
a, a:visited {text-decoration:none;outline:none;color:#999999;}
a:hover {text-decoration:none; outline:none; color:#0066cc;}
img { border:0;}

/**********************************  menu bar *********************************/
#broroma_nav {width: 735px; height: 58px; background: url(../img/button/broroma_menu.png) no-repeat; position: absolute; top: 86px; left: 266px; padding:0;}

#broroma_nav li { display: inline; }
#broroma_nav li a:link, #broroma_nav li a:visited { position: absolute; top: 0; height: 58px; text-indent: -9000px; overflow: hidden; z-index: 10; }

#home a:link, #home a:visited { left: 36px; width: 72px; }
#home.current a:link, #home.current a:visited { background: url(../img/button/broroma_menu.png) no-repeat -36px -115px; cursor: default; }
.broroma_nav-home, .nav-home-click { position: absolute; top: 0; left: 36px; width: 72px; height: 58px; background: url(../img/button/broroma_menu.png) no-repeat -36px -55px; }
.broroma_nav-home-click { background: url(../img/button/broroma_menu.png) no-repeat -36px -110px; }

#about a:link, #about a:visited { left: 107px; width: 107px; }
#about.current a:link, #about.current a:visited { background: url(../img/button/broroma_menu.png) no-repeat -107px -115px; cursor: default; }
.broroma_nav-about, .nav-about-click { position: absolute; top: 0; left: 107px; width: 107px; height: 58px; background: url(../img/button/broroma_menu.png) no-repeat -107px -55px; }
.broroma_nav-about-click { background: url(../img/button/broroma_menu.png) no-repeat -107px -110px; }

#products a:link, #products a:visited { left: 213px; width: 108px; }
#products.current a:link, #products.current a:visited { background: url(../img/button/broroma_menu.png) no-repeat -183px -115px; cursor: default; }
.broroma_nav-products, .nav-products-click { position: absolute; top: 0; left: 213px; width: 108px; height: 58px; background: url(../img/button/broroma_menu.png) no-repeat -213px -55px; }
.broroma_nav-products-click { background: url(../img/button/broroma_menu.png) no-repeat -213px -110px; }

#contact a:link, #contact a:visited { left: 320px; width: 94px; }
#contact.current a:link, #contact.current a:visited { background: url(../img/button/broroma_menu.png) no-repeat -320px -115px; cursor: default; }
.broroma_nav-contact, .nav-contact-click { position: absolute; top: 0; left: 320px; width: 97px; height: 58px; background:url(../img/button/broroma_menu.png) no-repeat -320px -55px; }
.broroma_nav-contact-click { background: url(../img/button/broroma_menu.png) no-repeat -320px -110px; }

#career a:link, #career a:visited { left: 413px; width: 88px; }
#career.current a:link, #career.current a:visited { background: url(../img/button/broroma_menu.png) no-repeat -413px -115px; cursor: default; }
.broroma_nav-career, .nav-career-click { position: absolute; top: 0; left: 413px; width: 88px; height: 58px; background:url(../img/button/broroma_menu.png) no-repeat -413px -55px; }
.broroma_nav-career-click { background: url(../img/button/broroma_menu.png) no-repeat -413px -110px; }

/**********************************  menu bar  ENG*********************************/

#broroma_nav1 {width: 735px; height: 58px; background: url(../img/button/broroma_menu_eng.png) no-repeat; position: absolute; top: 86px; left: 266px; padding:0;}

#broroma_nav1 li { display: inline; }
#broroma_nav1 li a:link, #broroma_nav1 li a:visited { position: absolute; top: 0; height: 58px; text-indent: -9000px; overflow: hidden; z-index: 10; }

#home1 a:link, #home1 a:visited { left: 36px; width: 72px; }
#home1.current a:link, #home1.current a:visited { background: url(../img/button/broroma_menu_eng.png) no-repeat -36px -115px; cursor: default; }
.broroma_nav1-home, .nav-home-click { position: absolute; top: 0; left: 36px; width: 72px; height: 58px; background: url(../img/button/broroma_menu_eng.png) no-repeat -36px -55px; }
.broroma_nav1-home-click { background: url(../img/button/broroma_menu_eng.png) no-repeat -36px -110px; }

#about1 a:link, #about1 a:visited { left: 107px; width: 107px; }
#about1.current a:link, #about1.current a:visited { background: url(../img/button/broroma_menu_eng.png) no-repeat -107px -115px; cursor: default; }
.broroma_nav1-about, .nav-about-click { position: absolute; top: 0; left: 107px; width: 107px; height: 58px; background: url(../img/button/broroma_menu_eng.png) no-repeat -107px -55px; }
.broroma_nav1-about-click { background: url(../img/button/broroma_menu_eng.png) no-repeat -107px -110px; }

#products1 a:link, #products1 a:visited { left: 213px; width: 108px; }
#products1.current a:link, #products1.current a:visited { background: url(../img/button/broroma_menu_eng.png) no-repeat -183px -115px; cursor: default; }
.broroma_nav1-products, .nav-products-click { position: absolute; top: 0; left: 213px; width: 108px; height: 58px; background: url(../img/button/broroma_menu_eng.png) no-repeat -213px -55px; }
.broroma_nav1-products-click { background: url(../img/button/broroma_menu_eng.png) no-repeat -213px -110px; }

#contact a:link, #contact a:visited { left: 320px; width: 94px; }
#contact.current a:link, #contact.current a:visited { background: url(../img/button/broroma_menu_eng.png) no-repeat -320px -115px; cursor: default; }
.broroma_nav1-contact, .nav1-contact-click { position: absolute; top: 0; left: 320px; width: 97px; height: 58px; background:url(../img/button/broroma_menu_eng.png) no-repeat -320px -55px; }
.broroma_nav1-contact-click { background: url(../img/button/broroma_menu_eng.png) no-repeat -320px -110px; }

#career a:link, #career a:visited { left: 413px; width: 88px; }
#career.current a:link, #career.current a:visited { background: url(../img/broroma_menu_eng.png) no-repeat -413px -115px; cursor: default; }
.broroma_nav1-career, .nav1-career-click { position: absolute; top: 0; left: 413px; width: 88px; height: 58px; background:url(../img/button/broroma_menu_eng.png) no-repeat -413px -55px; }
.broroma_nav1-career-click { background: url(../img/button/broroma_menu_eng.png) no-repeat -413px -110px; }




.body-wrapperHome {width:1000px;height:auto;display:block;border:1px solid #CCC;background:#FFF;margin:0 auto;}
.body-wrapperContentarea {width:1000px;height:320px;display:block;border:1px solid #CCC;background:#FFF;margin:0 auto;}
.body-wrapperFooter {width:1000px;height:66px;display:block;background:url(../img/bg/broroma_bgFooter_shadows.png) top no-repeat;margin:0 auto;}
#header {display:block;width:1000px;margin:0 auto;height:160px;position:relative;}
.broroma_boxlogo {display:block;width:256px;height:122px;position:absolute;top: 26px;left: -1px;}
a.broroma {display:block;width:256px;height:122px;background:url(../img/global/Broroma.png) top left no-repeat;
}
a.broroma:hover {opacity:0.8;filter:alpha(opacity=94); /* For IE8 and earlier */}
#home_boxcontent {
	display:block;
	width:995px;
	height:auto;
	float:left;
	background:url(../img/background/bg_main.png) top repeat-y;
}
#content_area {display:block; width:1000px; height:auto; display:block; border-right:1px solid #CCC; border-left:1px solid #CCC; border-bottom:1px solid #CCC; border-top:0px; background:#000;
}	
.headinner {display:block; width:auto; height:60px; position:relative; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 433px;
}
#box_column {display:block; width:226px; height:118px; float:left; margin:0 6px 0 6px; border-right: 1px double #CCCCCC;}
#box_columnEnd {display:block; width:232px; height:118px; float:left; margin:0 3px 0 3px;}
#area_highlight {display:block; width:1000px; height:388px; float:left;}
	
	
/************************************ menu bar ************************************/

a.langTh {display:block; width:109px; height:30px; background:url(../img/button/broroma_langTh.png) left top no-repeat;}
a.langTh:hover {background-position:left -29px;}

a.langEn {display:block; width:109px; height:30px; background:url(../img/button/broroma_langEng.png) left top no-repeat;}
a.langEn:hover {background-position:left -29px;}



a.fb {display:block;width:25px;height:27px;background:url(../img/button/fb.png) top no-repeat;}
a.fb:hover {background-position:left -27px;}
a.tw {display:block;width:25px;height:27px; background:url(../img/button/tw.png) top no-repeat;}
a.tw:hover {background-position:left -27px;}
.menubar {display:block; width:734px; height:52px; background:url(../img/global/menu_bar.png) top left no-repeat;position:absolute;top: 91px;left: 286px;}

/************************************ Navigator ************************************/
.navigator {display:block; width:600px; height:20px; float:left;margin-left:30px; border-bottom:1px solid #999}


/************************************* links motion *********************************/
#motion_links img {float: left;margin:10px 0 0 0; -webkit-transition: margin 0.2s ease-out; -moz-transition: margin 0.2s ease-out;-o-transition: margin 0.2s ease-out;}
#motion_links img:hover {margin-top: 2px;}


/*************************************  type product ********************************/
.productType_01 {display:block; width:196px; height:188px; margin:0 0 0 9px; float:left; background:url(../img/bg/brorona_typeProduct_01.jpg) bottom no-repeat}
.productType_011 {display:block; width:196px; height:188px; margin:0 0 0 9px; float:left; background:url(../img/bg/brorona_typeProduct_011.jpg) bottom no-repeat}
.productType_02 {display:block; width:196px; height:188px; float:left; background:url(../img/bg/brorona_typeProduct_02.jpg) bottom  no-repeat}
.productType_022 {display:block; width:196px; height:188px; float:left; background:url(../img/bg/brorona_typeProduct_022.jpg) bottom  no-repeat}
.productType_03 {display:block; width:196px; height:188px; float:left; background:url(../img/bg/brorona_typeProduct_03.jpg) bottom  no-repeat}
.productType_033 {display:block; width:196px; height:188px; float:left; background:url(../img/bg/brorona_typeProduct_033.jpg) bottom  no-repeat}
.productType_04 {display:block; width:196px; height:188px; float:left; background:url(../img/bg/brorona_typeProduct_04.jpg) bottom  no-repeat}
.productType_044 {display:block; width:196px; height:188px; float:left; background:url(../img/bg/brorona_typeProduct_044.jpg) bottom  no-repeat}
.productType_05 {display:block; width:196px; height:188px; float:left; background:url(../img/bg/brorona_typeProduct_05.jpg) bottom  no-repeat}
.product_border {display:block; width:176px; height:138px; margin:0 0 0 10px;}


/*********************************  Product inner ***********************************/
.product_in1 {display:block; width:156px; height:146px; float:left; margin-left:30px; margin-top:16px;}
.product_in2 {display:block; width:156px; height:112px; position:relative; background: url(../img/bg/Producut_frame.jpg) top left no-repeat }
.product_in3 {display:block; width:144px; height:99px; position:absolute; top: 6px; left: 6px;}
.product_in4 {display:block; width:154px; /*height:20px;*/ padding:6px 0 0 4px; margin-bottom:10px; overflow:hidden; border-bottom:1px solid #CCC; color:#0099ff; font-weight:bold}
.product_in5 {display:block; width:384px; height:20px; margin-top:14px; float:left; margin-left:30px; border-bottom:1px solid #999; color:#0099ff; font-weight:bold}
.product_in6 {display:block; width:384px; height:auto; margin-top:14px; float:left; margin-left:30px;}

/************************************** Aboutus  **************************************/
.menu_box {display:block; width:264px; height:auto; float:left; padding-top:70px; padding-bottom:120px; background:url(../img/bg/broroma_contact_05.png) top repeat-y}
#menu_broroma a.links_topic {font-size:14px;font-weight:bold; color:#FFFFFF;height:26px;display:block;padding-top: 16px;padding-right: 16px;padding-bottom: 12px;padding-left: 20px;}
#menu_broroma a.links { width:208px; font-size:14px; margin-left:10px; color:#FFFFFF;background: url(../img/CCKnowledge_menu.jpg)left no-repeat; height:26px; display:block;padding-top: 14px;padding-right: 16px;padding-bottom: 0;padding-left: 20px; margin-top:-1px; border-top:1px solid #9c9b9b; border-bottom:1px solid #9c9b9b;}
#menu_broroma a.links:hover {font-size:14px;font-weight:bold;color:#000; background:url(../img/button/broroma_grass.png)left no-repeat;height:26px;display:block;padding-top: 14px;padding-right: 16px;padding-bottom: 0;padding-left: 20px;}

/*************************************  contact  **************************************/
a.contact_send {display:block;width:107px;height:32px;background:url(../img/button/broroma_contact_send.png) left top no-repeat;float:left;margin-left:26px;margin-top:16px;margin-bottom:16px;}
a.contact_send:hover {background-position: left -32px;}
a.contact_reset {display:block;width:107px;height:32px;	background:url(../img/button/broroma_contact_reset.png) left top no-repeat;float:left;margin-top:16px;margin-bottom:16px;}
a.contact_reset:hover {background-position: left -32px;}

/*************************************  Company  **************************************/
.company_1 {display:block; width:600px; height:auto; float:left; margin-top:30px; margin-left:30px;}
.company_2 {display:block; width:600px; height:auto; float:left; margin-bottom:6px; font-weight:bold}
.company_3 {display:block; width:600px; height:16px; float:left;}
.company_4 {display:block; width:600px; height:16px; float:left;}

/*********************************** Send Contact ************************************/
.send_contact1 {display:block;  width:264px; height:455px; margin-left:56px; float:left}
.send_contact2 {display:block; position:relative; width:264px; height:28px; float:left; background:url(../img/bg/broroma_contact_03.png) top no-repeat}
.send_contact3 {display:block; position:absolute; width:263px; height:48px; background:url(../img/bg/broroma_contact_10.png) top no-repeat; top: 31px; left: -19px}
.send_contact4 {display:block; margin-top:10px; padding-left:52px; font-size:15px; font-weight:bold; color:#ff0000}
.send_contact5 {display:block; width:264px; height:auto; float:left;  background:url(../img/bg/broroma_contact_05.png) top repeat-y}
.send_contact6 {display:block; width:188px; height:15px; float:left; margin-left:34px; margin-bottom:2px; margin-top:70px; color:#FFF; font-weight:normal}
.send_contact7 {display:block; width:188px; height:26px; float:left; padding-left:10px; margin-left:34px; margin-bottom:5px; background:url(../img/bg/broroma_contact_18.png) top left no-repeat; border:0px; color:#FFF}
.send_contact8 {display:block; width:188px; height:15px; float:left; margin-left:34px; margin-bottom:2px; margin-top:1px; color:#FFF; font-weight:normal}
.send_contact9 {display:block; width:188px; height:26px; float:left; padding-left:10px; margin-left:34px; margin-bottom:5px; background:url(../img/bg/broroma_contact_18.png) top left no-repeat; border:0px; color:#FFF}
.send_contact10 {display:block; width:188px; height:15px; float:left; margin-left:34px; margin-bottom:2px; margin-top:1px; color:#FFF; font-weight:normal}
.send_contact11 {display:block; width:188px; height:77px; height:78px; float:left; padding-top:10px; padding-left:10px; margin-left:34px; margin-bottom:5px; background:url(../img/bg/broroma_contact_21.png) top left no-repeat; border:0px; color:#FFF ; max-height:68px; max-width:188px;}
.send_contact12 {display:block; width:188px; height:15px; float:left; margin-left:34px; margin-bottom:2px; margin-top:1px; color:#FFF; font-weight:normal}
.send_contact13 {display:block; width:125px; height:33px; float:left; margin-left:34px;}
.send_contact14 {display:block; width:188px; height:26px; float:left; padding-left:10px; margin-left:34px; margin-bottom:5px; background:url(../img/bg/broroma_contact_18.png) top left no-repeat; border:0px; color:#FFF}
.send_contact15 {display:block; width:264px; height:39px; float:left;  background:url(../img/bg/broroma_contact_07.png) top no-repeat}


/*************************************  footer  **************************************/
#footer_box1000 {display:block; width:1000px; height:80px; position:relative; float:left; margin:40px 0 0 0; background:url(../img/bg/broroma_bgFooter.png) bottom no-repeat}
.footer_companyName {display:block; width:602px; height:17px; position:absolute; left: 67px; top: 26px; font-weight:bold ; color:#666;  }
.footer_companyAddress {display:block; width:603px; height:15px; position:absolute; left: 67px; top: 43px;font-size:11px; color:#666;font-weight:normal}
.footer_companyPhone {display:block; width:260px; height:17px; position:absolute; left: 735px; top: 14px; font-size:11px; color:#666; font-weight:normal}
.footer_companyFax {display:block; width:260px; height:17px; position:absolute; left: 735px; top: 34px; font-size:11px; color:#666; font-weight:normal}
.footer_companyEmail {display:block; width:260px; height:17px; position:absolute; left: 735px; top: 55px; font-size:11px; color:#666; font-weight:normal}
.footer_compamyCopyright {display:block; margin: 0 auto; width:330px; text-align:center; height:20px; font-size:10px; color:#E2E2E2;padding-top:18px;}

/*************************************  Map  **************************************/	
.map1_1 { display:block; width:280px; height:76px; float:left; margin-top:20px; border-bottom:1px solid #CCC; border-top:1px solid #CCC}
.map2_1 { display:block; width:280px; height:76px; float:left; margin-top:20px; margin-left:20px; border-bottom:1px solid #CCC; border-top:1px solid #CCC}
.map1_2 {display:block; width:75px; height:75px; position:relative; background:url(../img/bg/brorona_bgmap.jpg) top no-repeat}
.map1_3 {display:block; width:55px; height:55px; position:absolute; left: 11px; top: 10px;}
.map1_4 {font-size:10px; font-weight: normal; color:#999}
.map1_5 {font-size:10px; font-weight: normal;color:#999}