/*******************************************************************
 *
 *	@fileOverview Styles for net02
 *  @author werner@bussedesign.com
 *
 *******************************************************************/
@import url("normalize.min.css");
/*
@import url("classic.css");
@import url("classic.date.css");
@import url("classic.time.css");
@import url("timepicker.css");
@import url("datepicker.css");
*/

/*******************************************************************
 *	
 *	globals
 *
 *******************************************************************/
*,
*:before,
*:after {
  -moz-box-sizing: border-box; 
  -webkit-box-sizing: border-box; 
  box-sizing: border-box;
 }
.clearfix:before,
.clearfix:after,
.container:before,
.container:after {
  display: table;
  content: "";
  zoom: 1;
}
.clearfix:after,
.container:after {
  clear: both;
}
body {
  padding: 70px 0 0;
  font: normal 13px/1.3 Arial, Helvetica, Geneva, sans-serif;
  color: #7d706c;
  position: relative;
}
body.setup {
  background-color: #f1f1f1;
  padding-bottom: 70px;
}
body.login {
  margin: 0;
  background-color: #F1F1F1;
  font-size: 16px;
}
.ie8 body.login {
  background-color: #fff;
  width: 100%;
  height: 100%;
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/login_bg.jpg',  sizingMethod='scale');
}
body.hiddenPage {
  margin:0;
  padding: 10px 50px;
}

.ie8 body.setup,
.ie9 body.setup {
  background-color: #fff;
}
h1 {
  font-size: 18px;
  color: #333;
}

h2 {
  font-size: 13px;
  color: #333;
}
.container {
  max-width: 1024px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
    .container {
      max-width: 768px;
      margin: 0;
    }
}

hr {
	height: 0;
	border: none;
	border-top: 1px solid #ccc;
	margin: 15px 0;
	clear: left;
}
a {
  color: #00ade6;
  text-decoration: none;
}
a:hover {
  text-decoration: none;
  cursor: pointer;
}

.roundCorners {
	border-radius: 10px;
}
.downArrow {
  display: inline-block;
  position: relative;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-top-color: #595a5a;
  margin-left: 5px;
  top: 5px;
}
.upArrow {
  display: inline-block;
  position: relative;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-bottom-color: #595a5a;
  margin-left: 5px;
  top: 5px;
}
.rightArrow {
  display: inline-block;
  position: relative;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-left-color: #595a5a;
  margin-left: 5px;
  top: 5px;
}
[type="text"][disabled] {
	opacity: 0.4;
}
.btn[disabled],
.btn.primary[disabled],
.btn.primary[disabled]:hover,
.btn.primary[disabled]:active{
	background-color: #aaa;
}
.error {
	color: red;
}
.pwdError {
  color:  red;
  margin-top: 0;
} 
.right	{
	float: right;
}
.margin_bottom_50 {
  margin-bottom: 50px;
}
.relative {
  position: relative;
}
.half_width {
  width: 50%;
}
/* default lists */
ul {
  margin: 0;
  padding: 0;
}
li {
  list-style: none none outside;
}
.dnintg-checkmark,
.dnintg-locked,
.dnintg-unlock,
.dnintg-collapsed,
.dnintg-expanded,
.dnintg-menu,
.dnintg-search,
.dnintg-edit,
.dnintg-cancel,
.dnintg-fw-refresh,
.dnintg-greenclock{
  display: inline-block;
  width: 30px;
  height: 30px;
  background-image: url('../img/iconSprite2x.png');
  background-repeat: no-repeat;
  margin-right: 10px;
  position: relative;
  background-size: 234px 244px;
}
.ie8 .dnintg-checkmark,
.ie8 .dnintg-locked,
.ie8 .dnintg-unlock,
.ie8 .dnintg-collapsed,
.ie8 .dnintg-expanded,
.ie8 .dnintg-menu,
.ie8 .dnintg-search,
.ie8 .dnintg-edit,
.ie8 .dnintg-cancel,
.ie8 .dnintg-fw-refresh,
.ie8 .dnintg-greenclock{
  background-image: url('../img/iconSprite.png');
}
.dnintg-checkmark {
  background-position: -62px 0;
  vertical-align: middle;
  margin-right: 5px;
}
.dnintg-greenclock {
  margin-right: 5px;
  vertical-align: middle;
  background-position: -62px -150px;
}
.networkStatus .dnintg-locked {
  height: 20px;
  width: 20px;
  top: 2px;
  background-position: 0 -3px;
  margin-right: 0;
}
.networkStatus .dnintg-unlock {
  height: 20px;
  width: 30px;
  top: 2px;
  background-position: -23px -3px;
  margin-right: 0;
}
.dnintg-collapsed {
  height: 20px;
  width: 20px;
  background-position: -130px -88px;
}
.dnintg-expanded{
  height: 20px;
  width: 20px;
  background-position: -180px -88px;
}
.dnintg-menu {
  background-position: -125px -115px;
}
.dnintg-search {
  height: 24px;
  width: 30px;
  background-position: -220px -42px;
  margin: 0;
  vertical-align: top;
}
.dnintg-edit {
  background-position: -130px 0;
}
.dnintg-edit:hover {
  background-position: -130px -150px;
}
.dnintg-cancel {
  background-position: -172px -114px;
}
.dnintg-cancel:hover {
  background-position: -172px -114px;
}
.dnintg-fw-refresh {
  background-position: -62px -112px;
  vertical-align: middle;
  margin-right: 5px;
}

.hide,
.phoneLabel {
  display: none;
}

.red {
  color: #ff0000;
}
.errorMsg {
	color: red;
	margin: 5px 0 0 0;
	display: block;
	word-break: normal;
}
.download_bg {
	width: 90%;
	margin: 10% 5%;
	height: 36px;
	background: #666666;
}
.download_per {
	float: left;
	color: #FFFFFF;
	width: 0%;
	height: 100%;
	text-align: left;
	text-indent: 5px;
	line-height: 36px;
	background: #00A1DE;
}

/******************************************************************************
 *
 * buttons
 *
 *****************************************************************************/
 .timeLabel {
	border: none;
	width: 80%;
	height: 40px;
	display: inline-block;
	line-height: 40px;
	text-align: center;
	text-decoration: none;
	font-size: 17px;
	color: #fff;
	background-color: #00a1de;
	-webkit-border-radius:0px;
	font-weight: bold;
	font-size: 20px;
	margin: 0 10%;
}
.btn {
	border: none;
	width: auto;
	display: inline-block;
	padding: 5px 15px;
	text-decoration: none;
	font-size: 17px;
	color: #fff;
}
.btn.primary {
	background-color: #00a1de;
	-webkit-border-radius:0px;
	text-transform: uppercase;
}
.btn.primary:hover {
	background-color: #20b9f0;
}
.btn.primary:active {
	background-color: #039ed5;
}
.btn.secondary {
	background-color: #666;
	-webkit-border-radius:0px;
	text-transform: uppercase;
}
.btn.secondary:hover {
	background-color: #777;
}
.btn.wide {
	display: block;
	text-align: center;
	text-transform: uppercase;
}

/* process buttons in the footer */
.processButtons .btn {
  width: 220px;
  height: 44px;
  padding: 0;
  font-size: 17px;
  line-height: 44px;
  margin-top: 10px;
  text-align: center;
}

.processButtons .btn.threebt {
  width: 200px;
}

.processButtons .btn[disabled] {
  background-color: #aaa;
}

@media screen and (max-width: 740px) {
  .processButtons .btn.threebt {
    width: 160px;
  }
}

@media screen and (max-width: 600px) {
  .processButtons .btn.threebt {
    width: 140px;
  }
}

@media screen and (max-width: 525px) {
  .processButtons .btn.threebt {
    width: 100px;
  }
  .processButtons .btn {
    width: 150px;
  }
}

@media screen and (max-width: 400px) {
  .processButtons .btn {
    width: 100px;
  }
  .statusScreen .processButtons .btn {
    width: 200px;
  }
  .processButtons .btn.threebt {
    width: 85px;
  }
}
@media screen and (max-width: 280px) {
  .processButtons .btn {
    width: 90px;
    overflow: hidden;
  }
  .processButtons .btn.threebt {
    width: 80px;
  }
}

/* center a group of buttons */
.centerButtons {
	float:left;
	position:relative;
	left:50%;
	overflow:visible;
}
.centerButtons > div {
	float: left;
	position:relative;
	right:50%;
}

.refreshBtn {
  height: 28px;
  line-height: 28px;
  margin: 5px 5px 10px 10px;
  padding: 0 10px 0 5px;
	background-color: #fff;
	font-size: 12px;
	color: #7d706c;
	-webkit-box-shadow: 0 0  6px rgba(0, 0, 0, 0.35);
	   -moz-box-shadow: 0 0  6px rgba(0, 0, 0, 0.35);
	        box-shadow: 0 0  6px rgba(0, 0, 0, 0.35);
}
.ie8 .refreshBtn,
.ie9 .refreshBtn {
  border: 1px solid #f0f0f0;
}
.controlBtn {
  height: 28px;
  line-height: 28px;
  margin: 5px;
  padding: 0 10px;
	background-color: #fff;
	font-size: 12px;
	color: #7d706c;
	-webkit-box-shadow: 0 0  6px rgba(0, 0, 0, 0.35);
	   -moz-box-shadow: 0 0  6px rgba(0, 0, 0, 0.35);
	        box-shadow: 0 0  6px rgba(0, 0, 0, 0.35);
}
.accessSchedule .controlBtn{
  float: right;
}
.ie8 .controlBtn,
.ie9 .controlBtn {
  border: 1px solid #f0f0f0;
}
.refreshBtn span {
  display: inline-block;
  vertical-align: top;
}
.refreshBtn i {
  display: inline-block;
  vertical-align: top;
  width: 24px;
  height: 24px;
}
.dnintg-refresh {
  background: transparent url('../img/iconSprite2x.png') no-repeat -217px -2px;
  background-size: 234px 244px;
}
.ie8 .dnintg-refresh {
  background: transparent url('../img/iconSprite.png') no-repeat -217px -2px;
}
.refreshBtn:hover,
.controlBtn:hover {
  background-color: #f0f0f0;
}
.refreshBtn[disabled]:hover,
.controlBtn[disabled]:hover {
  background-color: #aaa;
}

/*******************************************************************
 *	
 *	page header
 *
 *******************************************************************/
#fixedHeader {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  width: 100%;
  background: #fff;
}
#fixedHeader:after{
	content:"";
	position: absolute;
	z-index: 97;
	-webkit-box-shadow: 0 0 15px rgba(0,0,0,0.4);
	        box-shadow: 0 0 15px rgba(0,0,0,0.4);
	bottom:0px;
	left:0;
	right:0;
	width:100%;
	height:30px;
	-moz-border-radius: 100%;
	     border-radius: 100%;
}
.ie8 #fixedHeader,
.ie9 #fixedHeader {
  border-bottom: 1px solid #f5f5f5;
}
.mask {
  background: #fff;
  position: relative;
  z-index: 98;
}
header {
  height: 70px;
  padding: 10px 3%;
  background-color: #fff;
}
#navButton {
  display: none;
}
#fixedHeader #logo {
	float: left;
	margin-top: 10px;
	max-width: 266px;
	height: auto;
}
#passtitle {
  display: block;
  font-size: 20px;
  font-weight: bold;
  margin: 10px auto;
}
.showTitle {
  font-weight: bold;
  color: #000;
  font-size: 17px;
}
#byline {
  float: right;
  margin: 0;
  line-height: 50px;
  font-size: 15px;
  font-weight: bold;
}
#language {
  display: block;
  float: right;
  position: relative;
  min-width: 100px;
  padding: 5px 0;
  margin-top: 14px;
}
#language ul {
  position: absolute;
  top: 100%;
  right: 0;
  z-index: 1;
  padding: 20px;
  background-color: #FFFFFF;
  box-shadow: 0 3px 7px 1px rgba(0, 0, 0, 0.3);
  max-height: 300px;
  overflow-y: auto;
  display: none;
}
#language:hover ul {
  display: block;
}
#language a {
  display: block;
  color: #5E514F;
  white-space: nowrap;
  padding: 0 0 10px 0;
}
#language > a {
  display: inline-block;
  float: right;
}
#language a:hover {
  color: #0AADE7;
}
#language a * {
  float: right;
}
@media screen and (max-width: 980px) {
  .twoColumns header {
    padding-left: 10%;  
  }
  #navButton {
    display: block;
    position: fixed;
    top: 20px;
    left: 3%;
    z-index: 999;
  }
}

@media screen and (max-width: 650px) {
  #byline {
    float: left;
    clear: left;
    line-height: 1.4;
    font-size: 0.8rem;
  }
  #language {
	font-size: 0.8rem;
	min-width: 80px;
  }
}

@media screen and (max-width: 480px) {
    #logo {
      width: 50%;
    }
    .twoColumns #logo,
    .twoColumns #byline {
      margin-left: 4%;
    }
     
    #language,
    .languageSelect {
      margin: 24px 0 0;
    }
    .twoColumns header {
      padding-left: 10%;  
    }
    #navButton {
      display: block;
      position: fixed;
      top: 20px;
      left: 3%;
    }  
}

@media screen and (max-width: 350px) {
	.twoColumns #byline {
		width: 155px;
	}
}

@media screen and (max-width: 280px) {
    #language {
    	width: 70px;
	font-size: 10px;
	min-width: 70px;
    }
    #fixedHeader #logo {
    	margin-left: 20px;
    }
    #fixedHeader #byline {
    	width: 58px;
	font-size: 10px;
	margin-left: 20px;
    }
}

/*******************************************************************
 *
 *	page footer
 *
 *******************************************************************/
#fixedFooter {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  z-index: 9;
  overflow: hidden;
}
@media screen and (max-width: 2000px) {
  #fixedFooter:after{
	content:"";
	position:absolute;
	z-index:-1;
	-webkit-box-shadow: 0 0 15px rgba(0,0,0,0.4);
	        box-shadow: 0 0 15px rgba(0,0,0,0.4);
	bottom: 80px;
	left:0;
	right:0;
	width:100%;
	height:30px;
	-moz-border-radius: 100%;
	     border-radius: 100%;
  }
  .processButtons a {
        margin-right: 10px;
        margin-left: 10px;
  }
}
@media screen and (max-width: 500px) {
  #fixedFooter:after{
        content:"";
        position:absolute;
        z-index:-1;
        -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.6);
                box-shadow: 0 0 15px rgba(0,0,0,0.6);
        bottom: 110px;
        left:0;
        right:0;
        width:100%;
        height:30px;
        -moz-border-radius: 100%;
             border-radius: 100%;
  }
}
.ie8 #fixedFooter,
.ie9 #fixedFooter {
  border-top: 1px solid #f5f5f5;
}
footer {
  height: 80px;
  padding: 10px 30px;
}
footer .search {
  float: right;
}
.footerNav {
  margin: 0;
  padding: 0;
}
.footerNav li {
  float: left;
  list-style: none outside none;
  padding: 0 10px;
}
.footerNav li:first-child {
  padding-left: 0;
  color: #fff;
  font-weight: bold;
  text-transform: uppercase;
}
.footerNav a {
  color: #fff;
  font-weight: bold;
  text-transform: uppercase;
}
.processButtons {
	float: right;
}

input.searchInput {
  width: 200px;
  color: black !important;
  font-style: normal !important;
  font-weight: bold !important;
}

/* fancy footer */
#fancyFooter {
  clear: both;
}
#fancyFooter .container {
  height: 240px;
  padding-top: 150px  ;
  background: #fff url('../img/fancyFooter.png') no-repeat left bottom;
  background-size: 100% auto;
}

/* search field */
#footerSearch label {
  color: #fff;
}
.searchWrap {
  height: 24px;
  padding-right: 30px;
  background: #fff;
  border: none;
  box-shadow: none;
  border-radius: 5px;
  position: relative;
}
.searchWrap input[type="text"] {
  width: 200px;
  background: none;
  border: none;
  height: 24px;
  line-height: 24px;
  padding: 0 5px;
  font-style: italic;
  vertical-align: top;
}
.searchWrap input[type="button"] {
  position: absolute;
  right: 0;
  z-index: 2;
  height: 24px;
  visibility: hidden;
}
.searchWrap div {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  background-position: -212px -42px;
}
.searchWrap input[type="button"]:hover,
.searchWrap div:hover {
  cursor: pointer;
}

@media screen and (max-width: 800px) {
  #fancyFooter {
    position: relative;
  }
  #fancyFooter .footerNav {
    margin: 40px 0 0 10%;
  }
  #fancyFooter .search {
    position: absolute;
    bottom: 60px;
    left: 50%;
    margin-left: -90px;
  }  
}

@media screen and (max-width: 640px) {
  footer {
    padding: 10px 20px;
  }
  #fancyFooter .footerNav {
    
    margin: 40px 0 0;
  }
}

@media screen and (max-width: 600px) {
  footer {
    padding: 0;
  }
  #fancyFooter .container {
    min-height: 350px;
    padding-top: 150px  ;
    background: #6e2585 url('../img/fancyFooter.png') no-repeat left top;
    background-size: 100% auto;
  }
  #fancyFooter footer {
    height: 300px;
  }
  #fancyFooter .footerNav {
    margin: 0 0 0 5%;
  }
  #fancyFooter .footerNav li {
    float: none;
    list-style: none outside none;
    padding: 0;
    margin-bottom: 20px;
  }
  #fancyFooter .search {
    position: absolute;
    bottom: auto;
    top:  90px;
    left: 5%;
    margin-left: 0;
  }  
}

/**
 *  temporary rules
 */
.processButtons .tempLink {
  display: inline-block;
  margin: 15px 5px;
}
.processButtons .tempLink:hover {
  text-decoration: underline;
}

/*******************************************************************
 *
 *  default pages
 *
 ******************************************************************/
