@charset "utf-8";
/*** styles that apply to tags throughout the site ***/
 
 
 
body {
	font-family:Arial, Helvetica, sans-serif;
	color: #6D6E71;
	margin:0px;
	padding:0px;
}
img {
	border:none;
	outline:none;
}
a:link, a:visited, a:hover, a:visited {
	outline:none;
}
 
span {
	margin:0px;
	padding:0px;
}
 
/* leftspace and rightspace classes are for adding a 10px margin to an inline element*/
.leftspace {
	margin-left:10px;
}
.rightspace {
	margin-right:10px;
}
 
 
/*** bodyWrapper contains all page content, positions page in the center of browser window ***/
#bodyWrapper {
	position: relative;
	margin: 0 auto;
	width: 900px;
}
#clearAll {
	width:0px;
	height:0px;
	clear:both;
}
 
 
/*** content area structural elements ***/
#twoColumnLeft {
	width: 650px;
	position: relative;
	float: left;
	margin: 0px;
	padding:0px;
	margin-top: 20px;
	margin-left: 10px;
}
#twoColumnRight {
	width: 235px;
	margin: 0px;
	padding:0px;
	margin-top:20px;
	position: relative;
	float: left;
}
 
#oneColumn {
   width: 885px;
   margin: 0px;
   padding:0px;
   margin-top:20px;
   position: relative;
   float: left;
}
 
 
/*** header area structure and styles ***/
 
/* headwrapper is the container element for the logo, nav, login area, and graphic separator */
#headWrapper {
	width: 900px;
	height: 76px;
}
#logo {
	width:191px;
	height:54px;
	position:relative;
	float:left;
	margin: 0px;
	padding: 0px;
	margin-top: 22px;
}
#separator {
	width: 900px;
	height: 8px;
	background-color: #808285;
	background-image: url(../images/separator.jpg);
	background-position: left;
	background-repeat:no-repeat;
	position:relative;
}
 
/* top navigation  and tabs */
#navigation {
	width: 460px;
	height: 30px;
	position: relative;
	float:left;
	margin-top: 46px;
	padding-left:30px;
}
 
/* activeTab is the id for tabs that are clickable links */
#activeTab {
	position:relative;
	float:left;
	color:#FFF;
	width: 102px;
	height: 30px;
	background-image:url(../images/blueTab.jpg);
	font-size: 12px;
	font-weight:bold;
	margin-right:2px;
}
#activeTab p {
	margin:0px;
	margin-left:10px;
	margin-top:10px;
}
#navigation a:link, #navigation a:visited, #navigation a:hover, #navigation a:visited {
	text-decoration:none;
}
#navigation #activeTab:hover {
	background-image:url(../images/orangeTab.jpg);
}
 
/* selectedTab is the id for the tab which is currently selected - not clickable */
#selectedTab {
	position:relative;
	float:left;
	color:#FFF;
	width: 102px;
	height: 30px;
	background-image:url(../images/orangeTab.jpg);
	font-size: 12px;
	font-weight:bold;
	margin-right:2px;
}
#selectedTab p {
	margin:0px;
	margin-left:10px;
	margin-top:10px;
}
 
 
/** login area **/
 
/* the divs loginBox and loggedIn are designed to be interchangeable - loggedIn replaces loginBox when user has successfully authenticated */
#loginBox {
	width: 430px;
	height: 50px;
	position: absolute;
	top:0px;
	right:10px;
	z-index:2;
	text-align:right;
}
#loggedIn {
	width: 205px;
	height: 40px;
	position:relative;
	float:left;
	margin: 0px;
	padding: 0px;
	margin-top: 36px;
}
#loggedIn p {
	margin:0px;
	text-align:right;
	line-height:12px;
}
.greeting {
	font-size:12px;
	font-weight:bold;
	color:#16A2D3;
}
.signOut {
	font-size:11px;
	color:#6D6E71;
}
.signOut a:link, .signOut a:visited {
	color:#6D6E71;
	outline:none;
	text-decoration:none;
}
.signOut a:hover, .signOut a:active {
	color:#6D6E71;
	outline:none;
	text-decoration:underline;
}
#loginBox .signUp {
	font-size:13px;
	font-weight:bold;
	color: #16A2D3;
	margin-left:5px;
}
#loginBox .login {
	font-size:13px;
	font-weight:bold;
	color: #F78E1E;
	margin-right:5px;
}
#loginBox a:link, #loginBox a:visited {
	outline:none;
	text-decoration: none;
}
#loginBox a:hover, #loginBox a:active {
	outline:none;
	text-decoration: underline;
}
#loginSubmitBtn {
	width:60px;
	position:relative;
	background-color:#16A2D3;
	font-size:12px;
	font-weight:bold;
	margin:0px;
	padding-left:5px;
	color: #ffffff;
	text-decoration:none;
	text-align:left;
}
#loginSubmitBtn:hover {
	background-color:#F78E1E;
	text-decoration:none;
}
a:link.loginSubmitBtn, a:visited.loginSubmitBtn, a:hover.loginSubmitBtn, a:active.loginSubmitBtn {
	float:right;
	color: #ffffff;
	text-decoration:none;
}

