/*-------------------------------------
// Author: PATRICK.CHEN@TP-LINK.COM
// Created: 2011-04-01
// Last Modified: 2013-10-31
//--------------------------------------*/
 #tpNavCol > ol > li[class="current"] + li > span { border-top-color:#fff;}
 
 /*Logo layout style*/
.logoList { width:100%; overflow:hidden;}
.logoList, .logoList .title { margin-bottom:0.5em;}
.logoList .title, .locationBox .location, h2.title { background:url(https://static.tp-link.com/res/images/buy_titleBg.jpg) no-repeat 0 0; height:24px; font:bold 14px/1 "Trebuchet MS", Arial, Helvetica, sans-serif; padding-top:5px; color:#000;}
.logoList .title span, .locationBox .location span, h2.title { padding-left:1em;}
.logoList li { width:25%; float:left; height:126px; overflow:hidden; display:table; table-layout:fixed; background:url(https://static.tp-link.com/res/images/buy_line_verticle.gif) no-repeat 0 -128px;}
.logoList ul.single li { background:url(https://static.tp-link.com/res/images/buy_line_verticle_single.gif) no-repeat 0 50%;}
.logoList li.first, .logoList ul.single li.first { background:none;}
.logoList li span { display:table-cell; vertical-align:middle; text-align: center; width:100%; height:100%; overflow:hidden;}
.logoList li.line { float:none; width:100%; height:4px; overflow:hidden; clear:both;}
.logoList ul { *zoom:1; background:url(https://static.tp-link.com/res/images/buy_line.gif) no-repeat 50% 0;}
.logoList ul.first, .logoList ul.single { background:none;}
.logoList ul.first li { background-position:0 0;}
.logoList ul.last li { background-position:0 100%;}

.logoList ul:after, .logoWithCommentList li:after, .logoWithCommentList li .comment dd dl:after, .textList ul:after, .textList .comment dl:after { content:"."; display:block; height:0; clear:both; clear:both; visibility:hidden;}

.locationBox .location { font-size:1.4em; padding-top:3px;}
.logoWithCommentList .title, .textList .title { font:bold 16px/1em "Trebuchet MS", Arial, Helvetica, sans-serif; background:#4978a2 url(https://static.tp-link.com/res/images/buy_titleBg_2.gif) repeat; color:#fff; padding:0;}
.logoWithCommentList .title span, .textList .title span { display:block; padding:5px 0 5px 40px; background:url(https://static.tp-link.com/res/images/buy_titlebg_head.jpg) no-repeat 0 50%;}
.logoWithCommentList li .logo { float:left; width:180px; text-align:center; overflow:hidden; text-indent:0px; height:auto;}
.logoWithCommentList li .comment { float:right; width:470px; margin-right:20px; overflow:hidden; border-bottom:1px #ccc dashed; padding-bottom:1em;}
.logoWithCommentList, .logoWithCommentList .title, .logoWithCommentList li { zoom:1; margin-bottom:24px;}
.logoWithCommentList li .comment dt { background-color:#f6f6f6; padding:3px 20px;}
.logoWithCommentList li .comment dt, .logoWithCommentList li .comment dt a { font:bold 16px/1em "Trebuchet MS", Arial, Helvetica, sans-serif; color:#4978a2;}
.logoWithCommentList li .comment dt a:hover { text-decoration:underline;}
.logoWithCommentList li .comment dd dt { background:none; font:bold 1em/1 Arial, Helvetica, sans-serif; color:#333; padding-right:0.5em; float:left; }
.logoWithCommentList li .comment dd dt, .logoWithCommentList li .comment dd { line-height:1.2em; word-spacing:normal; word-wrap:break-word; word-break:break-all; padding:0; }
.logoWithCommentList li .comment dd dt { padding-right:5px; }
.logoWithCommentList li .comment dd dl { *zoom:1; margin-bottom:0.5em; padding-left:20px; }
.logoWithCommentList li .comment .sub .subtitle span { border-bottom:1px #ccc solid;}
.logoWithCommentList li .comment .sub .subtitle, .logoWithCommentList li .comment .sub .subcontent { float:none;}
ul.logoWithCommentList { margin-top:1em;}
ul.logoWithCommentList li .comment { border-bottom:none; padding-bottom:0;}
ul.logoWithCommentList li { border-bottom:1px #ccc dashed; padding-bottom:1em; margin-bottom:1em;}
ul.logoWithCommentList li .comment dt { margin-bottom:0.4em;}
ul.logoWithCommentList li .comment dt a:hover { text-decoration:none; color:#000;}
ul.logoWithCommentList li .comment dd dt { margin-bottom:0em;}
ul.logoWithCommentList li.special .comment dt { font-style:italic; color:#000; background-color:#e4e9ed;}
ul.logoWithCommentList li.special .comment dt a { color:#000; font-style:italic;}
ul.logoWithCommentList li.special .comment dd dt { font-style:normal; color:#333; background:none;}

.textList .title { margin-bottom:2em;}
.textList .name { margin-bottom:0.5em;}
.textList .name span { font:bold 16px/1 "Trebuchet MS", Arial, Helvetica, sans-serif; color:#4978a2; border-bottom:2px #4978a2 solid;}
.textList li { float:left; width:50%; overflow:hidden;}
.textList ul { *zoom:1; margin:0 0 3em 33px;}
.textList .comment dt { font-weight:bold; padding-right:0.5em;}
.textList .comment dt, .textList .comment dd { float:left;}
.textList .comment dl { *zoom:1; margin-bottom:0.3em; line-height:1.2em; width:90%;}
/*
// Resellers
*/
body#buy #seller, body#buy #d { padding-bottom:1.5em;}
.locations span, .regions span { color:#ccc; font-weight:bold; font-size:1.1em;}
.locations a:hover, .regions a:hover, .contactInfo td a:hover { text-decoration:underline;}
.locations { font-size:1.2em; margin-bottom:0.5em; padding-bottom:0.7em; border-bottom:1px #ccc dashed;}
body#buy #d .locations { border:none; padding-bottom:0; margin-bottom:0em;}
.regions { margin-bottom:0.5em; border:1px #0071b3 dashed; padding:1em;}
a.current { color:#0071b3; text-decoration:underline; cursor:default; font-weight:bold;}
.contactInfo { table-layout:fixed; width:100%;}
.contactInfo th, .contactInfo td { line-height:1.15em; padding:7px 5px; vertical-align:top; width:20%; overflow:hidden; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;}
.contactInfo td div { font-size:0.9em; width:130px; overflow:hidden;}
.contactInfo td.www div, .contactInfo td.tel { white-space:normal; word-spacing:normal; word-break:break-all;word-wrap:break-word; }
.contactInfo td.www img { width:80%;}
.contactInfo th { font-weight:bold; color:#000;}
.contactInfo thead th { color:#fff; border:0px #fff solid; font-size:1.2em; font-family:"Trebuchet MS",Arial,Helvetica,sans-serif; background-color:#ccc; text-align:left; background: url(https://static.tp-link.com/res/images/buy_titleBg_2.gif) repeat scroll 0 0 #4978A2;}
.contactInfo tbody th { color:#336699; font-family:"Trebuchet MS",Arial,Helvetica,sans-serif;}
.contactInfo tbody th, .contactInfo td { border-bottom:1px #ccc solid;}
.contactInfo .newline td, .contactInfo .newline th { border-top:none; border-top:2px #4978A2 solid;}
.contactInfo tbody { border-bottom:2px #4978A2 solid;}
.contactInfo .com { font-weight:bold;}
.contactInfo .addr {}
.contactInfo caption, #divContent h2 { font-weight:bold; background-color:#eee; border-bottom:1px #fff solid; padding:3px 5px; font-size:1.1em; color:#000;}
.contactInfo caption span, #divContent h2 span { color:#999; padding:0 0.5em;}

/*temp content style*/
#divContentTemp ol { padding:1em 0 1.5em 1.2em; *padding-left:1.4em;}
#divContentTemp li { list-style:disc; font-size:1.2em;}
#divContentTemp p { margin-bottom:1em; color:#000;}
#divContentTemp a:hover { text-decoration:underline;}
#divContent h2 { background-color:#ddd;}

.title .description { line-height:1.2em; margin-top:1em;}
.searchBox { float:right;}
.searchBox input, .searchBox button, .searchBox select { line-height:1em; padding:3px; }
@media screen and (max-width:736px)
{
   .mobile-web .searchBox{ float:left}
   .mobile-web .searchBox button{ padding:6px 8px; border-radius:3px; background-color:#0979f8; color:White}
   .mobile-web .searchBox input{ width:120px;}
   .mobile-web .logoList ul{ background:none; }
   .mobile-web .logoList ul:not(:first-child){border-top:none }
   .mobile-web .logoList li{ width:50%; background:none}
   .mobile-web .logoList ul li:first-child span{border:1px #c8cad0 solid;}
   .mobile-web .logoList ul:not(:first-child) li:first-child span{border-top:none}
   .mobile-web .logoList ul li:nth-child(2) span{border:1px #c8cad0 solid; border-left:none}
   .mobile-web .logoList ul li:nth-child(3) span{border:1px #c8cad0 solid; border-top:none}
   .mobile-web .logoList ul li:nth-child(4) span{border:1px #c8cad0 solid; border-top:none; border-left:none}
   .mobile-web .logoList li span{ width:90%}
   .mobile-web .logoList li span a{ display:block; max-height:100%; overflow:hidden}
   .mobile-web .logoList li span a img{ width:70%;max-width:70%; height:auto; max-height:100%; width:auto}
   .mobile-web h2.title{ padding-top:0}
   .mobile-web .logoWithCommentList li .logo{ width:23%}
   .mobile-web .logoWithCommentList li .logo a{ display:block}
   .mobile-web .logoWithCommentList li .logo a img{ display:block; width:90%; height:auto}
   .mobile-web .logoWithCommentList li .comment{ width:75%; margin-right:0; float:left}
}