#content {
  position: relative;
  background: #fff;
  background-image: -webkit-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%); 
  background-image:    -moz-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%);
  background-image:     -ms-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%); 
  background-image:      -o-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%); 
  background-image:         linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%);
  padding-bottom: 50px;
}
.main {
	padding: 10px 3%;
	position: relative;
}
.middleMsg {
	width: 90%;
	margin: 20% 5%;
	text-align: center;
}
.instruction {
  font-size: 15px;
  font-weight: bold;
	margin: 35px 3% 25px;
	color: #333;
}
.continueTip {
  margin: 5px 3% 5px;
  clear: both;
}
.continueAlert {
  margin: 5px 3% 5px;
  clear: both;
  font-size: 15px;
}
.continueAlert b {
  color: #333;
}
h1 + .instruction {
  margin-top: 10px;
}

.column.wide {
	float: none;
	clear: both;
  width: 100%;
  margin-left: 0;
}
.twoColumns .sidebar,
.twoColumns .promo {
  width: 16%;
  margin-left: 3%;
  float:  left;
}
.twoColumns .main {
  width: 79%;
  margin-left: 2%;
  float: right;
  position: relative;
  margin-bottom: 30px;
}
.twoColumns .continueMain {
  width: 79%;
}
.twoColumns .promo {
  clear: left;
}
.updateInfo {
  margin: 12px 0 ;
}
.checkingConnect .main {
  min-height: 200px;
}
.networkWrap {
  display: -webkit-box;
}
@media screen and (max-width: 980px) {
  .statusScreen h1 {
    width: 80%;
    margin: 12px auto;
    padding-left: 40px;
    position: relative;
  }
  .statusScreen h1 i {
    position: absolute;
    left: 0;
  }
  .twoColumns .main,
  .twoColumns .sidebar,
  .twoColumns .promo {
    float: none;
    width: 100%;
    margin: 0;
    position: relative; 
  }
  .postSetup #slider .main {
    padding: 0 3%;
  }
  .twoColumns .main,
  .twoColumns .promo {
    margin-bottom: 40px;
  }
  .twoColumns .main {
    padding: 10px 0;
  }
  .twoColumns .main .sectionWrap {
    width: 100%;
    padding: 10px 0;
  } 
  .twoColumns .main .sectionWrap.tabletOnly {
    padding: 10px 3% 30px;
  }  
  .sliderWrap {
    width: 100%;
    overflow: hidden;
  }    
  #slider {
    width: 100%;
    position: relative;
    z-index: 9;
    -webkit-transition: all ease-out 500ms;
       -moz-transition: all ease-out 500ms;
         -o-transition: all ease-out 500ms;
            transition: all ease-out 500ms;
    background-color: #fff;
  } 
  .twoColumns .main .sectionWrap,
  .twoColumns .promo {
    width: 80%;
    margin: 0 auto;
  }
  .promo > div {
    float:  left;
    width: 50%;
    padding: 30px;
  }
  .promo img {
    display: block;
    float: left;
  }
  .promo .textWrap {
    margin-left: 160px;
  }
}

@media screen and (max-width: 768px) {
    .statusScreen h1 {
      margin: 12px 3%;
      padding-left: 40px;
      position: relative;
    }
    .updateInfo{
      margin: 12px 3%;
    }
    .twoColumns .main .sectionWrap {
      width: 100%;
      padding: 10px 0;
    } 
    .twoColumns .main .sectionWrap.tabletOnly {
      padding: 10px 3% 30px;
    } 
    .twoColumns .promo {
      width: 100%;
    }
    .promo > div {
      float:  left;
      width: 50%;
      padding: 30px;
    }
    .promo img {
      display: block;
      float: left;
    }
    .promo .textWrap {
      margin-left: 160px;
    }
}

@media screen and (max-width: 640px) {
  .promo > div {
    float:  none;
    width: 100%;
    padding: 0  3%;
  } 
  .promo h3 {
    margin-top: 0;
  }  
  .networkWrap {
    display: block;
  }
}

@media screen and (max-width: 480px) {
    h1 {
      margin-left: 0;
    }
    #content {
      margin-bottom: 50px;
    }
    .instruction {
      font-size: 13px;
      margin: 15px 3%;
    }
    .continueTip {
      margin: 5px 3%;
    }
    .skipReg {
      display: block;
      float: none;
      margin-top: 10px;
    }
    .largeScreenOnly {
      display: none;
    }   
}
@media screen and (max-width: 280px) {
    .statusScreen H1 {
    	width: 100%;
	margin-left: 0;
	font-size: 15px;
    }
    .promo .textWrap {
      margin-left: 10px;
      width: 140px;
    }
}

/*******************************************************************
 *
 *  sidebar for setting pages
 *
 ******************************************************************/
.mainNav {
  margin: 30px 0 30px;
  padding: 0;
  color: #7d706c;
  overflow: hidden;
}
.mainNav  a {
  display: block;
  color: inherit;
  text-decoration: none;
  padding: 10px 0
}
.mainNav li li:first-child a {
  padding-top: 0;
}

.mainNav a:hover {
  text-decoration: underline;
}
.mainNav li {
  list-style: none outside none;
  border-bottom: 1px solid #ccc;
  margin-bottom: 5px;
  position: relative;
}
.mainNav li:hover {
  cursor: pointer;
}
.mainNav ul {
  display: none;
  margin-top: 10px;
}
.mainNav li li {
  border: none;
  padding: 0 10px;
  margin: 0;
}
.mainNav li i {
  display: inline-block;
  position: absolute;
  top: 10px;
  right: 0;
  left: auto;
}
.mainNav li.active > a {
  font-weight: bold;
  color: #9a258f;
}
.mainNav li li.active > a {
  font-weight: normal;
}

.promo > div{
  margin-bottom: 40px;
}
.promo h3 {
  color: #333;
}
.promo img {
  display: block;
  -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.4);
          box-shadow: 0 0 5px rgba(0,0,0,0.4);
}

@media screen and (max-width: 980px) {
  .mainNavWrap {
    width: 36%;
    margin-right: 2%;
    position: fixed;
    z-index: 9;
    top: 90px;
    left: 2%;
  }
  .mainNavWrap:after{
  	display: block;
  	content:"";
  	position: absolute;
  	z-index: -1;
  	-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.7);
  	        box-shadow: 0 0 20px rgba(0,0,0,0.7);
  	bottom:0px;
  	left:10%;
  	right:10%;
  	width:80%;
  	height:30px;
  	-moz-border-radius:100%;
  	     border-radius:100%;
  }
  .mainNav {
    width: 100%;
    background: #fff;
    margin: 0;
  }
  .mainNav li {
    padding-left: 3%;
  }
  .mainNav li:last-child {
    border: none;
  }
}

@media screen and (max-width: 768px) {
  .mainNavWrap {
    width: 36%;
    margin-right: 2%;
    position: fixed;
    z-index: 9;
    top: 90px;
    left: 2%;
  }
  .mainNavWrap:after{
  	display: block;
  	content:"";
  	position: absolute;
  	z-index: -1;
  	-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.7);
  	        box-shadow: 0 0 20px rgba(0,0,0,0.7);
  	bottom:0px;
  	left:10%;
  	right:10%;
  	width:80%;
  	height:30px;
  	-moz-border-radius:100%;
  	     border-radius:100%;
  }
  .mainNav {
    width: 100%;
    background: #fff;
    margin: 0;
  }
  .mainNav li {
    padding-left: 3%;
  }
  .mainNav li:last-child {
    border: none;
  }
}

@media screen and (max-width: 640px) {
  .mainNavWrap {
    width: 100%;
    position: fixed;
    z-index: 99;
    top: 80px;
    left: 0;
    display: none;
  }
}

@media screen and (max-width: 1136px){
  .mainNav {
    max-height: 380px;
    overflow: auto;
  }
}

/*******************************************************************
 *
 *  loading/scanning message
 *
 ******************************************************************/
.loadingMessage {
	width: 300px;
	background: #fff url('../img/loading-on-white.gif') no-repeat 50% 70%;
	padding: 20px 20px 100px;
	text-align: center;
	font-size: 16px;
	color: #9A258F;
	margin: 200px auto;
	border: 1px solid #f0f0f0;
	-webkit-box-shadow: 0 0  6px rgba(0, 0, 0, 0.35);
	   -moz-box-shadow: 0 0  6px rgba(0, 0, 0, 0.35);
	        box-shadow: 0 0  6px rgba(0, 0, 0, 0.35);
}

.loadingMessage {
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -150px;
}

.loadingMessage.wait2g,
.loadingMessage.wait5g {
	max-width: 300px;
	width: 66%;
	top: -150px;
	margin-left: -33%;
}

#scanning_bg {
	position: absolute;
	width: 100%;
	height: 120%;
	z-index: 1000;
	top: 0;
	left: 0;
	background-color: #fff;
	filter:alpha(opacity=40);
	-moz-opacity:0.4;
	-khtml-opacity: 0.4;
	opacity: 0.4;
}

#waiting,
#page_waiting {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 100;
	background-color: #fff;
        filter:alpha(opacity=40);
        -moz-opacity:0.4;
        -khtml-opacity: 0.4;
	opacity: 0.4;
}
#page_waiting {
	position: absolute;
	z-index: 80;
}

.doing,
.page_doing{
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	z-index: 1000;
}
.page_doing{
	z-index: 81;
}

/*******************************************************************
 *
 *  simple choice pages
 *
 ******************************************************************/
.simpleChoiceWrapper {
  width: 100%;
  padding: 100px 10%;
}
.column {
  position: relative;
	float: left;
  width: 48%;
  margin-left: 4%;
}
.twoColumns .sectionWrap .column.ap {
  position: relative;
	float: left;
  width: 29%;
}
.twoColumns .continueMain .column.ap {
  position: relative;
	float: left;
  width: 29%;
  margin-left: 4%;
}
.continueMain {
  word-wrap: break-word;
  word-break: break-all;
}
.status_ssid {
  word-wrap: break-word;
  word-break: break-all;
  overflow: hidden;
  text-overflow: ellipsis;
}
.column.networkStatus{
  word-wrap: break-word;
  word-break: break-all;
}
.column2 {
  position: relative;
	float: left;
  width: 29%;
  margin-left: 4%;
  word-wrap: break-word;
  word-break: break-all;
}
.column.first {
  margin-left: 0;
  z-index: 1;
}
.simpleChoice .btn {
	text-transform: uppercase;
	padding: 20px;
	width: 100%;
}
.singleBtn .btn {
	width: 48%;
	margin: 0 26%;
}
.wps.postSetup #wpsBt {
	width: 60%;
	margin: 60px 20%;
}
a.setupLater {
	float: right;
	margin: 50px 0;
}
.sameSsid {
	margin-left:4%;
	margin-top:2%;
	width:90%;
	color:#333;
	float:left;
}

.samePwd {
        margin:5px 3% 25px;
        width:100%;
        color:#333;
}

@media screen and (max-width: 640px) {
	
	.simpleChoiceWrapper h1 {
		margin: 0 0 20px 0;
	}
	.simpleChoiceWrapper {
    padding: 20px 2%;
  }
  .simpleChoiceWrapper .column,
  .main .column {
  	float: none;
    width: 100%;
    padding: 0;
    margin: 0 0 50px 0;
    border: none;
  }
  .simpleChoice .btn,
  .singleBtn .btn {
    width: 100%; 
    margin: 0;
  }
  .wps.postSetup #wpsBt {
	width: 100%;
	margin: 60px 0;
  }
  a.setupLater {
  	float: right;
	margin: 0;
  }
}
}
/*******************************************************************
 *
 * wps
 *
 ******************************************************************/
.wps div.wpsMain{
  width: 50%;
  margin: 75px 25% 0 25%;
}
.wps_bg {
  width: 400px;
  height: 278px;
}
.wps_bg img{
  padding: 0;
  margin: 0;
  height: 100%;
  width: auto;
}
.wps input.success,
.wps input.failure{
  display: none;
}
.wps p.instruction {
  text-align: center;
  margin: 75px auto;
}
.wps ul.wpsChoice {
	margin-top: 40px;
	margin-bottom: 10px;
}
.wps input[type="radio"]#pin_radio {
	margin-left: 20px;
}
.wps .simpleChoice, .wps .pinChoice {
	padding-top: 3px;
}
.wps .pinChoice input[type="text"] {
	width: 120px;
}
.wps .pinChoice .formButtons {
	margin-top: 50px;
}
@media screen and (max-width: 640px) {
  .wps div.wpsMain{
    width: 100%;
    margin: 0;
  }
  .wps p.instruction {
    margin: 20px auto;
  }
}

/*******************************************************************
 *
 *  available networks table
 *
 ******************************************************************/
.activWrap {
	position: relative;
	border: 1px solid #e8e6e5;
	border-radius: 10px;
}
.tableControl {
	overflow: hidden;
	clear: both;
}
.tableControl .refreshBtn,
.tableControl .controlBtn {
  float: right;
}
.tableControl label,
.tableControl h3,
.formTable tr td label {
  display: inline-block;
  margin-top: 8px;
  font-size: 15px;
  font-weight: bold;
  color: #7d706c;
}
.tableControl h3 span {
  font-weight: normal;
}
.tableControl input[type="checkbox"] {
  margin-right: 10px;
}
.availableNetworks {
  color: #666;
  border-bottom: 1px solid #e8e6e5;
	border-collapse: separate;
	width: 100%;
	table-layout: fixed;
}
.inactive .availableNetworks {
	opacity: 0.4;
	filter:alpha(opacity=40);
	-moz-opacity:0.4;
  	-khtml-opacity: 0.4;
}
.availableNetworks th {
	padding: 15px;
  text-align: left;
}
.availableNetworks.double th:first-child {
	width: 40%;
}
.availableNetworks.double th:first-child  + th + th {
	width: 30%;
}
.availableNetworks.single th:first-child {
	width: 60%;
}
.availableNetworks.single th:first-child  + th + th {
	width: 20%;
}
.availableNetworks td {
	padding: 10px 15px;
	max-width: 100px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
}
.availableNetworks td * {
  vertical-align: middle;
}

.availableNetworks th:first-child + th,
.availableNetworks td:first-child + td {
  border-left: 1px solid #e8e6e5;
  border-right: 1px solid #e8e6e5;
}
.availableNetworks td:first-child + td + td + td {
	display: none;
}
.availableNetworks tr:nth-child(odd) td {
	background-color: #f3f3f3;
}
.availableNetworks input[type="radio"],
.manualSelect input[type="radio"] {
	margin-right: 10px;
	margin-bottom: 3px;
}
.manualSelect {
	padding: 15px;
	margin-top: 5px;
}
.manualSelect > label {
  color: #666;
  font-weight: bold;
}
.inactive .manualSelect {
	opacity: 0.4;
	filter:alpha(opacity=40);
	-moz-opacity:0.4;
	-khtml-opacity: 0.4;
}
.availableNetworks .moreLink {
  display: none;
}
input[type="checkbox"] + .wifidev {
  /*margin: -5% 35%;*/
  position: relative !important;
}

@media screen and (max-width: 768px) {
  .tableControl .refreshBtn span {
    display: none;
  }
  .tableControl .refreshBtn i {
    display: inline-block;
    vertical-align: top;
    width: 16px;
  }
  .availableNetworks th:first-child {
  	width: 60%;
  }
  .availableNetworks th:first-child  + th,
  .availableNetworks td:first-child  + td {
  	width: 40%;
  	border-right: none;
  }
  .availableNetworks th:first-child  + th + th,
  .availableNetworks td:first-child  + td + td {
  	display: none;
  }  
}

@media screen and (max-width: 540px) {
  input[type="checkbox"] + .wifidev {
    margin: 0px;
  }
}

@media screen and (max-width: 480px) {
  .activWrap {
  	border: none;
  	border-top: 1px solid #e8e6e5;
  	padding-top: 10px;
  	border-radius: 0;
  }
  .availableNetworks {
    display: block;
    padding-bottom: 0;
    width: 100%;
  }
  .availableNetworks thead {
    display: none;
  }
  .ie9 .availableNetworks td {
    float: left;
  }
  .availableNetworks tbody, 
  .availableNetworks tr, 
  .availableNetworks th, 
  .availableNetworks td {
    border: none;
    display: block;
    padding: 0;
    text-align: left;
    white-space: nowrap;
  }
  .availableNetworks th,
  .availableNetworks td {
  	width: 100% !important;
  	max-width: 480px;
  	border-right: none;
  	position: relative;
  } 
  .availableNetworks tr:nth-child(2n+1) td {
      background: none;
  } 
  .availableNetworks th:first-child + th, 
  .availableNetworks td:first-child + td {
      border: none;   
  }
  .availableNetworks tr {
    margin-bottom: 10px;
  }
  .availableNetworks td input{
    display: block;
    position: absolute;
    left: 0;
    top: 2px;
  }
  .availableNetworks .phoneLabel {
    display: inline-block;
    font-weight: bold;
    margin-left: 30px;
  }
  .availableNetworks .phoneLabel:after {
    content: ":";
    margin-right: 10px;
  }
  .manualSelect {
    padding: 15px 0;
  }
  .manualSelect input[type="radio"] {
      margin-right: 12px;
  }
  .hideOnMobile td {
    display: none;
  }
  .availableNetworks .moreLink {
    display: block;
    padding: 5px 0;
  }
}

/*******************************************************************
 *
 *  signal strength icons
 *
 ******************************************************************/
i[class*='signalStrength'] {
  display: inline-block;
  width: 30px;
  height: 22px;
  background-image: url('../img/iconSprite2x.png');
  background-repeat: no-repeat;
  background-size: 234px 244px;
  margin-right: 20px;
}
.ie8 i[class*='signalStrength'] {
  background-image: url('../img/iconSprite.png');
}
.dnintg-no-bars {
  background-position:0 -223px;
}
.dnintg-one-bar {
  background-position:-42px -223px;
}
.dnintg-two-bars {
  background-position: -81px -223px;
}
.dnintg-three-bars {
  background-position: -121px -223px;
}
.dnintg-four-bars {
  background-position: -158px -223px;
}


