﻿/* Debugging Element */
#debug {background-color:White; position:absolute; left:0px; right:0px;}

/* Enviroment Setting */
body {text-align:left; font-family:Arial; font-size:12px; font-weight:normal;}
a {color:#0033ff; text-decoration:none; display:inline-block;}
a:hover {border-bottom:dotted 1px #0033ff;}
#logo_homelink:hover {border:none;}

/* Details  */
#main_frame {width:991px; min-height:500px; display:block; margin:0 auto 0 auto; }

#init_load_img { display:none; }

#top_frame {width:951px; height:82px; padding:20px; position:relative;padding-bottom:0px;}
#top_frame ul {font-size:10px; position:absolute; right:0px; top:20px;}
#top_frame ul li{float:left; padding-left:25px; padding-right:25px; border-right:solid 1px #1F1F1F;}
#top_frame ul li.lastchild {border-right:none; padding-right:0px; }
#top_frame span {position:absolute; right:0px; bottom:4px; font-size:16px; font-weight:bold; letter-spacing:1px;}
#top_frame span.top_frame_title {bottom:35px; left:180px; font-size:22px; font-style:italic;}


/*
Menu Bar Setting
*/

#menu_frame {width:990px; height:35px; background-image:url('../image/top_frame/menu_center.jpg'); position:relative; z-index:3000;}
#menu_frame ul.menu_bar {color:White;float:left;text-align:left;}
#menu_frame ul.menu_bar > li {text-align:left;float:left;line-height:35px;background:url('../image/top_frame/menu_break.jpg'); background-repeat:no-repeat;}
#menu_frame ul.menu_bar > li.firstchild {background:url('../image/top_frame/menu_left.jpg'); background-repeat:no-repeat;}
#menu_frame ul.menu_bar > li.lastchild {}
#menu_frame ul.menu_bar > li:hover {height:33px; background:url('../image/top_frame/menu_break_hl.jpg'); background-repeat:no-repeat; background-color:#0001F1; border-top:solid 1px #CBCBCC;border-bottom:solid 1px #CBCBCC; line-height:33px; }
#menu_frame ul.menu_bar > li.firstchild:hover {background:url('../image/top_frame/menu_first_hl.jpg'); background-repeat:no-repeat; background-color:#0001F1;border:none; height:35px; line-height:35px;}
#menu_frame ul.menu_bar > li a {color:White; display:inline-block; min-width:60px; height:100%; text-align:center;padding-left:20px; padding-right:20px;}
#menu_frame span a:hover, #menu_frame ul li a:hover {border:none;}
#menu_frame span {float:right;line-height:35px;padding-right:20px; background:url('../image/top_frame/menu_right.jpg'); background-repeat:no-repeat; background-position:right; }
#menu_frame span a {color:#C0C0C0;}
#menu_frame span a:hover {color:#A19F9F;}


#menu_frame .product_main_dd .product_dropdown {position:absolute;left:116px; top:35px; float:none; background:none;}
#menu_frame .product_main_dd .product_dropdown a {text-align:left; color:White; height:34px; width:150px; padding-left:20px; padding-right:20px; line-height:34px;}
#menu_frame .product_main_dd .product_dropdown li {background-color:#0033FF; border-top:solid 1px #CBCBCC; float:none;text-align:left;}
#menu_frame .product_main_dd .product_dropdown li:hover {background-color:#01079F; border-top:solid 1px #020A76;}


#menu_frame .product_main_dd .product_dropdown {display:none;}
/*#menu_frame .product_main_dd:hover .product_dropdown {display:inline-block;}*/


#menu_frame .service_main_dd .service_dropdown {position:absolute;left:228px; top:35px; float:none; background:none;}
#menu_frame .service_main_dd .service_dropdown a {text-align:left; color:White; height:34px; width:210px; padding-left:20px; padding-right:20px; line-height:34px;}
#menu_frame .service_main_dd .service_dropdown li {background-color:#0033FF; border-top:solid 1px #CBCBCC; float:none;text-align:left;}
#menu_frame .service_main_dd .service_dropdown li:hover {background-color:#01079F; border-top:solid 1px #020A76;}

#menu_frame .service_main_dd .service_dropdown {display:none;}
/*#menu_frame .service_main_dd:hover .service_dropdown {display:inline-block;}*/


/*
Banner Section
*/

#banner_frame {margin-top:5px;width:990px; height:300px; background-image:url('../image/homepage/banner.jpg');}
#banner_frame {text-indent:-9999px; margin-bottom:5px;}


/* Holder Frame to holder View Recommendation and New Product */

.holder_frame {width:990px;display:block;}

/*
View Our Recommendation
*/

.view_recommendation_frame {width:640px; height:320px; position:relative; display:inline-block; float:left;}
.view_recommendation_frame > ul.header_bar {width:640px; height:35px; background-image:url(../image/top_frame/silver_bar_center.jpg); }
.view_recommendation_frame > ul.header_bar > li.firstchild {line-height:35px;padding-left:20px;background-image:url(../image/top_frame/silver_bar_left.jpg); background-repeat:no-repeat;float:left; color:#333333; }
.view_recommendation_frame > ul.header_bar > li.lastchild {line-height:35px;text-indent:-9999px;background-image:url(../image/top_frame/silver_bar_right.jpg); float:right; background-repeat:no-repeat; background-position:right top;}
.view_recommendation_frame > ul.item_list {width:638px; height:285px; border:solid 1px #CCCCCC;border-top:none}

.view_recommendation_frame > ul.item_list > li {height:33px; border:solid 1px #CCCCCC; border-left:none; border-top:none; padding-left:20px; line-height:33px; width:189px; color:#333333; }
.view_recommendation_frame > ul.item_list > li.firstchild {height:56px; line-height:56px; border-right:none;}

.view_recommendation_frame > ul.item_list > li > a {color:Black;width:189px; height:33px; background-image:url('../image/top_frame/right_arrow_grey_trans.png'); background-repeat:no-repeat; background-position:160px center; }
.view_recommendation_frame > ul.item_list > li > a:hover { border:none; background-color:White;}
.view_recommendation_frame > ul.item_list > li:hover {background-color:White; border-right:solid 1px white;}
.view_recommendation_frame > ul.item_list > li:hover > a {background-image:url('../image/top_frame/right_arrow_white_trans.png');}

.view_recommendation_frame > ul.item_list {background-image:url('../image/top_frame/silver_itemlist_bg.jpg'); background-repeat:no-repeat;}



.item_display {position:absolute; left:211px; top:35px; width:390px; min-height:265px; padding-top:15px; padding-left:20px; color:#1F1F1F; background-color:White; background-repeat:no-repeat; background-position:bottom right;}
.item_display h2 {font-size:16px;}
.item_display p {line-height:25px; margin-top:15px; text-align:justify; color:#333333;}
.item_display span {line-height:25px; margin-top:15px; text-align:left; display:block;}


.item_display > p > a, .item_display > span > a {border:none !important; display:inline-block !important; padding:0px !important; margin:0px !important; width:auto !important; height:auto !important; color:#0033ff !important;}
.item_display > p > a:hover, .item_display > span > a:hover { text-decoration:underline; border:none !important;}

/* Set View Recommendation display to none for effect */
.view_recommendation_frame > ul.item_list > li.item_checkout_counter div {display:none;}
.view_recommendation_frame > ul.item_list > li.item_shelving div {display:none; }
.view_recommendation_frame > ul.item_list > li.item_fixture div {display:none; }
.view_recommendation_frame > ul.item_list > li.item_trolley div {display:none; }
.view_recommendation_frame > ul.item_list > li.item_whr div {display:none; }
.view_recommendation_frame > ul.item_list > li.item_str div {display:none; }


/* Enable only when JQuery is not in place, and to use CSS standalone effect */
/*.view_recommendation_frame > ul.item_list > li.item_checkout_counter:hover div {display:block; }
.view_recommendation_frame > ul.item_list > li.item_shelving:hover div {display:block; }
.view_recommendation_frame > ul.item_list > li.item_fixture:hover div {display:block; }
.view_recommendation_frame > ul.item_list > li.item_trolley:hover div {display:block; }
.view_recommendation_frame > ul.item_list > li.item_whr:hover div {display:block; }
.view_recommendation_frame > ul.item_list > li.item_str:hover div {display:block; }*/


/* New Product */

.new_product_frame {width:340px; height:320px; position:relative; display:inline-block; padding-left:10px;}
.new_product_frame > ul.header_bar {width:340px; height:35px; background-image:url(../image/top_frame/silver_bar_center.jpg); }
.new_product_frame > ul.header_bar > li.firstchild {line-height:35px;padding-left:20px;background-image:url(../image/top_frame/silver_bar_left.jpg); background-repeat:no-repeat;float:left; color:#333333; }
.new_product_frame > ul.header_bar > li.lastchild {line-height:35px;text-indent:-9999px;background-image:url(../image/top_frame/silver_bar_right.jpg); float:right; background-repeat:no-repeat; background-position:right top;}

.new_product_frame > ul.item_list > li { width:338px; height:56px; border:solid 1px #CCCCCC; border-top:none;font-size:10px; display:block;}
.new_product_frame > ul.item_list > li > a { width:298px; height:36px; color:#333333; padding:20px; padding-top:10px; padding-bottom:10px;}
.new_product_frame > ul.item_list > li > a > h3, .new_product_frame > ul.item_list > li > a > h2 {display:inline-block; font-weight:bold;}
.new_product_frame > ul.item_list > li > a > h3 {padding-left:20px; color:#0033FF; float:right;}
.new_product_frame > ul.item_list > li > a > p {display:block; margin-top:5px;}


.new_product_frame > ul.item_list > li:hover {background-color:#F4F4F4;}
.new_product_frame > ul.item_list > li > a:hover {border:none;}

/* Footer Frame */

.footer_frame {width:990px; height:30px; background-color:Black;padding-top:5px; margin-top:10px;margin-bottom:5px; background-image:url('../image/top_frame/footer_top.jpg'); background-repeat:no-repeat; color:White;}
.footer_frame > ul {width:988px; height:29px; border:solid 1px #CCCCCC; border-top:none;}
.footer_frame > ul > li {float:left;padding-left:20px; padding-right:10px; line-height:29px;}
.footer_frame > ul > li.lastchild {float:right;}
.footer_frame > ul > li > a {color:White; padding-left:10px; padding-right:10px;}
.footer_frame > ul > li > a:hover {border:none; text-decoration:underline;}





/* Template 1 Frame, For About us, and Product Page */

#template1_frame {border:solid 1px #CCCCCC; width:988px; min-height:420px; display:block; background-image:url('../image/template1/content_bg.jpg');background-repeat:repeat-x; background-position:bottom; position:relative;} 
#template1_header {width:988px; height:100px;background-color:white; }
#template1_mainholder {background-image:url('../image/template1/frame_bg.gif'); padding-bottom:35px;}
#template1_breadcrumb {width:988px; height:33px; border-top:solid 1px #CCCCCC; border-bottom:solid 1px #CCCCCC; background-color:#F0F0F0;}
#template1_contentframe {display:inline-block; width:695px; min-height:428px; vertical-align:top; padding-left:20px; padding-right:20px;}
#template1_naviframe {display:inline-block; width:230px; min-height:428px;padding-top:35px; position:absolute; left:738px; top:150px; }



/* Set Template 1 Header format, H1 is the title, and ul for the print and email button */
#template1_header > h1 {font-size:30px; font-family:"Sans-Serif", Arial; padding-left:20px; display:inline-block; text-shadow: 3px 3px 3px #666;-moz-text-shadow: 3px 3px 3px #666;webkit-text-shadow:3px 3px 3px #666; margin-top:35px;}
#template1_header > ul {float:right;}
#template1_header > ul > li {float:left;padding-right:10px; margin-top:55px;}
#template1_header > ul > li > a.print_page, #template1_header > ul > li > a.email_to {text-indent:-9999px;width:108px; height:36px; background-image:url('../image/template1/email_icon.gif'); background-repeat:no-repeat;}
#template1_header > ul > li > a.print_page {background-image:url('../image/template1/print_icon.gif'); background-repeat:no-repeat; }
#template1_header > ul > li > a.print_page:hover {border:none;background-image:url('../image/template1/print_icon_sel.gif');}
#template1_header > ul > li > a.email_to:hover {border:none;background-image:url('../image/template1/email_icon_sel.gif');}
#template1_header > ul > li > a.print_page:active {border:none;background-image:url('../image/template1/print_icon_press.gif');}
#template1_header > ul > li > a.email_to:active {border:none;background-image:url('../image/template1/email_icon_press.gif');}


/* Set template 1 Breadcrumb information */
#template1_breadcrumb > ul {padding-left:20px; line-height:33px;}
#template1_breadcrumb > ul > li {float:left; padding-right:30px;padding-left:20px; font-size:10px; background-image:url('../image/template1/arrow_right.gif'); background-position:right center; background-repeat:no-repeat;}
#template1_breadcrumb > ul > li > a:hover {border:none; font-weight:bold;}
#template1_breadcrumb > ul > li.cc_location {font-weight:bold; color:#333333;background:none; }


/* Set template 1 Right Navigation information */
#template1_naviframe > ul {}
#template1_naviframe > ul > li {width:210px; height:45px; }
#template1_naviframe > ul > li > a {width:210px; height:45px; background-color:#333333; line-height:45px;padding-left:20px;color:White;}
#template1_naviframe > ul > li > a:hover {border:none;background-color:#A0A0A0;color:#333333;}
#template1_naviframe > ul > li > a.t1_nav_selected {width:210px; height:45px; background-color:white; line-height:45px;padding-left:20px;color:#333333;}
#template1_naviframe > ul > li > a.t1_nav_selected:hover {border:none;background-color:white;}


/* Set template 1 content information */
#template1_contentframe {}
#template1_contentframe h2 {font-size:16px; font-weight:bold; margin-top:35px;}
#template1_contentframe p { text-align:justify; line-height:25px; padding-top:20px;}
#template1_contentframe p b {font-size:13px;}
#template1_contentframe p u {font-size:13px; font-weight:bold;}
#template1_contentframe p a:hover {border:none; text-decoration:underline;}
#template1_contentframe ul {margin-top:20px;}
#template1_contentframe ul li {margin-top:10px;}
#template1_contentframe ul li a:hover {border:none; text-decoration:underline;}

#template1_contentframe blockquote {font-size:18px; font-weight:bold; font-family:Lucida Sans, Arial; font-style:italic; text-align:center; margin-top:55px; margin-bottom:55px; }
#template1_contentframe blockquote span {font-size:10px; font-weight:normal; font-family:Arial; font-style:normal; text-align:right;}

#template1_contentframe img.display_image_small {border:solid 2px #CCCCCC; width:684px; height:224px; display:block; margin-top:20px; background-repeat:no-repeat; background-position:center center; background-color:White;}
#template1_contentframe img.display_image {border:solid 2px #CCCCCC; width:684px; height:404px; display:block; margin-top:20px; background-repeat:no-repeat; background-position:center center; background-color:White;}
#template1_contentframe img.display_image_large {border:solid 2px #CCCCCC; width:684px; height:904px; display:block; margin-top:20px; background-repeat:no-repeat; background-position:center center; background-color:White;}

#template1_contentframe > div.sitemapBlock {display:inline-block; width:200px;padding-top:20px; text-align:left; line-height:25px; vertical-align:top;}
#template1_contentframe > div.sitemapBlock > a:hover {border:none; text-decoration:underline}
/* Set templaet 1 contact information picture sorting using unordered list*/

#template1_contentframe ul.picturelisting {text-align:center; }
#template1_contentframe ul.picturelisting li {width:160px; height:170px; text-align:center;float:left;margin:35px;}
#template1_contentframe ul.picturelisting li img { width:160px; height:100px;margin-bottom:30px;}
#template1_contentframe ul.picturelisting li a {display:block; width:160px; height:130px; position:relative;z-index:4000;}
#template1_contentframe ul.picturelisting li a:hover { text-decoration:none;}
#template1_contentframe ul.picturelisting span { z-index:4000;width:600px; height:400px; position:absolute;left:0px; top:-410px; border:solid 2px #CCCCCC; background-color:White; display:none; }
#template1_contentframe ul.picturelisting span > img {width:600px; height:400px; background-position:center center; background-repeat:no-repeat;}
#template1_contentframe ul.picturelisting span.firstchild {}
#template1_contentframe ul.picturelisting span.lastchild {left:-130px;}
#template1_contentframe ul.picturelisting li:hover span {display:block;}
/* Template 1 contact us forms */

#template1_contentframe div.contactus_form {}
#template1_contentframe div.contactus_form > h2 { display:block; background-color:Black; color:White; height:35px; width:670px; line-height:35px; padding-left:20px; }
#template1_contentframe div.contactus_form > ul {padding-left:20px;}
#template1_contentframe div.contactus_form > ul > li > label {width:120px; display:inline-block; font-weight:bold;}
#template1_contentframe div.contactus_form > ul > li > textarea, #template1_contentframe div.contactus_form > ul > li > input {height:30px; line-height:30px; border:dotted 1px #333333; font-family:Arial; width:300px; padding-left:20px; padding-right:20px;}
#template1_contentframe div.contactus_form > ul > li > textarea:focus, #template1_contentframe div.contactus_form > ul > li > input:focus {background-color:#C5CFFC; border:dotted 1px #0066FF;}
#template1_contentframe div.contactus_form > ul > li > textarea {height:150px; padding-top:10px;}
#template1_contentframe div.contactus_form > ul > li.textareafield > label {vertical-align:top; margin-top:10px;}
#template1_contentframe div.contactus_form > ul > li > a { text-indent:-9999px; width:108px; height:36px; background-image:url('../image/template1/submit_icon.gif'); margin-left:355px; background-repeat:no-repeat; background-position:right;}
#template1_contentframe div.contactus_form > ul > li > a:hover { border:none;background-image:url('../image/template1/submit_icon_sel.gif');}
#template1_contentframe div.contactus_form > ul > li > a:active {background-image:url('../image/template1/submit_icon_press.gif');}
#template1_contentframe div.contactus_form > ul > li > a title {width:100px; height:100px; background-color:White;}




/* Template 2 */