#forgot {
	width:100px;
	position:relative;
	float:right;
	margin:0px;
}
#forgot p {
	margin:0px;
 	color:#A0A2A6;
	font-size:10px;
	text-align:right;
}
#forgot a:link, #forgot a:visited {
 	color:#A0A2A6;
	outline:none;
	text-decoration:none;
}
#forgot a:hover, #forgot a:active {
	color:#6D6E71;
	outline:none;
	text-decoration:underline;
}
#loginBox form {
	margin:0px;
	margin-top:5px;
}
#loginBox input {
	display:inline;
	outline:none;
	color:#6D6E71;
	width: 170px;
	height: 18px;
	font-size:12px;
	padding:0px;
	padding-top:3px;
	padding-left:3px;
	margin-bottom:4px;
	border: 1px solid #A0A2A6;
}
#loginBox input[type="hidden"] {
    display:none;
    margin: 0;
    padding: 0;
}

/* loginError div contains login error message. Note:loginError div tag must be within bodyWrapper div tag for proper positioning */
#loginError {
	font-size:12px;
	color:#F00;
	position:absolute;
	left:470px;
	top:0px;
	width:350px;
	z-index:1;	
}
#loginError strong {
	font-size:13px;
	line-height:18px;
}
#loginError p {
        margin: 0;
        padding: 0;
}

#error {
	font-size:16px;
	color:#F00;
	text-align:left;
	line-height:18px;
}

#msg {
	font-size:16px;
	color:green;
	text-align:left;
	line-height:18px;
}

/*** download box structure and styles ***/
#downloadButton {
	width: 215px;
	margin-left: 10px;
	padding-bottom: 5px;
}
#downloadButton a:link, #downloadButton a:visited {
	border:none;
	outline:none;
	text-decoration:none;
}
#downloadButton a h3 {
	font-size: 20px;
	font-weight:bold;
	color:#16A2D3;
	margin: 0px;
	margin-top: 5px;
	margin-bottom: 1px;
}
#downloadButton a:hover h3 {
	color:#F78E1E;
}
#downloadButton a p {
	font-size: 14px;
	color: #6D6E71;
	margin:0px;
}
#downloadButton a:hover p {
	color: #F78E1E;
}
#downloadButton a img {
	padding-right: 10px;
	padding-bottom: 20px;
}
 
 
/*** footer area structure and styles ***/
 
/** footWrapper div contains all the footer elements **/
#footWrapper {
	width: 900px;
	position: relative;
	float: left;
	margin-top: 25px;
}
 
/* footerLinks holds TOS, contact link, etc */
#footerLinks {
	width: 640px;
	position:relative;
	float:left;
	margin-left:10px;
	font-size:10px;
	color: #6D6E71;
}
#footerLinks a:link, #footerLinks a:visited {
	color: #6D6E71;
	text-decoration:none;
	margin-right:10px;
}
#footerLinks a:hover {
	color:#373737;
}
#footerLinks a:active {
	color: #6D6E71;
}
 
/* socialLinks holds twitter and facebook links */
#socialLinks {
	width: 235px;
	position:relative;
	float:left;
	text-align:right;
	font-size:12px;
	font-weight:bold;
}
#socialLinks a:link, #socialLinks a:visited {
	color: #6D6E71;
	text-decoration:none;
	margin-left:10px;
}
#socialLinks a:hover {
	text-decoration:underline;
}
#socialLinks a:active {
	text-decoration:none;
}
 
 
/*** styles for basic text pages ***/
.basicPage h1 {
	color:#808285;
	font-size: 24px;
	line-height: 26px;
	margin: 0px;
	margin-top:5px;
	margin-bottom: 20px;
}
.basicPage h2 {
	font-size:22px;
	font-weight:bold;
	color:#808285;
	margin:0px;
	padding-top:10px;
	margin-bottom:10px;
}
.basicPage p {
	font-size:16px;
	line-height:19px;
	margin:0px;
	margin-bottom: 10px;
}
.basicPage ul {
	margin:0px;
	padding:0px;
	padding-left:30px;
	margin-bottom:10px;
} 
.basicPage ol {
	margin:0px;
	padding:0px;
	padding-left:30px;
	margin-bottom:10px;
} 
 
