﻿@import "reset.css";
/*---------------------------------------
// Author: Patrick.Chen@tp-link.com
// Created: 2011-02-10
// Last Modified: 2013-01-08
//---------------------------------------*/
body, a { color:#333;}
body {font:12px/1.6 Arial, Helvetica, sans-serif; background:url(../images/bgColor.jpg) repeat; text-align:center;}
a { text-decoration:none;}
a:visited { color:#333;/*color:#663399;*/}
a:hover { color:#0071b3;}
a:active { color:#f00;}
strong { font-weight:bold;}
em, i { font-style:italic;}
.clearFix:after, #tpUtils .search:after { content:"."; display:block; height:0; visibility:hidden; clear:both;}
.clearFix { *zoom:1;}
/*.clearFix { zoom:1; display:table;}*/
	
#tpHeader, #tpBody, #tpFooter { width:100%; height:auto; margin:0 auto; text-align:left;}
/*tpHeader*/
#tpHeader { height:80px; background-color:#fff;}
#tpHeader .wrapperBox { width:960px; margin:0 auto; position:relative;}
#tpLogo { display:inline-block; width:171px; height:36px; overflow:hidden; background:url(../images/tp-link_logo.png) no-repeat 0 0; margin:27px 0 0 15px;}
#tpLogo strong { visibility:hidden;}
/*	tpNav*/
#tpNav { width:530px; position:absolute; z-index:99999; left:250px; top:30px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;}
#tpNav a { color:#000;}
#tpNav a:hover { color:#0071b3;}
#tpNav > li { float:left; height:50px; line-height:50px; position:relative;}
#tpNav > li > a { display:block; width:100%; height:33px; font-size:15px; font-weight:bold; /**/padding-top:17px;/**/}
#tpNav > li > a:hover { color:#0071b3;}
#tpNav > li > a span { padding:0 15px; line-height:1em;}
#tpNav > li > a span.border { border-left:1px #666 solid;}
#tpNav > li:hover + li > a span { border-color:#fff;}
#tpNav > li:hover > a { background:none; background-color:#ededee; height:33px; border-bottom:1px #d2d2d2 solid;}
#tpNav > li:hover > a span { border-color:#ededee;}
#tpNav > li:hover .subNav { display:block;}
/*		.subNav*/
#tpNav .subNav { position:absolute; left:0px; top:50px; display:none;}
#tpNav .subNav li a { display:block; padding-right:7px; line-height:1em; background:url(../images/subNav-Shadow.png) repeat-y 100% 0; white-space:nowrap;}
#tpNav .subNav li a span {display:block; border:1px #d2d2d2 solid; border-top-color:#fff; padding:7px 43px 7px 15px; background:#ededee url(../images/subnav_liststyleimage.jpg) no-repeat 7px 50%;}
#tpNav .subNav li a:hover span { background-color:#fff; background-image:url(../images/subnav_liststyleimage_on.jpg);}
#tpNav .subNav li.borderBottom { height:7px; }
#tpNav .subNav li.borderBottom a { background:none; background:url(../images/subNav-bottom-corner-shadow.png) no-repeat 100% 0;}
#tpNav .subNav li.borderBottom a span, #tpNav .subNav li.borderBottom a:hover span { background:none; border:none; background:url(../images/subNav-bottom-shadow.png) no-repeat 0 0;}
/*	tpUtils*/
#tpUtils { position:absolute; right:0; top:18px; text-align:right; color:#666; z-index:99999999;}
#tpUtils .changes a, #tpUtils .location { color:#0071b3;}
#tpUtils .changes a { font-weight:normal;}
#tpUtils .changes a:hover { text-decoration:underline; color:#f00;}
#tpUtils .changes span.vline { padding:0 2px; color:#ccc; font-weight:bold;}
#tpUtils .langs strong { color:#666;}
#tpUtils .flag img { vertical-align:baseline; border:none;}
#tpUtils form { position:absolute; right:0; background-color:#fff;}
#tpUtils .search { width:203px; overflow:hidden; border:1px #ccc solid; margin-top:5px; padding:0 0 0 10px; background:url(../images/search.jpg) no-repeat 98% 50%; zoom:1;}
#tpUtils .search span { float:left; width:170px; padding:3px 0;}
#tpUtils .search input { border:none; background:none; line-height:1.2em; height:1.2em;}
#tpUtils .search input.text { width:167px; font-size:13px; color:#666; }
#tpUtils .search input.button { position:absolute; right:0; width:25px; height:24px; overflow:hidden; text-indent:-9999px; cursor:pointer;}
#tpUtils .search input.button:hover { border:none; border-left:1px #ccc solid;}

/*tpBody*/
#tpBody { background:url(../images/header-shadow.jpg) repeat-x 0 0; padding-top:12px;}
#tpLocation, #tpBanner, #tpContent { width:960px; height:auto; margin:0 auto;}
#tpLocation { width:968px; height:14px; background:url(../images/banner-top-shadow.jpg) no-repeat 50% 100%;}
#tpLocation span { position:relative; top:-5px; padding-left:24px; height:1em; overflow:hidden;}
#tpBody .wrapperBox { width:968px; margin:0 auto; background:#fff url(../images/body-shadow.jpg) repeat-y 50% 0;}
#tpBanner { background:url(../images/banner-bottom-shadow.jpg) no-repeat 50% 100%; padding-bottom:3px; line-height:0;}
/*	tpConten*/
#tpContent { width:910px; margin:30px 30px 50px 25px; }
#tpNavCol { width:210px; overflow:hidden; float:left;}
#tpContentCol { width:671px; overflow:hidden; float:right;}
/*		tpNavCol*/
#tpNavCol > ol { margin-bottom:21px;}
#tpNavCol > ol > li > span, #tpNavCol li a { display:block;}
#tpNavCol > ol > li > span {background:#f5f5f7 url(../images/menuBarColor.jpg) repeat; border:1px #d2d2d2 solid;border-top-color:#fff;}
#tpNavCol > ol > li:first-child > span, #tpNavCol > ol > li[class="current"] + li > span { border-top-color:#d2d2d2;}
#tpNavCol li a { height:auto; width:160px; padding-right:30px; line-height:1em; padding-left:18px;padding-top:5px;padding-bottom:5px;}
#tpNavCol > ol > li > span {}
#tpNavCol > ol > li > span a {font-weight:bold;background:#f5f5f7 url(../images/menuBar_Arrow.jpg) no-repeat 183px 50%; }
#tpNavCol > ol > li.current > span a { background-image:url(../images/menuBar_Arrow_on.jpg);}
#tpNavCol > ol > li > span a:hover {}
#tpNavCol > ol > li.current > span a, #tpNavCol li.current li.current a { color:#0071b3;}
#tpNavCol ol ol { display:none; padding:4px 0; background:url(../images/menu-sub_bgColor.jpg) repeat;}
#tpNavCol li li { padding:3px 0; line-height:0;}
#tpNavCol li li a { height:auto; background:url(../images/triangle.jpg) no-repeat 11px 6px; line-height:1.2em; padding-top:0; padding-bottom:0; width:180px; padding-right:10px;}
#tpNavCol li li a:hover { background-image:url(../images/triangle_on.jpg);}
#tpNavCol li.current ol { display:block;}
#tpNavCol li.current li.current a { background-image:url(../images/triangle_on.jpg)}
/*		tpContentCol*/
#tpContentCol div.title { background:url(../images/gray-gradient-line.jpg) no-repeat 50% 100%; padding-bottom:38px; padding-right:5px;}
#tpContentCol div.title h1 { font:bold 20px/1 "Trebuchet MS", Arial, Helvetica, sans-serif; margin-bottom:16px;}
#tpContentCol div.title h1.larger { font-size:24px;}

/*tpFooter*/
#tpFooter { background:url(../images/body-bottom-shadow.jpg) no-repeat 50% 0; padding-top:22px;}
#tpFooter .wrapperBox { width:920px; margin:0 auto; position:relative; font-size:11px; padding-bottom:1.5em;}
#tpFooter ul { }
#tpFooter p { position:absolute; right:0; top:-3px; color:#666;}
#tpFooter ul li {float:left;padding:0 10px;border-left:1px #666 solid;line-height:1em;}
#tpFooter ul li.borderNone { border:none;}
#tpFooter ul li.copyright { float:right; border:none; padding-right:0;}
#tpFooter ul li.icon { border:none; padding-left:0; position:relative; top:-7px;}
#tpFooter ul li.icon a { display:block; width:22px; height:22px; overflow:hidden; text-indent:-9999px;}
#tpFooter ul li.icon a#facebook { background:url(../images/facebook.png) no-repeat 50% 50%;}
#tpFooter ul li.icon a#youtube { background:url(../images/Youtube-logo.png) no-repeat 50% 50%;}
#tpFooter ul li.icon a#twitter { background:url(../images/twitter.png) no-repeat 50% 50%;}
#tpFooter ul li.icon a#linkedin { background:url(../images/linkedin.png) no-repeat 50% 50%;}
#tpFooter ul li.normal a { text-indent:0;}
/*pageNav*/
#pageNav { text-align:right; color:#000!important; width:100%;}
#pageNav span { padding:0 2px;}
#pageNav span strong { color:#0071b3; text-decoration:underline;}
#pageNav a:hover { text-decoration:underline;}
#pageNav .current, #pageNav .current a { color:#0071b3; text-decoration:underline;}
#pageNav .current { font-weight:bold;}
#pageNav .disabled { color:#666;}
/*resultBox */
#resultBox, .lightBox { position:absolute; top:0; left:0; width:100%; height:100%; z-index:99999; text-align:center;}
#resultBox .bgBox, .lightBox .bgBox { background-color:#E6E6E8; width:100%; height:100%; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity:0.7; opacity:0.7;}
#resultBox .contentBox, .lightBox .contentBox { position:absolute;}
#resultBox .contentBox .innerBox, .lightBox .contentBox .innerBox { background-color:#fff; border:1px #999 solid; border-width:0 2px 2px 0;}
#resultBox .contentBox .innerBox .content, .lightBox .contentBox .innerBox .content { text-align:left; padding:1.5em; border:2px #ccc solid;}
#resultBox .contentBox .innerBox .content p, .lightBox p { margin-bottom:1em; font-size:14px;}
#resultBox .contentBox .innerBox .content .title, .lightBox .title { font:bold 20px/1 "Trebuchet MS", Arial, Helvetica, sans-serif; background:url(../images/line_gradient.jpg) no-repeat 50% 100%; padding-bottom:1em;}
#resultBox .contentBox .innerBox .content .title strong { background:url(../images/ok.png) no-repeat 0 0; display:block; height:32px; padding-left:30px; line-height:32px;}
#resultBox .contentBox .innerBox .content .title strong.failed, .lightBox .failed { background-image:url(../images/failed.png); padding-left:35px;}
#resultBox .contentBox .innerBox .content a, .lightBox a { color:#0071b3;}
#resultBox .contentBox .innerBox .content a:hover, .lightBox a:hover { text-decoration:underline;}
#resultBox .contentBox .innerBox .content .note, .lightBox .note { color:#646464; font-size:12px;}
#resultBox .contentBox .innerBox .content .button, .lightBox .button { text-align:center; margin-top:3em;}
#resultBox .contentBox .innerBox .content input, .lightBox .input { background:url(../images/btnbg.png) repeat-x 0 0; border:1px #ccc solid; height:19px; font-size:12px; padding:0 1em;}

.acountInfoBox { text-align:right; height:0em; padding:0 23px;}
.acountInfoBox a { text-decoration:underline;}