/* CSS RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font-family: Thonburi, "Lucida Grande", Arial, Tahoma, Sans-Serif; vertical-align: absmiddle;}
:focus {outline: 0;}
body {line-height: 1; color: black; background: white;}
ol, ul {list-style: none;}
table {border-collapse: separate; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;align:absmiddle;}
blockquote:before, blockquote:after,
q:before, q:after {content: "";}
blockquote, q {quotes: "" "";} 

*
{ margin: 0;
  padding: 0;
}
body,p,td,th,ul,li{ color: #777777; font-family: "Lucida Grande", Arial, Tahoma; font-size: 12px; line-height: 15px; }
body { background-color:#666666;}
a { color: #888888; text-decoration: none; }
a:hover { color: #333; }
a:active { color: #333; }

table { width:758px; height:100%; margin:auto;}

p {
margin: 4px 0 0 0;
}
#register {width:975px; height:100%;padding:5px;background-color:#ffffff;}
#container {width: 998px; margin: 0 auto; padding:0px 0px 5px 0px; background-color:#FFFFFF;}
#head {margin-bottom: 15px; }
#logo { height:77px; width:987px; padding-right:1px; background-image:url(../design/back-logo.jpg); padding:0px 5px; }
#piclogo { float:left; width:210px; height:77xp; padding-top:5px;}
#banner { width:975px; height:275px; padding:0px; background-image:url(../design/borderbanner.gif); background-repeat:no-repeat; margin-left:6px;}

#mdbhead { width:975px; height:24px; padding:0px; background-image:url(../design/tpmdb-head.png); background-repeat:no-repeat;margin:0 auto;}
#mdbfooter { width:975px; height:24px; padding:0px; background-image:url(../design/tpmdb-footer.png); background-repeat:no-repeat;margin:0 auto;}
#mdbbg { width:975px; height:100%; padding: 0px; background-image:url(../design/tpmdb-bg.png); background-repeat:repeat-y;margin:0 auto;color:#FFF;font-size:28px;}
#mdbbg-sub { width:935px; height:100%;padding:0px 50px 10px 40px;margin:0 auto;color:#FFF;font-size:13px;line-height:16px;}

#nav{margin-bottom:12px;}
.clearspace {clear:both;}
#mainbody {margin-top:5px; margin-left:5px;}
#lcol{ width:195px; float:left;}
.head-lcol { width:175px; background-image:url(../design/headbackbround.gif); margin:0px; height:17px; padding:5px 10px; color:#FFFFFF; font-size:14px;}
.head-lcol a{ color:#FFFFFF;}
.body-lcol { background-image:url(../design/bodybackground.gif); background-repeat:repeat-y; padding:0px 10px;}
.body-lcol ul { margin-left:25px; padding-top:15px; padding-bottom:15px; list-style:none;}
.body-lcol li{ padding-top:5px;}
.bottom-lcol {width:175px; background-image:url(../design/bottombackground.gif); height:5px; padding:0px 10px; margin-bottom:5px;}

#head-lcol { width:175px; background-image:url(../design/head-left-product-new.gif); height:16px; padding:5px 10px; color:#FFFFFF; font-size:14px;}
#head-lcol a{ color:#FFFFFF;}
#body-lcol { background-image:url(../design/back-left-product.jpg); height:339px; margin-bottom:5px; padding-top:5px;}
#body-lcol h1{margin-left:15px; margin-top:10px; color:#000000; font-size: large;}
#body-lcol ul { margin-left:35px; padding-top:5px; padding-bottom:15px; list-style: disc;}
#body-lcol li{ padding-top:5px;}

#lcol p { padding:0px 5px;; margin:0px 0px; font-size:12px;}
#rcol { float:left; width:778px; margin-left:10px;}
#rcol h1 {margin-top:15px; margin-bottom:15px; font-size:large;}
#rcol h2 {margin-left:20px; margin-top:20px;}
#rcol h2 a { color:#000000;}
#columfirst { margin-bottom:20px;}
#filedpic { width:280px;height:300px;float:left; text-align:center; }
#colum {}
#filedcontent {float:left; width:468px;}
#filedcontent ul { list-style: disc inside; padding-left:15px;}
#filedcontent h1 { padding-top:15px;}
#columtwo { width:300px; margin-bottom:20px;}
.productdetailtable { border:solid 1px #888888;}
.productdetailtable .left{padding:3px 10px;border-top:solid 1px #888888; border-right:solid 1px #888888;}
.productdetailtable .right{padding:3px 10px;border-top:solid 1px #888888;}
.picmobile-product{}
.picture { padding:5px 5px; width:185px; }
#footer { background-image:url(../design/bannerfooter.gif); width:965px; height:20px; padding:5px 10px; color:#fff; margin-left:5px; } 




/***************************************************************************************************************/


/*****************************************************************************/
#mainmenu { width: 500px; height:25px; float: right; margin-top:52px; padding-right:1px;}
#mainmenu #mainnav { margin:0; padding:0; }
#mainmenu #mainnav li { display: inline; }
#mainmenu #mainnav li a { float: left; height: 0px; padding-top: 25px; overflow: hidden; }
#mainmenu #mainnav li a { background-image:url(../design/menu_w.gif); background-repeat: no-repeat; }

#adminmainmenu { width: 394px; height:25px; float: right; margin-top:52px; color:#000000;}
#adminmainmenu #adminmainnav { margin:0; padding:0; }
#adminmainmenu #adminmainnav li { display: inline; padding:10px; margin:10px; font-size:16px;}
#adminmainmenu #adminmainnav li a { color:#000000;}