/*** home page specific structure and style ***/

/* WiFi locator */
#locator {
	margin-left:10px;
}
 
/* home page headline style */
.homePage h1 {
	color:#F78E1E;
	font-size: 32px;
	line-height: 34px;
	margin: 0px;
	margin-bottom: 15px;
}
 
/* home page news area */
#newsArea {
	width: 880px;
	margin-top: 10px;
	margin-left: 10px;
}
#newsArea h4 {
	color:#16A2D3;
	font-size: 13px;
	font-weight:bold;
	margin: 0px;
}
#newsArea h3 {
	font-size: 18px;
	color:#6D6E71;
	font-weight:bold;
	margin:0px;
	margin-top: 10px;
	padding-bottom:5px;
	line-height: 20px;
}
#newsArea a:link, #newsArea a:visited {
	color:#6D6E71;
	text-decoration:none;
}
#newsArea a:hover, #newsArea a:active {
	color:#3C3D3E;
}
#newsArea p {
	margin:0px;
	padding-bottom:10px;
}
#newsArea ul {
	margin: 0px;
	padding:0px;
	padding-left:30px;
	padding-bottom:10px;
}
#newsArea ol {
	margin: 0px;
	padding:0px;
	padding-left:30px;
	padding-bottom:10px;
}
#newsArea li {
	margin:0px;
	padding:0px;
}
#newsItem {
	width: 270px;
	position:relative;
	float:left;
	padding-left:10px;
}
#newsItemSpace {
	position:relative;
	float:left;
	width:9px;
	height:200px;
	background-image:url(../images/vRule.jpg);
	background-position:center;
	background-repeat:no-repeat;
}

 
/*** account pages structure and styles ***/
 
/* account page headline style */
.accountPage h1 {
	color:#808285;
	font-size: 24px;
	line-height: 26px;
	margin: 0px;
	margin-top:5px;
	margin-bottom: 20px;
}
 
/* accountContent is div that holds content INSIDE the table on account page template - indicated by 'main content area' comment in the html */
#accountContent {
	min-height:300px;
	padding-bottom:20px;
}
 
/* listHead is container div for list headline content, example: my private networks */
#listHead {
	position: relative;
	width: 612px;
	height: 25px;
	margin-top: 30px;
	padding-bottom: 10px;
	border-bottom: 1px solid #231F20;
	text-align:left;
}
#listHead h3 {
	color:#231F20;
	font-size:22px;
	display:inline;
	margin:0px;
	margin-left:5px;
}
 
/* listHeadLeftColumn is for content that shows up on the left side of of listHead div, example: (icon) my hotspot accounts */
#listHeadLeftColumn {
	width:492px;
	position:relative;
	float:left;
}
 
/* listHeadRightColumn is for content that shows up on the right side of a listHead div, example:'add a network' button */
#listHeadRightColumn {
	width:120px;
	position:relative;
	float:right;
	text-align:right;
	
}
 
/* listItem div contains list entry content */
#listItem {
	position: relative;
	background-color:#FFF;
	width: 630px;
	min-height:45px;
	padding-top:20px;
	padding-bottom:20px;
	border-bottom: 1px solid #6D6E71;
	text-align:left;
}
#listItem:hover {
	background-color:#E6E7E8;
}
#listItemLeftColumn {
	width:420px;
	min-height:45px;
	position:relative;
	float:left;
	padding-left:10px;
}
#listItemRightColumn {
	color:#6D6E71;
	width:180px;
	min-height:45px;
	position:relative;
	float:right;
	text-align:right;
}
#listItemRightColumn a:link, #listItemRightColumn a:visited {
	color:#6D6E71;
	text-decoration:none;
}
#listItemRightColumn a:hover, #listItemRightColumn a:active {
	color:#231F20;
	text-decoration:underline;
}
 
/* specific styles for list content on the 'my wireless networks' account page */
#listItemRightColumn.editRemove p {
	color:#6D6E71;
	font-size:13px;
	font-weight:bold;
	bottom:0;
	left: 18px;
	position:absolute;
}
.title {
	margin:0px;
	font-size:16px;
	font-weight:bold;
}
.subTitle {
	margin:0px;
	font-size:13px;
	font-weight:bold;
}
 
