@charset "utf-8"; /* |********************************************************************************************************************* | CSS Layout (FILE : front-main.css) |********************************************************************************************************************* */ /* |-------------------------------------------------------------------------------------------- | Standard CSS |-------------------------------------------------------------------------------------------- */ img { border:0; } a:active { outline-style:none;} a:focus { outline-style:none;} /* On click hidden border line dotted Comment by jim */ ul { padding:0;margin:0;list-style:none;} h1,h2,h3,p { padding:0;margin:0;} label { cursor: pointer;} body { position:relative;margin:0px;font-family:Tahoma;font-size:13px;color:#888; width: 100%; background:url(../images/bg/bg-repeat.jpg) repeat-x; } /* |-------------------------------------------------------------------------------------------- | Main Layout |-------------------------------------------------------------------------------------------- */ #container { position: relative; width: 980px; margin: 0 auto;} #content { position: relative; float: right; width: 73%; height: auto; margin: 100px auto 70px; } #content h1 { margin:0; padding:0; text-align: left; color:#003d8d; font-size:24px; } #content h1.blue { color:#090033; font-size: 20px; } div.tab { position: relative; margin: 50px 0 0; padding: 0 10px; width: 100%; /*height: 700px;*/ background: url(../images/bg/bg-left.png) repeat-y -35px 0; } #member-page div.tab { height: 750px;} div.tab h2 { position: relative; line-height: 30px; margin: 0 -10px; width: 100%; height: 55px; text-align: left; font-size: 16px; font-family: Georgia, Verdana, Tahoma; color: #0097be; font-weight: normal; background: url(../images/bg/member-history.png) no-repeat 0 -15px; text-indent: 160px; } div.tab h2 span img { margin: 0 5px;} div.tab h2 span a { color:#0097be; text-indent: 20px; text-decoration: none;} div.tab h2 span a:hover { text-decoration: underline;} div.month { text-align: right; font-size:9px; color:#999; font-style:italic;} div.month h3 { position: relative; right: 30px;} /* |-------------------------------------------------------------------------------------------- | Section Header |-------------------------------------------------------------------------------------------- */ #header { position: absolute; float: left; left:0; width: 100%; height: 50px; top:0; } #header h1 { text-align: center; margin: 5px auto; text-indent: -9999px;} #logo { position: absolute; width: 268px; height: 318px; top:0; left:0; margin: 5px; text-align: center; background: url(../images/bg/logo.png) left top no-repeat; } /* |-------------------------------------------------------------------------------------------- | Change Laungage |-------------------------------------------------------------------------------------------- */ #language { position: absolute; right: 15px; width: auto; } #language img { position: relative; float: left; margin: 4px 5px 0 0; } /* |-------------------------------------------------------------------------------------------- | Section Footer |-------------------------------------------------------------------------------------------- */ #footer { position: relative; clear:both; width:100%; height: 80px; font-family: Verdana; color: #818181; font-size: 11px; margin:20px 0 0; z-index:2; } #footer p { position: relative; margin: 0 auto; top: 8px;} #footer a:link { color: #818181; text-decoration: none; font-size: 11px; font-family: Verdana;} #footer a:visited { color: #818181; text-decoration: none; font-size: 11px; font-family: Verdana;} #footer a:hover { color: #666; text-decoration: none; font-size: 11px; font-family: Verdana;} #footer a:active { color: #818181; text-decoration: none; font-size: 11px; font-family: Verdana;} #footer span { position: relative; font-size:8px; display: none; } #footer span a:link { color: #666; text-decoration: none; font-size: 8px; font-family: Verdana;} #footer span a:visited { color: #666; text-decoration: none; font-size: 8px; font-family: Verdana;} #footer span a:hover { color: #FFF; text-decoration: none; font-size: 8px; font-family: Verdana;} #footer span a:active { color: #666; text-decoration: none; font-size: 8px; font-family: Verdana;} #footer .footwrapper { position: relative; width: 980px; margin: 0 auto; } #footer .footer-top { position: relative; background: url(../images/bg/foot-bg-top.png) no-repeat top left; height: 68px; padding: 0 0 0 30px; } #footer .footer-top h3 { position: relative; float: left; margin: 45px 0 0 -22px; color: #028375; width: 700px; border-bottom: 1px solid #9a9166; } #footer .footer-bg { position: relative; background: url(../images/bg/foot-bg-repeat-y.png) repeat-y; height: 50px; } #footer .footer-bottom { position: relative; background: url(../images/bg/foot-bg-bottom.png) no-repeat top left; height:60px; } ul.menu-footer { list-style: none ;margin: 0 0 0 10px; padding :0; height: 30px; width: 700px ;border-bottom :1px solid #dddacc; } ul.menu-footer li, .support li { float: left ;margin: 0px; padding: 10px; } ul.support { position: relative; float: left; width: 300px; left: 270px; top: -10px; } #footer #foot-contact { position: absolute; width: 250px; height: 100px; right: 10px; top: 45px; } #footer #foot-contact p { color:#000; font-size: 12px; line-height: 16px; } #footer #foot-contact b { position: relative; float: left; width: 100%; font-weight: 14px; } /* |-------------------------------------------------------------------------------------------- | Section Menu |-------------------------------------------------------------------------------------------- */ #menu { position: absolute; width: 100%; margin: 70px auto 0px; height: 65px; left:0; z-index:90; } ul#topnav { position: relative; float: right; list-style: none; margin:0 10px 0 0; padding:0; } ul#topnav a { position: relative; float: left; color:#FFF; font-weight: bold; padding: 30px 0 0 0; text-align: center; text-decoration: none; font-size:12px; text-indent: 10px; } /*ul#topnav a:hover { position: relative; float: left; color:#ccc; } ul#topnav a:active { position: relative; float: left; color:#000; } ul#topnav a:visited { position: relative; float: left; color:#000; text-decoration: none; }*/ ul#topnav li { position: relative; float: left; margin:0; height: 65px; } /*EN*/ /*background*/ ul#topnav li.home-page a { background: url(../images/menu-tab/menu-tab_home.png) no-repeat 3px 3px ; width: 76px; height: 47px; color:#FFF; } ul#topnav li.about-page a { background: url(../images/menu-tab/menu-tab_about.png) no-repeat 0 3px ; width: 115px; height: 47px; color:#FFF; } ul#topnav li.product-page a { background: url(../images/menu-tab/menu-tab_product.png) no-repeat 0 3px; width: 129px; height: 47px; color:#FFF; } ul#topnav li.event-page a { background: url(../images/menu-tab/menu-tab_event.png) no-repeat 0 3px ; width: 98px; height: 47px; color:#FFF; } ul#topnav li.faq-page a { background: url(../images/menu-tab/menu-tab_faq.png) no-repeat 0 3px ; width: 52px; height: 47px; color:#FFF; } ul#topnav li.partner-page a { background: url(../images/menu-tab/menu-tab_partner.png) no-repeat 0 3px ; width: 93px; height: 47px; color:#FFF; } ul#topnav li.career-page a { background: url(../images/menu-tab/menu-tab_job.png) no-repeat 0 3px ; width: 59px; height: 47px; color:#FFF; } ul#topnav li.contact-page a { background: url(../images/menu-tab/menu-tab_contact.png) no-repeat 0 3px ; width: 81px; height: 47px; color:#FFF; } /*hover*/ ul#topnav li.home-page a:hover { background-position: 3px -68px; height: 47px; color:#ccc; } ul#topnav li.about-page a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.product-page a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.event-page a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.faq-page a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.partner-page a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.career-page a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.contact-page a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } /*Current page*/ #home-page li.home-page a.home { background-position: 3px -148px; height: 60px; color:#000; } #about-page li.about-page a.about { background-position: 0 -148px; height: 60px; color:#000; } body#product-page #menu li.product-page a.product { background-position: 0 -148px; height: 60px; color:#000; } #event-page li.event-page a.event { background-position: 0 -148px; height: 60px; color:#000; } #faq-page li.faq-page a.faq { background-position: 0 -148px; height: 60px; color:#000; } #partner-page li.partner-page a.partner { background-position: 0 -148px; height: 60px; color:#000; } #career-page li.career-page a.career { background-position: 0 -148px; height: 60px; color:#000; } #contact-page li.contact-page a.contact { background-position: 0 -148px; height: 60px; color:#000; } /*TH*/ /*background*/ ul#topnav li.home-page.thai a { background: url(../images/menu-tab/menu-tab_home.png) no-repeat 3px 3px ; width: 76px; height: 47px; color:#FFF; } ul#topnav li.about-page.thai a { background: url(../images/menu-tab/menu-tab_about.png) no-repeat 0 3px ; width: 90px; height: 47px; color:#FFF; } ul#topnav li.product-page.thai a { background: url(../images/menu-tab/menu-tab_product.png) no-repeat 0 3px; width: 124px; height: 47px; color:#FFF; } ul#topnav li.event-page.thai a { background: url(../images/menu-tab/menu-tab_event.png) no-repeat 0 3px ; width: 98px; height: 47px; color:#FFF; } ul#topnav li.faq-page.thai a { background: url(../images/menu-tab/menu-tab_faq.png) no-repeat 0 3px ; width: 60px; height: 47px; color:#FFF; } ul#topnav li.partner-page.thai a { background: url(../images/menu-tab/menu-tab_partner.png) no-repeat 0 3px ; width: 80px; height: 47px; color:#FFF; } ul#topnav li.career-page.thai a { background: url(../images/menu-tab/menu-tab_about.png) no-repeat 0 3px ; width: 95px; height: 47px; color:#FFF; } ul#topnav li.contact-page.thai a { background: url(../images/menu-tab/menu-tab_contact.png) no-repeat 0 3px ; width: 81px; height: 47px; color:#FFF; } /*hover*/ ul#topnav li.home-page.thai a:hover { background-position: 3px -68px; height: 47px; color:#ccc; } ul#topnav li.about-page.thai a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.product-page.thai a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.event-page.thai a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.faq-page.thai a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.partner-page.thai a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.career-page.thai a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } ul#topnav li.contact-page.thai a:hover { background-position: 0 -68px; height: 47px; color:#ccc; } /*Current page*/ #home-page li.home-page.thai a.home { background-position: 3px -148px; height: 60px; color:#000; } #about-page li.about-page.thai a.about { background-position: 0 -148px; height: 60px; color:#000; } body#product-page #menu li.product-chose.thai a.product { background-position: 0 -148px; height: 60px; color:#000; } #event-page li.event-page.thai a.event { background-position: 0 -148px; height: 60px; color:#000; } #faq-page li.faq-page.thai a.faq { background-position: 0 -148px; height: 60px; color:#000; } #partner-page li.partner-page.thai a.partner { background-position: 0 -148px; height: 60px; color:#000; } #career-page li.career-page.thai a.career { background-position: 0 -148px; height: 60px; color:#000; } #contact-page li.contact-page.thai a.contact { background-position: 0 -148px; height: 60px; color:#000; } /* |-------------------------------------------------------------------------------------------- | Top Product Menu |-------------------------------------------------------------------------------------------- */ #top-product { position: absolute; width: 270px; height: 30px; top: 310px; left:0; z-index:1; } #top-product img.top { position: relative; float: left; left: 25px; background: none; border: none;} #top-product img.all-product { position: relative; float: left; left: 0; top: 15px; } #top-product div.product-wrapper {position: relative; float: left; width: 100%; height: 140px;} #top-product ul { position: relative; width: 90%; height: 130px; top: 10px; left: 10px; border: 1px solid #CCC; overflow-x: hidden; overflow-y:scroll; } #top-product ul li { background: url(../images/bt/list-product.jpg) 0 7px no-repeat; text-indent: 22px; padding: 5px 0; } #top-product ul a { color:#333; text-decoration: none; } #top-product ul a:hover { color:#000; text-decoration: underline;} /* |-------------------------------------------------------------------------------------------- | News Menu |-------------------------------------------------------------------------------------------- */ #news { position: absolute; width: 270px; height: 380px; top: 555px; left:0; background:url(../images/bg/news.png) top left no-repeat; } #news ul { position: relative; width: 90%; height: auto; top: 40px; left: 20px; } #news ul li { position: relative; float: left; } #news ul li.date { color: #090033; font-size: 18px; background:url(../images/bt/list-news.png) 0 5px no-repeat; text-indent: 20px; width: 100%; } #news ul li.date a { color:#000; font-size:13px; font-weight:bold; text-decoration: none; } #news ul li.date a:hover { color:#000; font-size:13px; font-weight:bold; text-decoration: underline; } #news ul li.details { color: #000; width: 100%; } #news ul li.details p { text-align: left; color:#333; margin: 10px 0 5px;} #news img { position: relative; float: left; top: 50px; left: 2px; } #news span.more { float: right; margin-right:15px; clear: both;} #news span.more a { color:#F00; text-decoration: underline; } #news span.more a:hover { color:#F60; text-decoration: underline; } /* |-------------------------------------------------------------------------------------------- | Product list left inc Menu |-------------------------------------------------------------------------------------------- */ /*Section Left (Menu)*/ #menu-sub-product { position: absolute; width: 270px; height: 380px; top: 550px; /*top:930px;*/ left:0; } /*cat-wrap*/ .cat-wrap { position: relative; float: left; width: 90%; height:200px; margin: 10px; background: #e9f0f4; border: 2px solid #a1bbcd; } .cat-wrap h3 { position: relative; float: left; width: 100%; font-size:16px; color:#FFF; text-indent:10px; background:#486981; } .cat-wrap p { position: relative; float: left; width: 100%; height: 25px; font-size:12px; color:#FFF; text-indent:10px; background:#486981; } #menu-sub-product ul { position: relative; float: left; width: 100%; height: auto; left: 20px; margin: 10px 0 0; } #menu-sub-product ul li { position: relative; float: left; width: 85%; line-height: 25px; border-bottom: 1px dashed #fff; font-size: 11px; font-family: Tahoma, Verdana; padding: 3px 0; border-bottom:3px 0 #e7e7e7;} #menu-sub-product ul li a { width: 100%; } #menu-sub-product ul li a:link { position: relative; float: left; text-decoration: none; color: #9f9f9f; } #menu-sub-product ul li a:active { position: relative; float: left; text-decoration: none; color: #0097be; } #menu-sub-product ul li a:visited { position: relative; float: left; text-decoration: none; color: #0097be; } #menu-sub-product ul li a:hover { position: relative; float: left; text-decoration: none; color: #486981; background:url(../images/bt/arrow.gif) 180px 10px no-repeat; } #menu-sub-product ul li a img { position: relative; float: left; background: none; border: none; margin:0 5px 0 0; padding:0; } /*current gallery*/ #menu-sub-product ul li.showall { background: none;} #menu-sub-product ul li.current { background:url(../images/bt/arrow.gif) 190px 17px no-repeat; width: 95%; height: 35px; padding: 8px 0 0 10px; color: #396576; font-size: 14px; font-weight: bold; } /* |-------------------------------------------------------------------------------------------- | Member Status left |-------------------------------------------------------------------------------------------- */ #member-login { position: absolute; width: 230px; height: auto; top: 300px; left:10px; z-index:1; } /*#member-login img.top { position: relative; float: left; left: 25px; } #member-login img.all-product { position: relative; float: left; left: 0; top: 15px; } #member-login div.product-wrapper {position: relative; float: left; width: 100%; }*/ #member-login ul { position: relative; width: 90%; height: auto; top: 10px; left: 10px; border: 1px solid #CCC; } #member-login ul li { background: url(../images/bt/list-product.jpg) 0 7px no-repeat; text-indent: 22px; padding: 5px 0; } #member-login ul a { color:#333; text-decoration: none; } #member-login ul a:hover { color:#000; text-decoration: underline; background:#FF0;} /* |-------------------------------------------------------------------------------------------- | Fieldset, Legend, Form |-------------------------------------------------------------------------------------------- */ form { position: relative; float: left; width: 100%; } fieldset { position: relative; margin: 0; width:75%; height: auto; clear:both; background:#fffadf; border: 1px solid #FBE47E; } fieldset legend { position: relative; float: left; font-size: 15px; font-family: Georgia, Tahoma; color: #0097be; font-weight: bold; z-index:1; background: none; } form fieldset { position: relative; float: left; width: 100%; } /* 1 Row */ form fieldset label, form fieldset div { position: relative; float: left; width: 100%; margin: 5px 0; height: auto; text-align: right; cursor: pointer; } /*form fieldset div#change { }*/ /* Left ( Text etc. ) */ form fieldset label span, form fieldset div span { position: relative; float: left; width: 30%; margin: 0; text-align: right; } /* Right ( Input, Select etc. )*/ form fieldset label input { position: relative; float: left; width: auto; margin: 0 5px; height: 14px; padding: 5px; font-family: Tahoma; } form fieldset label textarea { position: relative; float: left; width: auto; height: auto; margin: 0 5px; padding: 5px; font-family: Tahoma; font-size: 13px; color: #444; overflow: auto; } form fieldset label select { position: relative; float: left; width: auto; margin: 0 5px; padding: 5px; font-family: Tahoma; } form fieldset div label { position: relative; float: left; width: auto; margin: 0; } form fieldset div label input, form fieldset div label select { position: relative; float: left; width: auto; margin: 0; font-family: Tahoma; padding: 5px; margin: 0 5px; color: #444; cursor: pointer; outline: none; } form fieldset div label span { position: relative; float: left; width: auto; margin: 0 5px 0 0; } form fieldset label span#rule { position: relative; float: left; width: 100%; margin:0; line-height: 20px; background: #444; border: 1px solid #999; height: 200px; text-align: left; padding: 5px; color: #999; overflow: auto; } #label-file input { position: relative; float: left; height: 25px; } /* Require field */ form fieldset em { position: relative; float: left; top: 0px; width: auto; font-style:normal; font-size: 13px; color: #C00; } form fieldset label em strong { position: relative; top:-2px; color: #888; font-weight: normal; } #label-remember-pass em { position: relative; margin: 1px 0 0 0; font-size: 11px; } /* Button Submit */ form fieldset label a { position: relative; float: left; margin:5px 5px 0; color: #0097be; text-decoration: none; font-size: 11px; } form fieldset label a:visited { position: relative; float: left; margin:5px 5px 0; color: #0097be; text-decoration: none; } form fieldset label a:hover { position: relative; float: left; color: #000; text-decoration: underline; } form fieldset label a img { position: relative; float: left; margin: 0 5px 0 0; text-decoration: none; } form fieldset#old-user { background:none; border: none;} #label-capsha { position: relative; float: left; width: 100%; clear:both; } #label-capsha img { position: relative; float: left; width: auto; border: 1px solid #ccc; } /* |-------------------------------------------------------------------------------------------- | Section Option |-------------------------------------------------------------------------------------------- */ #search { position: absolute; top: 230px; left:43px; width: 200px; text-align: center; z-index: 3; height: 16px; } .search-input { position: relative; float: left; width: 220px; margin:0; } .search-input input { position: relative; float: left; width: 120px; font-family: Tahoma; font-size: 12px; color: #0567bd; border: none; height: 16px; background:none; padding: 5px 5px 0; margin:0;} .search-input input.submit { position: relative; float: right; display: block; width: 70px; } #search span { position: relative; float: left; } /* #search a:link { position: relative; float: right; margin: 7px 8px 3px auto; text-decoration: none; color: #000; } #search a:visited { position: relative; float: right; margin: 7px 8px 3px auto; text-decoration: none; color: #000; } #search a:active { position: relative; float: right; margin: 7px 8px 3px auto; text-decoration: none; color: #000; } #search a:hover { position: relative; float: right; margin: 7px 8px 3px auto; text-decoration: underline; color: #0097be; }*/ #navigation { position: absolute; left: 0; margin: 3px; top: 175px; width: 99%; font-size: 11px; color: #555; z-index:2; display: none; } #navigation a:link { text-decoration: underline; color: #555; } #navigation a:visited { text-decoration: underline; color: #555; } #navigation a:active { text-decoration: underline; color: #555; } #navigation a:hover { text-decoration: none; color: #0097be; } #counter { position: absolute; width: auto; height: 25px; font-size: 11px; right: 10px; top: 130px; text-align: center; z-index:2; } /*.page-no { position: absolute; width: 220px; margin: 0 auto; top:2px; right:2px; }*/ .page-no ul li { position: relative; float: left; margin: 5px; } .page-no ul li a:link { position: relative; width: auto; height: 29px; color:#444; border: 1px solid; border-color: #ebebeb #c9c9c9 #c9c9c9 #ebebeb; background: url(../images/bt/bg-bt-page.png) repeat-x left bottom;font-size: 9px; padding: 3px 7px; } .page-no ul li a:visited{ position: relative; width: auto; height: 29px; color:#444; border: 1px solid; border-color: #ebebeb #c9c9c9 #c9c9c9 #ebebeb; background: url(../images/bt/bg-bt-page.png) repeat-x left bottom;font-size: 9px; padding: 3px 7px; } .page-no ul li a:hover { position: relative; width: auto; height: 29px; color:#809aae; border: 1px solid; border-color: #d7e5ef #809aae #809aae #d7e5ef; background: url(../images/bt/bg-bt-page.png) repeat-x left bottom;font-size: 9px; padding: 3px 7px; } .feature { position: absolute; width: auto; height: auto; top:20px; right:20px; font-size: 10px; font-family: Tahoma, Verdana; color: #444; margin: 2px;} .feature a { text-decoration: none; color: #444; } .feature a:hover { text-decoration: underline; color: #0097be; } .feature .view { position: relative; margin: 0 2px; display: inline; } .feature .comment { position: relative; margin: 0 2px; display: inline; } .feature .date { position: relative; margin: 0 2px; display: inline; } .tag { position: absolute; width: auto; height: auto; bottom:0; left:0; margin: 3px 0; } .tag h3 { position: relative; float: left; margin: 0 5px 0 0; font-size: 11px; color: #0097be; } .tag a { position: relative; float: left; font-size: 10px; color: #333; margin: 0 5px 0 0; text-decoration: underline; } .tag a:hover { text-decoration: none; color: #0097be; } #subscribe { position: absolute; width: 210px; top: 253px; left: 30px; margin: 10px; text-decoration: none; z-index:2; height: 16px; } #subscribe input { position: relative; float: left; width: 125px; font-family: Tahoma; font-size: 12px; color: #d16300; border: none; height: 16px; background:none; padding: 5px 5px 0; margin:0;} #subscribe input.submit { position: relative; float: left; width: 65px;} #subscribe img { position: absolute; right:0; display: block; } /* |-------------------------------------------------------------------------------------------- | Index Page |-------------------------------------------------------------------------------------------- */ div#index-gallery { position: relative; width: 100%; height: 250px; margin: 0 0 0 5px; /*background: url(../images/bg/index/gallery-slide-show.png) no-repeat center top;*/ } #home-page #navigation { display: none; } #brief { position: relative; float: left;} /* IE7 */ *:first-child+html #brief { position: relative; float: left; width: 715px; top:50px; height:120px;} *:first-child+html #home-page .col-3 { position: relative; float: left; width:715px; left:0;} /* IE7 */ *:first-child+html #home-page .col-3 h2 { position: relative; float: left; left:-250px; right:0; width: 200px; top:100px; margin:0; padding:0; height:10px;} /* CSS jQuery Sliding Menu ( Categories Gallery ) - 09-02-2010 */ #ct-gallery { position: absolute; height: auto; width: 120px; margin: auto; z-index:9; cursor: pointer; top:60px; right: 40px; } #ct-gallery img { position: absolute; margin: 1px 0 0 0; padding: 0 80px 0 0; z-index:1; } #ct-gallery h3 { position: absolute; left: 30px; top:3px; font-size: 11px; color: #0097be; } #ct-gallery h3:hover { position: absolute; font-size: 11px; color: #000; text-decoration: underline; } #ct-gallery ul li { padding:0; margin:0; list-style:none;} .ct-gallery_class { border:none ; } .the_ct-gallery { position: relative; top: 22px; display:none; width: auto; border: 1px dotted #222; margin:0; } .the_ct-gallery li { background: #111; border-bottom: 1px dotted #222; } .the_ct-gallery li a { position: relative; left: 5px; color:#0097be; text-decoration: none; line-height: 20px; font-size: 11px; } .the_ct-gallery li a:hover { position: relative; left: 5px; color:#FFF; line-height: 20px; text-decoration: none;} div.index-title { position: absolute; top: 200px; z-index: 30; width:100%; height: 170px; background: url(../images/bg/menu-title.png) no-repeat; left:0; } /* |-------------------------------------------------------------------------------------------- | About Page |-------------------------------------------------------------------------------------------- */ div.about-menu { position: absolute; top: 200px; z-index: 30; width:100%; } div.about-menu ul { position: relative; float: left; width: 100%; display:inline; background: url(../images/launages/en/tab.png) no-repeat; } div.about-menu li { position: relative; float: left; color:#000; font-size:18px; width: 100%; height: 90px; margin:0; padding:0; } div.about-menu li span { position: absolute; margin: 40px 0 0 70px; } div.about-menu li a { color: #ccc; text-decoration: none; } div.about-menu li a:hover { color: #000; text-decoration: underline; } div.about-menu li.ceo-talk { background-position: 240px 0; width: 260px; } div.about-menu li.history { background-position: 0 0; width: 190px; } div.about-menu li.history span { margin: 40px 0 0 35px; } div.about-menu li.partner-talk { background-position: 430px 0; width: 250px; } div.about-menu li.partner-talk span {margin: 40px 0 0 50px; } body div.history { height: 500px;} #about-page div.right { padding:20px 0 0 5px; border-left: 1px dotted #818181; text-align: left; font-size:10px; line-height: 15px;} /* |-------------------------------------------------------------------------------------------- | Blog Page |-------------------------------------------------------------------------------------------- */ div.blog { position: relative; width: 100%; height: auto; margin: 5px auto; line-height: 25px; } .blog-feature { position: relative; float: right; margin: 10px; width: auto; } .blog-feature a { position: relative; float: left; width: auto; margin:0 5px; color: #0097be; text-decoration: none; font-size: 11px; } .blog-feature a:hover { position: relative; float: left; color: #000; text-decoration: underline; } .blog-feature a img { position: relative; float: left; margin: 3px 5px 0 0;} .blog-feature em { position: relative; float: left; top:0; font-style: normal; font-size: 11px; color: #0097be; right:10px; } .blog-feature em img { position: relative; float: left; left:0; top:0; margin:3px 0 0; width: 15px; height: 15px; border:none; background:none; } .blog-feature em span { position: relative; float: left; margin: 0 0 0 10px;} .blog-feature .feature { position: relative; float: left; top:0; left:0; margin:0; right:0; } /* One Colum */ .col-1 { position: relative; float: left; width: 100%; height: auto; margin: 10px auto; } .col-1 h2 { position: relative; float: left; clear: right; width: 100%; height:25px; text-align: left; font-size: 18px; font-family: Georgia, Verdana, Tahoma; color: #0097be; font-weight: normal; margin: 10px auto 10px;} .col-1 h2 a { color: #0097be; text-decoration: none; } .col-1 h2 a:hover { color: #FFF; text-decoration: underline; } .col-1 p { position: relative; float: left; width: auto; text-indent: 30px; text-align: justify; padding: 10px 20px 30px; line-height: 20px;} .col-1 p img { position: relative; float: left; margin: 5px 10px 2px 5px; } .col-1 div.view-sample { position: relative; float: left; width: 100%; } div.code { position: relative; float: left; width: 95%; background: url(../tutorial/images/code_lines.png) repeat-y scroll 0 -3px #F9F9FA; padding:0 14px 0 35px; } div.code pre { position: relative; float: left; width: 90%; color: #000; font-size: 11px; line-height: 16px; } /* Two Colum */ .col-2 { position: relative; float: left; width: 100%; height: auto; margin: 10px auto; } .col-2 h2 { position: relative; clear: right; width: 95%; height:25px; text-align: left; font-size: 18px; font-family: Georgia, Verdana, Tahoma; color: #0097be; font-weight: normal; border-bottom: 1px dashed #0097be; margin: 0 auto 10px; } .col-2 h2 a { color: #0097be; text-decoration: none; } .col-2 h2 a:hover { color: #000; text-decoration: underline; } .col-2 div.left { position: relative; float: left; width: 70%; height: auto; margin: 1px; line-height: 25px; } .col-2 div.left h2 { position: relative; float: left; margin: 10px 0 0;} .col-2 div.left h4 { position: relative; float: left; text-indent: 10px; color:#333; font-weight:bold;} .col-2 div.left p { position: relative; float: left; width: auto; text-indent: 30px; text-align: justify; padding: 10px 20px 30px; line-height: 20px; } .col-2 div.left p img { position: relative; float: left; margin: 5px 10px 5px 5px; border: 5px solid #000; background: #999; } .col-2 div.right { position: relative; float: left; width: 28%; height: auto; margin: 1px; line-height: 25px; } .col-2 div.right img { position: relative; float: left; margin: 15px 0 0 ;} .col-2 div.right p { position: relative; float: left; width: auto; text-indent: 30px; text-align: justify; padding: 10px 20px 30px; line-height: 20px; } .col-2 div.right p img { position: relative; float: left; width: 200px; height: 150px; margin: 5px 10px 2px 5px; border: 5px solid #000; background: #999; } /* Three Colum */ .col-3 { position: relative; float: left; width: 100%; height: auto; margin: 10px auto; } .col-3 h2 { position: relative; clear: right; width: 95%; height:25px; text-align: left; font-size: 14px; font-family: Tahoma, Georgia, Verdana; color: #000258; font-weight: normal; margin:0 0 10px 0; text-indent: 20px; } .col-3 h2 a { color: #000258; text-decoration: none; } .col-3 h2 a:hover { color: #000; text-decoration: underline; } .col-3 span.thumnails { position: relative; float: left; width: 100%; padding: 0 0 10px 30px; background:url(../images/thumnails/bg-thum.png) 15px 0 no-repeat;} .col-3 img { position: relative; float: left; margin: 0 auto; } .col-3 img.read-more { position: relative; float: right; } .col-3 div.left { position: relative; float: left; width: 33%; height: auto; margin: 1px; line-height: 25px;} .col-3 div.left p { position: relative; float: left; width: auto; height: 130px; text-indent: 30px; text-align: justify; padding: 10px 20px 30px; margin: 20px 0 0 0; line-height: 20px; } .col-3 div.left p img { position: relative; float: left; margin: 5px 10px 2px 5px; } .col-3 div.middle { position: relative; float: left; width: 33%; height: auto; margin: 1px; line-height: 25px;} .col-3 div.middle p { position: relative; float: left; width: auto; height: 130px; text-indent: 30px; text-align: justify; padding: 10px 20px 30px; margin: 20px 0 0 0;line-height: 20px; } .col-3 div.middle p img { position: relative; float: left; margin: 5px 10px 2px 5px; } .col-3 div.right { position: relative; float: left; width: 33%; height: auto; margin: 1px; line-height: 25px;} .col-3 div.right p { position: relative; float: left; width: auto; height: 130px; text-indent: 30px; text-align: justify; padding: 10px 20px 30px; margin: 20px 0 0 0;line-height: 20px; } .col-3 div.right p img { position: relative; float: left; margin: 5px 10px 2px 5px; } /* CSS jQuery Sliding Menu ( Categories Story ) - 03-03-2010 */ #ct-story { position: absolute; height: auto; width: 120px; margin: auto; z-index:9; cursor: pointer; top:10px; right:10px; } #ct-story img { position: absolute; margin: 1px 0 0 0; padding: 0 80px 0 0; z-index:1; } #ct-story h3 { position: absolute; left: 30px; top:3px; font-size: 11px; color: #0097be; } #ct-story h3:hover { position: absolute; font-size: 11px; color: #FFF; text-decoration: underline; } #ct-storyy ul li { padding:0; margin:0; list-style:none;} .ct-story_class { border:none ; } .the_ct-story { position: relative; top: 22px; display:none; width: auto; border: 1px dotted #222; margin:0; } .the_ct-story li { background: #111; border-bottom: 1px dotted #222; } .the_ct-story li a { position: relative; left: 5px; color:#0097be; text-decoration: none; line-height: 20px; font-size: 11px; } .the_ct-story li a:hover{ position: relative; left: 5px; color:#FFF; line-height: 20px; text-decoration: none;} div#story-comment { position: relative; float: left; width: 100%; height: auto; margin: 10px 0 10px; border-top: 1px dashed #0097be; background:none;} div#story-comment h2 { font-family: Georgia,Verdana,Tahoma; font-size: 18px; font-weight: normal; } /* |-------------------------------------------------------------------------------------------- | Product Page |-------------------------------------------------------------------------------------------- */ #product-page .page-no { position: relative; float:right; height:50px; right:40px; text-align: center; width:94%; } div.product { position: relative; float: left; width: 100%; height: auto; margin: 30px 0 50px 15px; } /*Section Right (Product)*/ div.product-list { position: relative; float: left; height: auto; width: 100%; margin: 10px 0 0 0; border: none; background:none; } div.product-list ul { position: relative; float: left; width: 100%; margin:0; padding:0; list-style:none; } div.product-list ul li { position: relative; float: left; width: 100%; /*margin:5px 3px;*/ padding: 2px; left:0; top:0; } div.product-list div { position: relative; float: left; width: 93%; height:40px; top:0; padding:0; margin:0; border-bottom: 1px dotted #e7f3fd; border-left: 1px dotted #e7f3fd; border-right: 1px dotted #e7f3fd;} div.product-list div div.img-wrap { position: relative; float: left; margin: 10px 45px; width: 110px; height: 110px; border: none; display:none; } div.product-list div div.img-wrap img { position: relative; float: left; /*clear: both;*/ } /*product-head*/ div.product-list ul li.product-head { position: relative; float: left; border: 1px solid #eee; width: 93%; height: 22px; background:url(../images/bg/product-header.jpg) repeat-x;} li.product-head h2 { position: relative; float: left; width: 40%; border-right:1px solid #e4e4e4; font-size: 15px; font-weight: normal; text-align: center; margin: 2px 0 0 ; } li.product-head p { position: relative; float: left; width: 28%; border-right:1px solid #e4e4e4; font-size: 15px; font-weight: normal; text-align: center; margin: 2px 0 0 ; } li.product-head p.type { width: 10%;} div.product-list div h2 { position: relative; float: left; text-indent:5px; width: 40%; text-align: left; font-size: 14px; margin: 8px 0 0 5px; } div.product-list div h2 a { color: #000; text-decoration: none; } div.product-list div h2 a:hover { color: #363636; text-decoration: underline; } div.product-list div p { position: relative; margin: 8px 0 0 5px; width: 25%; overflow: hidden; text-align: center; font-size: 11px; line-height: 18px; } div.product-list div p.product-type { width: 10%; } div.product-list div span { position: absolute; right:5px; bottom: 55px; margin:0; width: 40%; text-align: right; font-size: 14px; color: #0097be; font-family: Georgia, Verdana; display:none; } div.product-list div a { position: relative; z-index:1;} div.product-list div a.bt-cart { position: absolute; right:3px; bottom:3px; border: none; background: url(../images/bt/product-bt.png) -95px 3px no-repeat; width: 98px; height:35px; z-index:1; } div.product-list div a.bt-cart:hover { background-position: -95px -32px; } div.product-list div a.bt-cart:active { background-position: -95px -67px; } div.product-list div a.bt-view { position: absolute; right:110px; bottom:3px; border: none; background: url(../images/bt/product-bt.png) 3px 3px no-repeat; width: 98px; height:35px; z-index:1; } div.product-list div a.bt-view:hover { background-position: 3px -32px; } div.product-list div a.bt-view:active { background-position: 3px -67px; } div.product-list div span.new { position: absolute; width:40px; height:38px; top:0; right:0; left:auto; background: url(../images/bg/promotion50x50.png) top center no-repeat; z-index:2; } /*product chose page*/ body#product-chose .product { height: 400px;} div.product-chose-title { position: absolute; top: 200px; z-index: 30; width:100%; height: 170px; background:url(../images/bg/product-chose.png) no-repeat; left:0; } div.product-list ul.product-chose { position: relative; float: left; } div.product-list ul li.chose { position: relative; float: left; width: 690px; height: 200px; text-align: center; display: block; } div.product-list ul li.chose a { position: relative; float: left; width: 690px; height: 200px; display: block; text-indent: -9999px;} a#materials { background:url(../images/bt/materials.jpg) 0 0 no-repeat;} a#materials:hover { background:url(../images/bt/materials-hover.jpg) no-repeat; cursor:pointer;} a#chemical { background:url(../images/bt/chemical.jpg) 0 0 no-repeat;} a#chemical:hover { background:url(../images/bt/chemical-hover.jpg) no-repeat; cursor:pointer;} a#api { background:url(../images/bt/api.jpg) 0 0 no-repeat;} a#api:hover { background:url(../images/bt/api-hover.jpg) no-repeat; cursor:pointer;} /*product TAB*/ div.chemical-tab { background:url(../images/bg/chemical-tab.png) 0 0 no-repeat; width: 676px; height: 85px; display: block;} div.cosmetic-tab { background:url(../images/bg/materials-tab.png) 0 0 no-repeat; width: 676px; height: 85px; display: block;} div.api-tab { background:url(../images/bg/api-tabs.png) 0 0 no-repeat; width: 676px; height: 85px; display: block; } div.type-des { width: 100%; clear:both; height:150px;} /*#member-login { position: relative; float: left; width: 20%; height: auto; margin: 0px 1px; top: -5px; }*/ /* |-------------------------------------------------------------------------------------------- | Product Each Page |-------------------------------------------------------------------------------------------- */ /*Section Right (Product)*/ div.product-each { position: relative; float: right; width: 98%; height: auto; margin:0; border: none; background:none; } div.product-each div.content { position: relative; float: right; width: 100%; height: auto; border:none; background:none; } div.product-each div h2 { position: relative; width: 100%; line-height: 30px; color: #0097be; margin: 0; text-align: left; font-size: 18px; font-family: Georgia, Tahoma; font-weight: normal; border-bottom: 1px dotted #0097be; } div.product-each div p { position: relative; margin: 10px 0; width: 95%; text-align: justify; line-height: 22px; text-indent: 30px; } div.product-each div p strong { color: #0097be; } div.product-each div p a { text-decoration: underline; color: #0097be; } div.product-each div p a:hover { text-decoration: none; color: #888; } div.product-each div.button { position: relative; width:100%; height:20px; } div.product-each .content form fieldset ul li { margin:3px; line-height: 18px; } div.product-each .content form fieldset { font-size: 11px; } div.product-each .content form fieldset legend { font-size: 11px; font-weight: bold; } div.product-each .content form fieldset span { position: relative; float: left; width: 80%; margin:0; text-align: left; } div.product-each .content form fieldset span strong { font-weight:normal; color: #C00; } /* Feature Price */ fieldset#feature-system span.price { position: absolute; right:0; bottom:0; padding:0; color: #C00; bottom:0; width:100px; height:auto; z-index:2; background: none; text-shadow: 0px 1px 0px #000;} div.product-each div.button ul li img { display: inline; width:26px; height:18px; } div.product-each div.button .clearfix { visibility: hidden; } div.product-each div.button .clearfix .show { visibility: visible; } div.product-each a img { position: relative; float: left; border: none; margin:0 5px 0 0; background: none; padding:0; } div.product-each div a.bt { position: relative; float: right; margin:0 0 0 10px; border: none; font-size: 11px; text-align: right; color: #0097be; text-decoration: none; } div.product-each div a.bt:hover { color: #000; text-decoration: underline; } /* Feature Image Product */ span.img { position: relative; float: right; margin:5px 20px 10px; text-indent:0px; } span.img img { position: relative; float: right; margin:0; border:none; background: none; } span.price { position: absolute; right:0; bottom:0; font-size: 20px; color: #250000; font-family: Georgia;padding: 0 10px; height:26px; background:url(../images/bg/bg-price.png) repeat-x; text-shadow: 0px 1px 0px #e04141; } span.new { position: absolute; left:0; bottom:0; width:73px; height:69px; background: url(../images/bg/promotion.png) top center no-repeat; z-index:2;} /* Recently Product */ div#product-recently { position: relative; float: left; width: 100%; height: auto; margin: 20px 0; background:none; } div#product-recently ul { position: relative; float: left; margin:0; padding:0; width: 100%; list-style:none; } div#product-recently ul li { position: relative; float: left; line-height: 25px; width: 100px; height: 130px; border-bottom: 1px dotted #333; margin:5px 10px 0 0; font-size: 13px; font-family:Georgia,Verdana,Tahoma; text-align: center; } div#product-recently ul li a:link { position: relative; float: left; text-decoration: none; color: #0097be; } div#product-recently ul li a:active { position: relative; float: left; text-decoration: none; color: #0097be; } div#product-recently ul li a:visited { position: relative; float: left; text-decoration: none; color: #0097be; } div#product-recently ul li a:hover { position: relative; float: left; text-decoration: underline; color: #FFF; } div#product-recently ul li a img { position: relative; float: left; background: none; border: none; margin:0; padding:0; } /* Relate Product */ div#product-related { position: relative; float: left; width: 100%; height: auto; margin: 20px 0; background:none; } div#product-related ul { position: relative; float: left; margin:0 10px; padding:0; width: 30%; list-style:none; } div#product-related ul li { position: relative; float: left; line-height: 25px; width: 250px; height: 60px; border-bottom: 1px dotted #333; margin: 1px; font-size: 14px; font-family:Georgia,Verdana,Tahoma; text-align: left; } div#product-related ul li a:link { position: relative; float: left; text-decoration: none; color: #0097be; } div#product-related ul li a:active { position: relative; float: left; text-decoration: none; color: #0097be; } div#product-related ul li a:visited { position: relative; float: left; text-decoration: none; color: #0097be; } div#product-related ul li a:hover { position: relative; float: left; text-decoration: underline; color: #FFF; } div#product-related ul li a img { position: relative; float: left; background: none; border: none; margin:3px; padding:0; } div#product-related ul li a span { position: relative; float: right; clear:none; width: 75%; margin:0; padding:0; color: #888; font-size: 11px; font-family: Tahoma, Verdana; line-height: 15px; text-indent:0px; } /*#product-page .col-1 { position: relative; float: left; height:850px;}*/ #product-page-item .product-wrapper { top:-20px;} #product-page-item #top-product img.all-product {top:-10px;} /* |-------------------------------------------------------------------------------------------- | Product Add to Cart Page |-------------------------------------------------------------------------------------------- */ div.add-cart { position: relative; width: 100%; height: 800px; margin: 30px auto; } body.checkout-shopping div.add-cart { height:auto;} div.add-cart div.content { position: relative; float: left; width: 98%; height: auto; margin:10px 0 0 10px; border: none; background:none; } div.add-cart div.content a { color:#09F; text-decoration: underline; } div.add-cart div.content a:hover { color:#06F; text-decoration: underline; } div.add-cart div.content h2 { position: relative; line-height: 30px; margin: 0; width: 100%; height: 55px; text-align: left; font-size: 18px; font-family: Georgia, Verdana, Tahoma; color: #0097be; font-weight: normal; background:url(../images/bg/shipping-header.png) no-repeat -40px 0; } div.add-cart div.content p { position: relative; clear: both; margin: 0; width: 100%; text-align: left; font-size: 11px; line-height: 22px; text-indent: 30px; color: #999; } div.add-cart div.content p strong { color: #0097be; } div.add-cart div.content p a { text-decoration: underline; color: #0097be; } div.add-cart div.content p a:hover { text-decoration: none; color: #888; } div.add-cart div.content table { position: relative; float: left; width: 100%; margin: 10px auto; font-family: Tahoma; font-size: 11px; color: #0097be; text-align: center; background: #fffcf6; border:1px solid #c7c7c7; } div.add-cart div.content table th { background: #6D8293; color:#fff; font-family:arial,sans-serif; font-size:14px; font-weight: normal; border:1px solid #FFFFFF; padding:10px 5px;} div.add-cart div.content table th.product { width:60%;text-align: left; } div.add-cart div.content table th.product-type { font-size:10px; text-align: left; font-weight: bold; text-indent:20px; padding: 3px;} div.add-cart div.content table th#image { width:15%;} div.add-cart div.content table th#price { width:10%;} div.add-cart div.content table th#quantity { width:10%;} div.add-cart div.content table th#subtotal { width:15%;} div.add-cart div.content table th#remove { width: 5%;} div.add-cart div.content table td { text-align: center; font-family: Tahoma; font-size: 13px; color: #555; font-weight: normal; border: 1px solid #eee;} div.add-cart div.content table td.product { text-align: left; padding: 5px 10px; } div.add-cart div.content table td a { font-family: Georgia, Tahoma; font-size: 16px; color: #000; text-decoration:none; padding: 0 0 0 10px; } div.add-cart div.content table td a:hover { font-family: Georgia, Tahoma; font-size: 16px; color: #000; text-decoration: underline; } div.add-cart div.content table td input { text-align: center; font-family: Tahoma; font-size: 13px; color: #555; width: 20px; } div.add-cart div.content table tr#total td { text-align: center; font-family: Tahoma; font-size: 12px; font-weight:bold; border:none; padding:5px 0; } /* Choose Payment Type */ div.add-cart div.payment { position: relative; float: left; width: 100%; height: auto; border-top: 1px dotted #0097be; clear: both; } div.add-cart div.payment fieldset { position: relative; float: left; width: 46%; margin: 10px 10px 10px 0; } div.add-cart div.payment label { position: relative; float: right; margin: 10px auto; color: #0097be; } div.add-cart div.payment input { position: relative; float: right; } /*div.add-cart div.payment div.logo { position: absolute; }*/ div.add-cart div.payment img { margin: 0 5px 0 0; } #discount-code { position: relative; width: auto; height: auto; clear: both; } #discount-code span { width: 78%; } div#bt { position: relative; float: left; width: 100%; height: 30px; } div#bt a { position: relative; float: right; margin:10px 0 0 10px; color: #0097be; text-decoration: none; font-size: 11px; } div#bt a:hover { position: relative;/* margin:10px 0 0 10px;*/ color: #000; text-decoration: none; } div#bt a img { position: relative; float: left; margin: 0 3px 0 0;} /* Step Purchase */ div#step-purchase { position: absolute; width: auto; height: auto; top: 175px; right:0; } div#step-purchase ul { position: relative; float: left; margin:0; padding:0; width: 100%; list-style:none; } div#step-purchase ul li { position: relative; float: left; width: 50px; margin: 3px 0px 3px 3px; border: 1px dotted #222; font-size: 11px; font-family: Tahoma; text-align: center; } div#step-purchase ul li img { position: relative; background: none; border: none; margin:3px; padding:0; clear: both; } div.buy-note { position: relative; float: left; width: 80%; margin: 20px; color:#666; font-size: 12px;} div.buy-note a { color:#333;} div.payment-choose { position: relative; width: 95%; clear:both; margin: 10px 0 0 20px; } div.payment-choose p { font-weight: bold; color:#000;} div.payment-choose ul { margin: 10px 0 0 20px; } div.payment-choose ul li { list-style:none; padding: 10px 0; } div.payment-choose ul li a { color:#333;} /* Bank Transfer Page */ .input-bank { padding-top: 25px; padding-left: 15px; position: absolute; top: 112px; right: 186px; } .img-bank { position: relative; float: right; right:0; top:0; } .span-bank { position: relative; float: left; width: 50%; line-height: 25px; } /*bt*/ a.login-bt { width:64px; height:22px; background:url(../images/bt/bt-login.png);} a.login-bt:hover { background:url(../images/bt/bt-login-hover.png);} a.pass-bt { width:64px; height:22px; background:url(../images/bt/bt-forget.png);} a.pass-bt:hover { background:url(../images/bt/bt-forget-hover.png);} /*shipping page*/ .address-send fieldset { background: url(../images/bg/bg-left.png) repeat-y -30px 0; border:none; } .address-send .title { background: url(../images/bg/bg-left.png) repeat-y -30px 0; color:#888; padding: 20px 0 0;} .address-send .subTitle { background: url(../images/bg/bg-left.png) repeat-y -30px 0; padding: 20px 0 0;} .add-cart .content .address-send form #bt { float: left; width: 80%; } /*payment page*/ .payment { position: relative; margin: 50px 0 0; width: 80%; height: 900px; background: url(../images/bg/bg-left.png) repeat-y -35px 0; } .payment h2 { position: relative; line-height: 30px; margin: 0; width: 100%; height: 55px; text-align: left; font-size: 18px; font-family: Georgia, Verdana, Tahoma; color: #0097be; font-weight: normal; background:url(../images/bg/shipping-header.png) no-repeat -40px 0; } .payment div.content { position: relative; float: left; width: 98%; height: auto; margin:10px 0 0 10px; border: none; background:none; } .payment .content #TFB { position: relative; float: left; width: 100%; } .payment form { float: left; width: 684px; background: none; } .payment form fieldset { background: none; border: none; } .payment div.pay-wrap { float: left; width: 235px; height: 196px; background:url(../images/bg/payment-fram.png) no-repeat; } /*.payment form div.pay-wrap legend { position: relative; float: left; width: 235px; height: 196px; background:url(../images/bg/payment-fram.png) no-repeat; clear: none; }*/ .payment form div.pay-wrap img { margin: 21px; border: none; } .payment form p { float: left; margin: 0 0 0 10px; text-indent: 20; } .payment form label { background:url(../images/bt/select-input.png) no-repeat; width:180px; height: 45px; position: absolute; right: 0px; top: 100px; padding-top: 15px; padding-left:40px } .payment form label input { float: left; width: 20%; top: 15px; margin:0; } .payment form label span { position: relative; float: left; width: 75%; color: #000; font-size: 14px; font-weight: bold; top: 10px; text-align: left;} .checkout_detail{ position: relative; width: 600px; } .checkout_detail_right{ width: 300px; position: absolute; height: 100px; left: 240px; top: 30px } /*bank payment page*/ .payment-bank { position: relative; margin: 50px 0 0; padding: 0 20px; width: 90%; height: 650px; background: url(../images/bg/bg-left.png) repeat-y -35px 0; } .payment-bank h2 { position: relative; line-height: 30px; margin: 0 -12px; width: 100%; height: 55px; text-align: left; font-size: 18px; font-family: Georgia, Verdana, Tahoma; color: #0097be; font-weight: normal; background:url(../images/bg/shipping-header.png) no-repeat -40px -15px; text-indent: 10px; } .payment-bank div.verify { position: relative; margin: 0 auto; text-align: center;} .payment-bank a { color:#333; text-decoration: underline; } .payment-bank a:hover { color:#000;} span.grey_bold { font-size: 14px; font-weight: bold;} span.red_bold { font-weight: bold; color:#000;} /* |-------------------------------------------------------------------------------------------- | Step Payment |-------------------------------------------------------------------------------------------- */ /* Step 1 */ .step1 li#step1 { background: #09F; color: #FFF; border: 1px solid #FFF; } /* Step 2 */ .step2 li#step1, .step2 li#step2 { background: #09F; color: #FFF; border: 1px solid #FFF; } /* Step 3 */ .step3 li#step1, .step3 li#step2, .step3 li#step3 { background: #09F; color: #FFF; border: 1px solid #FFF; } /* |-------------------------------------------------------------------------------------------- | Pay Buy Credit Card Page |-------------------------------------------------------------------------------------------- */ label#label-amount em { border: none; background: none; color: #09F; border-bottom: 1px dotted #09F; padding:0; margin: 3px 3px 0 5px; } /* |-------------------------------------------------------------------------------------------- | Product Check Out Page |-------------------------------------------------------------------------------------------- */ .checkout { position: relative; float: right; width: 79%; height: auto; margin:0; border: none; background:none; } .checkout p { position: relative; clear: both; margin: 0; width: 100%; text-align: left; line-height: 22px; text-indent: 30px; color: #999; } .checkout p a { text-decoration: underline; color: #0097be; } .checkout p a:hover { text-decoration: none; color: #000; } .checkout h2 { position: relative; line-height: 30px; margin: 0; width: 100%; text-align: left; font-size: 18px; font-family: Georgia, Tahoma; color: #0097be; font-weight: normal; border-bottom: 1px dotted #222; } .checkout h3 { font-family: Georgia, Verdana, Tahoma; font-size: 18px; color: #0097be; font-weight: normal; } .checkout h3 strong { font-family: Georgia, Verdana, Tahoma; font-size: 18px; color: #000; font-weight: normal; } div.address-send { position: relative; float: left; width: 95%; background:url(../images/bg/border-left.png) 0 -30px no-repeat; padding:0 0 0 10px; } div.address-send form { position: relative; float: left; width: 60%;} #note { position: relative; float: right; width: 30%;} #note p { width: 98%; text-indent:0; font-size: 11px; color:#999; line-height: 20px; } #note ul { width: 98%; text-indent:0; font-size: 11px; color:#999; line-height: 20px; } /* |-------------------------------------------------------------------------------------------- | Delivery Address Page |-------------------------------------------------------------------------------------------- */ .deliver { position: relative; float: right; width: 79%; height: auto; margin:0; border: none; background:none; } .deliver p { position: relative; clear: both; margin: 0; width: 100%; text-align: left; line-height: 22px; text-indent: 30px; color: #999; } .deliver p strong { color: #0097be; font-size: 11px; } .deliver p a { text-decoration: underline; color: #0097be; } .deliver p a:hover { text-decoration: none; color: #000; } .deliver h2 { position: relative; line-height: 30px; margin: 0; width: 100%; text-align: left; font-size: 18px; font-family: Georgia, Tahoma; color: #0097be; font-weight: normal; border-bottom: 1px dotted #222; } .deliver h3 { font-family: Georgia, Verdana, Tahoma; font-size: 18px; color: #0097be; font-weight: normal; } .deliver h3 strong { font-family: Georgia, Verdana, Tahoma; font-size: 18px; color: #000; font-weight: normal; } /* |-------------------------------------------------------------------------------------------- | Guestbook Page |-------------------------------------------------------------------------------------------- */ .guestbook { position: relative; width: 100%; height: auto; margin: 5px auto; } .guestbook fieldset { position: relative; margin: 0 auto; float: left; width: 100%; } .guestbook fieldset legend { font-size: 13px; } .guestbook fieldset label#label-massage { width: 50%; position:absolute; float: right; top:0; right:0; } #comment-massage { position: relative; float: left; width: 100%; height: auto; } /* Comment Massage */ #comment-massage li { position: relative; float: left; margin: 0 auto; width: 100%; height: auto; } #comment-massage li h3 { position: relative; float: left; width: 100%; font-size: 13px; font-family: Tahoma; font-weight: normal; margin: 10px 0; border-bottom: 1px dotted #333; color: #0097be; } #comment-massage li img { position: relative; float: left; margin: 0 20px 0 0; padding:0; background:none; border:none;} #comment-massage li p img.point { position: absolute; top: 5px; left: -13px; } #comment-massage li p { position: relative; float: left; clear:none; width: 85%; margin: 0 0 0 3px; line-height: 23px; text-indent: 5px; border: 1px solid #444; background: #222; padding: 10px; text-align: justify;} /* Button Comment Massage */ #comment-massage span.button { position: relative; float: right; margin: 5px; width: 445px; height: 20px; } #comment-massage span.button a { position: relative; float: right; color: #900; font-size:11px; text-decoration: none; margin: 0 0 0 10px; } #comment-massage span.button a:hover { position: relative; float: right; color: #000; text-decoration: underline; } #comment-massage span.button a.reply { position: relative; float: right; color: #090; font-size:11px; text-decoration: none; margin: 0 0 0 10px; } #comment-massage span.button a.reply:hover { position: relative; float: right; color: #FFF; text-decoration: underline; } #comment-massage span.button a img { position: relative; float: left; margin:0 3px 0 0; } #comment-massage span.button span.time { position: relative; float: right; width: auto; margin: 0 10px 0 0; color: #555; font-size:11px; text-decoration: none; } #comment-massage span.button span.date { position: relative; float: right; width: auto; margin: 0 10px 0 0; color: #555; font-size:11px; text-decoration: none; } #comment-massage span.button span.ip { position: relative; float: right; width: auto; margin: 0 10px 0 0; color: #555; font-size:11px; text-decoration: none; } /* Reply Massage */ #comment-massage div.reply { position: relative; float: right; width: 92%; margin:0;} #comment-massage div.reply h3 { position: relative; float: left; width: 100%; font-size: 13px; font-family: Tahoma; font-weight: normal; margin:5px 0 10px; border-bottom: 1px dotted #333; color: #0097be; } #comment-massage div.reply img { position: relative; float: left; margin: 0 20px 0 0; padding:0; background:none; border:none;} #comment-massage div.reply p img.point { position: absolute; top: 5px; left: -13px; } #comment-massage div.reply p { position: relative; float: left; clear:none; width: 84%; margin: 0 0 0 3px; font-size: 13px; color: #888; line-height: 23px; text-indent: 5px; border: 1px solid #444; background: #222; padding: 10px;} #comment-massage div.reply span.button { position: relative; float: right; right:0; width: 445px; height: 20px; } /* |-------------------------------------------------------------------------------------------- | Faqs Page |-------------------------------------------------------------------------------------------- */ div.thumnails-img { position: relative; float: left; width: 20%; margin:0 0 0 10px; } div.faq-title { position: absolute; top: 200px; width:100%; height: 170px; background: url(../images/bg/faq-title.png) no-repeat; left:0; } body#faq-page h2.active { text-indent: 20px;} body#faq-page div.toggle_container span { margin: 0 20px;} /* |-------------------------------------------------------------------------------------------- | POLICY Page |-------------------------------------------------------------------------------------------- */ /*#about-page div.content-text { position: relative; float: left; width: 600px;} div.policy { position: relative; float: left; width: 693px;} div.policy h3 { position: relative; float: left; width: 693px; } div.policy ul { position: relative; float: left; width: 550px; } div.policy li { position: relative; float: left; text-indent: 50px; } #about-page #content h1.gmp { position: relative; float: left; margin: 30px 0 0 20px;}*/ p.policy-img { margin: 50px 0 0;} p.policy-click { height:80px; font-weight: bold;} div.gmp-title { position: absolute; top: 200px; width:100%; height: 170px; background: url(../images/bg/gmp.png) no-repeat; left:0; } /* IE7 */ *:first-child+html #about-page h2.content-head { position: relative; float: left; clear: both; font-family:Tahoma, Geneva, sans-serif; } /* |-------------------------------------------------------------------------------------------- | Contact Us Page |-------------------------------------------------------------------------------------------- */ #contact-page #content { margin: 100px auto 0;} div#contact { position: relative; width: 90%; height: auto; margin: 5px auto; } div#contact-detail { position: relative; float: left; width: 49%; height: auto; } #contact-form { position: relative; float: left; width: 50%; } #contact-form fieldset { background: none; border: none;} div#contact-detail img { position: relative; float: left; width: auto; height: auto; margin:0px 5px 5px 0px; } div#contact-detail p { position: relative; float: left; width: 70%; height: auto; margin: 5px 0 0 0; } ul.popup-contact { position: relative; width: 100px; height: 20px; margin: 3px auto; text-align: center; } #contact-page #navigation { display: none; } #contact-form form { position: relative; float: left; width:90%; height: auto; margin:0; padding: 15px 20px; } #contact-form form span { position: relative; float: left; width: 30%; } #contact-form label { position: relative; float: left; width: 100%; margin: 2px auto; text-align: right; clear:both; } #contact-form input { position: relative; float: left; width: 180px; height: 14px; padding: 5px; font-size: 13px; font-family: Tahoma; color: #444; text-align: left; } #contact-form textarea { width: 180px;} #contact-form label a { margin: 5px 0 0 20px;} h2.contact-head { background:url(../images/bg/contact-header.png) 0 0 no-repeat; text-indent: -9999px; position: relative; float: left; width: 693px; height:29px; margin: 30px 0 0 10px; display: block;} h2.content-head { background:url(../images/bg/header-label.png) 0 0 no-repeat; text-indent: 10px; position: relative; float: left; width: 693px; height:29px; margin: 30px 0 0 10px; display: block; color:#FFF; font-size:16px; font-weight: bold; line-height:30px;} h2.footer-map { background: url(../images/bg/contact-map.png) 0 0 no-repeat; text-indent: -9999px; position: relative; float: left; width: 693px; height:29px; margin: 30px 0 0 10px; display: block; clear:both;} div.content-text { position: relative; float: left; width: 91%; margin: 0 10px; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; padding:20px; } span.contact-foot { position: relative; float: left; margin: 0 10px; background: url(../images/bg/contact-foot.png) 0 0 no-repeat; width:693px; height:24px; display: block;} .success ul {position: relative; float: left; width: 100%;} .success ul li {position: relative; float: left; width: 100%; margin: 5px 0;} span.margin10px {position: relative; float: left; clear:both; text-indent: 20px;} span.margin30px {position: relative; float: left; clear:both; text-indent: 50px;} .success a { color:#333;} div.contact-page { position: relative; float: left; margin: 30px 0 0; width: 100%;} div#contact-detail img { position: relative; float: left; width: auto; height: auto; margin:0px 5px 5px 0px; } div#contact-detail p { position: relative; float: left; width: 70%; height: auto; margin: 5px 0 0 0; padding: 0 0 0 8px; clear:both; text-align: left; text-indent:0; } div#contact-detail p.title { color:#000; font-weight: bold; margin: 10px 0 0 0; padding: 5px 0 0; background:url(../images/bg/thumnails_label.png) no-repeat; height: 30px; text-indent: 20px; } div#contact-detail span.strong { font-weight: bold; color:#333; } div#contact-detail a { color:#333; text-decoration:underline; } div#contact-detail a:hover { color:#6ed8ff; text-decoration:none; } /* Contact Post Page */ #contact-post { position:relative;margin:0;font-family:Tahoma;font-size:13px;color:#FFF; width:399px; height:399px; background:none;} #contact-post form { position: relative; margin: 0 auto; border: none; color: #FFF; } #contact-post label { position: relative; float: left; width: 400px; margin: 2px auto; text-align: center; } #contact-post input { position: relative; float: left; width: 250px; height: 14px; padding: 5px; font-size: 13px; font-family: Tahoma; color: #444; text-align: center; left: 75px; } #contact-post a { position: relative; float: left; margin: 20px auto 0; width: 400px; height: 20px; text-align: center; color: #FFF; text-decoration: none; } #contact-post a:visited { color: #000; text-decoration: none; } #contact-post a:hover { color: #000; text-decoration: underline; } /*graphic-map*/ #graphic-maps { position: relative; float: left; width: 100%; } #graphic-maps img { position: relative; float: left; width: 65%; } #graphic-maps #travel { position: relative; float: right; width: 30%; } #graphic-maps #travel h4 { position: relative; float: left; width: 100%; height: auto; font-size: 14px; color:#F90; } #graphic-maps #travel ul { position: relative; float: left; width: 100%; } /*google-map*/ #google-maps { position: relative; float:left; margin: 20px 0 0 5px; width: 622px; height: 350px; border: 5px solid #ededed; } #google-maps iframe { position: relative; margin: 0 auto; width: 100%; height: 350px;} #google-maps small { position: absolute; width: 100.5%; height: 15px; bottom:0; left:0; z-index:2; background: #FFF; padding: 10px 0;} #google-maps small a { color: #000; font-size: 11px; margin: 5px 10px; } #google-maps small a:visited{ color: #000; } #google-maps small a:hover { color: #09F; } /* |-------------------------------------------------------------------------------------------- | Service Page |-------------------------------------------------------------------------------------------- */ div.service { position: relative; margin: 5px auto; width: 100%; height: auto; } /* |-------------------------------------------------------------------------------------------- | Search Page |-------------------------------------------------------------------------------------------- */ div.search { height:850px;} #search-page { position: relative; height: 120px;} h2.search-head { background: url(../images/bg/header-label.png) 0 0 no-repeat; color:#FFF; line-height:30px; text-indent: 10px; position: relative; float: left; width: 693px; height:29px; margin: 30px 0 0 10px; display: block;} div.search-text { position: relative; float: left; width: 91%; margin: 0 10px; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; padding:20px; } div#search-detail { position: relative; float: left; width: 49%; height: auto; } span.search-foot { position: relative; float: left; margin: 0 10px; background: url(../images/bg/contact-foot.png) 0 0 no-repeat; width:693px; height:24px; display: block;} /* |-------------------------------------------------------------------------------------------- | Register Page |-------------------------------------------------------------------------------------------- */ div.register-choose { position: relative; float: left; width: 100%; height: 600px; } div.register-choose p { position: relative; float: left; width: 100%; top:250px; margin:0 auto; text-align: center; cursor: pointer;} div.register-choose a { font-size: 36px; color:#09F; text-decoration: none; } div.register-choose a:hover { font-size: 36px; color:#09F; text-decoration: underline; } div.permission { position: relative; float: left; width: 48%; top: 70px; margin: 0 0 0 20px; height: 350px; background:url(../images/bt/signature.png) no-repeat; } div.no-permission { position: relative; float: left; width: 48%; top: 70px; height: 350px; background: url(../images/bt/member-normal.png) no-repeat; } div.people { position: relative; float: left; width: 48%; top: 70px; margin: 0 0 0 20px; height: 350px; background: url(../images/bt/member-alone.png) no-repeat; } div.organizer { position: relative; float: left; width: 48%; top: 70px; height: 350px; background: url(../images/bt/member-organize.png) no-repeat; } #register { position: relative; margin: 35px 0 0 8px; width: 95%; height: auto; } #register fieldset.name { position: relative; float: left; margin: 0; border: 1px dotted #fbe47e; width:100%; height: auto; clear:both; } #register fieldset.user { position: relative; float: left; margin: 0; border: 1px dotted #fbe47e; width:100%; height: auto; clear:both; } #register fieldset.address { position: relative; float: left; margin: 0; border: 1px dotted #fbe47e; width:100%; height: auto; clear:both; } /*#register fieldset.profile { position: relative; float: left; margin: 10px auto; border: 1px dotted #fbe47e; width:100%; height: auto; clear:both; } */ #register fieldset.license { position: relative; float: left; margin: 0; border: 1px dotted #fbe47e; width:100%; height: auto; clear:both; } form fieldset label input.upfile{ position:relative; font-family:Tahoma; height:25px; width:300px; margin:5px; padding:5px; } #register fieldset.agree { position: relative; float: left; margin: 0; border: 1px dotted #fbe47e; width:100%; height: 330px; clear:both; } #register label { position: relative; float: left; width: 100%; clear: both; /*height: 30px;*/ } #register label span { position: relative; float: left; width: 30%; text-align: right; font: normal; color:#000; font-size: 13px; } #register label span.red { color:#F00; width: 100%; text-align: center; } label#label-pass { position: relative; float: left; width: 100%; clear: both; height: 30px; } #register label span#rule { position: relative; float: left; width: 90%; margin:0 0 0 25px; line-height: 20px; background: #fffef8; border: 1px solid #fbe47e; height: 200px; text-align: left; padding: 5px; color: #999; overflow: auto; } #register label span input { position: relative; float: left; width: 70%; } #label-birthday .dob { display: inline; clear:none; width:auto; left: 115px; } span#change { position: relative; float: left; width: 100%; clear: both; height: auto; } /*#forget-post { position: relative; float: left; width: 100%; margin: 20px 0 0 0; text-align: center; }*/ #register form .agree #label-agree { position: relative; float: left; clear: both; width:100%; height: 30px; } /*sex form*/ #label-gender { position: relative; float: left; width: 100%; height: 30px; } #label-gender .sex-select { position: relative; float: left; width: 30%; text-align: right; color:#000; } #label-gender .girl { position: relative; float: left; width: 20px; } #label-gender .female { position: relative; float: left; width: 45px; text-align: left; color:#000; } /*date of birth*/ #label-birthday { position: relative; width: 100%; height: auto; clear: both; } #label-birthday span.dob { position: relative; float: left; width: auto; height:auto; color:#000; } #register label a { color:#666; text-decoration: none; } #register label a:hover { color:#0CF; text-decoration: none; } div.title { position:relative; float: left; width:663px; font-family:Arial,sans-serif; font-size:17px; margin:0; padding:0; text-indent: 15px; color:#5D5D5D;background-color:#F8E89D; } #career-page form fieldset div { position:relative; float: left; width: 645px;} div.title span { position:relative; float: left; margin:0; } div.subTitle { position:relative; float: left; width:100%; margin:0;padding:0; text-indent: 15px; font-size:17px; font-family:Arial,sans-serif; } div.subTitle span { position:relative; float: left; margin:0; } .normalText { font-family:Arial;font-size:small;color:#f00;position:relative; float:left; margin:0;} /* |-------------------------------------------------------------------------------------------- | Partner Page |-------------------------------------------------------------------------------------------- */ div.partner-label { position: absolute; left:0; right:0; top: 200px; z-index: 30; width:100%; height: 170px; background: url(../images/bg/partner-label.png) no-repeat; } div.partner-page { position: relative; float: left; margin: 30px 0 0; width: 100%;} div.partner-page h1 { color:#39F; font-size:18px; } #content .col-1 .partner-page .partner { position: relative; float: left; width: 100%; } #content .col-1 .partner-page .partner li { position: relative; float: left; width: 100%; margin: 15px 10px 5px; display:inline; } div.partner-top { position: relative; float: left; width: 100%; } div.partner-top h3 { position: relative; float: left; width: 693px; height:29px; line-height:27px; text-indent: 10px; color:#06F; font-size: 16px; background: url(../images/bg/header-label.png) 0 0;} div.partner-top h3 a { color:#FFF; text-decoration:none;} div.partner-top h3:hover a { color:#000; text-decoration:underline;} div.partner-middle { position: relative; float: left; width: 690px; border: 1px solid #ccc; } div.partner-logo { position: relative; float: left; width: 20%; height: 120px; } div.partner-logo img { width: auto; height: auto; margin: 20px; } div.partner-des { position: relative; float: right; width: 70%;} div.partner-des p { position: relative; float: right; width: 80%; padding: 10px; text-align: justify; margin: 10px 20px 0 0; height:150px; } /*div.partner-bottom { position: relative; float: left; width: 100%; border-bottom:}*/ /* |-------------------------------------------------------------------------------------------- | Job Page |-------------------------------------------------------------------------------------------- */ #careers { position: relative; float: left; margin: 0 0 0 20px; width: 90%; height: auto; } div.job-menu { position: absolute; top: 200px; z-index: 30; width:100%; height: 170px; background: url(../images/bg/career-menu.png) no-repeat; } #career-page div.jobdetails { height:550px;} /*div.job-menu ul { position: relative; float: left; width: 100%; display:inline; background: url(../images/launages/en/tab.png) no-repeat; }*/ /*#careers .col-1 { height: 550px;}*/ #career-page .col-2 { margin: 30px 0 0; height: 560px; } #careers p { border: none; padding:0; } ul.job-detail { position: relative; float: left; width: 100%; border: 1px solid #ccc; text-indent:10px; } ul.job-detail li { padding: 10px 0 5px;} /*text wrapper*/ div.qualification-wrap { position: relative; float: left; width: 90%; } div.qualification-wrap p { position: relative; float: left; width: 90%; text-indent: 0; border: none; } ul.job-detail span.blue { color: #0081C6; font-weight: bold; } ul.job-detail li.qualification { position: relative; float: left; width: 100%; margin: 0 0 0 50px; border:none; } li.qualification qualification-wrap { position: relative; float: left; width: 100%; height: auto; } .job-detail .apply-job { position: relative; float: left; width: 100%; height: 50px; } ul.related { position: relative; float: left; width: 100%; margin: 30px 0; background:#0CF; } /* |-------------------------------------------------------------------------------------------- | Show Categories Page |-------------------------------------------------------------------------------------------- */ div.show-ct { position: relative; width: 100%; height: auto; margin: 5px auto; } .show-ct div.box { position: relative; float: left; left:0; top:0; width: 99%; height: 140px; margin: 5px; border-bottom: 1px dotted #222; } .show-ct div.box h2 { position: relative; float: left; left:140px; width: 85%; margin: 3px 0 0 0; font-family: Georgia, Tahome, Verdana; font-size: 16px; font-weight: normal; border-bottom: 1px dashed #0097be; } .show-ct div.box h2 a { position: relative; float: left; left:0; top:0; margin: 0 5px 5px 0; color: #0097be; text-decoration: none; } .show-ct div.box h2 a:hover { position: relative; float: left; color: #000; text-decoration: underline; } .show-ct div.box img { position: absolute; left:0; width: 120px; height: auto; margin: 5px 10px 5px 0; border: 5px solid #000; background: #999; } .show-ct div.box em { position: absolute; left:140px; top:40px; width: auto; font-size: 11px; font-style: normal; line-height: 12px; } .show-ct div.box em img { position: relative; float: left; left:0; top:0; margin:0; width: 15px; height: 15px; border:none; background:none; } .show-ct div.box em span { position: relative; float: left; margin:0 0 0 5px; } .show-ct div.box p { position: absolute; left:140px; top:60px; height: auto; line-height: 20px; color: #888; text-shadow: 0 2px 0 #000; } .show-ct .feature { top: 30px; right:0; } .show-ct .tag { position: absolute; left: 140px; } /* |-------------------------------------------------------------------------------------------- | Webboard Page |-------------------------------------------------------------------------------------------- */ div.board { position: relative; width: 100%; height: auto; margin: 5px auto; } .board .option { position: relative; float: left; left:0; top:0; width: 99%; margin: 5px; border-bottom: 1px dotted #0097be; } .board .option .add-topic {} .board .option .add-topic a { position: relative; float: left; width: auto; margin:0 5px 0 0; color: #0097be; text-decoration: none; font-size: 13px; } .board .option .add-topic a:hover{ position: relative; float: left; color: #000; text-decoration: underline; } .board .option .add-topic a img { position: relative; float: left; margin: 0 5px 0 0;} .board div.box { position: relative; float: left; left:0; top:0; width: 99%; margin: 5px; border-bottom: 1px dotted #222; } .board div.box h2 { position: relative; float: left; width: 80%; margin:0; font-family: Georgia, Tahome, Verdana; font-size: 13px; font-weight: normal; line-height: 23px; } .board div.box h2 a { position: relative; float: left; left:0; top:0; margin:0; color: #0097be; text-decoration: none; } .board div.box h2 a:hover { position: relative; float: left; color: #FFF; text-decoration: underline; } .board div.box h2 a img { position: relative; float: left; margin: 6px 5px auto 0; text-decoration: none; } .board div.box h2 a span { position: relative; float: left; width: 90%; margin:0; text-decoration: none; } .board .feature { bottom:5px; top: auto; right:0; font-size:11px; } #board-page #content h1 { position: relative; float: left; margin:20px 0 9px; text-decoration:none; padding:0; color: #000; text-indent:0px; font-size: 48px; font-weight: normal; font-family: Tahoma;text-align:left;line-height:25px;z-index:9; } #board-page .page-no { top:auto; right:0; bottom:0; } #board-page #navigation { display: none; } #board-page #board-form { position: relative; margin: 10px auto; } #board-page #board-form fieldset legend { display: block; font-size: 14px; color: #0097be; } #board-page #board-form #form-comment { width: 100%; height: 520px; background: none; border: 1px dotted #222; } #board-page #board-form #form-comment label#field-name input, #board-page #board-form #form-comment label#field-email input, #board-page #board-form #form-comment label#field-tel input, #board-page #board-form #form-comment label#field-web input { float: left; } #board-page #board-form #form-comment label#field-massage textarea { float: left; } #board-page #board-form #form-comment em { position: relative; float: left; top:5px; } #board-page #board-form #form-comment label#field-topic { position: relative; float: left; width: 100%; margin: 5px; padding: 5px 0 0; text-align: right; cursor: pointer; } #board-page #board-form #form-comment label#field-topic span { position: relative; float: left; width: 100px; margin: 5px 0 0 0; text-align: right;} #board-page #board-form #form-comment label#field-topic input { position: relative; float: left; width: 250px; margin: 0 45px 0 5px; height: 14px; padding: 5px; font-size: 13px; font-family: Tahoma; color: #444; } #board-page #board-form #form-comment label#field-file { position: relative; float: left; width: 100%; margin: 5px; padding: 5px 0 0; text-align: right; cursor: pointer; } #board-page #board-form #form-comment label#field-file span { position: relative; float: left; width: 100px; margin: 5px 0 0 0; text-align: right;} #board-page #board-form #form-comment label#field-file input { position: relative; float: left; width: 250px; margin: 0 45px 0 5px; height: 30px; padding: 5px; font-size: 13px; font-family: Tahoma; color: #444; } #board-page #board-form #form-comment label#field-capsha { position: relative; float: left; width: 100%; margin: 5px; padding: 5px 0 0; text-align: right; cursor: pointer; } #board-page #board-form #form-comment label#field-capsha span { position: relative; float: left; width: 100px; margin: 5px 0 0 0; text-align: right;} #board-page #board-form #form-comment label#field-capsha input { position: relative; float: left; width: 250px; margin: 0 45px 0 5px; height: 14px; padding: 5px; font-size: 13px; font-family: Tahoma; color: #444; } #board-page #board-form #form-comment label#field-submit span { margin: 8px 0 0 105px; } /* |-------------------------------------------------------------------------------------------- | Webboard Each Page |-------------------------------------------------------------------------------------------- */ #board-content p { position: relative; float: left; width: 95.5%; line-height: 23px; margin: 0 auto 10px; padding: 20px; background: #222; border: 1px solid #444; color: #888; font-size: 13px; text-align: justify;} #board-content p img { border: 5px solid #000; background: #ddd; clear: both; display: block; margin: 20px auto; } /* Button Comment Massage */ #board-content span.button { position: absolute; width: 98%; height: 25px; left: 10px; top: 80px; z-index:2; } /* IE 7 */ *+ html #board-content span.button { position: absolute; width: 98%; height: 25px; left: 10px; top: 0px; z-index:2; } #board-content span.button a { position: relative; float: right; color: #900; font-size:11px; text-decoration: none; margin: 0 0 0 10px; } #board-content span.button a:hover { position: relative; float: right; color: #FFF; text-decoration: underline; } #board-content span.button a.reply { position: relative; float: right; color: #090; font-size:11px; text-decoration: none; margin: 0 0 0 10px; } #board-content span.button a.reply:hover{ position: relative; float: right; color: #FFF; text-decoration: underline; } #board-content span.button a img { position: relative; float: left; margin:0 3px 0 0; } #board-content span.button span.name { position: relative; float: left; width: auto; height: auto; margin:0 10px 0 0; padding:0; font-size: 13px; font-weight: normal; } #board-content span.button span.time { position: relative; float: right; width: auto; margin: 0 10px 0 0; color: #555; font-size:11px; text-decoration: none; } #board-content span.button span.date { position: relative; float: right; width: auto; margin: 0 10px 0 0; color: #555; font-size:11px; text-decoration: none; } #board-content span.button span.ip { position: relative; float: right; width: auto; margin: 0 10px 0 0; color: #555; font-size:11px; text-decoration: none; } #board-form { position: relative; margin: 0 auto 10px; } #board-form #form-comment { background: none; border: 1px dotted #222; } #board-each-page #content h1 { position: relative; float: left; margin:20px 0 9px; text-decoration:none; padding:0; color: #0097be; text-indent:0px; font-size: 18px; font-weight: normal; font-family: Tahoma;text-align:left;line-height:25px;z-index:9; } #board-each-page #navigation { display: block; } /* |-------------------------------------------------------------------------------------------- | Search Page |-------------------------------------------------------------------------------------------- */ div.search { position: relative; width: 380px; height: auto; margin: 5px auto; } /* |-------------------------------------------------------------------------------------------- | Member Page |-------------------------------------------------------------------------------------------- */ .member { position: relative; float: left; width: 100%; height: auto; margin:0; border: none; background:none; } .member h2 { position: relative; line-height: 30px; margin: 0; width: 100%; text-align: left; font-size: 18px; font-family: Georgia, Verdana, Tahoma; color: #0097be; font-weight: normal; border-bottom: 1px dotted #222; } .member p { position: relative; clear: both; margin: 0; width: 100%; text-align: left; font-size: 13px; line-height: 22px; text-indent: 30px; color: #999; } /* Login Box */ div.login-new { position: relative; float: left; width: 40%; padding: 10px; height: 230px; margin: -20px 3px 0; } div.login-new h3 { color: #00AFF0;} div.login-old { position: relative; float: right; width: 42%; padding: 10px; height: 230px; margin: -20px 3px 0; } /*login-page*/ div.login-menu { position: absolute; top: 200px; z-index: 30; width:100%; height: 170px; background: url(../images/bg/login-tab.png) no-repeat; } /* |-------------------------------------------------------------------------------------------- | Login Top-Right Section |-------------------------------------------------------------------------------------------- */ #login { position: absolute; top:20px; right:0; width:36%; z-index:1;} #login form { position: relative; width: 390px; top: 5px; } #login form input { position: relative; float: left; font-family: Verdana; font-size: 11px; color: #000; width: 120px; margin: 0 2px; } #login form input.username,.password {position: relative; top: 10px; } #login form input.submit { width:88px; height:36px; text-indent:-9999px; border:none; cursor: pointer; } #login p { position: relative; float: right; width: 398px; } #login p a { color:#818181; text-decoration:none;} #login p a:hover { color:#000; text-decoration:none;} /*login Status*/ #login-status { position: relative; float: right; top:10px; left:40px; } #login-status p { position: relative; float: right; width: 400px; } #login-status p a { color:#818181; text-decoration:none;} #login-status p a:hover { color:#000; text-decoration:none;} #login-option img { margin:0 5px;} /*login option*/ #login-option { position: absolute; top:35px; left:0; } /* |-------------------------------------------------------------------------------------------- | Member Login Complete Page |-------------------------------------------------------------------------------------------- */ /*Section Left (Menu)*/ #menu-sub-member { position: relative; float: left; width: 20%; height: auto; margin:1px; } #menu-sub-member ul { position: relative; float: left; margin:0; padding:0; width: 100%; list-style:none; } #menu-sub-member ul li { position: relative; float: left; line-height: 25px; width: 100%; border-bottom: 1px dotted #222; } #menu-sub-member ul li a:link { position: relative; float: left; text-decoration: none; color: #0097be; } #menu-sub-member ul li a:active { position: relative; float: left; text-decoration: none; color: #0097be; } #menu-sub-member ul li a:visited { position: relative; float: left; text-decoration: none; color: #0097be; } #menu-sub-member ul li a:hover { position: relative; float: left; text-decoration: none; color: #000; } #menu-sub-member ul li a img { position: relative; float: left; background: none; border: none; margin:5px 5px 0 0; padding:0; } /*Section Right (Cotent)*/ .member-login { position: relative; float: right; width: 79%; height: auto; margin:0; border: none; background:none; } .member-login p { position: relative; clear: both; margin: 0; width: 100%; text-align: left; line-height: 22px; text-indent: 30px; color: #999; } .member-login p strong { color: #0097be; font-size: 11px; } .member-login p a { text-decoration: underline; color: #0097be; } .member-login p a:hover { text-decoration: none; color: #000; } .member-login h2 { position: relative; line-height: 30px; margin: 0; width: 100%; text-align: left; font-size: 18px; font-family: Georgia, Tahoma; color: #0097be; font-weight: normal; border-bottom: 1px dotted #222; } .member-login h3 { font-family: Georgia, Verdana, Tahoma; font-size: 18px; color: #0097be; font-weight: normal; } .member-login h3 strong { font-family: Georgia, Verdana, Tahoma; font-size: 18px; color: #000; font-weight: normal; } /* Member Check Product Page */ /*#member-check-product { position: relative; width: 100%; height: auto; margin: 10px auto; }*/ #member-check-product h3 { font-size: 14px; color:#000; } #member-check-product table { position: relative; width: 98%; margin: 10px auto; border: 1px solid #ccc; } #member-check-product table th { font-weight: normal; } #member-check-product table th.product { width:45%; border-bottom: none; text-align: left; font-size: 14px; font-weight: bold; color:#000; } #member-check-product table th#image { width:15%; border-bottom: none; font-size:14px; font-weight: bold; color:#000; } #member-check-product table th#price { width:10%; border-bottom: none; font-size:14px; font-weight: bold; color:#000; } #member-check-product table th#quantity { width:10%; border-bottom: none; font-size:14px; font-weight: bold; color:#000; } #member-check-product table th#subtotal { width:15%; border-bottom: none; font-size:14px; font-weight: bold; color:#000; } #member-check-product table th#remove { width: 5%; border-bottom: none; font-size:14px; font-weight: bold; color:#000; } #member-check-product table th#discount { width: 5%; border-bottom: none; font-size:14px; font-weight: bold; color:#000; display:none; } #member-check-product table td { text-align: center; font-family: Tahoma; font-size: 13px; color: #555; font-weight: normal; border-bottom: 1px dotted #222; } #member-check-product table td.product { text-align: left; } #member-check-product table td a { font-family: Tahoma; font-size: 13px; color: #0097be; text-decoration:none; } #member-check-product table td a:hover { font-family: Tahoma; font-size: 13px; color: #000; text-decoration: underline; } #member-check-product table td input { text-align: center; font-family: Tahoma; font-size: 13px; color: #555; width: 20px; } #member-check-product table tr#total td { text-align: center; font-family: Tahoma; font-size: 13px; color: #0097be; font-weight: normal; border:none; text-decoration: underline; } /*Member Check History*/ ul#sum-month { position: relative; float: left; width: 95%; margin: 0 0 30px 10px; } ul#sum-month li { position: relative; float: left; width: 100%; border: 1px dotted #c7c7c7; border-top: none; } ul#sum-month li.topic { color:#000; font-weight: bold; background:url(../images/bg/bg-table.jpg) repeat-x top center; height: 47px; border-bottom: none; } ul#sum-month li.topic span.month-top { position: relative; float: left; margin: 10px 0 0 20px; font-size:16px; color: #818181; } div.top-month { position: relative; float: left; width: 30%; text-align:left; } div.status { position: relative; float: left; width: 60%; text-align:right; } #sum-month li span.month { position: relative; float: left; width: 40%; height: 30px; text-align: center; margin: 10px 0 0 0; } #sum-month li span.detail { position: relative; float: left; width: 60%; text-align: center; margin: 10px 0 0 0; } #sum-month a { color:#F60; } #sum-month a:hover { color:#000; } /*month each*/ #mem-his-wrap { height: 600px; } #table-wrapper #header { position: relative; float: left; height: auto; margin: 10px 0 0; } #table-wrapper #header h3 { color:#000; font-size:16px;} #table-wrapper #header ul li span { position: relative; float: left; text-align: center; font-size: 14px; font-weight:bold; border: 1px solid #ccc; background:#FC0; } #table-wrapper #header ul li span.date-head { width: 15%; } #table-wrapper #header ul li span.time-head { width: 20%; } #table-wrapper #header ul li span.order-head { width: 20%; } #table-wrapper #header ul li span.reciver-head { width: 30%; } #table-wrapper #header ul li span.status-head { width: 10%; } #table-wrapper { position: relative; margin: 10px; width: 100%; margin: 0 0 250px 0; } #table-wrapper ul { width: 100%; } #product-list { position: relative; float: left; width: 100%; } #product-list ul { width: 100%; /*display: inline;*/ } .member-page #bt { position: relative; width:110px; right: 10px; float: right;} .member-page #bt span { float: left; width: 5px; height:5px; margin:5px 2px; padding:5px; } .member-page #bt a { float: left; width: 5px; height:5px; margin:5px 2px; padding:5px; } .member-page #bt { position: relative; clear: both; text-align: left; margin: 10px auto 20px 0; width:200px; right:-40px; height:400px; } .member-page #bt a { border: 1px solid #d1d1d1; padding:10px; color: #999; font-size: 11px; font-weight: bold; color: #999; margin:2px; } .member-page #bt a:hover { border: 1px solid #0b55c4; padding:10px; margin: 2px; font-size: 11px; font-weight: bold; color: #0b55c4; text-decoration:none;} .member-page #bt span { border: 1px solid #d1d1d1; padding:10px; font-size:11px; margin: 2px; color: #999; background-color: #efefef;} div.pagerDB { clear: both; margin: 3px; /*position: absolute;*/ top: 14px; right: 10px; padding-top: 5px; padding-right: 10px; padding-bottom: 5px; padding-left: 10px; position: relative; text-align: center; } div.pagerDB a { border: 1px solid #d1d1d1; color: #999; font-size:11px; font-size: 11px; font-weight: bold; color: #999; margin:0px; padding-top: 5px; padding-right: 10px; padding-bottom: 5px; padding-left: 10px; } div.pagerDB a:hover {border: 1px solid #0b55c4; padding:5px 10px; margin: 0px; font-size: 11px; font-weight: bold; color: #0b55c4; text-decoration:none;} div.pagerDB b {border: 1px solid #d1d1d1; padding:5px 10px; font-size:11px; margin: 0px; color: #999; background-color: #efefef;} .highslide img{ height:200px; width: 150px; } div.pagerDB span { border: 1px dotted #d1d1d1; padding:4px 10px;} /* IE7 */ /**:first-child+html .member-page #bt span { margin: 18px 3px 0; }*/ *:first-child+html .member-page #bt { clear:none; width: 250px;} *:first-child+html .member-page #bt a { padding:10px;} /*product-list*/ #product-list ul li span { float: left; height: 30px; padding:10px 0 0 0; text-align: center; font-size: 12px; font-size:normal; border: 1px solid #ccc; } #product-list ul li span.date { width: 15%; } #product-list ul li span.time { width: 20%; } #product-list ul li span.order-id { width: 20%; } #product-list ul li span.reciver { width: 30%; } #product-list ul li span.status { width: 10%; } #product-list a { color:#39F;} #product-list a:hover { color:#000;} /*product-check-each*/ #recive-header { position: relative; float: left; border: 1px solid #ccc; width: 90%; margin: 60px 20px 0; } #recive-header ul { width: 100%; } #recive-header ul li { width: 95%; margin: 0 10px; } #recive-header ul li.order-number { text-align: left;} #recive-header ul li.name { text-align: right;} #recive-header ul li.add { text-align: right; } #recive-header ul li.zipcode { text-align: right; } #recive-header ul li.date { text-align: left; } #recive-header ul li.time { text-align: left;} #member-check-product { position: relative; float: left; width: 95%; margin: 10px;} #member-check-product #header { position: relative; float: left; width: 100%; height: auto; } #member-check-product #header ul {} #member-check-product #header ul li {width:100%;} #member-check-product #header ul li span { position: relative; float: left; text-align: center; background:#CCC; font-weight: bold; font-size:14px; color:#000; border: 1px solid #ccc;} #member-check-product #header ul li span.date-head {width: 5%;} #member-check-product #header ul li span.Product-name-head {width: 30%;} #member-check-product #header ul li span.Product-no-head {width: 20%;} #member-check-product #header ul li span.Price-head {width: 15%;} #member-check-product #header ul li span.quantity-head {width: 15%;} #member-check-product #header ul li span.discount-head {width: 10%;} #member-check-product #product-list { position: relative; float: left; width: 100%; } #member-check-product #product-list span.label { position: relative; float: left; width: 97%; background:#F90; color:#000; font-weight: bold; font-size:14px; } /*#member-check-product #product-list li {}*/ #member-check-product #product-list li span.no {width: 5%;} #member-check-product #product-list li span.product {width: 30%;} #member-check-product #product-list li span.order-no {width: 20%;} #member-check-product #product-list li span.pp {width: 15%;} #member-check-product #product-list li span.unit {width: 15%;} #member-check-product #product-list li span.total {width: 10%;} #member-check-product #product-list li span.tax {width: 80%; height: 15px; color:#000; text-align: right; } #member-check-product #product-list li span.sum-tax {width: 16%; height: 15px; color:#000; text-align: right; } #member-check-product #product-list li span.sum-unit {width: 80%; height: 15px; color:#000; text-align: right; } #member-check-product #product-list li span.sum-price {width: 16%; height: 15px; color:#000; text-align: right; } /* |-------------------------------------------------------------------------------------------- | Forget Post Page |-------------------------------------------------------------------------------------------- */ #forget-post { position:relative;margin:60px auto;font-family:Tahoma;font-size:13px;color:#FFF; width:399px; height:700px; background:none;} #forget-post p { color:#000; } #forget-post input.send-bt { width: auto; height: auto;} #forget-post form { position: relative; margin: 0 auto; border: none; color: #FFF; } #forget-post label { position: relative; float: left; width: 400px; margin: 2px auto; text-align: center; } #forget-post input { position: relative; float: left; width: 250px; height: 14px; padding: 5px; font-size: 13px; font-family: Tahoma; color: #444; text-align: center; left: 75px; } #forget-post textarea { position: relative; float: left; width: 250px; height: 150px; color: #444; padding: 5px; font-size: 13px; overflow: auto; margin: 0 auto; font-family: Tahoma; left: 75px; } #forget-post a { position: relative; float: left; margin: 15px auto; width: 400px; height: 20px; text-align: center; color: #FFF; text-decoration: none; } #forget-post a:visited { color: #FFF; text-decoration: none; } #forget-post a:hover { color: #000; text-decoration: underline; } /* |********************************************************************************************************************* | CSS jQuery Plugin (FILE : front-jquery-plugin.css) |********************************************************************************************************************* */ /* |-------------------------------------------------------------------------------------------- | CSS jQuery Plugin Pretty Photo - 27-02-2010 |-------------------------------------------------------------------------------------------- */ div.light_rounded .pp_top .pp_left{background: url(../images/pretty-photo/prettyPhoto/light_rounded/sprite.png) -88px -53px no-repeat;}div.light_rounded .pp_top .pp_middle{background:#fff;}div.light_rounded .pp_top .pp_right{background: url(../images/pretty-photo/prettyPhoto/light_rounded/sprite.png) -110px -53px no-repeat;}div.light_rounded .pp_content{background-color:#fff;}div.light_rounded .pp_next:hover{background: url(../images/pretty-photo/prettyPhoto/light_rounded/btnNext.png) center right no-repeat;cursor: pointer;}div.light_rounded .pp_previous:hover{background: url(../images/pretty-photo/prettyPhoto/light_rounded/btnPrevious.png) center left no-repeat;cursor: pointer;}div.light_rounded .pp_expand{background: url(../images/pretty-photo/prettyPhoto/light_rounded/sprite.png) -31px -26px no-repeat;cursor: pointer;}div.light_rounded .pp_expand:hover{background: url(../images/pretty-photo/prettyPhoto/light_rounded/sprite.png) -31px -47px no-repeat;cursor: pointer;}div.light_rounded .pp_contract{background: url(../images/pretty-photo/prettyPhoto/light_rounded/sprite.png) 0 -26px no-repeat;cursor: pointer;}div.light_rounded .pp_contract:hover{background: url(../images/pretty-photo/prettyPhoto/light_rounded/sprite.png) 0 -47px no-repeat;cursor: pointer;}div.light_rounded .pp_close{width:75px;height:22px;background: url(../images/pretty-photo/prettyPhoto/light_rounded/sprite.png) -1px -1px no-repeat;cursor: pointer;}div.light_rounded .pp_arrow_previous{background: url(../images/pretty-photo/prettyPhoto/light_rounded/sprite.png) 0 -71px no-repeat;}div.light_rounded .pp_arrow_previous.disabled{background-position:0 -87px;cursor:default;}div.light_rounded .pp_arrow_next{background: url(../images/pretty-photo/prettyPhoto/light_rounded/sprite.png) -22px -71px no-repeat;}div.light_rounded .pp_arrow_next.disabled{background-position: -22px -87px;cursor:default;}div.light_rounded .pp_bottom .pp_left{background: url(../images/pretty-photo/prettyPhoto/light_rounded/sprite.png) -88px -80px no-repeat;}div.light_rounded .pp_bottom .pp_middle{background:#fff;}div.light_rounded .pp_bottom .pp_right{background: url(../images/pretty-photo/prettyPhoto/light_rounded/sprite.png) -110px -80px no-repeat;}div.light_rounded .pp_loaderIcon{background: url(../images/pretty-photo/prettyPhoto/light_rounded/loader.gif) center center no-repeat;}div.dark_rounded .pp_top .pp_left{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/sprite.png) -88px -53px no-repeat;}div.dark_rounded .pp_top .pp_middle{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/contentPattern.png) top left repeat;}div.dark_rounded .pp_top .pp_right{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/sprite.png) -110px -53px no-repeat;}div.dark_rounded .pp_content{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/contentPattern.png) top left repeat;}div.dark_rounded .pp_next:hover{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/btnNext.png) center right no-repeat;cursor: pointer;}div.dark_rounded .pp_previous:hover{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/btnPrevious.png) center left no-repeat;cursor: pointer;}div.dark_rounded .pp_expand{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/sprite.png) -31px -26px no-repeat;cursor: pointer;}div.dark_rounded .pp_expand:hover{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/sprite.png) -31px -47px no-repeat;cursor: pointer;}div.dark_rounded .pp_contract{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/sprite.png) 0 -26px no-repeat;cursor: pointer;}div.dark_rounded .pp_contract:hover{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/sprite.png) 0 -47px no-repeat;cursor: pointer;}div.dark_rounded .pp_close{width:75px;height:22px;background: url(../images/pretty-photo/prettyPhoto/dark_rounded/sprite.png) -1px -1px no-repeat;cursor: pointer;}div.dark_rounded .currentTextHolder{color:#c4c4c4;}div.dark_rounded .pp_description{color:#fff;}div.dark_rounded .pp_arrow_previous{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/sprite.png) 0 -71px no-repeat;}div.dark_rounded .pp_arrow_previous.disabled{background-position:0 -87px;cursor:default;}div.dark_rounded .pp_arrow_next{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/sprite.png) -22px -71px no-repeat;}div.dark_rounded .pp_arrow_next.disabled{background-position: -22px -87px;cursor:default;}div.dark_rounded .pp_bottom .pp_left{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/sprite.png) -88px -80px no-repeat;}div.dark_rounded .pp_bottom .pp_middle{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/contentPattern.png) top left repeat;}div.dark_rounded .pp_bottom .pp_right{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/sprite.png) -110px -80px no-repeat;}div.dark_rounded .pp_loaderIcon{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/loader.gif) center center no-repeat;}div.dark_square .pp_left ,div.dark_square .pp_middle,div.dark_square .pp_right,div.dark_square .pp_content{background: url(../images/pretty-photo/prettyPhoto/dark_square/contentPattern.png) top left repeat;}div.dark_square .currentTextHolder{color:#c4c4c4;}div.dark_square .pp_description{color:#fff;}div.dark_square .pp_loaderIcon{background: url(../images/pretty-photo/prettyPhoto/dark_rounded/loader.gif) center center no-repeat;}div.dark_square .pp_expand{background: url(../images/pretty-photo/prettyPhoto/dark_square/sprite.png) -31px -26px no-repeat;cursor: pointer;}div.dark_square .pp_expand:hover{background: url(../images/pretty-photo/prettyPhoto/dark_square/sprite.png) -31px -47px no-repeat;cursor: pointer;}div.dark_square .pp_contract{background: url(../images/pretty-photo/prettyPhoto/dark_square/sprite.png) 0 -26px no-repeat;cursor: pointer;}div.dark_square .pp_contract:hover{background: url(../images/pretty-photo/prettyPhoto/dark_square/sprite.png) 0 -47px no-repeat;cursor: pointer;}div.dark_square .pp_close{width:75px;height:22px;background: url(../images/pretty-photo/prettyPhoto/dark_square/sprite.png) -1px -1px no-repeat;cursor: pointer;}div.dark_square .pp_arrow_previous{background: url(../images/pretty-photo/prettyPhoto/dark_square/sprite.png) 0 -71px no-repeat;}div.dark_square .pp_arrow_previous.disabled{background-position:0 -87px;cursor:default;}div.dark_square .pp_arrow_next{background: url(../images/pretty-photo/prettyPhoto/dark_square/sprite.png) -22px -71px no-repeat;}div.dark_square .pp_arrow_next.disabled{background-position: -22px -87px;cursor:default;}div.dark_square .pp_next:hover{background: url(../images/pretty-photo/prettyPhoto/dark_square/btnNext.png) center right no-repeat;cursor: pointer;}div.dark_square .pp_previous:hover{background: url(../images/pretty-photo/prettyPhoto/dark_square/btnPrevious.png) center left no-repeat;cursor: pointer;}div.light_square .pp_left ,div.light_square .pp_middle,div.light_square .pp_right,div.light_square .pp_content{background:#fff;}div.light_square .pp_expand{background: url(../images/pretty-photo/prettyPhoto/light_square/sprite.png) -31px -26px no-repeat;cursor: pointer;}div.light_square .pp_expand:hover{background: url(../images/pretty-photo/prettyPhoto/light_square/sprite.png) -31px -47px no-repeat;cursor: pointer;}div.light_square .pp_contract{background: url(../images/pretty-photo/prettyPhoto/light_square/sprite.png) 0 -26px no-repeat;cursor: pointer;}div.light_square .pp_contract:hover{background: url(../images/pretty-photo/prettyPhoto/light_square/sprite.png) 0 -47px no-repeat;cursor: pointer;}div.light_square .pp_close{width:75px;height:22px;background: url(../images/pretty-photo/prettyPhoto/light_square/sprite.png) -1px -1px no-repeat;cursor: pointer;}div.light_square .pp_arrow_previous{background: url(../images/pretty-photo/prettyPhoto/light_square/sprite.png) 0 -71px no-repeat;}div.light_square .pp_arrow_previous.disabled{background-position:0 -87px;cursor:default;}div.light_square .pp_arrow_next{background: url(../images/pretty-photo/prettyPhoto/light_square/sprite.png) -22px -71px no-repeat;}div.light_square .pp_arrow_next.disabled{background-position: -22px -87px;cursor:default;}div.light_square .pp_next:hover{background: url(../images/pretty-photo/prettyPhoto/light_square/btnNext.png) center right no-repeat;cursor: pointer;}div.light_square .pp_previous:hover{background: url(../images/pretty-photo/prettyPhoto/light_square/btnPrevious.png) center left no-repeat;cursor: pointer;}div.pp_pic_holder a:focus{outline:none;}div.pp_overlay{background:#000;left:0;position:absolute;top:0;width:100%;z-index:9500;}div.pp_pic_holder{display: none;position:absolute;width:100px;z-index:10000;}.pp_top{height:20px;position: relative;}* html .pp_top{padding:0 20px;}.pp_top .pp_left{height:20px;left:0;position:absolute;width:20px;}.pp_top .pp_middle{height:20px;left:20px;position:absolute;right:20px;}* html .pp_top .pp_middle{left:0;position: static;}.pp_top .pp_right{height:20px;left:auto;position:absolute;right:0;top:0;width:20px;}.pp_content{height:40px;position: relative;text-align: left;width:100%;}.pp_content .pp_details{display: none;margin:10px 15px 2px 20px;}.pp_description{display: none;float: left;margin:0;}.pp_nav{clear: left;float: left;margin:3px 0 0 0;}.pp_nav p{float: left;margin:2px 4px;}.pp_nav a.pp_arrow_previous,.pp_nav a.pp_arrow_next{display:block;float: left;height:15px;margin-top:3px;overflow: hidden;text-indent: -10000px;width:14px;}.pp_hoverContainer{left:0;position:absolute;top:0;width:100%;z-index:2000;}a.pp_next{background: url(../images/pretty-photo/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat;display:block;float: right;height:100%;text-indent: -10000px;width:49%;}a.pp_previous{background: url(../images/pretty-photo/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat;display:block;float: left;height:100%;text-indent: -10000px;width:49%;}a.pp_expand,a.pp_contract{cursor: pointer;display: none;height:20px;position:absolute;right:30px;text-indent: -10000px;top:10px;width:20px;z-index:20000;}a.pp_close{display:block;float: right;text-indent: -10000px;}.pp_bottom{height:20px;position: relative;}* html .pp_bottom{padding:0 20px;}.pp_bottom .pp_left{height:20px;left:0;position:absolute;width:20px;}.pp_bottom .pp_middle{height:20px;left:20px;position:absolute;right:20px;}* html .pp_bottom .pp_middle{left:0;position: static;}.pp_bottom .pp_right{height:20px;left:auto;position:absolute;right:0;top:0;width:20px;}.pp_loaderIcon{display: none;height:24px;left:50%;margin: -12px 0 0 -12px;position:absolute;top:50%;width:24px;}#pp_full_res{display: none;line-height:1 !important;margin:0 auto;text-align:center;width:100%;}div.ppt{color:#fff;display: none;font-size:17px;left:0;position:absolute;top:0;z-index:9999;}.clearfix:after{content: ".";display:block;height:0;clear:both;visibility: hidden;}.clearfix {display: inline-block;}* html .clearfix {height:1%;}.clearfix {display:block;} /* |-------------------------------------------------------------------------------------------- | CSS jQuery Sliding Menu ( Option ) - 02-03-2010 |-------------------------------------------------------------------------------------------- */ #option { position: absolute; height: 15px; width:150px; margin: auto; cursor: pointer; top:0; right:0; z-index:2; } #option ul li { padding:0; margin:0; list-style:none;} #option p { position: absolute; width: 110px; top:0; right:2px; padding:0; margin:0; z-index:1; text-align: right; font-size:10px;} #option img { position: absolute; top:0; left:0; z-index:2; } .option_class { border:none ; } .the_option { position: relative; right:0; display:none; width:99%; border: 1px solid #333; margin:15px 0 0 0; } .the_option li { background: #000; border-bottom: 1px dotted #333; } .the_option li a { position: relative; left: 5px; font-size: 11px; line-height: 15px; color:#444; text-decoration: none; display:block; } .the_option li a:hover { font-size: 11px; line-height: 15px; color:#999; text-decoration: none;} /* |-------------------------------------------------------------------------------------------- | CSS jQuery Slider Menu ( Login ) - 28-02-2010 |-------------------------------------------------------------------------------------------- */ #slider-wrap { position: relative; margin: 0 auto; width: 100%; background: #0097be; z-index:999; } #slider { position: absolute; width: 100%; height: 42px; margin-top: -94px; } #slider img { border: 0; } #openCloseWrap { position:absolute; color: #000; right:0; } #openCloseWrap a:link { position: relative; float: left; border:0; margin:0; padding:0;} #openCloseWrap a:visited { position: relative; float: left; border:0; margin:0; padding:0;} /* |-------------------------------------------------------------------------------------------- | CSS jQuery Simple Toggle ( Gallery Post ) - 02-23-2010 |-------------------------------------------------------------------------------------------- */ h2.trigger { float: left; padding: 0; width: 100%; height: 30px; margin: 0 0 5px 0; font-size: 13px; font-weight: normal; } h2.trigger a { position: relative; color: #0097be; text-decoration: none; display: block; } h2.trigger a:hover { color: #000; } h2.trigger a img { position: relative; float: left; margin: 3px 5px 0 0; text-decoration: none; display: block; } h2.active { background-position: left bottom; } .toggle_container { margin: 0 0 5px; padding: 0; overflow: hidden; width: 100%; clear: both; } .toggle_container .block { position: relative; float: left; width: 95%; padding: 20px; background: #111; } .toggle_container .block p { width: auto; height: auto; padding: 5px 0; margin: 5px 0; font-size: 13px; color: #888; line-height: 20px; } .toggle_container h3 { font-size: 13px; font-family: Verdana; font-weight: normal; padding: 0 0 5px 0; border-bottom: 1px dotted #333; color: #888; } /*.toggle_container img { float: left; margin: 10px 15px 15px 0; padding: 5px; background: #ddd; border: 1px solid #ccc; } */ /* |-------------------------------------------------------------------------------------------- | CSS jQuery s3Slider - 03-03-2010 |-------------------------------------------------------------------------------------------- */ #s3slider { position: relative; float: left; margin:0; top:0; left:0; width: 100%; height: 286px; } #s3sliderContent { position: relative; float: left; top: 0; margin:0; } .s3sliderImage { float: left; position: relative; display: none; } .s3sliderImage span { display: none; } .top { top: 0; left: 0; } .bottom { bottom: 0; left: 0; } .left { top: 0; left: 0; width: 110px; height: 280px; } .right { right: 0; bottom: 0; width: 90px; height: 290px; } /* |-------------------------------------------------------------------------------------------- | CSS jQuery Plugin Name - DD-MM-YYYY |-------------------------------------------------------------------------------------------- */ form.jqtransformdone label{ margin-top:4px; margin-right: 8px; display: block; float:left; } form.jqtransformdone div.rowElem{ clear:both; padding:4px 0px; } /* ------------- * Buttons * ------------- */ button.jqTransformButton { margin: 0px; padding: 0px; border: none; background-color: transparent; cursor: pointer; overflow: visible; font-family: Arial; } *:first-child+html button.jqTransformButton[type]{width: 1;} /* IE7 */ button.jqTransformButton span { background: transparent url(../images/jqtransformplugin/img/btn_right.gif) no-repeat right top; display: block; float: left; padding: 0px 4px 0px 0px; /* sliding doors padding */ margin: 0px; height: 33px; } button.jqTransformButton span span { background: transparent url(../images/jqtransformplugin/img/btn_left.gif) no-repeat top left; color: #333; padding: 8px 4px 0px 8px; font-weight: normal; font-size: 12px; line-height: 13px; display: block; text-decoration: none; height: 33px; } /*hover*/ button.jqTransformButton_hover span span { background-position: left -33px ; } button.jqTransformButton_hover span { background-position: right -33px ; } /*clicked*/ button.jqTransformButton_click span span { background-position: left -66px ; } button.jqTransformButton_click span { background-position: right -66px ; } /* IE 6 */ * html button.jqTransformButton { height:33px; } * button.jqTransformButton span span { height: 25px; } /* IE 7 */ *+ html button.jqTransformButton { height:33px; } *+ button.jqTransformButton span span { height: 25px; } /* ------------- * Inputs * ------------- */ .jqTransformInputWrapper { background: transparent url(../images/jqtransformplugin/img/input/input_text_left.gif) no-repeat left top; height: 31px; padding: 0px; float:left; } .jqTransformInputInner { background: transparent url(../images/jqtransformplugin/img/input/input_text_right.gif) no-repeat top right; padding: 0px; margin: 0px; } .jqTransformInputInner div { height: 31px; margin:0px 0px 0px 8px; } .jqTransformInputInner div input { font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height: 18px; vertical-align: middle; height: 31px; color:#404040; border: none; padding: 8px 0px 0px 0px; margin: 0px; background:transparent; } /* IE6 */ * html .jqTransformInputInner div input { padding: 6px 0 0 0; margin: 0 0 0 -8px; height:24px; } /* Ie7 */ *+ html .jqTransformInputInner div input { padding: 6px 0 0 0; margin-left:-10px; height:24px; } /*hover*/ .jqTransformInputWrapper_hover{ background-position: left -31px ;} .jqTransformInputWrapper_hover div.jqTransformInputInner{ background-position: right -31px ;} /*focus*/ .jqTransformInputWrapper_focus{ background-position: left -62px ;} .jqTransformInputWrapper_focus div.jqTransformInputInner{ background-position: right -62px ;} .jqTransformSafari .jqTransformInputInner div { position: relative; overflow: hidden; margin:0px 8px; } .jqTransformSafari .jqTransformInputInner div input { background-color: none; position: absolute; top: -10px; left: -2px; height: 42px; padding-left: 4px; } /* ------------- * Textarea * ------------- */ table.jqTransformTextarea td#jqTransformTextarea-mm textarea{ font-size: 12px; line-height: 16px; } table.jqTransformTextarea td{ font-size: 1px; line-height: 1px; width: 5px; height: 5px; margin: 0; padding: 0; } table.jqTransformTextarea{} table.jqTransformTextarea tr{ /*border: 1px solid red;*/ } table.jqTransformTextarea textarea{ margin: 0; padding: 0; border: 0; background: none; } table.jqTransformTextarea td#jqTransformTextarea-tl{background: url(../images/jqtransformplugin/img/textarea/textarea_tl.gif) no-repeat top left;} table.jqTransformTextarea td#jqTransformTextarea-tm{background: url(../images/jqtransformplugin/img/textarea/textarea_tm.gif) repeat-x top left;} table.jqTransformTextarea td#jqTransformTextarea-tr{background: url(../images/jqtransformplugin/img/textarea/textarea_tr.gif) no-repeat top left;} table.jqTransformTextarea td#jqTransformTextarea-ml{background: url(../images/jqtransformplugin/img/textarea/textarea_ml.gif) repeat-y top left;} table.jqTransformTextarea td#jqTransformTextarea-mm{background: url(../images/jqtransformplugin/img/textarea/textarea-mm.gif) repeat;} table.jqTransformTextarea td#jqTransformTextarea-mr{background: url(../images/jqtransformplugin/img/textarea/textarea_mr.gif) repeat-y top left;} table.jqTransformTextarea td#jqTransformTextarea-bl{background: url(../images/jqtransformplugin/img/textarea/textarea_bl.gif) no-repeat top left;} table.jqTransformTextarea td#jqTransformTextarea-bm{background: url(../images/jqtransformplugin/img/textarea/textarea_bm.gif) repeat-x top left;} table.jqTransformTextarea td#jqTransformTextarea-br{background: url(../images/jqtransformplugin/img/textarea/textarea_br.gif) no-repeat top left;} /*hover*/ table.jqTransformTextarea-hover td#jqTransformTextarea-tl{background-position:0px -5px;} table.jqTransformTextarea-hover td#jqTransformTextarea-tm{background-position:0px -5px;} table.jqTransformTextarea-hover td#jqTransformTextarea-tr{background-position:0px -5px;} table.jqTransformTextarea-hover td#jqTransformTextarea-ml{background-position:-5px 0px;} table.jqTransformTextarea-hover td#jqTransformTextarea-mm{background-image: url(../images/jqtransformplugin/img/textarea/textarea-mm-hover.gif);} table.jqTransformTextarea-hover td#jqTransformTextarea-mr{background-position:-5px 0px;} table.jqTransformTextarea-hover td#jqTransformTextarea-bl{background-position:0px -5px;} table.jqTransformTextarea-hover td#jqTransformTextarea-bm{background-position:0px -5px;} table.jqTransformTextarea-hover td#jqTransformTextarea-br{background-position:0px -5px;} /*focus*/ table.jqTransformTextarea-focus td#jqTransformTextarea-tl{background-position:0px -10px;} table.jqTransformTextarea-focus td#jqTransformTextarea-tm{background-position:0px -10px;} table.jqTransformTextarea-focus td#jqTransformTextarea-tr{background-position:0px -10px;} table.jqTransformTextarea-focus td#jqTransformTextarea-ml{background-position:-10px 0px;} table.jqTransformTextarea-focus td#jqTransformTextarea-mm{background-image: url(../images/jqtransformplugin/img/textarea/textarea-mm-focus.gif);} table.jqTransformTextarea-focus td#jqTransformTextarea-mr{background-position: -10px 0px;} table.jqTransformTextarea-focus td#jqTransformTextarea-bl{background-position:0px -10px;} table.jqTransformTextarea-focus td#jqTransformTextarea-bm{background-position:0px -10px;} table.jqTransformTextarea-focus td#jqTransformTextarea-br{background-position:0px -10px;} table.jqTransformTextarea .jqTransformSafariTextarea div { position: relative; overflow: hidden; border: 0px solid red; } table.jqTransformTextarea .jqTransformSafariTextarea textarea{ background: none; position: absolute; top:-10px; left:-10px; padding: 10px 10px 10px 10px; resize: none; } /* ------------- * Radios * ------------- */ .jqTransformRadioWrapper {float: left;display:block;margin:0px 4px; margin-top:5px;} .jqTransformRadio { background: transparent url(../images/jqtransformplugin/img/radio.gif) no-repeat center top; vertical-align: middle; height: 19px; width: 18px; display:block;/*display: -moz-inline-block;*/ } /* ------------- * Checkboxes * ------------- */ span.jqTransformCheckboxWrapper{ display:block;float:left; margin-top:5px; } a.jqTransformCheckbox { background: transparent url(../images/jqtransformplugin/img/checkbox.gif) no-repeat center top; vertical-align: middle; height: 19px; width: 18px; display:block;/*display: -moz-inline-block;*/ } /* ------------- * Checked - Used for both Radio and Checkbox * ------------- */ a.jqTransformChecked { background-position: center bottom;} /* ------------- * Selects * ------------- */ .jqTransformSelectWrapper { width: 45px; position:relative; height: 31px; background: url(../images/jqtransformplugin/img/input-fill.gif) no-repeat top left; float:left; } .jqTransformSelectWrapper div span { font-size: 14px; text-align: left; color:#000; float: none; position: absolute; white-space: nowrap; height: 31px; line-height: 15px; padding: 3px 0 0 7px; overflow: hidden; cursor:pointer; /*border: 1px solid #CCCCCC;*/ /* border-right: none;*/ } .jqTransformSelectWrapper a.jqTransformSelectOpen { display: block; position: absolute; right: 0px; width: 31px; height: 31px; background: url(../images/jqtransformplugin/img/select_right.gif) no-repeat 0 0; } .jqTransformSelectWrapper ul { position: absolute; width: 43px; top: 30px; left: 0px; list-style: none; background-color: #FFF; border: solid 1px #CCC; display: none; margin: 0px; padding: 0px; height: 150px; overflow: auto; overflow-y: auto; z-index:10; } .jqTransformSelectWrapper ul a { display: block; padding: 5px; text-decoration: none; color:#d0b921; background-color: #FFF; font-size: 12px; border: 1px solid #ffd669; } .jqTransformSelectWrapper ul a.selected { background: #fff1b2; color: #333; } .jqTransformSelectWrapper ul a:hover, .jqTransformSelectWrapper ul a.selected:hover { background:#ffffe5; color: #f0c000; } /* ------------- * Hidden - used to hide the original form elements * ------------- */ .jqTransformHidden {display: none;} /* |-------------------------------------------------------------------------------------------- | Impromptu by Tum 06-04-2010 |-------------------------------------------------------------------------------------------- */ .jqifade { position: absolute; background: #000; } div.jqi { width: 409px; position: absolute; background: #333; padding: 15px; -moz-border-radius: 10px; -webkit-border-radius: 10px; } div.jqi .jqicontainer { font-weight: normal; } div.jqi .jqiclose { display:none; position: absolute; top: 4px; right: -2px; width: 18px; cursor: default; color: #FFF; font-weight: bold; } div.jqi .jqimessage { text-align: center; color: #FFF; } div.jqi .jqibuttons { text-align: center; } div.jqi button { padding: 3px 0px; margin: 0 10px; background-color: #333; border: solid 0px #333; color: #ffffff; font-size: 11px; } div.jqi button:hover { background-color: #728A8C; } /* |-------------------------------------------------------------------------------------------- | Job Page |-------------------------------------------------------------------------------------------- */ .clr {clear:both;} #col-left { float:left; width:60%;} #col-right { float:right; width:32%;} #col-left h1 { font-size:24px; padding-bottom:15px; font-weight:normal;} #col-right h1 { font-size:18px; padding-bottom:7px; font-weight:normal;} #photo-recruit img { width:100%;} ul#recruit { position: relative; border:#D9D9D9 solid 3px; color:#000; margin: 0 10px 0; } ul#new-recruit { padding:17px 22px 14px 12px; background-color:#E0E8F3;} ul#old-recruit { padding:17px 22px 14px 12px; background-color:#EEEFF3;} #topic { font-size:18px;} span.show-date { position: absolute; top:0; right:10px; font-size: 12px; color:#818181; float: right; } li.detail { font-size:12px; color:#333; text-indent: 20px; line-height: 17px; } li.descreption { font-size:16px;} li.apply { position: relative; float: left; width:100%; text-align: right; } li.apply a { color: #184B7A; } #address ,#location { margin:0 20px 20px 0; padding:10px; border:#6990bc solid 3px; background-color:#184b7a; color:#fff; width:90%;} #address li { line-height:20px;} #address li img { padding:19px 0 7px 0;} #address li a { text-decoration:none; color:#61c3de;} #location li { border-bottom:#5681ac solid 1px; background:url(../images/job/location-bg.jpg) no-repeat top left; text-indent:15px; line-height:25px;} #location li a { color:#FFF; text-decoration: none; } #location li a:hover { color:#FFF; text-decoration: underline; } #location li#last { border:none;} /* |-------------------------------------------------------------------------------------------- | Fag Page |-------------------------------------------------------------------------------------------- */ #fag-page { width:90%; float:left; height: 600px; margin:0 0 0 20px;} #fag-page h1 { text-indent:12px; font-weight:normal; color:#090033;} .border-fag img { width:100%;} #fag-page div.fags-list { position: relative; float: left; width: 100%; background:#F4F5F7; border-left: 1px solid #F4F5F7; border-right: 1px solid #F4F5F7;} /*#fag{background-color:#edeff2;}*/ #fag-color1 { background-color:#edeff2;} #fag-color2 { background-color:#dce8f1; padding-top:35px;} #fag-color3 { background-color:#edeff2; padding-top:35px;} #fag li { border-bottom:#FFF solid 1px;} .image-fag { position: relative; float: left; width:12%;} .image-fag img { width:100%; float:left; } .des-fag { width:88%; float:left;} .top-fag { font-size:18px; color:#00396e; padding-bottom:13px;} .det { font-size:12px; text-align: justify; width: 95%; color:#707070; margin: 0 0 0 10px; text-indent: 20px; } /* |-------------------------------------------------------------------------------------------- | Products Page |-------------------------------------------------------------------------------------------- */ #product-left{width:100%; float:left;} #each-product{ float:left; width:32%; padding:0 0 6px 6px ;} ul#each-color1{background-color:#e7f3fd;} ul#each-color2{background-color:#cbe6ff;} .name-product{width:100%; border-bottom:#d2dde6 solid 1px; padding-bottom:4px;} .name{font-size:20px; float:left; text-indent:3px; line-height:32px; padding-left:5px;} .price{font-size:16px; line-height:32px; float:right; padding-right:10px; color:#3B3C3E;} .look{ float:left; padding:0 0 10px 10px;} .buy{ float:right; padding:0 10px 10px 0;} .look a, .buy a{ font-size:14px; color:#727272; text-decoration:none;} .des, .name{color:#000;} .des { float:right; padding-top:4px; width:60%;} .image { float:left; width:40%;} .image img {width:100%;} #product-search ,#hot-sells { margin:0 20px 20px 0; padding:10px; border:#6990bc solid 3px; background-color:#184b7a; color:#fff; width:90%;} #product-search li {line-height:20px;} #product-search li img { padding:19px 0 7px 0;} #product-search li a { text-decoration:none; color:#61c3de;} #product-search li input {width:98%; color:#60a0ff;} #hot-sells li { border-bottom:#5681ac solid 1px; background:url(../images/job/location-bg.jpg) no-repeat top left; text-indent:15px; line-height:20px;} #hot-sells li a { color:#FFF; font-size: 11px; text-decoration: none; } #hot-sells li a:hover { color:#CCC; font-size: 11px; text-decoration: none; } #hot-sells li#last { border:none ;} #hot-sells li#first { background-image:none; text-indent:inherit; font-size:16px;} /* |-------------------------------------------------------------------------------------------- | Checkout Section |-------------------------------------------------------------------------------------------- */ #summary { position: relative; float: left; width: 95%; margin: 50px 0 0 20px; border: 1px solid #666; text-indent: 10px; } #summary div.sum-address { position: relative; float: left; width: 100%; } #summary h3 { position: relative; float: left; width: 100%; color:#000; background:#CCC; font-size: 16px; font-weight: bold; } #summary div.sum-address ul { position: relative; float: left; width: 100%; } #summary span { position: relative; float: left; width: 20%; color:#000; font-weight: bold; } li.group { position: relative; float: left; width: 100%; background:#CCC; color:#FFF; font-size:15px; } li.item-wrapper { position: relative; float: left; width: 100%; list-style: none; border: 1px solid #eee; padding: 10px 0; } #summary span.order-number { width: 5%; } #summary span.order-item { width: 45%; } #summary span.order-itemprice { width: 15%; } #summary span.order-unit { width: 15%; } #summary span.order-sum { width: 15%; } #summary p { position: relative; float: left; width: 80%; } #success { position: relative; float: left; width: 95%; height: 800px; margin: 60px 0 0 30px; } #summary tr td {/* padding: 5px 0;*/ font-size:12px;} /* |-------------------------------------------------------------------------------------------- | Press&Event Page |-------------------------------------------------------------------------------------------- */ #event-page .col-1 { height: 850px;} #press-left { position: relative; float:left; width:70%; margin:30px 0 0 10px; height: auto;} /*#press-left div { position: relative; }*/ div.textwrapper p { border:1px solid #EEEFF3;} #press-right{float:right; width:25%; margin: 60px 20px 0 0;} #press-left h1{ text-indent:12px; font-weight:normal; color:#090033;} li#press-color1 { position: relative; float: left; border-bottom: 1px dotted #CCC; margin: 5px 0 0; width: 100%;} .view-date{float:right; font-size:14px; color:#033a6c; padding-right:20px;} .des-press{ position: relative; float: left; width:80%; } .image-press{ position: relative; float: left; width:20%; margin: 20px 0; } .image-press img{width:100%; float:left; } .top-press{ position: relative; float: left; width: 70%; font-size:14px; color:#00396e; padding-bottom:13px; text-indent: 10px; margin: 20px 0 0; } .top-press a { color:#03C; text-decoration: none; } .top-press a:hover { color:#03C; text-decoration: underline; } .date { position: relative; float: left; font-size: 11px; color:#CCC; } .view { position: relative; float: left; font-size: 11px; color:#CCC; } .read-more {float:right; padding: 0 20px 10px 0; text-align: right;} .page-no .page-no { position:absolute; margin:0 auto; right:15px; top:30px; width:220px; border: 1px solid #F00; } .page-no a { position: relative; width: auto; height: 29px; color:#636363; border: 1px dotted; padding: 3px 7px; font:12px Arial,serif; text-decoration: none; margin: 0 -3px; } .page-no span { background: #FEEFB5; color:#3b0000; padding:3px 6px; text-decoration:none; font:16px Arial,serif; margin: 0 -3px; font-weight: bold; } .page-no a:hover { position: relative; width: auto; height: 29px; color:#809aae; border: 1px solid; border-color: #e58100 #ffc000 #ffc000 #e58100; background: url(../images/bt/bg-bt-page.png) repeat-x left bottom;font-size: 9px; padding: 3px 7px; font:12px Arial,serif; text-decoration: none; } /*event page-no*/ #event-page #page-wrapper { position: relative; float: left; width: 70%; height: 25px; margin: 60px auto 0;} #event-page .page-no { position: relative; float: left; right:0; top:0; width: 100%; height: 30px; clear:both; border: none; text-align: center;} #event-page .page-no span { border: none; font-size:16px; font-weight: bold;} /* |-------------------------------------------------------------------------------------------- | Contact Page |-------------------------------------------------------------------------------------------- */ .td_top { font-family: Tahoma; font-size: 11px; vertical-align: top; } .bg_content { background-image: url(images/bg_content.gif); background-repeat: repeat-x; } .txt_search01 { font-family: Tahoma; font-size: 11px; font-weight: bold; color: #2E5376; text-align: right; padding-right: 6px; } .input_search { font-family: Tahoma; font-size: 11px; padding: 2px; height: 15px; width: 130px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-color: #A7DCD7; border-right-color: #A7DCD7; border-bottom-color: #A7DCD7; border-left-color: #A7DCD7; background-color: #4BB9C1; color: #FFFFFF; margin-right: 6px; margin-left: 6px; } .txt_search { font-family: Tahoma; font-size: 11px; color: #009BA6; } .txt_search_c01 { font-family: Tahoma; font-size: 11px; font-weight: bold; color: #FFFFFF; background-color: #009BA6; padding: 3px; height: 10px; } .txt_search_c02 { font-family: Tahoma; font-size: 11px; font-weight: normal; color: #009BA6; background-color: #C6FFFF; padding: 3px; height: 10px; } .txt_search_c03 { font-family: Tahoma; font-size: 11px; font-weight: bold; color: #009BA6; background-color: #FFFFFF; padding: 3px; height: 10px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: none; border-right-style: none; border-bottom-style: solid; border-left-style: solid; border-bottom-color: #C6FFFF; border-left-color: #C6FFFF; } .txt_search_c04 { font-family: Tahoma; font-size: 11px; font-weight: bold; color: #009BA6; background-color: #FFFFFF; padding: 3px; height: 10px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: none; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-bottom-color: #C6FFFF; border-left-color: #C6FFFF; border-right-width: 1px; border-right-color: #C6FFFF; } .txt_search2 { font-family: Tahoma; font-size: 11px; color: #FF6600; } .txt_white { font-family: Tahoma; font-size: 11px; color: #FFFFFF; } .input_search2 { font-family: Tahoma; font-size: 11px; padding: 2px; height: 15px; width: 160px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-color: #A7DCD7; border-right-color: #A7DCD7; border-bottom-color: #A7DCD7; border-left-color: #A7DCD7; background-color: #98EEF4; color: #2E5376; margin: 3px; } .bg_menu { background-image: url(images/be_menu.gif); background-repeat: no-repeat; } .txt_content { font-family: Tahoma; font-size: 11px; color: #2E5376; } .txt_content2 { font-family: Tahoma; font-size: 14px; color: #2E5376; } .txt_content_asterisk { font-family: Tahoma; font-size: 11px; color: #FF0000; } .input_search3 { font-family: Tahoma; font-size: 11px; padding: 2px; height: auto; width: 170px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-color: #5FBCB3; border-right-color: #5FBCB3; border-bottom-color: #5FBCB3; border-left-color: #5FBCB3; background-color: #C2E8EA; color: #2E5376; margin: 3px; } .link_content { font-family: Tahoma; font-size: 11px; color: #2E5376; font-weight: normal; } .link_content2 { font-family: Tahoma; font-size: 11px; color: #2E5376; font-weight: normal; text-decoration: none; } .input_search4 { font-family: Tahoma; font-size: 11px; padding: 2px; height: auto; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-color: #5FBCB3; border-right-color: #5FBCB3; border-bottom-color: #5FBCB3; border-left-color: #5FBCB3; background-color: #FFFFFF; color: #2E5376; margin: 3px; } .input_search5 { font-family: Tahoma; font-size: 11px; padding: 2px; height: auto; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-color: #5FBCB3; border-right-color: #5FBCB3; border-bottom-color: #5FBCB3; border-left-color: #5FBCB3; background-color: #FFFFFF; color: #2E5376; margin: 3px; } /*shopping status*/ #current img { position: relative; float: left; margin: 0 0 0 15px;} .status-shopping { position: relative; float: left; width: 100%; margin:50px auto; } .status-shopping ul { position: relative; float: left;width: 100%; height: 20px; margin:0 auto; display: inline; background: url(../images/bg/status-nav/breadcrumb_bg.png) no-repeat 0 12px; width: 670px; height: 60px; } .status-shopping ul li { position: relative; float: left; padding:5px 0 0 6px; margin:12px 0 0 15px; font-size: 10px; height: 60px; font-weight: bold; } .status-shopping ul li p { position: relative; float: left; width: auto; } .status-shopping ul li b { font-weight: normal; color:#000; font-weight: bold; } .status-shopping ul li a { color:#333; text-decoration: none; font-weight: bold; } .status-shopping ul li a:hover { color:#333; text-decoration: underline; } .status-shopping ul span.next { position: relative; float: left; padding-left:10px; margin: 0; width: 7px; height: 60px;} /*all-button*/ #bt a { text-decoration: none; font-weight: normal;} #bt a:hover { color:#f6c101; text-decoration: none; } #bt a div { position: relative; float: left; width: auto; height: 18px; margin:0; padding: 5px 20px 0 10px; font-size: 10px; color:#787878; text-decoration: none; } #bt a div span { position: relative; float: left; width: 100%; text-align: center; cursor:pointer;} #bt a { border: 1px solid #CCC;} #bt a:hover { border: 1px solid #606060; color:#000;} #bt a:active { border: 1px solid #ccc;} div.checkout { background:url(../images/bt/5_18.gif) 80px 10px no-repeat;} div.update-cart { background:url(../images/bt/5_20.gif) 70px 8px no-repeat;} div.continue { background:url(../images/bt/6_18.gif) 105px 10px no-repeat;} div.makenew { background:url(../images/bt/new-order.gif) 65px 5px no-repeat;} #bt a div.back { background:url(../images/bt/6_18.gif) 5px 10px no-repeat; padding: 5px 10px 0 10px; } div.back span { margin: 0 0 0 5px; } div.next { background:url(../images/bt/5_18.gif) 35px 10px no-repeat;} div.monthly { background:url(../images/bt/new-order.gif) 83px 5px no-repeat;} div.yearly { background:url(../images/bt/new-order.gif) 75px 5px no-repeat;} #summary a { color:#999;} /*shopping-cart top left*/ div.cart { position: absolute; top:10px; right: 350px; background:url(../images/bg/cart-status.png) 0 0 no-repeat; width: 250px; height: 70px; } div.cart p { width: 100%; color:#585858; padding: 15px 0 0 65px; } div.cart p.bottom { margin: -10px 0 0; background: none; border: none;} div.cart p strong { font-size:17px; color:#000;} div.cart p span { color: #3f8eff;} div.cart a { position: relative; float: left; width: 80%; text-decoration: none; height: 30px; cursor: pointer;} /*event page*/ #event-page #left { position: relative; float: left; width: 260px;} #event-page #right { position: relative; float: left; width: 710px;} #wrapper {height:auto; min-height:100%;} #product-chose .col-1 { height: 850px;} /* |-------------------------------------------------------------------------------------------- | Table Section |-------------------------------------------------------------------------------------------- */ table.product-table td { border: 1px dotted #ddd;} #event-page.event-each .col-1 { height:auto; margin: 0 0 50px 0;}