/* BUTTONS */
#mainmenu #mainnav li#m-1 a { width: 100px; background-position: 0px 0px; }
#mainmenu #mainnav li#m-2 a { width: 100px; background-position: -100px 0px; }
#mainmenu #mainnav li#m-3 a { width: 100px; background-position: -200px 0px; }
#mainmenu #mainnav li#m-4 a { width: 100px; background-position: -300px 0px; }
#mainmenu #mainnav li#m-5 a { width: 100px; background-position: -400px 0px; } 

/* OVER STATES */
#mainmenu #mainnav li#m-1 a:hover { width: 100px; background-position: 0px -25px; }
#mainmenu #mainnav li#m-2 a:hover { width: 100px; background-position: -100px -25px; }
#mainmenu #mainnav li#m-3 a:hover { width: 100px; background-position: -200px -25px; }
#mainmenu #mainnav li#m-4 a:hover { width: 100px; background-position: -300px -25px; }
#mainmenu #mainnav li#m-5 a:hover { width: 100px; background-position: -400px -25px; } 

#mainmenu #mainnav li#m-1 a:active { width: 100px; background-position: 0px -50px; }
#mainmenu #mainnav li#m-2 a:active { width: 100px; background-position: -100px -50px; }
#mainmenu #mainnav li#m-3 a:active { width: 100px; background-position: -200px -50px; }
#mainmenu #mainnav li#m-4 a:active { width: 100px; background-position: -300px -50px; }
#mainmenu #mainnav li#m-5 a:active { width: 100px; background-position: -400px -50px; } 

/* PRESSED STATES */
#mainmenu.m-1 #mainnav li#m-1 a { width: 100px; background-position: 0px -75px; }
#mainmenu.m-2 #mainnav li#m-2 a { width: 100px; background-position: -100px -75px; }
#mainmenu.m-3 #mainnav li#m-3 a { width: 100px; background-position: -200px -75px; }
#mainmenu.m-4 #mainnav li#m-4 a { width: 100px; background-position: -300px -75px; }
#mainmenu.m-5 #mainnav li#m-5 a { width: 100px; background-position: -400px -75px; } 


/* END MAIN MENUS */

#ccol { width:988px; }
#ccol .col { width: 325px; float: left;}
#ccol .colcenter { width: 325px; float: left; margin:0px 6px;}

#ccol .top { background-image:url(../design/head-index.jpg);background-repeat: no-repeat; height:21px; margin:0; padding: 4px 0px; color:#FFFFFF;}
#ccol .top a{color:#FFFFFF;}
#ccol .body { background-image:url(../design/body-index.jpg);background-repeat: no-repeat;  height: 135px;margin-top:0; }
#ccol .bottom { background-image:url(../design/bottom-index.gif);background-repeat: no-repeat; height: 4px; margin:0; padding: 0;}
.box { width:162px; height:130px; border:solid #cccccc 1px; float:left; }
.boxproductlist { height:150px; float:left; margin:2px 2px; padding-top:7px; text-align:center; border: 1px solid #CCCCCC; width:188px;}
.boxproductlist_pic { margin:10px 0px;; width:204px; text-align:center;}
.boxproductlist_text { float:left; width:194px; text-align:center;}
.text_ccolindex { width:220px; float:left; padding:5px 0px 0px 20px; color:#000000; font-size:15px;} 
#text_more
#ccol .body .between {  margin-left:5px;}
.colbox {  width:163px; float:left; height:123px; text-align:center; border-right:1px solid #ccc; border-top:1px solid #ccc; border-bottom: 1px solid #ccc;}
.colboxover { width:162px; padding-top:5px; float:left; height:125px; border:solid #cccccc 1px; float:left; margin-top:5px;}
#ccol .colbox_pic { width:165px; text-align:center; padding-top:10px;}
#ccol .colbox_text { width:165px; text-align:center; padding-top:5px;}
#ccol .colbox_pic .thumb { border:none; padding:0;}

img.thumb { border:1px solid #ccc; padding:7px; }
a:hover img.thumb { border:2px solid #666;}

#showcase { height:125px; background-color: #fefefe; margin-top:12px; margin-bottom:12px;  border-left: 1px solid #ccc;}
a.showcase { font-weight:bold; color:#999; }
a:hover.showcase { font-weight:bold; color:#666; }
.slide { float:left;}
.slidenext { float:right;}

ul.support { list-style-image:none; list-style-position:outside; list-style-type:none; margin-top: 10px; margin-bottom: 10px; }
ul.support li { padding-left:30px; }
.highlightpic{ padding-left:5px; float:left; width:120px; height:135px; text-align:center;}
.highlighttext{ padding-left:5px; padding-right:5px; float:right; width:190px; height:105px; color: #777777; font-family: "Lucida Grande", Arial, Tahoma; font-size: 12px; padding-top: 10px;}
.highlighttext p a {color: #3399CC;font-family: "Lucida Grande", Arial, Tahoma; font-size: 12px;}
.readmore { float:left; text-align:center; padding-left:5px; }
.readmore p a { color: #3399CC; font-size: 12px; }

#gallery {  }
#gallery #mainpic {  }
#gallery #gallery_navigation { display:none; }
#gallery a img.thumb { }
#gallery a:hover img.thumb {  }

#showcase {  }
#showcase #showcase-back { float:left; }
#showcase #showcase-next { float:right; }
#showcase #showcase-body { height:125px; overflow:hidden; position:relative; width:964px;  }
#showcase #showcase-body #showcase-box { position:absolute; width:4000px; }

.clear { clear:both; }

#breadCrumbsPanel { padding: 8px;}

#bottomPageProductPanel { padding:8px;}