/*******************************************************************
 *
 *  manual network input
 *
 ******************************************************************/
.manualNetworkInput {
	padding: 0 10px;
	margin-top: 10px;
}
.inactive .manualSelect,
.inactive .manualNetworkInput {
	opacity: 0.4;
	filter:alpha(opacity=40);
	-moz-opacity:0.4;
	-khtml-opacity: 0.4;
}
.manualNetworkInput label {
	display: block;
	margin-bottom: 5px;
}
.formElements select {
	height: 24px;
	padding-top: 3px;
}
.formElements select option{
	height: 20px;
	padding-top: 5px;
}
.manualNetworkInput,
.manualNetworkInput .pwdInput,
.securityOptionsWrap {
	display: none;
	margin-bottom: 0;
}
/*
.formElements .wpa input[type='password'],
.formElements .wpa input[type='text'] {
	display: inline-block;
	width: 70%;
	margin: 0 8px 0 0;
}*/

/*.formElements .wpa input[type='checkbox'] {
	display: inline-block;
	margin: 0 8px 8px 0;
}

.manualNetworkInput .wep input {
	display: inline-block;
	width: 100%;
	margin: 0;
}*/
.wpa,
.wep {
  display: none;
}

@media screen and (max-width: 480px) {
.manualNetworkInput {
    margin-top: 20px;
    padding: 0 0 20px 0;
    border-bottom: 1px solid #ccc;
    margin-bottom: 20px;
  }
}

/*******************************************************************
 *
 *  form elements and reasons container
 *
 ******************************************************************/
.formElements {
	padding: 0;
	margin: 20px 0;
}
.formElements.noBottomMargin {
  margin-bottom: 0;
}
.formElements.noTopMargin {
  margin-top: 0;
}
.formElements > li {
	list-style: none outside none;
	padding: 8px 0;
}
.formElements .elementsInline * {
  display: inline-block;
}
.formElements hr,
.formTable hr{
  margin: 5px 0;
}
.formElements .hdr {
	font-weight: bold;
}
.formElements label {
	display: inline-block;
	margin-bottom: 5px;
}
input[type=submit] {
  -webkit-border-radius:0px;
}
input[type="text"], 
input[type="email"], 
input[type="password"], 
input[type="tel"], 
input[type="number"], 
input[type="url"], 
textarea, 
select ,
#purchaseDate{
  border: 1px solid #7D706C;
  border-radius: 4px;
  box-shadow: 0 2px 3px -2px rgba(0, 0, 0, 0.3) inset;
  color: #7D706C;
  display: block;
  margin: 0;
  padding: 0.2em;
  width: 100%;
}
input[type="text"]::-ms-clear,
input[type="password"]::-ms-reveal {
  display: none;
}
input.alert {
	border: 2px solid red
}
/*.formElements [type="checkbox"] {
	margin-right: 10px;
	width: auto;
	display: inline-block;
}*/
.reasons {
	margin: 20px  0 0 20px;
	padding: 0;
}
.reasons li {
	list-style:  disc outside none;
	margin-bottom: 10px;
}
.reasons .hdr {
	list-style-type: none;
	margin-left: -20px;
	font-weight: bold;
}

/*******************************************************************
 *
 *  enter password page
 *
 ******************************************************************/

.enterPwd .main,
.wifiMain {
  width: 100%;
  margin: 20px auto 15px;
}

.main.regionSet {
  width: 48%;
  margin: 20px auto 15px;
}

@media screen and (max-width: 480px) {
  .enterPwd .main,
  .wifiMain,
  .main.regionSet {
    width: 100%;
    margin: 20px 0 5px;
  }
  
}

/*******************************************************************
 *
 *  enter security options extender page
 *
 ******************************************************************/
.networkInput {
  border: 1px solid #CCCCCC;
  margin-top: 10px;
  padding: 20px 0 10px;
}
.networkInput .formElements {
  margin: 0;
}
.networkInput li {
  padding: 8px 20px;
  height: auto;
}
.networkInput li li {
  padding: 0;
}
.networkInput .diffPwd,
.networkInput .pwdInput {
  display: none;
  width: 100%;
}
.networkInput .pwdInput {
  padding-top: 10px;
}
.networkInput .whatPwd {
  margin: 0;
}
.networkInput .securityOptions {
  margin-bottom: 0;
}

@media screen and (max-width: 480px) {
  .networkInput {
    border: none;
    margin-top: 10px;
    padding: 0 0 10px;
  }
  #securitySettings h2,
  #accessPointSettings h2 {
    margin: 10px 0 0 20px;
  }
  
  
    
}

/*******************************************************************
 *
 *  enter security options access point page
 *
 ******************************************************************/
.enterAccessPointSettings .networkInput .diffPwd {
  display: block;
}
 
 
/*******************************************************************
 *
 *  confirmation  page
 *
 ******************************************************************/
.setup.success h1 {
  font-size: 18px;
  text-align: center;
  margin-top: 30px;
}
.setup.success .instruction {
  font-weight: normal;
  text-align: center;
}
.setup.success .column {
  width: 38%;
  margin: 0;
}
.setup.success .column.first {
  width: 62%;
}
.setup.success .networkStatus {
  padding-top: 50px;
}
.setup.success .networkStatus ul {
  margin: 0 0 30px;
}
.networkStatus li {
  color: #7d706c;
  list-style: none none outside;
  margin-bottom: 10px;
  white-space: pre-wrap;
}
.networkStatus h2 {
  font-size: 15px;
}
.networkStatus h2 i {
  position: relative;
  top: 2px;
  left: 4px;
}

@media screen and (max-width: 768px) {
  .setup.success .column,
  .setup.success .column.first {
    width: 100%;
    margin: 0;
  }
  .networkStatus > div {
    float: left;
    margin-left: 7%;
  }
  
}

@media screen and (max-width: 480px) {
  .connectionState {
    margin-left: 0;
  }
  .networkStatus > div {
    float: none;
    margin-left: 3%;
  }
}


/*******************************************************************
 *
 *  connection states
 *
 ******************************************************************/
.connectionState {
  width: 524px;
  height: 348px;
  position: relative;
  color: #FFFFFF;
  font-size: 12px;
  float: right;
  margin-right: 60px;
 }
.connectionState img {
  display: none;
}
 .connectionState.extender  div {
   float: left;
 }
.connectionState.extender > div{
  width: 100%;
  height: 100%;
  background: url('../img/status_signal_bg.png') no-repeat left;
  background-size: 100% 100%;
}
.connectionState.extender > div > div:first-child {
  width: 185px;
  height: 348px;
  background: url('../img/product1.png') no-repeat left;
  background-size: 100% 100%;
  margin: 0 0 0 245px;
}
.connectionState.extender > div > div:first-child + div{
  width: 290px;
  height: 162px;
  background: url('../img/tip_bg.png') no-repeat left;
  background-size: 100% 100%;
  position: absolute;
  top: 90px;
  left: 0;
}
.connectionState.extender > div > div:first-child  + div + div{
  width: 98px;
  height: 33px;
  background: url('../img/black_box.png') no-repeat left;
  background-size: 100% 100%;
  position: absolute;
  top: 150px;
  left: 290px;
}
.connectionState.extender > div > div:first-child  + div > div > div {
  float: left;
  display: none;
}
.connectionState.extender.green > div > div:first-child  + div > div > div:first-child {
  width: 200px;
  height: 33px;
  margin: 35px 0 0 15px;
  display: block;
}
.connectionState.extender.green > div > div:first-child  + div > div > div:first-child + div{
  width: 49px;
  height: 49px;
  background: url('../img/green_btn1.png') no-repeat;
  background-size: 100% 100%;
  margin: 25px 0 0 5px;
  display: block;
}
.connectionState.extender.green > div > div:first-child  + div > div > div:first-child + div + div {
  width: 200px;
  height: 33px;
  margin: 30px 0 0 15px;
  display: block;
}
.connectionState.extender.green > div > div:first-child  + div > div > div:first-child + div + div + div {
  width: 49px;
  height: 49px;
  background: url('../img/green_btn2.png') no-repeat;
  background-size: 100% 100%;
  margin: 15px 0 0 5px;
  display: block;
}
.connectionState.extender.gray > div > div:first-child  + div > div > div:first-child + div + div + div + div {
  width: 100px;
  height: 33px;
  margin: 35px 0 0 15px;
  display: block;
}
.connectionState.extender.gray > div > div:first-child  + div > div > div:first-child + div + div + div + div + div {
  width: 260px;
  height: 33px;
  margin: 25px 0 0 15px;
  display: block;
}
.connectionState.extender.orange > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div,
.connectionState.extender.red > div > div:first-child  + div > div > div:first-child  + div + div + div + div + div + div + div{
  width: 140px;
  height: 33px;
  margin: 35px 0 0 15px;
  display: block;
}
.connectionState.extender.orange > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div ,
.connectionState.extender.red > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div  {
  width: 98px;
  height: 49px;
  margin: 30px 0 0 10px;
  display: block;
}
.connectionState.extender.orange.closerRouter > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div + div,
.connectionState.extender.red.closerRouter > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div + div  ,
.connectionState.extender.orange.closerExtender > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div + div + div,
.connectionState.extender.red.closerExtender > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div + div + div {
  width: 260px;
  height: 33px;
  margin: 30px 0 0 15px;
  font-style: italic;
  display: block;
}
.connectionState.extender.orange.closerRouter > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div {
  background: url('../img/orange_btn1.png') no-repeat;
  background-size: 100% 100%;
}
.connectionState.extender.orange.closerExtender > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div {
  background: url('../img/orange_btn2.png') no-repeat;
  background-size: 100% 100%;
}
.connectionState.extender.red.closerRouter > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div  {
  background: url('../img/red_btn1.png') no-repeat;
  background-size: 100% 100%;
}
.connectionState.extender.red.closerExtender > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div  {
  background: url('../img/red_btn2.png') no-repeat;
  background-size: 100% 100%;
}

@media screen and (max-width: 480px) {
  .connectionState {
    width: 312px;
    height: 187px;
    font-size: 11px;
    float: left;
  }
  
  .connectionState.extender > div > div:first-child {
  width: 92px;
  height: 174px;
  margin: 10px 0 0 155px;
}
.connectionState.extender > div > div:first-child + div{
  width: 180px;
  height: 102px;
  top: 45px;
}
.connectionState.extender > div > div:first-child  + div + div{
  width: 48px;
  height: 16px;
  position: absolute;
  top: 85px;
  left: 178px;
}

.connectionState.extender.green > div > div:first-child  + div > div > div:first-child {
  width: 95px;
  height: 33px;
  margin: 20px 0 0 15px;
  display: block;
}
.connectionState.extender.green > div > div:first-child  + div > div > div:first-child + div{
  width: 37px;
  height: 37px;
  margin: 15px 0 0 5px;
}
.connectionState.extender.green > div > div:first-child  + div > div > div:first-child + div + div {
  width: 95px;
  height: 33px;
  margin: 5px 0 0 15px;
}
.connectionState.extender.green > div > div:first-child  + div > div > div:first-child + div + div + div {
  width: 37px;
  height: 37px;
  margin: 5px 0 0 5px;
}
.connectionState.extender.gray > div > div:first-child  + div > div > div:first-child + div + div + div + div {
  width: 105px;
  height: 33px;
  margin: 10px 0 0 5px;
  display: block;
}
.connectionState.extender.gray > div > div:first-child  + div > div > div:first-child + div + div + div + div + div {
  width: 160px;
  height: 33px;
  margin: 10px 0 0 5px;
  display: block;
}
.connectionState.extender.orange > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div,
.connectionState.extender.red > div > div:first-child  + div > div > div:first-child  + div + div + div + div + div + div + div{
  width: 95px;
  height: 33px;
  margin: 20px 0 0 5px;
  display: block;
}
.connectionState.extender.orange > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div ,
.connectionState.extender.red > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div  {
  width: 70px;
  height: 35px;
  margin: 15px 0 0 0;
  display: block;
}
.connectionState.extender.orange.closerRouter > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div + div,
.connectionState.extender.red.closerRouter > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div + div  ,
.connectionState.extender.orange.closerExtender > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div + div + div,
.connectionState.extender.red.closerExtender > div > div:first-child  + div > div > div:first-child + div + div + div + div + div + div + div + div + div + div {
  width: 160px;
  height: 33px;
  margin: 10px 0 0 5px;
  font-style: italic;
  display: block;
}
.state {
   position: absolute;
   top: 0px;
   left: 0px;
 }
}