/* styles specific to the account pages menu */
.accountMenu {
	font-size:18px;
	font-weight:bold;
	padding-left:16px;
	padding-top:5px;
	color:#6D6E71;
}
.accountMenu p {
	margin:0px;
	margin-bottom:8px;
}
.accountMenu a:link, .accountMenu a:visited {
	color:#6D6E71;
	text-decoration:none;
}
.accountMenu a:hover, accountMenu a:active {
	color:#F78E1E;
	text-decoration:none;
}
.accountMenu .selected {
	color:#F78E1E;
}
 
 
/*** generic form styles ***/
.dataEntry {
	margin:0px;
	font-size:13px;
	font-weight:bold;
}
 
.dataEntry .subTitle {
	margin:0px;
	font-size:12px;
	font-weight:normal;
	display:inline;
}
 
.dataEntry .formTextInput {
	outline:none;
	color:#6D6E71;
	width: 250px;
	font-size:12px;
	padding-bottom:3px;
	padding-left:3px;
	margin-bottom:4px;
	border: 1px solid #A0A2A6;
}
.dataEntry .formCheckBox{
	clear:both;
	outline:none;
	color:#6D6E71;
	padding:0px;
	margin-top:3px;
	margin-left:3px;
	margin-right:5px;
	margin-bottom:4px;
	border: 1px solid #A0A2A6;
}
.dataEntry select {
	outline:none;
	color:#6D6E71;
	width: 255px;
	font-size:12px;
	padding:0px;
	margin-bottom:4px;	
	border: 1px solid #A0A2A6;
}
#formSubmitBtn {
	width:70px;
	height:21px;
	position:relative;
	float:left;
	background-color:#16A2D3;
	font-size:14px;
	font-weight:bold;
	text-align:left;
	margin:0px;
	padding-left:10px;
	padding-top:4px;
	color: #ffffff;
	text-decoration:none;
}
#formSubmitBtn:hover {
	background-color:#F78E1E;
	text-decoration:none;
}
a:link.formSubmitBtn, a:visited.formSubmitBtn, a:hover.formSubmitBtn, a:active.formSubmitBtn {
	margin:0px;
	padding:0px;
	color: #ffffff;
	text-decoration:none;
}

/*** downlaods page structure and styles ***/
.dlPage h1 {
	color:#808285;
	font-size: 24px;
	line-height: 26px;
	margin: 0px;
	margin-top:5px;
}
.dlPage h2 {
	font-size:12px;
	color:#16A2D3;
	margin:0px;
	padding:0px;
	margin-bottom:20px;
}
.dlPage h5 {
	color:#16A2D3;
	display: inline;
	margin:0px;
}
#downloadList.closed {
	border-top: 1px solid #231F20;
	border-bottom: 1px solid #231F20;
}
#downloadList.open {
	border: none;
}
#downloadList p {
	font-size:11px;
	color:#6D6E71;
	margin:0px;
	margin-top:5px;
}
img.view {
	margin-right:10px;
}
#downloadList a:link, #downloadList a:visited, #downloadList a:hover, #downloadList a:active {
	text-decoration:none;}

#downloadListItem {
	position:relative;
}
#downloadListItem.closed {
	margin-top: 10px;
	margin-bottom: 10px;
}
#downloadListItem.open {
	padding-top: 15px;
	padding-bottom: 15px;
	margin-top: -1px;
	margin-bottom: -1px;
	border-top: 1px solid #6D6E71;
	border-bottom: 1px solid #6D6E71;
}
#downloadListItemLeft {
	width:410px;
	position:relative;
	float:left;
}
#dlButton {
	position:relative;
	float:left;
	width:139px;
	height:18px;
	background-image:url(../images/dlButtonBlue.jpg);
	text-align:center;
	color:#ffffff;
	font-weight:bold;
	font-size:11px;
	padding-top:5px;
	margin-top: 5px;
}
#dlButton:hover {
	background-image:url(../images/dlButtonOrange.jpg);
}
#dlButtonInfo {
	font-size:8px;
	margin:0px;
	padding:0px;
	position:relative; 
	margin-top:-5px;
}
#dlButtonInfo strong {
	color:#16A2D3;
}
#dlButtonInfo a:link, #dlButtonInfo a:visited, #dlButtonInfo a:hover, #dlButtonInfo a:active {
	text-decoration:underline;
	color:#6D6E71;
}
#downloadListItemRight {
	width:220px;
	margin-left:20px;
	position:relative;
	float:left;
}

.availableFeatures {
	padding-left:5px;
	font-size:10px;
	color:#6D6E71;
}
.availableFeatures img {
	margin-right: 5px;
}
.availableFeatures h4 {
	display:inline;
	color:#16A2D3;
	font-size:12px;
	font-weight:bold;
}
.availableFeatures img.info {
	position:relative;
	float:right;
}