.connectionState.accesspoint > div{
  width: 518px;
  height: 340px;
  float: right;
  background-image: url('../img/status_signal_bg.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: right;
}
.connectionState.accesspoint > div > div {
  display: none;
}
.connectionState.accesspoint > div > div:first-child {
  width: 185px;
  height: 340px;
  float: right;
  margin-right: 93px;
  background-image: url('../img/product1.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: right;
  display: inline-block;
}
.ie9 .connectionState.accesspoint > div > div:first-child {
  margin-right: 90px;
}
.statusScreen h1 span {
  color: #333;
}
.statusScreen h1.extender.green > span.failed,
.statusScreen h1.extender.green > span.poor,
.statusScreen h1.extender.orange > span.failed,
.statusScreen h1.extender.orange > span.success,
.statusScreen h1.extender.red > span.failed,
.statusScreen h1.extender.red > span.success,
.statusScreen h1.extender.gray > span.success,
.statusScreen h1.extender.gray > span.poor,
.statusScreen h1.gray > i.dnintg-checkmark,
.statusScreen h1.extender > span.accesspoint,
.statusScreen h1.accesspoint.green > span.failed,
.statusScreen h1.accesspoint.gray > span.success,
.statusScreen h1.accesspoint > span.extender{
  display: none;
}
.statusScreen div.parentDiv.accesspoint > div.currentConnections.black_line,
.statusScreen div.parentDiv.accesspoint > div.currentConnections.connInternet,
.statusScreen div.parentDiv.accesspoint > div.currentConnections.connRouter,
.statusScreen div.parentDiv.accesspoint > div.connInternet_string,
.statusScreen div.parentDiv.accesspoint > div.connWifiExtender_string,
.statusScreen div.parentDiv.accesspoint > div.connRouter_string{
  display: none;
}
.statusScreen div.parentDiv.extender > div.currentConnections.black_long_line,
.statusScreen div.parentDiv.extender > div.currentConnections.connInternet2,
.statusScreen div.parentDiv.extender > div.apInternet_string,
.statusScreen div.parentDiv.extender > div.accessPoint_string{
  display: none;
}
.statusScreen div.parentDiv.extender > div.loc1.green > div.currentConnections.location1.bestRouter_24g{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc1.orange > div.currentConnections.location1.goodRouter_24g{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc1.red > div.currentConnections.location1.poorRouter_24g{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc1.gray > div.currentConnections.location1.noConnectedRouter_24g{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc1.disable > div.currentConnections.location1.disableRouter_24g{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc4.green > div.currentConnections.location4.bestRouter_5g{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc4.green_dark > div.currentConnections.location4.bestRouter_dark{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc4.orange > div.currentConnections.location4.goodRouter_5g{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc4.orange_dark > div.currentConnections.location4.goodRouter_dark{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc4.red > div.currentConnections.location4.poorRouter_5g{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc4.red_dark > div.currentConnections.location4.poorRouter_dark{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc4.gray > div.currentConnections.location4.noConnectedRouter_5g{
  display: block;
}
.statusScreen div.parentDiv.extender > div.loc4.disable > div.currentConnections.location4.disableRouter_5g{
  display: block;
}
.statusScreen div.parentDiv > div.loc2.green > div.currentConnections.location2.bestClient_24g{
  display: block;
}
.statusScreen div.parentDiv > div.loc2.orange > div.currentConnections.location2.bestClient_24g{
  display: block;
}
.statusScreen div.parentDiv > div.loc2.red > div.currentConnections.location2.bestClient_24g{
  display: block;
}
.statusScreen div.parentDiv > div.loc2.gray > div.currentConnections.location2.noConnectedClient_24g{
  display: block;
}
.statusScreen div.parentDiv > div.loc2.disable > div.currentConnections.location2.disableClient_24g{
  display: block;
}
.statusScreen div.parentDiv > div.loc3.green > div.currentConnections.location3.bestClient_5g{
  display: block;
}
.statusScreen div.parentDiv > div.loc3.green_dark > div.currentConnections.location3.bestClient_dark{
  display: block;
}
.statusScreen div.parentDiv > div.loc3.orange > div.currentConnections.location3.bestClient_5g{
  display: block;
}
.statusScreen div.parentDiv > div.loc3.orange_dark > div.currentConnections.location3.bestClient_5g{
  display: block;
}
.statusScreen div.parentDiv > div.loc3.red > div.currentConnections.location3.bestClient_5g{
  display: block;
}
.statusScreen div.parentDiv > div.loc3.red_dark > div.currentConnections.location3.bestClient_5g{
  display: block;
}
.statusScreen div.parentDiv > div.loc3.gray > div.currentConnections.location3.noConnectedClient_5g{
  display: block;
}
.statusScreen div.parentDiv > div.loc3.disable > div.currentConnections.location3.disableClient_5g{
  display: block;
}
.statusScreen div.parentDiv > div.parentDiv.location3.disable > div.currentConnections.location3.disableClient_5g{
  display: block;
}

.statusScreen h1.extender.orange > i.dnintg-checkmark {
  background-position: -62px -38px;
}

.statusScreen h1.extender.red > i.dnintg-checkmark {
  background-position: -62px -76px;
}

.statusScreen h1.extender.green.clock > i.dnintg-checkmark,
.statusScreen h1.extender.orange.clock > i.dnintg-checkmark,
.statusScreen h1.extender.red.clock > i.dnintg-checkmark,
.statusScreen h1.extender.green.block > i.dnintg-checkmark,
.statusScreen h1.extender.orange.block > i.dnintg-checkmark,
.statusScreen h1.extender.red.block > i.dnintg-checkmark {
  display: none;
}

.statusScreen h1.extender.green.clock > i.dnintg-greenclock,
.statusScreen h1.extender.orange.clock > i.dnintg-greenclock,
.statusScreen h1.extender.red.clock > i.dnintg-greenclock,
.statusScreen h1.extender.green.block > i.dnintg-greenclock,
.statusScreen h1.extender.orange.block > i.dnintg-greenclock,
.statusScreen h1.extender.red.block > i.dnintg-greenclock {
  display: inline-block;
}

.statusScreen h1.extender.green.block > span.success,
.statusScreen h1.extender.orange.block > span.success,
.statusScreen h1.extender.red.block > span.success,
.statusScreen h1.gray.noplug > span.failed {
  display: none;
}

.statusScreen h1.extender.green.block > span.normal,
.statusScreen h1.extender.orange.block > span.normal,
.statusScreen h1.extender.red.block > span.normal {
  display: inline-block;
  color: #333;
}

.statusScreen h1.gray.noplug > span.unplug {
  display: inline-block;
}

.setup div.title.extender .accesspoint,
.setup div.title.extender.green .failed,
.setup div.title.extender.orange .failed,
.setup div.title.extender.red .failed,
.setup div.title.extender.gray .success,
.setup div.title.accesspoint .extender,
.setup div.title.accesspoint.gray .success,
.setup div.title.accesspoint.green .failed,
.setup div.networkStatus.extender .accesspoint,
.setup div.networkStatus.accesspoint h2.extender {
  display: none;
}

.setup div.title.extender .success,
.setup div.title.extender .failed,
.setup div.title.accesspoint .success,
.setup div.title.accesspoint .failed {
  text-align: center;
}

.setup div.title p {
  font-weight: normal;
}

@media screen and (max-width: 770px) {
  .connectionState {
    float: left;
    margin-left: 10px;
  }
  .connectionState.accesspoint {
    float: none;
    margin: 0;
  }
}

@media screen and (max-width: 480px) {
  .connectionState.accesspoint > div {
    width: 269px;
    height: 170px;
    margin: 0;
	float: none;
    background-repeat: no-repeat;
  }
  
  .connectionState.accesspoint > div > div:first-child {
    width: 92px;
    height: 170px;
    float: none;
    margin-left: 127px;
  }
}
 
 /*******************************************************************
  *
  *  current connection
  *
  ******************************************************************/
.wifiStatus {
  border: 0 none;
  width: 100%;
}
.wifiStatus td {
  color: #7d706c;
  padding: 0 0 8px 0;
}
.wifiStatus h2 {
  color: #333333;
  font-size: 13px;
}

.currentConnection.extender {
  width: 646px;
  height: 224px;
  margin: 30px 50px;
}

.currentConnection div {
  font-size: 9px;
  font-weight: bold;
  color: #333;
}
.currentConnection > div{
  width: 100%;
  height: 100%;
  position: relative;
}

.currentConnection > div  div {
  float: left;
  position: relative;
}

.currentConnection img {
  display: none;
}
.ie8 .currentConnection img {
  display: block;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}
.currentConnection > div > div:first-child > div,
.currentConnection > div > div:first-child + div > div {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.currentConnection.extender > div > div:first-child{
  background-image: url('../img/currentConnection1.png');
  background-size: 100% 100%;
  width: 171px;
  height: 100%;
}
.currentConnection.extender > div > div:first-child + div{
  background-image: url('../img/currentConnection2.png');
  background-size: 100% 100%;
  width: 474px;
  height: 100%;
}

.currentConnection.extender > div  > div:first-child  > div >  div:first-child {
  width: 83px;
  height: 44px;
  background: url('../img/internet1.png') no-repeat;
  background-size: 100% 100%;
  margin: 90px 0 0 0;
}

.currentConnection.extender > div  > div:first-child + div  > div > div:first-child{
  width: 87px;
  height: 160px;
  background: url('../img/product2.png') no-repeat;
  background-size: 100% 100%;
  margin: 5px 0 0 0;
}

.currentConnection > div  > div:first-child + div.green > div > div:first-child + div,
.currentConnection > div  > div:first-child + div.orange > div > div:first-child + div,
.currentConnection > div  > div:first-child + div.red > div > div:first-child + div {
  width: 160px;
  height: 28px;
  margin: 100px 0 0 200px;
}
.currentConnection > div  > div:first-child + div.green > div > div:first-child + div > div,
.currentConnection > div  > div:first-child + div.orange > div > div:first-child + div > div,
.currentConnection > div  > div:first-child + div.red > div > div:first-child + div > div {
  width: 160px;
  height: 28px;
  background: url('../img/connectedIcon.png') no-repeat;
  background-size: 100% 100%;
  text-indent: -9999px;
  margin: 0;
}

.currentConnection > div  > div:first-child + div.gray > div > div:first-child + div > div {
  text-indent: 0;
  width: 200px;
  height: 28px;
  margin: 100px 0 0 185px;
  font-size: 18px;
  color: #FFFFFF;
  word-wrap: break-word;
  white-space: normal;
}

.currentConnection.extender > div  > div:first-child > div > div:first-child + div{
  top: 145px;
  left: -7px;
  position: absolute;
  width: 60px;
  word-wrap: break-word;
  white-space: normal;
  text-transform: uppercase;
  text-align: center;
}
.currentConnection.extender > div  > div:first-child > div > div:first-child + div + div{
  top: 145px;
  left: 53px;
  position: absolute;
  width: 50px;
  word-wrap: break-word;
  white-space: normal;
  text-transform: uppercase;
  text-align: center;
}
.currentConnection.extender > div  > div:first-child + div > div > div:first-child + div + div{
  top: 175px;
  left: 0;
  width: 90px;
  position: absolute;
  word-wrap: break-word;
  white-space: normal;
  text-transform: uppercase;
  text-align: center;
}
.connectionState.green > div,
.currentConnection > div > div.green{
  background-color: #449b45;
}

.connectionState.orange > div,
.currentConnection > div > div.orange{
  background-color: #f79320;
}
.connectionState.red > div,
.currentConnection > div > div.red{
  background-color: #ed2024;
}
.connectionState.gray > div,
.currentConnection > div > div.gray{
  background-color: #BEB7B5;
}

.currentConnection.accesspoint {
  width: 595px;
  height: 223px;
  margin: 40px 70px;
}
.currentConnection.accesspoint > div > div:first-child{
  background-image: url('../img/currentConnectionAP1.png');
  background-size: 100% 100%;
  width: 121px;
  height: 100%;
}
.currentConnection.accesspoint > div > div:first-child + div{
  background-image: url('../img/currentConnectionAP2.png');
  background-size: 100% 100%;
  width: 474px;
  height: 100%;
}

.currentConnection.accesspoint > div  > div:first-child > div > div:first-child,
.currentConnection.accesspoint > div  > div:first-child > div > div:first-child + div + div,
.currentConnection.accesspoint > div  > div:first-child  + div > div > div:first-child + div + div,
.currentConnection.extender > div  > div:first-child + div > div > div:first-child + div + div + div{
  display: none;
}

.currentConnection.accesspoint > div > div:first-child + div > div > div:first-child{
  width: 87px;
  height: 160px;
  background: url('../img/product2.png') no-repeat;
  background-size: 100% 100%;
}

.currentConnection.accesspoint > div  > div:first-child > div > div:first-child + div {
  top: 145px;
  left: 0;
  position: absolute;
}
.currentConnection.accesspoint > div  > div:first-child  + div > div > div:first-child + div + div + div{
  top: 160px;
  left: 10px;
  position: absolute;
}

.sectionWrap {
  position: relative;
}
.withBgGradient {
  background: #fff;
  background-image: -webkit-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%); 
  background-image:    -moz-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%);
  background-image:     -ms-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%); 
  background-image:      -o-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%); 
  background-image:         linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%);
  margin-bottom: 50px;
}
.ie8 .withBgGradient,
.ie9 .withBgGradient {
  border: 1px solid #f5f5f5;
}
.tabletOnly.withBgGradient {
  background: #fff;
}
.ie8 .tabletOnly.withBgGradient,
.ie9 .tabletOnly.withBgGradient {
  border: none;
}
.withBottomShadow:before {
  display: block;
	content:"";
	position: absolute;
	z-index: -1;
	-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.7);
	        box-shadow: 0 0 20px rgba(0,0,0,0.7);
	bottom:0px;
	left:10%;
	right:10%;
	width:80%;
	height:40px;
	-moz-border-radius:100%;
	border-radius:100%;
}
.twoColumns .main .tabletOnly.withBottomShadow {
  margin-top: 20px;
}
.tabletOnly.withBottomShadow:before {
  content: none;
}
.sectionWrap .buttonWrap {
  border-top: 1px solid #dcd9d8;
  padding: 5px 0 20px;
}
.version {
  margin-bottom: 20px;
}
.version li {
  color: #333;
  float: left;
  margin-right: 20px;
}
.networkStatus i {
  margin-right: 10px;
} 

@media screen and (max-width: 768px) {
    .tabletOnly.withBottomShadow {
      background: #fff;
      background-image: -webkit-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%); 
      background-image:    -moz-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%);
      background-image:     -ms-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%); 
      background-image:      -o-linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%); 
      background-image:         linear-gradient(top,  #fff 0%, #fff 80%, #f1f1f1 100%);
      margin-bottom: 50px;
      position: relative;
    }
    .tabletOnly.withBottomShadow:before {
      display: block;
    	content:"";
    	position: absolute;
    	z-index: -1;
    	-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.7);
    	        box-shadow: 0 0 20px rgba(0,0,0,0.7);
    	bottom:0px;
    	left:10%;
    	right:10%;
    	width:80%;
    	height:40px;
    	-moz-border-radius:100%;
    	border-radius:100%;
    }
}

@media screen and (max-width: 600px) {
  .currentConnection.extender {
    width: 276px;
    height: 108px;
    margin: 0 auto 30px;
  }
  .currentConnection.extender > div > div:first-child{
    width: 72px;
	height: 100px;
  }
  .currentConnection.extender > div > div:first-child + div{
    width: 174px;
	height: 100px;
  }
  .currentConnection.extender > div  > div:first-child + div  > div > div:first-child {
    width: 55px;
    height: 100px;
    background: url('../img/product2.png') no-repeat;
    background-size: 100% 100%;
    margin: 0;
	position: absolute;
	top: -15px;
	left: -10px;
	margin: 0
  }
  .currentConnection.extender > div  > div:first-child  > div > div:first-child{
    width: 33px;
    height: 73px;
    background: url('../img/internet2.png') no-repeat;
    background-size: 100% 100%;
    margin: 0 0 0 10px;
  }
  .currentConnection.extender > div  > div:first-child + div.green > div > div:first-child + div,
  .currentConnection.extender > div  > div:first-child + div.orange > div > div:first-child + div,
  .currentConnection.extender > div  > div:first-child + div.red > div > div:first-child + div{
    width: 75px;
    height: 13px;
    margin: 45px 0 0 95px;
  }
  .currentConnection.extender > div  > div:first-child + div.green > div > div:first-child + div > div,
  .currentConnection.extender > div  > div:first-child + div.orange > div > div:first-child + div > div,
  .currentConnection.extender > div  > div:first-child + div.red > div > div:first-child + div > div{
    width: 75px;
    height: 13px;
    margin: 0;
    text-indent: -9999px;
  }
  .currentConnection.extender > div  > div:first-child + div.gray > div > div:first-child + div > div{
 	text-indent: 0;
	width: 90px;
	height: 13px;
	margin: 45px 0 0 95px;
	font-size: 10px;
	color: #FFFFFF;
  }
  .currentConnection.extender > div  > div:first-child  > div > div:first-child + div{
    top: -15px;
    left: 3px;
    position: absolute;
  }
  .currentConnection.extender > div  > div:first-child  > div > div:first-child + div + div{
    top: 80px;
    left: 5px;
    position: absolute;
  }
  .currentConnection.extender > div  > div:first-child + div > div > div:first-child + div + div{
    top: 90px;
    left: -15px;
    position: absolute;
  }
  .currentConnection.accesspoint{
    height: 104px;
    width: 267px;
    margin: 0 auto 30px;
  }
  .currentConnection.accesspoint > div > div:first-child{
  width: 54px;
}
.currentConnection.accesspoint > div > div:first-child + div{
  width: 213px;
}
  .currentConnection.accesspoint > div > div:first-child + div > div > div:first-child  {
    width: 55px;
    height: 100px;
    background: url('../img/product2.png') no-repeat;
    background-size: 100% 100%;
    position: absolute;
	top: -15px;
	left: 0;
	margin: 0;
  }
  .currentConnection.accesspoint > div  > div:first-child > div > div:first-child + div{
    top: 70px;
    left: -10px;
    position: absolute;
  }
  .currentConnection.accesspoint > div  > div:first-child + div > div > div:first-child + div + div + div{
    top: 95px;
    left: -5px;
    position: absolute;
  }
  .currentConnection.accesspoint > div  > div:first-child + div.green > div > div:first-child + div {
    margin: 45px 0 0 125px;
  }
  .currentConnection.accesspoint > div  > div:first-child + div.green > div > div:first-child + div > div {
    width: 75px;
    height: 13px;
    background: url('../img/connectedIcon.png') no-repeat;
    background-size: 100% 100%;
    margin: 0;
    text-indent: -9999px;
  }

  .currentConnection.accesspoint > div  > div:first-child + div.gray > div > div:first-child + div  > div{
 	text-indent: 0;
	width: 90px;
	height: 13px;
	margin: 45px 0 0 125px;
	font-size: 10px;
	color: #FFFFFF;
  }
}

@media screen and (max-width: 480px) {
  .processButtons .btn.connectAgain {
      width: 180px;
  }
}  

@media screen and (max-width: 280px) {
  .currentConnection div {
  	font-size: 6px;
  }
  .currentConnection.extender {
  	width: 160px;
	height: 62px;
	margin: 0 auto 19px;
  }
  .currentConnection.extender > div > div:first-child{
    width: 44px;
    height: 58px;
  }
  .currentConnection.extender > div > div:first-child + div{
    width: 116px;
    height: 58px;
  }
  .currentConnection.extender > div  > div:first-child + div > div > div:first-child {
    width: 31px;
    height: 58px;
    margin: 0;
    position: absolute;
    top: -8px;
    left: -5px;
  }
  .currentConnection.extender > div  > div:first-child  > div > div:first-child{
    width: 20px;
    height: 42px;
    margin: 0 0 0 2px;
  }
  .currentConnection.extender > div  > div:first-child + div.green > div > div:first-child + div,
  .currentConnection.extender > div  > div:first-child + div.orange > div > div:first-child + div,
  .currentConnection.extender > div  > div:first-child + div.red > div > div:first-child + div {
    width: 43px;
    height: 7px;
    margin: 25px 0 0 65px;
  }
  .currentConnection.extender > div  > div:first-child + div.green > div > div:first-child + div > div,
  .currentConnection.extender > div  > div:first-child + div.orange > div > div:first-child + div > div,
  .currentConnection.extender > div  > div:first-child + div.red > div > div:first-child + div > div {
    width: 43px;
    height: 7px;
    margin: 0;
    text-indent: -9999px;
  }
  .currentConnection.extender > div  > div:first-child + div.gray > div > div:first-child + div > div {
        text-indent: 0;
        width: 51px;
        height: 7px;
        margin: 25px 0 0 64px;
        font-size: 6px;
        color: #FFFFFF;
  }
  .currentConnection.extender > div  > div:first-child > div > div:first-child + div{
    top: -8px;
    left: 0;
    position: absolute;
  }
  .currentConnection.extender > div  > div:first-child > div > div:first-child + div + div{
    top: 46px;
    left: 1px;
    position: absolute;
  }
  .currentConnection.extender > div  > div:first-child + div > div > div:first-child + div + div{
    top: 51px;
    left: -11px;
    position: absolute;
  }
  .currentConnection.accesspoint{
    height: 60px;
    width: 153px;
    margin: 0 auto 17px;
  }
  .currentConnection.accesspoint > div > div:first-child{
    width: 31px;
  }
  .currentConnection.accesspoint > div > div:first-child + div{
    width: 122px;
  }
  .currentConnection.accesspoint > div > div:first-child + div > div > div:first-child  {
    width: 31px;
    height: 58px;
    position: absolute;
    top: -8px;
    left: -6px;
    margin: 0;
  }
  .currentConnection.accesspoint > div  > div:first-child > div > div:first-child + div{
    top: 40px;
    left: -6px;
    position: absolute;
  }
  .currentConnection.accesspoint > div  > div:first-child + div > div > div:first-child + div + div + div{
    top: 54px;
    left: -6px;
    position: absolute;
  }
  .currentConnection.accesspoint > div  > div:first-child + div.green > div > div:first-child + div {
    width: 43px;
    height: 7px;
    margin: 25px 0 0 72px;
  }
  .currentConnection.accesspoint > div  > div:first-child + div.green > div > div:first-child + div > div {
    width: 43px;
    height: 7px;
    margin: 0;
    text-indent: -9999px;
  }

  .currentConnection.accesspoint > div  > div:first-child + div.gray > div > div:first-child + div > div{
        text-indent: 0;
        width: 52px;
        height: 7px;
	font-size: 5px;
	color: #FFFFFF;
	margin: 25px 0 0 72px;
  }
}
/*******************************************************************
 *
 *  modal overlay
 *
 ******************************************************************/
#modalOverlay.active {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background-color: #fff;
  opacity: 0.4;
  filter:alpha(opacity=40);
  -moz-opacity:0.4;
  -khtml-opacity: 0.4;
}
.loadingModal {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 101;
  background: transparent url('../img/loading-on-white.gif') no-repeat 50% 50% ;
  opacity: 0.4; 
  filter:alpha(opacity=40);
  -moz-opacity:0.4;
  -khtml-opacity: 0.4;
}
.modalBox {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 102;
  width: 400px;
  padding: 30px;
  margin: 200px 0 0 -200px;
  border: 1px solid #ccc;
  background: #fff;
  -moz-border-radius: 5px; 
  -webkit-border-radius: 5px; 
  -o-border-radius: 5px; 
  border-radius: 5px;
  -webkit-box-shadow:0 0 5px rgba(0,0,0,0.4);
  box-shadow:0 0 5px rgba(0,0,0,0.4); 
}
.modalBox.form {
  width: 70%;
  margin: 200px 0 0;
  left: 15%;
}
.isTablet .modalBox.form {
  width: 90%;
  margin: 200px 0 0;
  left: 5%;
}
.modalBox.hidden {
  display: none;
}
.btn.close {
  float: right;
  text-transform: uppercase;
}
.boxButtons .btn{
  width: 140px;
  margin-left: 10px;
  text-align: center;
}
.boxButtons {
  margin-top: 20px;
}

@media screen and (max-width: 540px) {
  .boxButtons .btn{
    margin-left: 10px;
  }
}
@media screen and (max-width: 480px) {
  .modalBox {
    width: 300px;
    margin: 100px 0 0 -150px;
  }
  .boxButtons .btn{
    width: auto;
  }
}
@media screen and (max-width: 280px) {
  .modalBox {
    width: 200px;
    margin: 100px 0 0 -100px;
  }
  .boxButtons .btn{
    width: auto;
    margin-left: 2px;
    font-size: 12px;
    padding: 5px 5px;
  }
}

/*******************************************************************
 *
 *  post setup pages
 *
 ******************************************************************/
.postSetup h1 {
  position: relative;
  z-index: 2;
  margin-top: 20px;
}
.postSetup .sectionWrap .expand h2 {
  position: relative;
  color: #00A1DE;
  font-size: 16px;
  margin-bottom: 30px;
  cursor: pointer;
}
.postSetup .sectionWrap.open .expand h2 {
  position: relative;
  color: #9A258F;
}
.postSetup .sectionWrap .expand i {
  display: inline-block;
  left: auto;
  position: absolute;
  right: 0;
  top: 10px;
  cursor: pointer;
}
.postSetup .sectionWrap .expand .dnintg-expanded {
  background-position: -179px -197px;
}
.postSetup .sectionWrap .expand .dnintg-collapsed {
  background-position: -132px -197px;
}

@media screen and (max-width: 480px) {
  .postSetup .sectionWrap .expand i {
    width: 20px;
    height: 40px;
  }
  .postSetup .sectionWrap .expand .dnintg-expanded {
    background-position: -178px -40px;
  }
  .postSetup .sectionWrap .expand .dnintg-collapsed {
    background-position: -130px -40px;
  }
}

.postSetup .sectionWrap h3 {
  margin-top: 0;
}
.postSetup .sectionWrap {
  background: #fff;
  padding-bottom: 20px;
  border-bottom: 1px solid #f0f0f0;
  min-height: 80px;
  margin-bottom: 30px;
}
.postSetup .sectionWrap.first {
  position: relative;
  top: -30px;
  margin-bottom: 0;
}
.postSetup .sectionWrap.last {
  margin-top:  50px;
}
.postSetup .sectionWrap .sectionDetails {
  display: none;
}
.postSetup .sectionWrap .sectionDetails.general {
  display: block;
}
.formButtons {
  float: right;
  width: 60%;
  margin-left: 2%;
  font-size: 13px;
}
.formButtons.bottom {
  clear:  both;
  margin-bottom: 50px;
}
.formButtons input {
  float: right;
  width: 100px;
  padding: 10px 0;
  font-size: 13px;
  margin-left: 2%;
}
.formButtons.top input {
  margin-top: 20px;
}

@media screen and (max-width: 540px) {
  .formButtons.top {
    display: none;
  }
  .formButtons.bottom {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    z-index: 9;
    overflow: hidden;
    margin: 0;
  }
   .formButtons.bottom:after{
  	content:"";
  	position:absolute;
  	z-index:-1;
  	-webkit-box-shadow: 0 0 15px rgba(0,0,0,0.4);
  	        box-shadow: 0 0 15px rgba(0,0,0,0.4);
  	bottom: 65px;
  	left:0;
  	right:0;
  	width:100%;
  	height:30px;
  	-moz-border-radius: 100%;
  	     border-radius: 100%;
  }
  .ie8 .formButtons.bottom,
  .ie9 .formButtons.bottom {
    border-top: 1px solid #f5f5f5;
  }
  .mobileFooter {
    height: 65px;
    padding: 15px 0;
  }
  .mobileCenterButtons {
  	float:left;
  	width: 100%;
  	position:relative;
  	left:50%;
  	overflow:visible;
  }
  .mobileCenterButtons > div {
  	float: left;
  	position:relative;
  	right: 150px;
  	width: 300px;
  }
  .mobileCenterButtons.singleButton > div {
  	width: 225px;
  }
  .mobileCenterButtons > div input {
    width: 145px;
    margin: 0;
  }
  .mobileCenterButtons > div .secondary {
    margin-right: 10px;
  }
} 
@media screen and (max-width: 300px) {
  .mobileCenterButtons > div {
        float: left;
        position:relative;
        right: 55%;
        width: 100%;
  }
  .mobileCenterButtons.singleButton > div {
        width: 75%;
  }
  .mobileCenterButtons > div input {
    width: 45%;
    margin: 0;
  }
  .mobileCenterButtons > div .secondary {
    margin-right: 5px;
  }
}

.sectionWrap.buttonWrap label,
.sectionWrap.buttonWrap select {
  float: right;
  margin: 25px 0 20px 5px;
}
.sectionWrap.buttonWrap select {
  width: 33%;
  clear: right;
  margin-top: 20px;
}
.sectionWrap.buttonWrap select:disabled,
.sectionWrap.buttonWrap select[disabled] {
  background-color: #EBEBE4;
}
.sectionWrap .formElements {
  margin: 0;
}
.advancedWrap select {
  float: left;
  width: 45%;
}
.advancedWrap a {
  float: right;
}
.advancedSettings {
  display: none;
}
.protectedSetup label {
  /* width: 90%; */
}
.protectedSetup input[type="checkbox"] {
  vertical-align: top;
}
.postSetup .sectionWrap .column {
  width: 45%;
  margin-left: 10%;
}
.postSetup .sectionWrap .column.ap {
  width: 30%;
  margin-left: 5%;
}
.postSetup .sectionWrap .column.first {
  margin-left: 0;
}
.postSetup .manualNetworkInput, 
.postSetup .manualNetworkInput .pwdInput {
  display: block;
}
.ipAddress .formElements label {
  display: inline-block;
  width: 55%;
}
.ipAddress li h3 {
  display: inline-block;
  margin-right: 10px;
  font-weight: normal;
}
.ipAddress li h3 + input {
  display: inline-block;
}
.ipAddress .formElements .num {
  display: inline-block;
  width: 8%;
}
.ipAddress .formElements input[name='device_name'] {
  width: 45%;
}
.ipAddress .formElements input[type='radio'] {
  margin-right: 10px;
}
.devicesList {
  color: #7d706c;
  border: 1px solid #e8e6e5;
	border-collapse: separate;
	width: 100%;
	table-layout: fixed;
	margin-bottom: 30px;
}
.devicesList th {
	padding: 15px 10px;
  text-align: left;
  font-weight: bold;
}
.wifiDevices th:first-child {
  width: 13%;
}
.wifiDevices th:first-child + th {
  width: 12%;
}
.wifiGuestDevices th:first-child {
  width: 13%;
}
.wifiGuestDevices th:first-child + th {
  width: 12%;
}
/*
.wifiDevices th:first-child + th + th {
  width: 18%;
}
.vmac_th{
  width: 18%;
}
*/
.channel_th {
  width: 10.5%;
}
.signal_th {
  width: 10.5%;
}
.rate_th {
  width: 10%;
}
#denyMark {
  width: 7.5%;
}
#denyMarkGuest {
  width: 7.5%;
}
.limitDevicesHeight {
  height: 430px;
  overflow: auto;
}
.devicesList td {
  padding: 6px;
  vertical-align: middle;
}
.wifiDevices th,
.repeatDevices td,
.guestDevices td,
.wiredDevices td,
.wifiGuestDevices td,
.wifiDevices td {
  word-wrap: break-word;
  white-space: pre-wrap;
}
.wifiDevices td {
  padding: 10px 5px 10px 5px;
}
.devicesList th,
.devicesList td {
  border-left: 1px solid #e8e6e5;
}
.devicesList th:first-child,
.devicesList td:first-child {
  border-left: none;
}
.devicesList td {
  border-top: 1px solid #e8e6e5;
}
.devicesList tr:nth-child(odd) td {
  background: #f3f3f3;
}
.devicesList .tbHr {
  display: none;
}
.devicesList .tdLabel {
  display: none;
}
.editAction .tdLabel {
  margin-top: 5px;
}
.devicesList [type="text"][disabled] {
  opacity: 1;
  background: none;
  border: none;
  box-shadow: none;
  color: #7d706c;
  -webkit-text-fill-color: #7d706c; 
}
.ie8 .devicesList input[type="text"][disabled] {
  color: #000;
}
.devicesList .editDevice {
  display: inline-block;
}
.devicesList .editMode {
  display: inline-block;
  position: relative;
  left: -7px;
}
.devicesList .mobileOnly {
  display: none;
}
#schListDiv {
  width: 100%;
}
.limitSchHeight {
  height: 595px;
  overflow: auto;
}
.scheduleList th,
.scheduleList .tdLabel {
  text-transform: capitalize;
}
.scheduleList th {
  width: 16%
}
.scheduleList th:first-child + th  + th {
  width: 50%
}
.tableControl.bottom {
  margin: -20px 0 30px;
}
.tableControl.bottom .controlBtn {
  float: left;
}
input[name="protectEnable"] {
  vertical-align: top;
  position: relative;
  top: 7px;
}
input[name="num_of_entries"] {
  width: 40px;
  padding: 5px;
  display: inline;
}
/*#wifiSettingsForm label {
  display: inline-block;
}*/
.pinWrap {
  width: 100%;
  height: 60px;
  font-size: 28px;
  color: #fff;
  line-height: 60px;
  text-align: center;
  background-color: #00A1DE;
}

@media screen and (max-width: 640px) {
  .sectionWrap.buttonWrap select {
    width: 60%;
  }
  .sectionWrap.buttonWrap label {
    margin-left: 0;
  }
  .postSetup .sectionWrap .expand h2 {
    margin: 0 0 15px;
    width: 80%;
  }
  .advancedWrap a,
  .advancedWrap select {
      float: none;
  }
  .advancedWrap a {
    display: block;
    text-align: right;
    margin-bottom: 10px;
  }
  .advancedWrap select {
    width: 100%;
  }
  .postSetup .sectionWrap .column {
    margin: 0;
    width: 100%;
    border: none;
  }
}

/* USB Port page */
.usbPort h1 {
  margin-bottom: 40px;
}
.usbPort .formButtons.top {
  position: absolute;
  top: 20px;
  right: 30px;
}
.usbPort h2,
.usbPort h3 {
  font-size: 16px;
  color: #333;
}
#workgroupWrap h2 {
  margin-top: 0;
}
.usbPort h2 #selSettings {
  float: right;
  font-size: 12px;
  font-weight: normal;
}
.usbPort h2 input[name="work_group"] {
  width: 40% !important;
  float: right;
  font-size: 12px;
  font-weight: normal;
}
.postSetup .elementsInline {
  padding: 0;
}
.postSetup .elementsInline.usbPageControls label {
  margin: 5px;
}
.postSetup .elementsInline input {
  margin-right: 10px;
}
.postSetup .elementsInline label {
  margin: 0 30px 0 0;
}
.postSetup input[name="device_name"],
.postSetup input[name="media_server_name"] {
  width: 40% !important;
  display: inline-block;
}
.workgroups th:first-child {
  width: 10%;
}
.workgroups th:first-child + th {
  width: 30%;
}
.workgroups th:first-child + th + th {
  width: 40%;
}
.workgroups th:first-child + th + th + th {
  width: 10%;
}
.workgroups th:first-child + th + th + th + th {
  width: 10%;
}
.connectedFolders th:first-child {
  width: 20%;
}
.connectedFolders th:first-child + th {
  width: 14%;
}
.connectedFolders th:first-child + th + th {
  width: 18%;
}
.connectedFolders th:first-child + th + th + th  {
  width: 18%;
}
.connectedFolders th:first-child + th + th + th + th {
  width: 9%;
}
.connectedFolders th:first-child + th + th + th + th + th {
  width: 9%;
}
.connectedFolders th:first-child + th + th + th + th + th + th {
  width: 12%;
}
#printerShareInfo {
  display: none;
}
.cancelNewFolder {
  text-align: center;
}
.connectedFolders .controlBtn[disabled],
.connectedFolders .controlBtn[disabled]:hover {
  background-color: #fff;
}

/* WiFi Output Power Page */
.wirelessOutputPower img {
  display: none;
}
.wirelessOutputPower {
  width: 100%;
  height: 180px;
  background-size: 100% 100%;
  position: relative;
  overflow: hidden;
}
.wirelessOutputPower div:first-child {
  width: 100%;
  height: 100%;
  background: transparent url('../img/outputPower.png') no-repeat left top;
  background-size: 100% 100%;
}
.wirelessOutputPower div:first-child + div {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  padding: 50px 0;
}
.wirelessOutputPower div:first-child + div > div {
  width: 92px;
  height: 170px;
  background: transparent url('../img/product2.png') no-repeat left top;
  background-size: 100% 100%;
  position: absolute;
  left: 40px;
  top: 0;
}
.wirelessOutputPower .formElements {
  position: absolute;
  top: 0;
  left: 0;
  padding: 50px 0;
  width: 100%;
}
.wirelessOutputPower li {
  float: left;
  text-align: center;
}
.wirelessOutputPower li:first-child span {
  white-space: nowrap;
  font-size: 18px;
  font-weight: bold;
  color: #fff;
  position: relative;
  top: -35px;
  left: 109%;
}
.wirelessOutputPower li label {
  display: block;
  font-size: 18px;
  color: #fff;
  margin-bottom: 25px;
}
.wirelessOutputPower li {
  width: 19%;
}
.wirelessOutputPower li:first-child {
  width: 24%;
}

@media screen and (max-width: 540px) {
  .wirelessOutputPower {
    height: 155px;
  }
  .wirelessOutputPower .formElements {
     margin: 12px 0;
     padding: 80px 0 0;
  }
  .wirelessOutputPower div:first-child {
    background-image: url('../img/outputPowerSmall.png');
  }
  .wirelessOutputPower > div:first-child + div > div{
    width: 38px;
    height: 70px;
    background-size: 100% 100%;
    position: absolute;
    top: 10px;
    left: 10px;
  }
  .wirelessOutputPower li:first-child span {
    white-space: nowrap;
    font-size: 12px;
    font-weight: bold;
    color: #fff;
    position: relative;
    top: -50px;
    left: 60px;
  }
  .wirelessOutputPower li label {
    display: block;
    font-size: 12px;
    color: #fff;
    margin-bottom: 10px;
  }
  .wirelessOutputPower li {
    width: 25%;
  }
  .wirelessOutputPower li:first-child {
    width: 0%;
  }
}

/* fast lane page */

.fastLaneOptions li.withBottomShadow {
  background-color: #fff;
  position: relative;
  margin-bottom: 40px;
}
.fastLaneOptions hr {
  margin: 0 0 20px 30px;
}
.fastLaneOptions label {
  display: inline-block;
  width: 90%;
  vertical-align: top;
}
.fastLaneOptions input {
  vertical-align: top;
  margin: 2px 10px 0 0;
}
.fastLaneOptions .secondaryOptions {
  padding-top: 0;
}
.fastLaneOptions .secondaryOptions input {
  vertical-align: top;
  margin: 2px 10px 0 30px;
}
.fastLaneIllustration {
  width: 470px;
  height: 160px;
  background: transparent url('../img/fastLaneSpriteLarge.png') no-repeat left top;
  margin: 10px 0 0 15%;
}
.fastLaneIllustration.basic {
  background-position: left top;
  margin-bottom: 20px;
}
.fastLaneIllustration.twogig {
  background-position: left -406px;
  margin-bottom: 20px;
}
.fastLaneIllustration.fivegig {
  background-position: left -203px;
}

@media screen and (max-width: 540px) {
  .fastLane #fancyFooter {
    padding-bottom: 65px;
  }
  .fastLaneIllustration {
    width: 300px;
    margin: 10px auto 0;
    height: 110px;
    background: transparent url('../img/fastLaneSpriteSmall.png') no-repeat left top;
  }
  .fastLaneIllustration.basic {
    background-position: left top;
    margin-bottom: 20px;
  }
  .fastLaneIllustration.twogig {
    background-position: left -240px;
    margin-bottom: 20px;
  }
  .fastLaneIllustration.fivegig {
    background-position: left -120px;
  }
  .fastLaneOptions label {
    width: 80%;
  }
}

/* password settings page */
.pwdSettingsOptions {
  width: 40%;
}
.recoveryPwdOptions {
  width: 60%;
  margin-bottom: 0;
}
.recoveryPwdOptions.recoveredTime {
  width: 90%;
  margin-top: 0;
  margin-bottom: 20px;
}

/* backup and firmware update setting */
.backupSettingsOptions li,
.firmwareUpdateOptions li {
  float: left;
  width: 32%;
  height: 220px;
  margin-bottom: 2%;
  margin-left: 2%;
  position: relative;
  overflow: hidden;
  padding: 0;
  border: 1px solid #E8E6E5;
}
.firmwareUpdateOptions li {
  width: 49%;
}
.backupSettingsOptions li:first-child,
.firmwareUpdateOptions li:first-child {
  margin-left: 0;
}
.backupSettingsOptions li p,
.firmwareUpdateOptions li p {
  padding: 0 20px;
  text-align: center;
}
.backupSettingsOptions .ftr,
.firmwareUpdateOptions .ftr,
.backupSettingsOptions .rst {
  border-top: 1px solid #E8E6E5;
  padding: 10px 0;
  position: absolute;
  bottom: 0;
  width: 100%;
}
.backupSettingsOptions .btn,
.firmwareUpdateOptions .btn {
  padding: 5px 0px;
  text-align: center;
  height: auto;
  font-size: 14px;
  width: 200px;
  word-wrap: break-word;
  white-space: normal;
}
.backupSettingsOptions input[type="file"],
.firmwareUpdateOptions input[type="file"] {
  margin-left: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.backupSettingsOptions .btn.rescheck,
.firmwareUpdateOptions .btn.rescheck {
  height: 28px;
}

@media screen and (max-width: 600px) {
  .backupSettingsOptions li,
  .firmwareUpdateOptions li {
    width: 100%;
    margin: 0 0 20px 0;
  }
}

/* file upload widget */
.fileInputWidget {
  position: relative;
  float: left;
  width: 100%;
  overflow: hidden;
}
.fileInputWidget .fakeInputField {
  display: inline-block;
  width: 48%;
  margin: 0 2%;
}
.fileInputWidget .btn {
  width: 46%;
  padding: 5px;
  font-size: 12px;
  height: auto;
  cursor: pointer;
  margin-right: 2%;
  word-wrap: break-word;
  white-space: normal;
  margin-top: 8px;
}
.fileInputWidget input[type="file"] {
  position: absolute;
  z-index: 1;
  top: 0px;
  left: -20px;
  filter:alpha(opacity=0);
  -moz-opacity:0;
  -khtml-opacity: 0;
  opacity: 0;
  cursor: pointer;
  height: 100%;
  width: 100%;
  font-size: 220px;
}
#langupg .fileInputWidget {
  margin-bottom: 30px;
}
#langupg .fileInputWidget .fakeInputField {
  width: 30%;
  margin-top: 0;
  margin-left: 0;
}
#langupg .fileInputWidget .btn {
  width: 10%;
  margin: 0 auto;
  text-align: center;
}

@media screen and (max-width: 1015px) {
  .backupSettingsOptions li{
    width: 48%;
  }
}

@media screen and (max-width: 600px) {
  .backupSettingsOptions li{
    width: 100%;
  }
}

/* access schedule page */
.daysAndTime {
  margin: 0;
}
#scheduleWrap {
  margin-bottom: 50px;
}
#scheduleWrap h3 {
  clear: both;
}
#scheduleWrap h3 a {
  float: right;
  font-size: 12px;
  font-weight: normal;
}
#scheduleWrap label {
  display: inline-block;
}
.daysAndTime li {
  width: 45%;
  margin-left: 10%;
  float: left;
}
.daysAndTime li:first-child {
  margin: 0;
}
input.synchDateTime {
  display: inline-block;
  width: 100px;
}
select .ui-timepicker-select {
	width: 100px;
	display: inline-block;
}
.selectDays {
  overflow: hidden;
  margin: 0 0 50px;
}
.selectDays li {
  clear: both;
}
.selectDays li:before,
.selectDays li:after {
  display: table;
  content: "";
  zoom: 1;
}
.selectDays li:after {
  clear: both;
}
.selectDays li > div {
  float: left;
}
.selectDays .timeSelection {
  float: right;
}
.selectDays .timeSelection label {
  margin-right: 5px;
}
.selectDays .timeSelection input[type='radio'] {
  margin-right: 5px;
}
.selectDays .timeSelection input[type='text'] {
  display: inline-block;
  width: 20%;
}
.selectDays .alldays .timeSelection {
  float: right;
}

select.timeList {
  width: 90px;
  display: inline-block;
}

@media screen and (max-width: 640px) {
  .selectDays li > div{
    width: 100%;
  }
  .selectDays .timeSelection {
    float: right;
  }
  .selectDays .timeSelection label {
    margin-right: 10px;
  }
}

@media screen and (max-width: 480px) {
  .selectDays li {
    border-bottom: 1px solid #f0f0f0;
  }
  #asOn,
  #asOff {
    margin: 10px 10px 10px 0;
  }
}

/*wifiSettings.htm*/
.new_feature {
  margin: -50px 0px 10px;
}
.wifi_info {
  text-align: left;
  height: 32px;
  width: 50%;
  font-weight: 400;
}
.wifi_radio {
  height:  32px;
  text-align: left;
  font-weight: 400;
}
#wifiNote {
  margin-left: 65%;
}
@media screen and (max-width: 940px) {
.new_feature {
  width: 80%;
}
}
@media screen and (max-width: 640px) {
.new_feature {
  width: 100%;
}
#wifiNote {
  margin-left: 35%;
}
}
@media screen and (max-width: 360px) {
#wifiNote {
  margin-left: 15%;
}
}
@media screen and (max-width: 770px) {
  /* connect devices page */
  .devicesList {
    display: block;
    padding-bottom: 0;
    width: 100%;
    border: none;
  }
  .devicesList thead {
    display: none;
  }
  .devicesList tbody, 
  .devicesList tr, 
  .devicesList th, 
  .devicesList td {
    border: none;
    display: block;
    padding: 0;
    text-align: left;
    white-space: pre;
  }
  .devicesList td {
	width: 65% !important;
  	max-width: 480px;
  	border-right: none;
  	position: relative;
  	margin-bottom: 5px;
  	vertical-align: top;
	float: left;
  } 
  .devicesList tr:nth-child(2n+1) td {
      background: none;
  } 
  .devicesList th:first-child + th, 
  .devicesList td:first-child + td {
      border: none;   
  }
  .devicesList tr {
    margin-bottom: 20px;
  }
  .devicesList .tdLabel {
    display: inline-block;
    font-weight: bold;
    margin-left: 0;
    margin-right: 10px;
    float: left;
  }
  .devicesList .tbHr {
    display: -webkit-box;
  }
  .devicesList td [disabled] {
      display: inline-block;
  }
  .devicesList .dnintg-edit {
    position: relative;
    top: 0;
  }
}

@media screen and (max-width: 540px) {
  /* wifi settings page */
  .postSetup .sectionWrap h3 {
    margin: 7px 0 0;
  }
  #wifiSettingsForm .ipAddressInput label {
      display: block;
  }
  #wifiSettingsForm .ipAddressInput .num {
      display: inline-block;
      width: 20%;
  }
  .manualNetworkInput {
    border: none;
  }
 
  
  /* password settings page */
  .pwdSettingsOptions,
  .recoveryPwdOptions{
      width: 100%;
  }
  
  /*  guest networks */
  .devicesList .mobileOnly {
    display: block;
  }
  .devicesList .dnintg-cancel {
    position: relative;
    top: 0;
  }
  .modalBox.form {
    width: 90%;
    left: 5%;
    padding: 15px;
  }
  .modalBox.form .formButtons {
    position: static;
    width: 100%;
  }
}
/***************************
 * Login page
 ***************************/
.login {
  margin: 0;
  background-color: #F1F1F1;
  font-size: 18px;
  min-width: 320px;
}

.loginbox {
  width: 300px;
  /*min-height: 580px;*/
  margin: auto auto auto 200px;
}

.login .logo {
  width: 235px;
  height: 35px;
  margin-bottom: 30px;
}

.loginAlert {
  width: 500px;
}

.footer {
  width: 100%;
  height: 180px;
  overflow: hidden;
}
.footer img,
.login .logo img{
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

.login.bg {
  background-image: url('../img/login_bg.jpg');
  background-position: right 40%;
  background-repeat: no-repeat;
  background-color: #e6e5e1;
  background-size: 100% 100%;
  
}

.login .btn.wide {
  width: 400px;
  height: auto;
  padding: 12px 6px;
  font-size: 24px;
  margin-top: 100px;
  word-wrap: break-word;
  white-space: normal;
}


.login input[type='text'],
.login input[type='email'],
.login input[type='password'],
span.securityQuestion {
  width: 100%;
  height: 40px;
  padding: 5px;
}

span.showLikeInput {
  padding: 15px 0px;
  color: #7D706C;
  display: block;
  width: 100%;
  height: 20px;
}

.ie8 .login input[type='text'],
.ie8 .login input[type='email'],
.ie8 .login input[type='password'],
.ie8 span.securityQuestion{
  width: 100%;
  height: 40px;
  padding: 8px 5px;
}
.loginbox input.btn {
  width: 100%;
  height: 38px;
  line-height: 38px;
  padding: 0;
}
.loginbox input.btn[disabled] {
	background-color: #aaaaaa;
}
.loginbox.btn.primary {
	background-color: #00a1de;
	-webkit-border-radius:0px;
}
.loginbox.btn.primary:hover {
	background-color: #20b9f0;
}
.loginbox.btn.primary:active {
	background-color: #039ed5;
}
.loginbox input.btn.secondary {
	background-color: #6d2485;
	-webkit-border-radius:0px;
}
.loginbox input.btn.secondary:hover {
	background-color: #9b1788;
}
.loginbox input.btn.secondary:active {
	background-color: #581d6c;
}


#extend_setup_title {
	width: 90%;
	height: 100%;
	font-size: 18px;
	font-weight: bold;
	margin: 6%;
	text-align: center;
}

.login .main {
	width: 65%;
	margin: -40px 20% 50px;
	position: relative;
}
	
.login table {
	width: 100%;
}
.formTable td {
	padding: 10px 0;
}

.login .formTable td:first-child + td{
	width: 10%;
}

.infoIcon {
	width: 30px;
	height: 30px;
	-moz-border-radius: 15px; 
	-webkit-border-radius: 15px; 
	border-radius: 15px; 
	background-color: #00A1DE;
	position: relative;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.1);
	display: inline-block;
	cursor: pointer;
	margin: 4px;
}
.infoIcon:after {
	color: #FFFFFF;
	content: 'i';
	font-size: 24px;
	font-family: Helvetica;
	padding: 3px;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	padding: 0 12px;
}
.ie8 .infoIcon {
	background: url('../img/info.png') no-repeat left;
}

.login .answerElements {
	visibility: hidden;
}
input::-webkit-input-placeholder,
input::-moz-placeholder{
	color: #AAAAAA;
}
div.placeholder,
input.placeholder{
	color: #AAAAAA;
}
.securityQuestionForm {
  position: relative;
  display: block;
}
div.securityQuestion{
  border: 1px solid #7D706C;
  border-radius: 4px;
  box-shadow: 0 2px 3px -2px rgba(0, 0, 0, 0.3) inset;
  display: block;
  margin: 0;
  padding: 8px;
  width: 100%;
  vertical-align:middle;
  height: 40px;
  overflow: hidden;
  line-height: 28px;
}
div.securityQuestion .downArrow {
  float: right;
  top: 10px;
}
.activeElement {
  color: #7D706C;
  font-weight: bold;
}
select.securityQuestion {
  border: 0 none;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 40px;
  position: absolute;
  top: 10px;
  left: 0;
  filter:alpha(opacity=0);
  -moz-opacity:0;
  -khtml-opacity: 0;
  opacity: 0;
}

select.securityQuestion option {
   padding: 0 8px;
   height: 22px;
   background-color: #FFFFFF;
}

@media screen and (max-width: 980px) {
	.login {
		padding-top: 40px;
		
	}
	
	.loginbox {
		margin: 0;
		padding: 0 20px;
	}
	.login .main {
		width: 70%;
		margin: -20px 15% 50px;
		position: relative;
	}
	.footer {
	  height: 100px;
	  background-size: 100% 180px;
	}
}

@media screen and (max-width: 600px) {
	.loginAlert {
                width: 300px;
        }
}

@media screen and (max-width: 480px) {
	.login {
		padding-top: 40px;
		min-width: 360px;
	}
	.login.bg {
		background-image: none;
	}
	.loginbox {
		margin: 0;
		padding: 0 20px;
	}
	.login .main {
		width: 90%;
		margin: 65px 5%;
		position: relative;
		padding: 0;
	}

	.formTable td {
		padding: 3px 0;
	}

	.login .btn.wide {
		width: 300px;
		line-height: 42px;
		font-size: 20px;
	}
	#extend_setup_title {
		font-size: 0.8rem;
		height: 14px;
		position: relative;
		text-align: left;
		margin-top: 50px;
		width: 80%;
	}
	
	.login .formTable td:first-child + td{
		width: 40px;
	}
	
	.footer {
	  height: 80px;
	  background-size: 100% 150px;
	}
}
@media screen and (max-width: 350px) {
	.login {
		min-width: 300px;
	}
	.loginbox {
		width: 90%;
		margin: 0;
		padding: 0 10px;
	}
	.login .btn.wide {
		width: 100%;
		line-height: 32px;
		font-size: 15px;
	}
}
@media screen and (max-width: 280px) {
	.login {
		min-width: 180px;
	}
	.loginbox,
	.login .logo {
		margin: 0;
		padding: 0 5px;
		width: 100%;
	}
	.ie9 .login .btn.wide {
		width: 210px;
	}
}

/*******************************************************************
 *
 * Redesign checkbox
 *
 *******************************************************************/
input[type="checkbox"] {
	/*display: none;*/
}

/*input[type="checkbox"] + label {
	cursor: pointer;
	background-color: #FFF;
	border: 1px solid #C1CACA;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.1);
	display: inline-block;
	position: absolute;
	float: left;
}*/

/*input[type="checkbox"] + label {
	padding: 8px;
	border-radius: 4px;
	margin: 0 5px 0 0;
	display: none;
}

.login input[type="checkbox"] + label {
	position: relative;
	padding: 12px;
	border-radius: 5px;
	margin: 0 5px;
}

input[type="checkbox"] + label:active {
	box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}

input[type="checkbox"]:checked + label {
	background-color: #ECF2F7;
	border: 1px solid #92A1AC;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05), inset 15px 10px -12px rgba(255, 255, 255, 0.1);
	color: #243441;
}

input[type="checkbox"]:checked + label:after {
	content: '\2714';
	position: absolute;
	top: 0px;
	left: 0px;
	background-color: #00A1DE;
	color: #FFFFFF;
	width: 100%;
	height: 100%;
	display: none;
}
input[type="checkbox"]:checked + label:after {
	padding: 0px 2px;
}
input[type="checkbox"]:disabled + label {
	background-color: #c4c4c4;
}
input[type="checkbox"]:checked:disabled + label:after {
        background-color: #c4c4c4;
	color: #FFFFFF;
}

.login input[type="checkbox"]:checked + label:after {
	padding: 1px 5px;
}*/

.ie8 input[type="checkbox"],
.ie8 .login input[type="checkbox"]{
	display: inline;
	/*filter:alpha(opacity=0);*/
	-moz-opacity:0;
	-khtml-opacity: 0;
	opacity: 0;
}
.ie8 .checkboxRow {
	position: relative;
}
.ie8 input[type="checkbox"] {
	/*position: absolute;*/
	top: 8px;
	left: 0;
}
.ie8 .login input[type="checkbox"] {
	left: 8px;
}
.ie8 .setup input[type="checkbox"] {
	top: 10px;
	left: 20px;
}
.ie8 .setup.registration input[type="checkbox"] {
	left: 0;
}
/*.ie8 input[type="checkbox"].checked  + label ,
.ie8 .login input[type="checkbox"].checked  + label {
	background-color: #ECF2F7;
	border: 1px solid #92A1AC;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05), inset 15px 10px -12px rgba(255, 255, 255, 0.1);
	color: #243441;
	
}
.ie8  input[type="checkbox"].checked + label:after {
	content: '\2714';
	position: absolute;
	top: 0px;
	left: 0px;
	background-color: #00A1DE;
	color: #FFFFFF;
	width: 100%;
	height: 100%;
	padding: 0 2px;
	margin-bottom: 50px;
}
.ie8 .login input[type="checkbox"].checked + label:after  {
	padding: 1px 5px;
}*/
label.checkBoxLabel {
	margin: 2px auto 8px 2px;
	/*float: left;*/
	cursor:pointer;
	cursor:hand;
	display: inline;
	width: auto;
	/*padding-left: 23px;*/
}
.wpsChoice label.checkBoxLabel {
	padding-left: 2px;
}
.login label.checkBoxLabel {
	/*margin: 3px auto 12px 5px;*/
	cursor:pointer;
	cursor:hand;
	/*float: left;*/
	padding: 0;
}
.Checking td{
	text-align: center;
}
.formTable {
	width: 100%;
}
div.syncClock {
	position: absolute;
	top: 0px;
	right: 0px;
}
.changing_lang h1 {
	margin-top: 20px;
}
.changing_lang table {
	width: 100%;
	text-align: center;
}
.changing_lang table tr:first-child + tr td {
	padding: 20px;
}
p.red {
	color: red;
	font-weight: bold;
	margin-top: 0;
	margin-bottom: 20px;
}
.reboot .introduce {
	margin: 100px auto 0 auto;
	text-align: center;
}
.roundedProcess{
	width: 60px;
	height: 60px;
	position: relative;
	margin: 50px auto;
}
.roundedProcess > div {
	width: 60px;
	height: 60px;
}
.top_bg {
	display: block; 
	background-image: url(../img/process/process.png);
	background-size: 100% 100%;
	z-index:2;
	position: absolute;
}
.pie {
	width: 100%;
	height: 100%;
	background-color:#d2c8bf;
	border-radius:30px;
	position:absolute;
}
.pie1 {
	clip:rect(0px,60px,60px,30px);
	-ms-transform:rotate(0deg);
	-o-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-webkit-transform:rotate(0deg);
}
.pie2 {
	clip:rect(0px,30px,60px,0px);
	-ms-transform:rotate(0deg);
	-o-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-webkit-transform:rotate(0deg);
}
.hold {
	position:absolute;
	z-index:1;
}
.hold1 {
	clip:rect(0px,60px,60px,30px);
}
.hold2 {
	clip:rect(0px,30px,60px,0px);
}
.reboot .bg {
	background-color: #92ae46;
	border-radius:30px;
	position:absolute;
}
.roundedProcess .perText{
	line-height: 60px;
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
	z-index:2;
}
.roundedProcess > div:first-child,
.roundedProcess > div:first-child  > img{
	display: none;
	margin: 0;
	padding: 0;
}
.accesspoint.setup .pwdInput select {
	width: 100%;
}
.pwdInput .continuePwd {
	width: 100%;
}
.accesspoint.setup > div .btn.primaty {
	margin-right: 10px;
}
.accesspoint.setup .marginRetract {
	margin-left: 20px;
}
.accesspoint.setup .marginRetract li:first-child {
	margin-left: -20px;
}
.accesspoint.setup .sectionIPAddr {
	margin-left: 40px;
}
.blueCol {
	color: #00ADE6 !important;
}

/*******************************************************************
  *
  *  fastLane
  *
  ******************************************************************/
.fastLaneDivParent{
  left:70px;
  width:500px;
  height:200px;
  position:relative;
} 

.fastLaneMode{
  width: 120px;
  height: 80px;
  position:absolute;
  background-image: url('../img/fastLaneLargeImage.png');
  background-repeat: no-repeat;
}

.locationSide12{
  width:180px;
  height:41px; 
  top:39%;
 }

.locationSide34{
  width:180px;
  height:41px; 
  top:58.1%;
 }
 .locationFront{
   width:180px;
   height:65px;
   top:42%;
 }
 .locationBack{
   width:180px;
   height:65px;
   top:42%;
 }
.longLineInfastLane { 
  height:2px;
  width:362px;
  left:72px;
  top:58%;
  background-position: 0px -224px;
}
.productFastLane{
  left: 42%;
  bottom: 30px;
  position: absolute;
}
img.fastlane{
  max-width:100px;
  max-height:150px;
}
.productSideFastLane{
  left:43.3%;
  bottom:40px;
  position:absolute;
}
img.sideFastLane{
  width:77px;
  height:132px;
}
.fastLaneMode.locationSide12.bestfs1{
  left:11%;
  background-position: -224px 0px;
}
.fastLaneMode.locationSide12.bestfs2{
  left:52.3%;
  background-position: -224px 0px;
}
.fastLaneMode.locationSide34.bestfs3{
  left:52.3%;
  background-position: -224px -51px;
}
.fastLaneMode.locationSide34.bestfs4{
  left:11%;
  background-position: -224px -51px;
}
.fastLaneMode.locationSide12.disablefs1{
  left:11%;
  background-position: 0px 0px;
}
.fastLaneMode.locationSide12.disablefs2{
  left:52.3%;
  background-position: 0px 0px;
}
.fastLaneMode.locationSide34.disablefs3{
  left:52.3%;
  background-position: 0px -51px;
}
.fastLaneMode.locationSide34.disablefs4{
  left:11%;
  background-position: 0px -51px;
}

.fastLaneMode.locationFront.best24g{
  left:13.5%;
  background-position:-211px -131px;
}
.fastLaneMode.locationBack.best5g{
  left:54.7%;
  background-position:0px -131px;
}

.fastLaneMode.locationFront.best5g{
  left:13.5%;
  background-position:0px -131px;
}
.fastLaneMode.locationBack.best24g{
  left:54.7%;
  background-position:-211px -131px;
}
.fastLaneMode.fsExtender{
  width:72px;
  height:123px; 
  top:21%;
  left:51%;
  background-position: -467px -71px;
}
.fastLaneMode.fsRouter{
  width:30px;
  height:69px; 
  top:40%;
  left:9.5%;
  background-position: -587px 0px;
}
.fastLaneMode.fsDevice{
  width:60px;
  height:47px; 
  top:47%;
  left:87%;
  background-position: -472px 0px;
}
.fastLane_router_string {
  font-weight:bold;
  width:auto;
  height:30px;
  left:6.6%;
  top:85%;
  position:absolute;
  text-transform:uppercase;
}
.fastLane_extender_string {
  font-weight:bold;
  width:auto;
  height:30px;
  left:43%;
  top:85%;
  position:absolute;
  text-transform:uppercase;
}
.fastLane_device_string {
  font-weight:bold;
  width:auto;
  height:30px;
  left:88%;
  top:85%;
  position:absolute;
  text-transform:uppercase;
}

@media screen and (max-width: 540px) {
  .fastLaneDivParent {
    left:8px;
    top:0px;
    width:500px;
    height:200px;
    position:relative;
  } 
  .fastLaneMode {
    width: 120px;
    height: 80px;
    position:absolute;
    background-image: url('../img/fastLaneSmallImage.png');
    background-repeat: no-repeat;
  }

  .longLineInfastLane { 
    height:2px;
    width:240px;
    left:3%;
    top:51%;
    background-position: -273px -96px;
  }
  .locationSide12 {
    width:118px;
    height:28px; 
    top:75px;
  }
  .locationSide34 {
    width:118px;
    height:27px; 
    top:103px;
  }
  .locationFront {
    width:125px;
    height:65px;
    top:42%;
  }
  .locationBack {
    width:125px;
    height:65px;
    top:42%;
  }
  .fastLaneMode.locationSide12.bestfs1 {
    left:1%;
    background-position: 0px 0px;
  }
  .fastLaneMode.locationSide34.bestfs4 {
    left:1%;
    background-position: 0px -35px;
  }
  .fastLaneMode.locationSide12.bestfs2 {
    left:27.7%;
    background-position: 0px 0px;
  }

  .fastLaneMode.locationSide34.bestfs3 {
    left:27.7%;
    background-position: 0px -35px;
  }

  .fastLaneMode.locationSide12.disablefs1 {
    left:1%;
    background-position: -140px 0px;
  }
  .fastLaneMode.locationSide34.disablefs4 {
    left:1%;
    background-position: -140px -35px;
  }
  .fastLaneMode.locationSide12.disablefs2 {
    left:27.7%;
    background-position: -140px 0px;
  }

  .fastLaneMode.locationSide34.disablefs3 {
    left:27.7%;
    background-position: -140px -35px;
  }

  .fastLaneMode.locationFront.best24g {
    left:3%;
    background-position:-428px 0px;
  }
  .fastLaneMode.locationBack.best5g {
    left:29.5%;
    background-position:-297px 0px;
  }

  .fastLaneMode.locationFront.best5g {
    left:3%;
    background-position:-297px 0px;
  }
  .fastLaneMode.locationBack.best24g {
    left:29.5%;
    background-position:-428px 0px;
  }

  .fastLaneMode.fsExtender {
    width:50px;
    height:80px; 
    top:48px;
    left:33%;
    background-position: -170px -64px;
  }

  .fastLaneMode.fsRouter {
    width:18px;
    height:45px; 
    top:78px;
    left:2px;
    background-position: 0px -81px;
  }
  .fastLaneMode.fsDevice {
    width:41px;
    height:31px; 
    top:88px;
    left:50%;
    background-position: -73px -85px;
  }
  .productFastLane {
    left:21%;
	bottom:58px;
	position:absolute;
  }
  img.fastlane {
    max-width:70px;
	max-height:100px;
  }
  .productSideFastLane {
    left:22.3%;
    bottom:68px;
    position:absolute;
  }

  img.sideFastLane {
    width:48px;
    height:85px;
  }
 
 .fastLane_router_string {
    font-weight:bold;
    font-size:10px;
    width:50px;
    height:30px;
    left:-7px;
    top:70%;
    position:absolute;
    text-transform:uppercase;
  }

  .fastLane_extender_string {
    font-weight:bold;
    font-size:10px;
    width:70px;
    height:30px;
    left:20%;
    top:70%;
    position:absolute;
    text-transform:uppercase;
  }

  .fastLane_device_string {
    font-weight:bold;
    font-size:10px;
    width:50px;
    height:30px;
    left:50%;
    top:70%;
    position:absolute;
    text-transform:uppercase;
  }

}

/*************************************************************************************************

confirmation

**************************************************************************************************/

.confirmation{
  width:120px;
  height:100px;
  position:absolute;
  background-image: url('../img/confirmationLargeImage.png');
  background-repeat: no-repeat;
}
.confirmDivParent{
 top:-40px;
 left:0px;
 width:550px; 
 height:350px; 
 position:relative
}
.location12{
  width:240px;
  height:160px;
  top:16%;
}
.location34{
  width:240px;
  height:160px;
  top:62%;
}

.confirmation.location12.ok1{
  left:20%;
  background-position:0px 0px;
}
.confirmation.location12.ok2{
  left:52%;
  background-position:-288px 0px;
}
.confirmation.location34.ok3{
  left:52%;
  background-position:-289px -197px;
}
.confirmation.location34.ok4{
  left:20%;
  background-position:0px -195px;
}

.confirmation.location12.best1{
  left:20%;
  background-position:0px -741px;
}
.confirmation.location12.best2{
  left:52%;
  background-position:-276px -741px;
}
.confirmation.location34.best3{
  left:52%;
  background-position:-276px -920px;
}
.confirmation.location34.best4{
  left:20%;
  background-position:0px -920px;
}
.confirmation.location12.poor1{
  left:20%;
  background-position:0px -370px;
}
.confirmation.location12.poor2{
  left:52%;
  background-position:-276px -370px;
}
.confirmation.location34.poor3{
  left:52%;
  background-position:-276px -553px;
}
.confirmation.location34.poor4{
  left:20%;
  background-position:0px -553px;
}
.confirmation.location12.disable1{
  left:20%;
  background-position:0px -1092px;
}
.confirmation.location12.disable2{
  left:52%;
  background-position:-276px -1092px;
}
.confirmation.location34.disable3{
  left:52%;
  background-position:-276px -1267px;
}
.confirmation.location34.disable4{
  left:20%;
  background-position:0px -1267px;
}

.confirmation.location12.noConnected1{
  left:20%;
  background-position:0px -1442px;
}
.confirmation.location12.noConnected2{
  left:52%;
  background-position:-276px -1442px;
}
.confirmation.location34.noConnected3{
  left:52%;
  background-position:-276px -1618px;
}
.confirmation.location34.noConnected4{
  left:20%;
  background-position:0px -1618px;
}
.confirmation.Extender{
  width:180px;
  height:349px;
  top:5%;
  left:35.5%;
  background-position:-24px -1799px;
}
.productOne{
  left:50%;bottom:40px;position:absolute;
}
img.size{
  max-width:140px;max-height:217px;
  margin-left:-10px;
}

@media screen and (max-width: 480px){
  .confirmation {
    width:120px;
    height:100px;
    position:absolute;
    background-image: url('../img/confirmationSmallImages.png');
    background-repeat: no-repeat;
  }
  .confirmDivParent{
    top:0px;
    left:10px;
    width:300px; 
    height:200px; 
    position:relative;
  }
  .currentConnections.longLineInconfirm{ 
    height:2px;
    width:200px;
    left:30%;
    top:58%;
    background-position: 0px -734px;
   }

  .location12{
    width:120px;
    height:81px;
    top:18%;
   }
  .location34{
    width:120px;
    height:81px;
    top:59%;
   }
  .confirmation.location12.ok1{
    left:27%;
    background-position:0px 0px;
  }
  .confirmation.location12.ok2{
    left:55%;
    background-position:-142px 0px;
  }
  .confirmation.location34.ok3{
    left:55%;
    background-position:-142px -110px;
 }
 .confirmation.location34.ok4{
    left:27%;
    background-position:0px -110px;
 }

 .confirmation.location12.best1{
    left:27%;
    background-position:0px -206px;
 }
 .confirmation.location12.best2{
    left:55%;
    background-position:-142px -202px;
 }
 .confirmation.location34.best3{
    left:55%;
    background-position:-142px -322px;
 }
 .confirmation.location34.best4{
    left:27%;
    background-position:0px -324px;
 }
 .confirmation.location12.poor1{
    left:27%;
    background-position:-320px 0px;
 }
 .confirmation.location12.poor2{
    left:55%;
    background-position:-473px 0px;
 }
 .confirmation.location34.poor3{
    left:55%;
    background-position:-473px -110px;
 }
 .confirmation.location34.poor4{
    left:27%;
    background-position:-320px -110px;
 }

 .confirmation.location12.disable1{
    left:27%;
    background-position:0px -412px;
 }
 .confirmation.location12.disable2{
    left:55%;
    background-position:-473px -206px;
 }
 .confirmation.location34.disable3{
    left:55%;
    background-position:-473px -322px;
 }
 .confirmation.location34.disable4{
    left:27%;
    background-position:-320px -322px;
 }
 
  .confirmation.location12.noConnected1{
    left:27%;
    background-position:0px -412px;
  }
  .confirmation.location12.noConnected2{
    left:55%;
    background-position:-142px -412px;
  }
  .confirmation.location34.noConnected3{
    left:55%;
    background-position:-142px -522px;
  }
  .confirmation.location34.noConnected4{
    left:27%;
    background-position:0px -514px;
  }
  .confirmation.Extender{
    width:100px;
    height:175px;
    top:10%;
    left:30.08%;
    background-position:-373px -415px;
  }
  .productOne{
    left:52%;bottom:25px;position:absolute;
  }
  img.size{
    max-width:80px;max-height:100px;
  }
 .productFrontPositionA{
    left:150px;
    bottom:10px;
    position:absolute;
  }
  img.sizeFront{
    width:90px;
    height:175px;
  }
}

@media screen and (min-width: 480px) and (max-width: 920px){
  .confirmDivParent{
    top:-40px;
    left:-100px;
    width:550px; 
    height:350px; 
    position:relative
  }
}

/****************************************************
   small Images
   
 ****************************************************/
.smallMarkImage{
 width:80px;
 height:100px;
 position:absolute;
 background-image:url('../img/smallImage.png');
 background-repeat:no-repeat;
}
.blackShade{
 width:310px;
 height:162px;
 left:10px;
 top:28%;
 background-position:-292px 0px;
}
.whiteCircleTop{
 width:53px;
 height:50px;
 left:42%;
 top:35%;
 background-position:0px -206px;
}
.whiteCircleBottom{
 width:53px;
 height:50px;
 left:42%;
 top:53%;
 background-position:0px -206px;
}
.linkRate24g_top{
 width:35px;
 height:34px;
 left:44%;
 top:38%;
 background-position:-173px 0px;
}
.linkRate24g_left{
 width:35px;
 height:34px;
 left:36%;
 top:38%;
 background-position:-173px 0px;
}
.linkRate5g_bottom{
 width:40px;
 height:34px;
 left:44.5%;
 top:56%;
 background-position:-176px -40px;
}
.linkRate5g_right{
 width:40px;
 height:34px;
 left:44%;
 top:38%;
 background-position:-176px -40px;
}

.whiteEllipse{
 width:100px;
 height:49px;
 left:33%;
 top:35%;
 background-position:0px -137px;
}
.letters_green_topLine{
 color:#fff;
 left:25px;
 top:40%;
 width:200px;
 height:60px;
 position:absolute;
}
.letters_green_bottomLine{
 color:#fff;
 left:25px;
 top:58%;
 width:200px;
 height:60px;
 position:absolute;
}
.letters_topLine{
 color:#fff;
 left:30px;
 top:39%;
 width:110px;
 height:60px;
 position:absolute;
}
.letters_bottomLine{
 color:#fff;
 left:30px;
 top:57%;
 width:200px;
 height:60px;
 position:absolute;
}
.green_routerSideImage{
 left:44%;
 top:38%;
 width:30px;
 height:22px;
 background-position:-53px -34px;
}
.green_deviceSideImage{
 left:44%;
 top:58%;
 width:33px;
 height:18px;
 background-position:-53px 0px;
}
.amber_routerSideImage{
 left:36%;
 top:37%;
 width:30px;
 height:22px;
 background-position:-107px -34px;
}
.arrowLeft{
 left:42%;
 top:37%;
 width:40px;
 height:34px;
 background-position:0px -77px;
}
.amber_deviceSideImage{
 left:42%;
 top:39%;
 width:30px;
 height:18px;
 background-position:-107px 0px;
}
.arrowRight{
 left:36%;
 top:37%;
 width:35px;
 height:34px;
 background-position:-57px -73px;
}
.red_routerSideImage{
 left:36%;
 top:36%;
 width:35px;
 height:30px;
 background-position:0px -30px;
}
.red_deviceSideImage{
 left:42%;
 top:39%;
 width:30px;
 height:18px;
 background-position:0px 0px;
}

@media screen and (max-width: 480px){
  .smallMarkImage{
   width:80px;
   height:100px;
   position:absolute;
   background-image:url('../img/littleImage.png');
   background-repeat:no-repeat;
  }
  .letters_green_topLine{
   color:#fff;
   left:15px;
   font-size:9px;
   top:25%;
   width:120px;
   height:45px;
   position:absolute;
  }
  .letters_green_bottomLine{
   color:#fff;
   left:15px;
   font-size:9px;
   top:47%;
   width:120px;
   height:45px;
   position:absolute;
  }
  .letters_topLine{
   color:#fff;
   left:5px;
   font-size:9px;
   top:25%;
   width:80px;
   height:50px;
   position:absolute;
  }
  .letters_bottomLine{
   color:#fff;
   left:5px;
   top:48%;
   font-size:9px;
   width:130px;
   height:50px;
   position:absolute;
  }
  .blackShade{
   width:190px;
   height:102px;
   left:-8px;
   top:18%;
   background-position:-289px 0px;
  }
  .whiteCircleTop{
   width:45px;
   height:38px;
   left:45%;
   top:23%;
   background-position:0px -160px;
  }
  .whiteCircleBottom{
   width:45px;
   height:50px;
   left:45%;
   top:45%;
   background-position:0px -160px;
  }
  .linkRate24g_top{
   width:25px;
   height:31px;
   left:48%;
   top:24%;
   background-position:-143px 0px;
  }
  .linkRate24g_left{
   width:35px;
   height:34px;
   left:35%;
   top:25%;
   background-position:-143px 0px;
  }
  .linkRate5g_bottom{
   width:30px;
   height:31px;
   left:48%;
   top:46.5%;
   background-position:-143px -42px;
  }
  .linkRate5g_right{
   width:35px;
   height:31px;
   left:47.5%;
   top:25%;
   background-position:-143px -42px;
  }

  .whiteEllipse{
   width:80px;
   height:37px;
   left:30%;
   top:24%;
   background-position: 0px -112px;
  }
  .green_routerSideImage{
   left:38%;
   top:28%;
   width:25px;
   height:16px;
   background-position:-82px -30px;
  }
  .green_deviceSideImage{
   left:38%;
   top:52%;
   width:25px;
   height:14px;
   background-position:-82px 0px;
  }
  .amber_routerSideImage{
   left:33%;
   top:28%;
   width:25px;
   height:16px;
   background-position:-39px -30px;
  }
  .arrowLeft{
   left:42%;
   top:28%;
   width:28px;
   height:26px;
   background-position:0px -59px;
  }
  .amber_deviceSideImage{
   left:42%;
   top:30%;
   width:25px;
   height:13px;
   background-position:-39px 0px;
  }
  .arrowRight{
   left:34%;
   top:27%;
   width:25px;
   height:25px;
   background-position:-44px -60px;
  }
  .red_routerSideImage{
   left:33%;
   top:28%;
   width:30px;
   height:16px;
   background-position:0px -30px;
  }
  .red_deviceSideImage{
   left:42%;
   top:30%;
   width:25px;
   height:13px;
   background-position:0px 0px;
  }
}

/************************************************************************************
 *
 *  status page
 *
 ************************************************************************************/
 .parentDiv{
  left:-50px;
  width:800px;
  height:300px;
  position:relative;
}
.currentConnections {
  width: 120px;
  height: 80px;
  position:absolute;
  background-image: url('../img/currentConnect.png?timestamp=20160412');
  background-repeat: no-repeat;
}

.location1{
  bottom:50%;
  height:82px;
  left:16%;
  width:135px;
  display: none;
}

.location2{
  bottom:46%;
  height:50%;
  left:34.5%;
  width: 455px;
  display: none;
}

.location3{
  bottom:4.4%;
  height:249px;
  left:34.5%;
  width: 453px;
  display: none;
}

.location4{
  height: 82px;
  top:50.5%;
  left:16%;
  width:135px;
  display: none;
}

.redCross{ 
  left:27.5%;
  top:44%; 
  width:50px;
  height:50px;
  background-image: url('../img/redCross.png');
  background-repeat: no-repeat;
  background-size:35px 35px;
  position:absolute;
}

.tipImage{
  width:30px;
  height:30px;
  background-image: url('../img/tip.png');
  background-repeat: no-repeat;
  background-size:30px 30px;
  display: inline-block;
  float: right;
}
.ie8 .tipImage {
  background-image: none;
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/tip.png', sizingMethod='scale');
}
.currentConnections.connInternet { 
  height:45px;
  width:50px;
  left:10%;
  top:42%;
  background-position: -558px -222px;
}

.currentConnections.connInternet2{
  height:45px;
  width:50px;
  left:21%;
  top:42%;
  background-position: -558px -222px;
}

.currentConnections.black_line { 
  height:2px;
  left:15%;
  top:49.5%;
  width:28px;
  background-position: -669px -235px;
}
.currentConnections.black_long_line{
  height:1px;
  left:26.5%;
  top:49.5%;
  width:100px;
  background-position:-762px -234px;
}

.currentConnections.connRouter { 
  height:45px;
  width:20px;
  left:18.3%;
  top:42%;
  background-position: -497px -225px;
  z-index:1;
}

.currentConnections.longLineInStatus { 
  height:2px;
  width:563px;
  left:20.5%;
  top:49.5%;
  background-position: -196px -2325px;
}

.currentConnections.longLineInconfirm{ 
  height:2px;
  width:369px;
  left:29%;
  top:61.5%;
  background-position: -196px -2325px;
}
.currentConnections.connExtender { 
  bottom:100px;
  height:161px;
  left:37%;
  width: 100px;
  background-position: -65px -2241px;
}

.currentConnections.location1.poorRouter_24g{  
  background-position: -152px 0px;
}

.currentConnections.location1.bestRouter_24g{ 
  background-position: -309px 0px;
}

.currentConnections.location1.goodRouter_24g{ 
  background-position: 0px 0px;
}
.currentConnections.location1.noConnectedRouter_24g{ 
  background-position: -618px 0px;
}
.currentConnections.location4.noConnectedRouter_5g{ 
  background-position: -618px -105px;
}

.currentConnections.location1.disableRouter_24g{ 
  background-position: -470px 0px;
}

.currentConnections.location4.poorRouter_5g{ 
  background-position: -152px -225px;
}

.currentConnections.location4.poorRouter_dark{ 
  background-position: -152px -105px;
}

.currentConnections.location4.goodRouter_5g{ 
  background-position: 0px -225px;
}

.currentConnections.location4.goodRouter_dark{ 
  background-position: 0px -105px;
}

.currentConnections.location4.bestRouter_5g{ 
  background-position: -309px -225px;
}

.currentConnections.location4.bestRouter_dark{ 
  background-position: -309px -105px;
}

.currentConnections.location4.disableRouter_5g{ 
  background-position: -470px -105px;
}

.currentConnections.location2.goodClient_24g {   
  background-position: 0px -833px;
}

.currentConnections.location2.bestClient_24g { 
  background-position: 0px -330px;
}

.currentConnections.location2.poorClient_24g { 
  background-position: -464px -330px;
}
.currentConnections.location2.disableClient_24g { 
  background-position: 0px -579px;
}

.currentConnections.location2.noConnectedClient_24g{
  background-position:-456px -579px;
} 
  
.currentConnections.location3.goodClient_5g { 
  background-position: -483px -1350px;
}

.currentConnections.location3.goodClient_dark { 
  background-position: 0px -1350px;
}

.currentConnections.location3.bestClient_5g { 
  background-position: -495px -1089px;
}

.currentConnections.location3.bestClient_dark { 
  background-position: 0px -1089px;
}

.currentConnections.location3.poorClient_5g { 
  background-position: 0px -1625px;
}

.currentConnections.location3.poorClient_dark { 
  background-position: -499px -1625px;
}

.currentConnections.location3.disableClient_5g { 
  background-position: -494px -1921px;
}

.currentConnections.location3.noConnectedClient_5g{
  background-position:0px -1923px;
}

.productTwo{
  left:30%;
  bottom:80px;
  position:absolute;
  z-index:1;
}
.productOne{
  left:50%;
  bottom:40px;
  position:absolute;
}
.productSideStatus{
  left:32%;
  bottom:92px;
  position:absolute;
}
img.sizeTwo{
  width:85px;
  height:125px;
  margin-left:8px;
}
.led_up, .led_down{
	text-align: center;
}
img.sizeFront{
  width:175px;
  height:349px;
}
img.sizeSide{
  width:88px;
  height:161px;
}
.productFrontPositionA{
  left:46.5%;
  bottom:0px;
  position:absolute;
}
.productSidePositionA{
  left:32.5%;
  top:40px;
  position:absolute;
}
.apInternet_string{
  font-size:10px;
  width:70px;
  height:30px;
  left:20.5%;
  top:60%;
  position:absolute;
  text-transform:uppercase;
}
.accessPoint_string{
  font-size:10px;
  width:100px;
  height:30px;
  left:33%;
  top:77%;
  position:absolute;
  text-transform:uppercase;
}
.connInternet_string{
  font-size:10px;
  width:65px;
  height:30px;
  left:8.5%;
  top:60%;
  position:absolute;
  text-transform:uppercase;
}
.connRouter_string{
  font-size:10px;
  width:60px;
  height:30px;
  left:17%;
  top:60%;
  position:absolute;
  text-transform:uppercase;
  word-break:break-all;
}
.connWifiExtender_string{
  font-size:10px;
  width:200px;
  height:50px;
  left:25%;
  top:77%;
  position:absolute;
  text-transform:uppercase;
  text-align: center;
}
.sta_24g_info{
  font-size:12px;
  height:50px;
  left:22%;
  top:18%;
  position:absolute;
  color:black;
}
.ap_24g_info{
  font-size:12px;
  height:50px;
  left:60%;
  top:4%;
  position:absolute;
  color:black;
}
.sta_5g_info{
  font-size:12px;
  height:50px;
  left:22%;
  top:72.5%;
  position:absolute;
  color:black;
}
.ap_5g_info{
  font-size:12px;
  height:50px;
  left:58%;
  top:89%;
  position:absolute;
  color:black;
}

@media screen and (max-width: 600px){
  .parentDiv{
    left:30px;
    top:0px;
    width:300px;
    height:150px;
    position:relative;
  }
  .currentConnections{
    width: 120px;
    height: 80px;
    position:absolute;
    background-image: url('../img/currentConnectionSmallImage.png?timestamp=20160412');
    background-repeat: no-repeat;
  }
  .location1{
    width:70px;
    height:45px;
    left:8px;
    top:25px; 
  }
  .location4{
    width:70px;
    height:45px;
    left:8px;
    top:70px;
  }
  .location2{
    width:220px;
    height:116px;
    left:31%;
    top:5px;
  }
  .location3{
    width:220px;
    height:117px;
    left:31%;
    top:17px;
  } 
 .currentConnections.longLineInStatus { 
    height:2px;
    width:280px;
    left:25px;
    top:69px;
    background-position: 0px -734px;
  } 
 .currentConnections.connInternet{
    width:40px;
    height:34px;
    left:2px;
    top:12px;
    background-position:-491px 0px;
  }
  
  .currentConnections.connInternet2{
    height:34px;
    width:40px;
    left:4%;
    top:33%;
    background-position: -491px 0px;
  }
  .currentConnections.connRouter{
    width:15px;
    height:33px;
    left:12px;
    top:53px;
    background-position:-594px 0px;
  }
  /* add a line */
  .currentConnections.black_long_line{
    width:45px;
    height:1px;
    left:14%;
    top:45%;
    background-position:-543px -284px;
  }

  .currentConnections.location1.bestRouter_24g{
    background-position:0px 0px;
  }
  .currentConnections.location1.goodRouter_24g{
    background-position:-87px 0px;
  }
  .currentConnections.location1.poorRouter_24g{
    background-position:-277px 0px;
  }
  .currentConnections.location1.disableRouter_24g{
    background-position:-182px 0px;
  }
  .currentConnections.location1.noConnectedRouter_24g{
    background-position:-376px 0px;
  } 
  .currentConnections.location4.bestRouter_5g{
    background-position:0px -55px;
  }
  .currentConnections.location4.bestRouter_dark{
    background-position:-644px -55px;
  }
  .currentConnections.location4.goodRouter_5g{
    background-position:-87px -55px;
  }
  .currentConnections.location4.goodRouter_dark{
    background-position:-466px -55px;
  }
  .currentConnections.location4.poorRouter_5g{
    background-position:-277px -55px;
  }
  .currentConnections.location4.poorRouter_dark{
    background-position:-557px -55px;
  }
  .currentConnections.location4.disableRouter_5g{
    background-position:-376px -55px;
  }
  .currentConnections.location4.noConnectedRouter_5g{
    background-position:-182px -55px;
  }
  .currentConnections.connExtender{
    width:55px;
    height:101px;
    left:145px;
    top:50px;
    background-position:-730px 0px;
  } 
  .currentConnections.black_line{
    width:2px;
    left:17px;
    height:7px;
    top:46px;
    background-position:-665px 0px;
  }
  .currentConnections.location2.bestClient_24g{
    background-position:0px -127px;
  }
  .currentConnections.location2.goodClient_24g{
    background-position:0px -249px;
  }
  .currentConnections.location2.poorClient_24g{
    background-position:-237px -127px;
  }
  .currentConnections.location2.disableClient_24g{
    background-position:-237px -249px;
  }
  .currentConnections.location2.noConnectedClient_24g{
    background-position:-482px -128px;
  } 
  .currentConnections.location3.bestClient_5g{
    background-position:-237px -616px;
  }
  .currentConnections.location3.bestClient_dark{
    background-position:0px -616px;
  }
  .currentConnections.location3.goodClient_5g{
    background-position:0px -490px;
  }
  .currentConnections.location3.goodClient_dark{
    background-position:0px -370px;
  }
  .currentConnections.location3.poorClient_5g{
    background-position:-520px -490px;
  }
  .currentConnections.location3.poorClient_dark{
    background-position:-520px -370px;
  }
  .currentConnections.location3.disableClient_5g{
    background-position:-237px -370px;
  }  
  .currentConnections.location3.noConnectedClient_5g{
    background-position:-237px -490px;
  }
  .productTwo{
    left:21%;
    bottom:35px;
    position:absolute;
  }
  .productSideStatus{
    left:28%;
    bottom:40px;
    position:absolute;
  }
  img.sizeTwo{
    width:52px;
    height:80px;
  }
  img.led{
	  height: 70px;
	  bottom: 15px;
	  position:absolute;
  }
  .led_up{
	  left: 25px;
	  bottom: 80px;
	  position:absolute;
	  font-size: smaller;
  }
  .led_down{
	  left: 25px;
	  bottom: 6px;
	  position:absolute;
	  font-size: smaller;
  }
  .productSidePositionA{
    left:70px;
    top:-10px;
    position:absolute;
  }
  img.sizeSide{
    width:60px;
    height:120px;
  }
  
  .apInternet_string{
    font-size:8px;
    width:70px;
    height:30px;
    left:1%;
    top:60%;
    position:absolute;
    text-transform:uppercase;
  }
  .accessPoint_string{
    font-size:8px;
    width:100px;
    height:30px;
    left:19%;
    top:75%;
    position:absolute;
    text-transform:uppercase;
  }

  .redCross{
    left:18%;
    top:38%; 
    width:30px;
    height:30px;
    background-image: url('../img/redCross.png');
    background-repeat: no-repeat;
    background-size:20px 20px;
    position:absolute;
  }

  .ie8 .redCross {
    background-image: none;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/redCross.png', sizingMethod='scale');
  }
  .connInternet_string{
    font-size:8px;
    height:30px;
    top:-3px;
    position:absolute;
    text-transform:uppercase;
    width:90px;
    left:-30px;
    text-align: center;
  }
  .connRouter_string{
    font-size:8px;
    height:30px;    
    position:absolute;
    text-transform:uppercase;
    word-break:break-all;
    width:70px;
    left:-20px;
    top:58%;
    text-align: center;
  }
  .connWifiExtender_string{
    font-size:8px;
    height:50px;
    position:absolute;
    text-transform:uppercase;
    width:150px;
    left:7%;
    top:80%;
    text-align: center;
  }
  .sta_24g_info{
    font-size:8px;
    height:50px;
    left:13%;
    top:8%;
    position:absolute;
    color:black;
  }
  .ap_24g_info{
    font-size:8px;
    height:50px;
    left:63%;
    top:-3%;
    position:absolute;
    color:black;
  }
 .sta_5g_info{
    font-size:8px;
    height:50px;
    position:absolute;
    color:black;
    width:120px;
    left:0%;
    top:72.5%;
    text-align: center;
 }
 .ap_5g_info{
    font-size:8px;
    height:50px;
    left:63%;
    top:83%;
    position:absolute;
    color:black;
  }
}
/****************************************************
   ca_extender_vie.htm

 ****************************************************/
.vie {
  word-spacing: 2px;
  font-size: 18px;
  line-height: 28px;
  margin: 10px;
  color: #333;
  padding: 40px 12%;
}
/****************************************************
   RA function

 ****************************************************/
#page_container{
  width:980px;
  margin:0 auto;
  overflow:visible;
}
.wizard_body_container {
  height:500px;
  width:960px;
  margin:5px auto 0 auto;
}
.wizard_content_div{ margin:0;}
.wizard_words_div{
  padding:4% 15% 0px 15%;
  font-family:Arial;
  font-size:10pt;
  font-weight:normal;
  color:#404040;
}
.wizard_buttons_div{
  height:50px;
  width:90%;
  line-height:50px;
  padding:0;
  margin:10px;
}
.apply_bt{
  width: 150px;
  height: 35px;
}
.apply1_bt{
  width: 150px;
  height: 35px;
}
.lines{
  padding-bottom:60px;
}
.lines>div+div div{
  float:left;
  margin:10px 20px 10px 20px;
}
.lines>div+div div a{
  line-height:19px;
}
.top_link{
  font-size:10pt;
  float:right;
  margin: 2% 5% 2% 5%;
}
.page_container_fw{
  width:100%;
  margin:0 auto;
  overflow:visible;
  float: right;
  margin-left:2%;
  position: relative;
}
.wizard_content_div_fw{
  border:1px solid rgb(216,214,214);
}
.wizard_words_div_fw{
  padding:5% 10% 0px 10%;
  font-family:Arial;
  font-size:10pt;
  font-weight:normal;
  color:#404040;
}
.lightList {
  display: inline;
  width: 90px;
}
/******************Security Enhancement*****************/
.top0 {
  background-color: rgb(206, 206, 206);
  border-radius: 18px;
}
#passwdHintContent {
  margin-left: 10px;
}
.secure .main,.reset .main, #continueReset{
  width: 65%;
  margin: 20px 20% 80px 20%;
  position:  relative;
}
#secure_title {
  width: 100%;
  height: 100%;
  font-size: 24px;
  font-weight: bold;
  color: rgb(186, 28, 165);
}
#secureName, #securePwd, #securePwdVerify,#resetName, #resetPwd, #resetPwdVerify {
  width: 50%;
  float: right;
}
#secureQue1, #secureQue2, #resetQue1, #resetQue2 {
  width: 70%;
}
.secure_que ,.reset_que{
  padding: 0px;
  height: 30px;
}
#reset_title {
  width: 100%;
  height: 100%;
  font-size: 24px;
  font-weight: bold;
  color: rgb(16, 141, 199);
}
