/********************************************
Theme Name: Genesis
Theme URI: http://ctinetworks.com
Description: This site was designed and developed by the CTI Creative Group.
Author: Evan Kennedy
Version: 2.0.0
Tags: Responsive, HTML5
Copyright: CTI Networks.  All Rights Reserved.
*/
/*------------------------------------------------------
                    Reset CSS
  ------------------------------------------------------*/
/**
 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 * http://cssreset.com
 */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, hr {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1.3; }

ol, ul {
  list-style: none;
  padding: 10px 0; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/*------------------------------------------------------
                    Preset CSS
  ------------------------------------------------------*/
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

html {
  font-size: 100%; }

html, body {
  height: 100%;
  margin: 0;
  padding: 0; }

body {
  color: #404141;
  font-family: 'Open Sans', sans-serif;
  font-size: 1em;
  padding-top: 60px;
  width: 100%; }

h1, .h1 {
  font-size: 2.8em;
  font-weight: 300;
  padding-bottom: 30px;
  text-align: center;
  text-transform: uppercase; }

h2, .h2 {
  font-size: 1.3em;
  padding: 10px 0;
  text-transform: uppercase; }

h3, .h3 {
  font-size: 1.2em;
  font-weight: 600;
  padding: 10px 0; }

p {
  padding: 10px 0;
  word-wrap: break-word; }

a {
  color: #2bade3;
  text-decoration: none; }

a:hover {
  color: #f96808; }

img {
  border: none;
  padding: 10px 0;
  max-width: 100%; }

hr {
  border-top: 2px solid #2bade3;
  display: block;
  height: 1px;
  margin: 0 auto 30px auto;
  width: 10%; }

strong {
  font-size: 1.2em;
  font-weight: 700; }

::-moz-selection {
  background: #2bade3;
  color: #fff; }

::selection {
  background: #2bade3;
  color: #fff; }

::-moz-selection {
  background: #2bade3;
  color: #2bade3; }

input[type=text], input[type=password], textarea, select {
  background: #eee;
  border: none;
  border-radius: 5px;
  font-family: 'Open Sans', sans-serif;
  font-size: 1.1em;
  margin: 0 0 10px 0;
  padding: 10px 5px;
  outline: none;
  width: 250px; }

textarea {
  width: 260px; }

input[type=submit] {
  background: #2bade3;
  border: none;
  border-radius: 5px;
  color: #fff;
  font-family: 'Open Sans', sans-serif;
  font-size: 1.1em;
  margin: 0 0 10px 0;
  padding: 10px 0;
  width: 260px;
  -webkit-appearance: none; }

input[type='radio'], input[type='checkbox'] {
  height: 20px;
  width: 20px; }

textarea {
  height: 100px; }

select {
  width: 260px; }

label {
  display: inline-block;
  font-weight: 600;
  padding: 0 0 3px;
  text-align: left;
  width: 240px; }

li {
  padding-bottom: 5px; }

details {
  margin: 10px 0; }

summary {
  cursor: pointer;
  font-size: 1.3em;
  font-weight: 700;
  outline: none; }

button {
  cursor: pointer; }

button:active, button:focus {
  border: none;
  outline: none; }

iframe {
  border-bottom: 1px solid #ccc; }

.g-recaptcha {
  -webkit-transform: scale(0.86);
      -ms-transform: scale(0.86);
          transform: scale(0.86); }

/*------------------------------------------------------
                  Container CSS
  ------------------------------------------------------*/
.full {
  display: block;
  overflow: hidden;
  position: relative;
  width: 100%; }

.wrapper {
  display: block;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  width: 1180px; }

.header, header {
  display: inline-block;
  padding-bottom: 30px;
  position: relative;
  text-align: center;
  width: 100%; }

.footer, footer {
  display: inline-block;
  padding-top: 30px;
  position: relative;
  text-align: center;
  width: 100%; }

.one {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  display: inline-block;
  padding: 60px 45px;
  position: relative;
  width: 1090px; }

.one-half {
  display: inline-block;
  float: left;
  padding: 10px;
  position: relative;
  width: 525px; }

.half-parent {
  display: inline-block;
  float: left;
  padding: 20px 0;
  width: 47%; }

.half-parent.last {
  float: right; }

.one-third {
  display: inline-block;
  float: left;
  padding: 0 10px;
  position: relative;
  text-align: center;
  width: 343px; }

.one-fourth {
  display: inline-block;
  float: left;
  padding: 0 10px;
  position: relative;
  width: 252px; }

.box {
  padding: 20px;
  text-align: left; }

.group {
  clear: both;
  display: inline-block; }

.screen-size {
  display: block;
  height: 85%;
  width: 100%; }

/*------------------------------------------------------
               Container > Tag CSS
  ------------------------------------------------------*/
.one-half h1 {
  padding: 0 0 20px 0;
  text-align: left; }

input.half, select.half {
  width: 125px; }

/*------------------------------------------------------
               Desktop Menu CSS
  ------------------------------------------------------*/
nav#desktop-menu {
  background: #fff;
  border-bottom: 2px solid #ebebeb;
  height: 60px;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 10;
  -webkit-backface-visibility: hidden; }

nav#desktop-menu img {
  display: inline-block;
  float: left;
  height: 60px;
  margin: 0 0 0 60px;
  padding: 0;
  width: auto;
  position: absolute; }

nav#desktop-menu ul {
  line-height: 60px;
  list-style: none;
  margin: 0 60px;
  padding: 0;
  float: right; }

nav#desktop-menu ul li {
  float: left;
  margin: 0 1em;
  padding: 0;
  position: relative; }

nav#desktop-menu ul li a {
  color: #404141; }

nav#desktop-menu ul li a:hover {
  color: #2bade3; }

nav#desktop-menu ul li a.desktop-menu-current {
  color: #f96808; }

#login, #my-account {
  background: #2bade3;
  border-radius: 5px;
  color: #fff !important;
  cursor: pointer;
  float: right;
  display: inline-block;
  line-height: 30px;
  margin: 15px 0;
  padding: 0 10px;
  text-transform: uppercase; }

#login::after {
  background: url("../img/primap.png") no-repeat -40px -437px;
  display: inline-block;
  content: " ";
  height: 22px;
  margin-left: 10px;
  vertical-align: middle;
  width: 20px; }

.logout {
  background: #f5f5f5;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  font-weight: 600;
  text-align: center; }

#login-form {
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  display: block;
  line-height: normal;
  position: fixed;
  right: -1000px;
  top: 60px;
  width: 300px;
  z-index: 10;
  transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  -webkit-transform: scale(0);
  -webkit-transition: right 0s .3s, -webkit-transform .3s;
  transition: right 0s .3s, -webkit-transform .3s;
  transition: transform .3s, right 0s .3s;
  transition: transform .3s, right 0s .3s, -webkit-transform .3s;
  -moz-transition: -moz-transform .3s, right 0s .3s;
  -ms-transition: -ms-transform .3s, right 0s .3s;
  -o-transition: -o-transform .3s, right 0s .3s;
  -webkit-transition: -webkit-transform .3s, right 0s .3s;
  -webkit-backface-visibility: hidden; }

#login-form.active {
  right: 76px;
  transition: -webkit-transform .3s;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s;
  -moz-transition: -moz-transform .3s;
  -ms-transition: -ms-transform .3s;
  -o-transition: -o-transform .3s;
  -webkit-transition: -webkit-transform .3s;
  transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  -webkit-transform: scale(1); }

#login-form::before {
  background: url("../img/primap.png") no-repeat -375px -127px;
  display: inline-block;
  content: " ";
  height: 9px;
  position: absolute;
  right: 35px;
  top: -8px;
  width: 18px; }

#login-form .form {
  line-height: 1.1em;
  margin: 0;
  padding: 20px 0 10px;
  width: 300px; }

#login-form .form li {
  float: none;
  margin: 0; }

#login-form .sprite, #login-form .sprite:hover {
  color: #404141; }

#login-form .icons {
  padding: 20px;
  overflow: hidden; }

#login-form .sprite {
  padding: 10px 0;
  width: 125px; }

/*------------------------------------------------------
               Mobile Menu CSS
  ------------------------------------------------------*/
#mobile-menu {
  background: #fff;
  border-bottom: 2px solid #ebebeb;
  display: none;
  left: 0;
  height: 60px;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 10;
  -webkit-backface-visibility: hidden;
  -webkit-transition: top .2s;
  -webkit-box-shadow: 0px -6px 25px 0px rgba(0, 0, 0, 0.75);
  box-shadow: 0px -6px 25px 0px rgba(0, 0, 0, 0.75); }

#mobile-menu.hidden {
  top: -60px; }

#mobile-menu img {
  display: inline-block;
  height: 60px;
  margin-left: 10px;
  padding: 0;
  max-width: 40%;
  width: auto; }

#mobile-menu ul {
  float: right;
  line-height: 60px;
  padding: 0;
  margin: 0; }

#mobile-menu li {
  float: left;
  padding-right: 10px; }

#mobile-account, #mobile-menu-button {
  cursor: pointer; }

#real-mobile-menu {
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  display: block;
  line-height: normal;
  position: fixed;
  right: -1000px;
  top: 60px;
  width: 300px;
  z-index: 10;
  text-align: center;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
  -webkit-transition: right 0s .3s, -webkit-transform .3s;
  transition: right 0s .3s, -webkit-transform .3s;
  transition: transform .3s, right 0s .3s;
  transition: transform .3s, right 0s .3s, -webkit-transform .3s;
  -webkit-backface-visibility: hidden; }

#real-mobile-menu a {
  color: #000;
  display: inline-block;
  font-size: 1.4em;
  font-weight: 700;
  padding: 10px 0; }

#real-mobile-menu.active {
  right: 10px;
  -webkit-transition: -webkit-transform .3s;
  transition: -webkit-transform .3s;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1); }

#real-mobile-menu::before {
  background: url("../img/primap.png") no-repeat -375px -127px;
  display: inline-block;
  content: " ";
  height: 9px;
  position: absolute;
  right: 40px;
  top: -8px;
  width: 18px; }

/*------------------------------------------------------
                  Footer CSS
  ------------------------------------------------------*/
footer {
  text-align: center; }

footer ul {
  padding-bottom: 30px; }

footer li {
  display: inline;
  padding: 0 10px; }

footer li a {
  text-transform: uppercase; }

footer p {
  font-size: 0.9em;
  padding-bottom: 30px; }

footer .facebook {
  background: url("../img/primap.png") no-repeat -132px -517px;
  display: inline-block;
  height: 55px;
  width: 55px; }

footer .google-plus {
  background: url("../img/primap.png") no-repeat -196px -517px;
  display: inline-block;
  height: 55px;
  width: 55px; }

footer .twitter {
  background: url("../img/primap.png") no-repeat -259px -517px;
  display: inline-block;
  height: 55px;
  width: 55px; }

/*------------------------------------------------------
               Color Schemes CSS
  ------------------------------------------------------*/
.color-scheme-orange, .color-scheme-blue {
  background: #F96808;
  color: #fff; }

.color-scheme-orange h2, .color-scheme-blue h2, .color-scheme-green h2, .color-scheme-yellow h2, .color-scheme-blue p {
  color: #404141; }

.color-scheme-blue summary, .color-scheme-green summary, .color-scheme-yellow summary {
  color: #fff; }

.color-scheme-blue details, .color-scheme-green details, .color-scheme-yellow details {
  color: #404141; }

.color-scheme-blue {
  background: #2BADE3; }

.color-scheme-bridge {
  background: url("../img/city-background.png") no-repeat;
  -webkit-background-size: 100% 100%;
          background-size: 100% 100%;
  color: #fff; }

.color-scheme-grey {
  background: #ebebeb; }

.color-scheme-grey input[type=text], .color-scheme-grey select, .color-scheme-blue select {
  background: #fff; }

.color-scheme-dark-wood {
  background: url("../img/wood-background.jpg") no-repeat;
  -webkit-background-size: 100% 100%;
          background-size: 100% 100%;
  color: #fff; }

.color-scheme-yellow {
  background: #ffad00;
  color: #fff; }

.color-scheme-yellow select {
  background: #fff; }

.color-scheme-white {
  background: #fff;
  color: #404141; }

.color-scheme-green {
  background: #6fa71b;
  color: #fff; }

.color-scheme-document h2 {
  color: #f96808; }

.color-scheme-document h3 {
  color: #2bade3; }

/*------------------------------------------------------
               Font Schemes CSS
  ------------------------------------------------------*/
.font-scheme-intro h1 {
  font-weight: 700; }

.font-scheme-intro h2 {
  font-weight: 700; }

/*------------------------------------------------------
                  Background CSS
  ------------------------------------------------------*/
.background-grey {
  background: #ebebeb; }

.background-black {
  background: #404141;
  color: #fff; }

/*------------------------------------------------------
                  Image CSS
  ------------------------------------------------------*/
.intro-image img {
  height: auto;
  width: 70%; }

img.intro-image-small {
  height: auto;
  width: 40%; }

img.full-image {
  height: auto;
  width: 100%; }

img.normal-image {
  height: auto;
  max-width: 100%;
  width: auto; }

/*------------------------------------------------------
                  Sprite CSS
  ------------------------------------------------------*/
.sprite {
  display: inline-block;
  text-align: center; }

.sprite h2, .sprite p {
  padding: 10px 0; }

.tower-sprite {
  background: url("../img/primap.png") no-repeat -254px -1051px;
  content: " ";
  display: inline-block;
  height: 128px;
  margin: 0 20px;
  width: 128px; }

.pig-large-sprite {
  background: url("../img/primap.png") no-repeat -388px -1051px;
  content: " ";
  display: inline-block;
  height: 128px;
  margin: 0 20px;
  width: 128px; }

.speedometer-large-sprite {
  background: url("../img/primap.png") no-repeat -518px -1051px;
  content: " ";
  display: inline-block;
  height: 128px;
  margin: 0 20px;
  width: 128px; }

.connect-computer-sprite {
  background: url("../img/primap.png") no-repeat -646px -1062px;
  content: " ";
  display: inline-block;
  height: 105px;
  margin: 0 20px;
  width: 132px; }

.connect-router-sprite {
  background: url("../img/primap.png") no-repeat -646px -1174px;
  content: " ";
  display: inline-block;
  height: 86px;
  margin: 0 20px;
  width: 132px; }

.media-devices-a-sprite {
  background: url("../img/primap.png") no-repeat -193px -1188px;
  content: " ";
  display: inline-block;
  height: 76px;
  margin: 0 20px;
  width: 207px; }

.media-devices-b-sprite {
  background: url("../img/primap.png") no-repeat -417px -1188px;
  content: " ";
  display: inline-block;
  height: 82px;
  margin: 0 20px;
  width: 220px; }

.envolope-sprite {
  background: url("../img/primap.png") no-repeat -8px -343px;
  content: " ";
  display: inline-block;
  height: 44px;
  margin: 0 20px;
  width: 62px; }

.email-sprite {
  background: url("../img/primap.png") no-repeat -174px -1269px;
  content: " ";
  display: inline-block;
  height: 166px;
  margin: 0 20px;
  width: 166px; }

.phone-sprite {
  background: url("../img/phone-button.png") no-repeat;
  display: inline-block;
  height: 165px;
  margin-top: 15px;
  width: 163px; }

.userspace-sprite {
  background: url("../img/primap.png") no-repeat -86px -343px;
  content: " ";
  display: inline-block;
  height: 44px;
  margin: 0 20px;
  width: 42px; }

.policies-sprite {
  background: url("../img/primap.png") no-repeat -142px -343px;
  content: " ";
  display: inline-block;
  height: 46px;
  margin: 0 20px;
  width: 40px; }

.pdf-sprite {
  background: url("../img/primap.png") no-repeat -200px -343px;
  content: " ";
  display: inline-block;
  height: 47px;
  margin: 0 20px;
  width: 39px; }

.preferences-sprite {
  background: url("../img/primap.png") no-repeat -321px -339px;
  content: " ";
  display: inline-block;
  height: 53px;
  margin: 0 20px;
  width: 54px; }

.payments-sprite {
  background: url("../img/primap.png") no-repeat -387px -350px;
  content: " ";
  display: inline-block;
  height: 39px;
  margin: 0 20px;
  width: 80px; }

.box-sprite {
  background: url("../img/primap.png") no-repeat -250px -343px;
  content: " ";
  display: inline-block;
  height: 47px;
  margin: 0 20px;
  width: 62px; }

.modem-sprite {
  background: url("../img/primap.png") no-repeat -347px -1343px;
  content: " ";
  display: inline-block;
  height: 30px;
  margin: 45px 20px 0 20px;
  width: 114px; }

.router-sprite {
  background: url("../img/primap.png") no-repeat -347px -1386px;
  content: " ";
  display: inline-block;
  height: 75px;
  margin: 0 20px;
  width: 114px; }

.no-equipment-sprite {
  background: url("../img/primap.png") no-repeat -473px -1335px;
  content: " ";
  display: inline-block;
  height: 44px;
  margin: 32px 20px 0 20px;
  width: 44px; }

.inline-filter-sprite {
  background: url("../img/primap.png") no-repeat -508px -1460px;
  content: " ";
  display: inline-block;
  height: 74px;
  margin: 57px 20px 0 20px;
  width: 51px; }

.dual-line-filter-sprite {
  background: url("../img/primap.png") no-repeat -588px -1460px;
  content: " ";
  display: inline-block;
  height: 74px;
  margin: 57px 20px 0 20px;
  width: 66px; }

.wall-mount-filter-sprite {
  background: url("../img/primap.png") no-repeat -690px -1402px;
  content: " ";
  display: inline-block;
  height: 131px;
  margin: 0 20px;
  width: 81px; }

.computer-search-sprite {
  background: url("../img/primap.png") no-repeat -8px -806px;
  content: " ";
  display: inline-block;
  height: 184px;
  margin: 0 20px;
  width: 227px; }

/*------------------------------------------------------
                  Icons CSS
  ------------------------------------------------------*/
.windows-icon {
  background: url("../img/primap.png") no-repeat -270px -1498px;
  content: " ";
  display: inline-block;
  height: 32px;
  margin: 0 10px;
  vertical-align: middle;
  width: 32px; }

.apple-icon {
  background: url("../img/primap.png") no-repeat -307px -1497px;
  content: " ";
  display: inline-block;
  height: 32px;
  margin: 0 15px;
  vertical-align: middle;
  width: 25px; }

.linux-icon {
  background: url("../img/primap.png") no-repeat -337px -1501px;
  content: " ";
  display: inline-block;
  height: 32px;
  margin: 0 13px;
  vertical-align: middle;
  width: 28px; }

.download-icon {
  background: url("../img/primap.png") no-repeat -39px -1191px;
  content: " ";
  display: inline-block;
  height: 17px;
  margin: 0 5px;
  vertical-align: middle;
  width: 29px; }

.upload-icon {
  background: url("../img/primap.png") no-repeat -39px -1229px;
  content: " ";
  display: inline-block;
  height: 17px;
  margin: 0 5px;
  vertical-align: middle;
  width: 29px; }

.account-icon {
  background: url("../img/primap.png") no-repeat -72px -401px;
  content: " ";
  display: inline-block;
  height: 26px;
  margin: 0 5px;
  vertical-align: middle;
  width: 28px; }

.mobile-menu-icon {
  background: url("../img/primap.png") no-repeat -67px -435px;
  content: " ";
  display: inline-block;
  height: 19px;
  margin: 0 5px;
  vertical-align: middle;
  width: 23px; }

.admin-icon {
  background: url("../img/primap.png") no-repeat -237px -806px;
  content: " ";
  display: inline-block;
  height: 21px;
  margin: 0 8px 0 2px;
  vertical-align: bottom;
  width: 17px; }

.blocked-icon {
  background: url("../img/primap.png") no-repeat -264px -806px;
  content: " ";
  display: inline-block;
  height: 20px;
  margin-right: 7px;
  vertical-align: bottom;
  width: 20px; }

.plans-icon {
  background: url("../img/primap.png") no-repeat -291px -806px;
  content: " ";
  display: inline-block;
  height: 20px;
  margin-right: 6px;
  vertical-align: bottom;
  width: 21px; }

/*------------------------------------------------------
                  List CSS
  ------------------------------------------------------*/
ul.checked {
  line-height: 26px; }

ul.checked li::before {
  background: url("../img/primap.png") no-repeat -112px -1186px;
  content: " ";
  display: block;
  float: left;
  height: 26px;
  margin-right: 5px;
  width: 29px; }

ul.square {
  list-style: square;
  padding: 20px;
  margin-left: 20px; }

ul.square-2 {
  list-style: square;
  margin: 0 0 0 20px;
  padding: 5px 0 5px 20px; }

ul.square-2 li {
  padding: 5px 0 0 0; }

ul.checked {
  position: relative; }

ul.checked li::before {
  background: url("../img/primap.png") no-repeat -112px -1186px;
  content: " ";
  display: block;
  float: left;
  height: 26px;
  left: 0;
  margin-right: 5px;
  position: absolute;
  width: 29px; }

ul.checked li {
  padding: 0 0 10px 34px; }

ul.square {
  list-style: square;
  padding: 20px;
  margin-left: 20px; }

ul.extra-ml {
  margin-left: 40px; }

/*------------------------------------------------------
                  Page Intro CSS
  ------------------------------------------------------*/
/*------------------------------------------------------
                  Setup Guides CSS
  ------------------------------------------------------*/
#setup-form select {
  width: 280px; }

#setup-guide img {
  height: auto;
  width: 70%; }

#setup-guide figure {
  text-align: center; }

/*------------------------------------------------------
                  Plan CSS
  ------------------------------------------------------*/
.plans {
  background: #fff;
  border-left: 1px solid #ccc;
  border-top: 1px solid #ccc;
  text-align: center;
  width: 100%; }

.plans h2, .plans p {
  padding: 0 10px 5px 10px; }

.plans th, .plans td {
  border-right: 1px solid #ccc;
  padding: 5px;
  vertical-align: middle;
  width: 20%; }

.plans tr {
  border-bottom: 1px solid #ccc; }

.plans .striped {
  background: #f1f1f1; }

.plans .details, .plans .speeds {
  text-align: left;
  width: 30%; }

.plans .speeds {
  font-size: 1.2em;
  font-weight: 600;
  text-align: center; }

.plans .speed-data {
  display: inline-block;
  text-align: right;
  width: 90px; }

.plans .blue, .plans .green, .plans .yellow, .plans .orange, .plans .red, .plans th {
  background: #2bade3;
  color: #fff; }

.plans .green {
  background: #85ca20; }

.plans .yellow {
  background: #ffad00; }

.plans .orange {
  background: #f96808; }

.plans .red {
  background: #d20000; }

.plans th {
  background: #404141;
  text-transform: uppercase; }

.plans .order-now {
  font-size: 1.2em;
  text-transform: uppercase; }

/*------------------------------------------------------
                  Home Intro CSS
  ------------------------------------------------------*/
#intro {
  background: #ebebeb; }

#intro h1 {
  color: #d20000;
  font-weight: 700;
  padding-bottom: 15px;
  text-transform: none; }

#intro footer p {
  padding-bottom: 20px; }

/*------------------------------------------------------
                Home Services CSS
  ------------------------------------------------------*/
#services .one-fourth.first {
  padding-left: 141.5px; }

#services .panel {
  color: #fff;
  display: block;
  padding: 30px 10px 20px 10px;
  position: relative;
  text-align: center; }

#services .panel p {
  height: 100px; }

#services h2 {
  padding-top: 10px; }

#services .panel.wireless {
  background: #f96808; }

#services .panel.dsl {
  background: #2bade3; }

#services .panel.dialup {
  background: #85ca20; }

#services .panel.email {
  background: #ffad00; }

#services div.wireless {
  background: url("../img/primap.png") no-repeat -8px -177px;
  display: inline-block;
  height: 146px;
  width: 167px; }

#services div.dsl {
  background: url("../img/primap.png") no-repeat -193px -177px;
  display: inline-block;
  height: 146px;
  width: 167px; }

#services div.dialup {
  background: url("../img/primap.png") no-repeat -380px -177px;
  display: inline-block;
  height: 146px;
  width: 167px; }

#services div.email {
  background: url("../img/primap.png") no-repeat -563px -177px;
  display: inline-block;
  height: 146px;
  width: 167px; }

/*------------------------------------------------------
                  Home Commitment CSS
  ------------------------------------------------------*/
#commitment {
  background: #2C2C2C url("../img/city-background.png") no-repeat;
  -webkit-background-size: 100% 100%;
          background-size: 100% 100%;
  color: #fff; }

#commitment h2 {
  padding: 10px 0 0 0; }

#commitment::before {
  background: url("../img/primap.png") no-repeat -10px -107px;
  content: " ";
  display: inline-block;
  height: 35px;
  left: 0;
  margin: -2px auto 0 auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 67px; }

#commitment .one-fourth {
  text-align: center; }

#commitment div.value {
  background: url("../img/primap.png") no-repeat -293px -12px;
  display: inline-block;
  height: 96px;
  width: 98px; }

#commitment div.reliability {
  background: url("../img/primap.png") no-repeat -395px -12px;
  display: inline-block;
  height: 96px;
  width: 98px; }

#commitment div.speed {
  background: url("../img/primap.png") no-repeat -495px -12px;
  display: inline-block;
  height: 96px;
  width: 98px; }

#commitment div.support {
  background: url("../img/primap.png") no-repeat -595px -12px;
  display: inline-block;
  height: 96px;
  width: 98px; }

/*------------------------------------------------------
                  Home Account CSS
  ------------------------------------------------------*/
#account {
  background: #ebebeb;
  text-align: center; }

#account::before {
  background: url("../img/primap.png") no-repeat -169px -107px;
  content: " ";
  display: inline-block;
  height: 32px;
  left: 0;
  margin: -2px auto 0 auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 66px; }

#account header {
  padding-bottom: 0; }

#account form {
  padding-bottom: 15px; }

/*------------------------------------------------------
                  Home Support CSS
  ------------------------------------------------------*/
#support::before {
  background: url("../img/primap.png") no-repeat -169px -107px;
  content: " ";
  display: inline-block;
  height: 35px;
  left: 0;
  margin: -2px auto 0 auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 67px; }

#support img.featured {
  float: right;
  height: auto;
  width: 70%; }

/*------------------------------------------------------
                  Home About CSS
  ------------------------------------------------------*/
#about {
  background: #2C2C2C url("../img/building-background.jpg") no-repeat;
  -webkit-background-size: 100% 100%;
          background-size: 100% 100%;
  color: #fff; }

#about::before {
  background: url("../img/primap.png") no-repeat -10px -107px;
  content: " ";
  display: inline-block;
  height: 35px;
  left: 0;
  margin: -2px auto 0 auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 67px; }

#about img.featured {
  height: auto;
  width: 100%; }

#about p {
  padding-bottom: 20px; }

#about strong {
  line-height: 2em; }

/*------------------------------------------------------
                  Home Contact CSS
  ------------------------------------------------------*/
#contact::before {
  background: url("../img/primap.png") no-repeat -169px -107px;
  content: " ";
  display: inline-block;
  height: 32px;
  left: 0;
  margin: -2px auto 0 auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 66px; }

#contact .one-third {
  text-align: center; }

#contact .sprite h2 {
  padding-bottom: 5px;
  text-transform: none; }

#contact .sprite .call {
  background: url("../img/phone-button.png") no-repeat;
  display: inline-block;
  height: 165px;
  margin-top: 15px;
  width: 163px; }

#contact .sprite .location {
  background: url("../img/location-button.png") no-repeat;
  display: inline-block;
  height: 165px;
  margin-top: 15px;
  width: 163px; }

#contact .sprite .email {
  background: url("../img/email-button.png") no-repeat;
  display: inline-block;
  height: 165px;
  margin-top: 15px;
  width: 163px; }

/*------------------------------------------------------
                  Home Map CSS
  ------------------------------------------------------*/
#map {
  height: 400px;
  width: 100%;
  z-index: 0; }

/*------------------------------------------------------
                  Userspace CSS
  ------------------------------------------------------*/
#userspace .upload {
  background: #ebebeb;
  border-radius: 10px;
  color: #2bade3;
  display: table-cell;
  font-size: 1.8em;
  height: 150px;
  text-align: center;
  vertical-align: middle;
  width: inherit; }

/*------------------------------------------------------
                  Accordion CSS
  ------------------------------------------------------*/
.accordion {
  background: #ccc;
  color: #fff;
  display: block;
  height: 445px;
  margin-bottom: 30px;
  position: relative;
  text-decoration: none;
  width: 100%; }

.accordion::after {
  background: url("../img/accordion-shadow.png") no-repeat;
  -webkit-background-size: 100% 100%;
          background-size: 100%;
  content: " ";
  display: block;
  height: 30px;
  position: absolute;
  bottom: -30px;
  width: 100%; }

.accordion .panel {
  -webkit-box-shadow: -5px 0 0 rgba(0, 0, 0, 0.1);
          box-shadow: -5px 0 0 rgba(0, 0, 0, 0.1);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 25%;
  height: 100%; }

.accordion .panel:first-child {
  -webkit-box-shadow: none;
          box-shadow: none; }

.accordion .panel.first {
  background: #2bade3 url("../img/slide1.jpg") no-repeat;
  -webkit-background-size: auto 100%;
          background-size: auto 100%;
  left: 0; }

.accordion .panel.second {
  background: #85ca20 url("../img/slide2.jpg") no-repeat;
  -webkit-background-size: auto 100%;
          background-size: auto 100%;
  left: 25%; }

.accordion .panel.third {
  background: #ffad00 url("../img/slide3.jpg") no-repeat;
  -webkit-background-size: auto 100%;
          background-size: auto 100%;
  left: 50%; }

.accordion .panel.fourth {
  background: #f96808 url("../img/slide4.jpg") no-repeat;
  -webkit-background-size: auto 100%;
          background-size: auto 100%;
  left: 75%; }

.accordion .heading, .accordion .title {
  font-weight: 800;
  text-transform: uppercase; }

.accordion .title {
  bottom: 30px;
  left: 20px;
  opacity: 1;
  min-width: 300px;
  position: absolute;
  -webkit-transition: opacity .5s;
  transition: opacity .5s; }

.accordion .panel.active .title, .accordion .panel.inactive .title {
  opacity: 0; }

.accordion .content {
  left: 300px;
  opacity: 0;
  position: absolute;
  top: 100px;
  width: 350px;
  -webkit-transition: opacity .7s;
  transition: opacity .7s; }

.accordion .panel.active .content {
  opacity: 1; }

.accordion .featured {
  left: -50px;
  height: auto;
  max-width: none;
  position: absolute;
  top: 30px;
  -webkit-transition: left .7s;
  transition: left .7s; }

.accordion .panel.active .featured {
  left: -10px; }

.accordion a, .accordion:hover {
  color: #fff;
  text-decoration: underline; }

/*------------------------------------------------------
                     Hover Balloon CSS
  ------------------------------------------------------*/
.hover-balloon {
  border-radius: 5px;
  color: #404141;
  display: inline-block;
  margin-top: 30px;
  padding: 20px 10px 20px 75px;
  text-align: left;
  width: 100%; }

.hover-balloon .icon {
  left: 10px;
  position: absolute; }

.hover-balloon .info {
  background: url("../img/primap.png") no-repeat -13px -1056px;
  display: inline-block;
  height: 52px;
  width: 53px; }

.hover-balloon .faq {
  background: url("../img/primap.png") no-repeat -198px -1056px;
  display: inline-block;
  height: 52px;
  width: 53px; }

.hover-balloon .computer {
  background: url("../img/primap.png") no-repeat -180px -590px;
  display: inline-block;
  height: 54px;
  width: 54px; }

.hover-balloon .cart {
  background: url("../img/primap.png") no-repeat -245px -590px;
  display: inline-block;
  height: 54px;
  width: 54px; }

.hover-balloon .gear {
  background: url("../img/primap.png") no-repeat -309px -590px;
  display: inline-block;
  height: 54px;
  width: 54px; }

.hover-balloon .title {
  color: #f96808;
  display: block;
  font-size: 1.3em;
  padding-bottom: 10px;
  text-transform: uppercase; }

.hover-balloon:hover {
  background: #f96808;
  color: #fff; }

.hover-balloon:hover .info {
  background: url("../img/primap.png") no-repeat -13px -1111px; }

.hover-balloon:hover .knowledge {
  background: url("../img/primap.png") no-repeat -74px -1111px; }

.hover-balloon:hover .blog {
  background: url("../img/primap.png") no-repeat -135px -1111px; }

.hover-balloon:hover .faq {
  background: url("../img/primap.png") no-repeat -198px -1111px; }

.hover-balloon:hover .computer {
  background: url("../img/primap.png") no-repeat -180px -650px; }

.hover-balloon:hover .gear {
  background: url("../img/primap.png") no-repeat -309px -650px; }

.hover-balloon:hover .cart {
  background: url("../img/primap.png") no-repeat -245px -650px; }

.hover-balloon:hover .title {
  color: #fff; }

/*------------------------------------------------------
                     Meter CSS
  ------------------------------------------------------*/
.meter {
  display: inline-block;
  margin: 20px 0;
  min-width: 50%;
  position: relative; }

.meter .bar {
  background: #ccc;
  cursor: pointer;
  display: inline-block;
  margin: 0 1px 0 0;
  padding: 0;
  width: 9%; }

.bar.one.active, .bar.two.active, .bar.three.active {
  background: #85ca20; }

.bar.four.active, .bar.five.active, .bar.six.active {
  background: #ffad00; }

.bar.seven.active, .bar.eight.active, .bar.nine.active, .bar.ten.active {
  background: #d20000; }

.bar.one {
  height: 40px; }

.bar.two {
  height: 50px; }

.bar.three {
  height: 60px; }

.bar.four {
  height: 70px; }

.bar.five {
  height: 80px; }

.bar.six {
  height: 90px; }

.bar.seven {
  height: 100px; }

.bar.eight {
  height: 110px; }

.bar.nine {
  height: 120px; }

.bar.ten {
  height: 130px; }

.spam-level {
  font-size: 4em; }

/*------------------------------------------------------
                     Overlay CSS
  ------------------------------------------------------*/
.overlay {
  background: url("../img/overlay2.png");
  left: 0;
  height: 0;
  opacity: 0;
  overflow-y: auto;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 20;
  transition: opacity .3s, height 0s .3s;
  -moz-transition: opacity .3s, height 0s .3s;
  -ms-transition: opacity .3s, height 0s .3s;
  -o-transition: opacity .3s, height 0s .3s;
  -webkit-transition: opacity .3s, height 0s .3s; }

.overlay.active {
  height: 100%;
  opacity: 1;
  transition: opacity .3s;
  -moz-transition: opacity .3s;
  -ms-transition: opacity .3s;
  -o-transition: opacity .3s;
  -webkit-transition: opacity .3s; }

/*------------------------------------------------------
                     Popups CSS
  ------------------------------------------------------*/
.popup {
  background: #fff;
  display: block;
  margin: 50px auto 0 auto;
  overflow: hidden;
  padding-bottom: 20px;
  text-align: left;
  width: 580px;
  z-index: 30;
  transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  -webkit-transform: scale(0);
  transition: -webkit-transform .3s;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s;
  -moz-transition: -moz-transform .3s;
  -ms-transition: -ms-transform .3s;
  -o-transition: -o-transform .3s;
  -webkit-transition: -webkit-transform .3s; }

.popup.active {
  transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  -webkit-transform: scale(1); }

.popup h2 {
  background: #2BADE3;
  color: #fff;
  margin-bottom: 10px;
  padding: 10px 0;
  text-align: center; }

.popup h3 {
  color: #f96808;
  font-size: 1.1em;
  font-weight: 600;
  padding-top: 10px;
  text-align: center; }

.popup p {
  padding: 10px 20px; }

.popup .button-1 {
  text-transform: none; }

/*------------------------------------------------------
                     Form CSS
  ------------------------------------------------------*/
.form {
  list-style: none;
  margin: 0 auto;
  padding: 10px 0;
  text-align: center;
  width: 300px; }

.form-error {
  background: #fff0f0;
  border: 1px solid #d20000;
  color: #d20000;
  margin: 0 0 10px;
  padding: 10px;
  width: 300px; }

.input-error {
  color: #d20000;
  width: 300px; }

.sucess {
  border-radius: 5px;
  color: #ffad00;
  font-weight: 600;
  padding: 10px;
  width: 300px; }

.form li {
  margin: 0; }

/*------------------------------------------------------
                     Order Form CSS
  ------------------------------------------------------*/
.order-form {
  display: block; }

.order-form label {
  display: block;
  padding: 0 0 10px 5px;
  width: 90%; }

.order-form table input, .order-form table select {
  width: 90%; }

.order-form table, .review-form table {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0;
  width: 100%; }

.review-form table {
  float: left;
  margin: 20px 0 20px 20px;
  width: 45%; }

.review-form table.last {
  float: right; }

.order-form td, .review-form td {
  padding: 10px 20px 30px 10px;
  width: 30%; }

.order-form-section-header {
  background: #2BADE3;
  border-bottom: 1px solid #fff;
  color: #fff;
  font-weight: 700;
  padding: 10px;
  text-align: center; }

.order-form-section {
  background: #fff;
  display: block;
  overflow: hidden;
  padding: 20px 0 40px 0; }

.order-form ul {
  display: inline-block;
  margin: 0 20px;
  position: relative; }

.order-form li {
  padding: 10px 0; }

.order-form h3 {
  padding: 30px 0 10px; }

.order-form li h3 {
  padding-bottom: 0; }

.order-form .note, .review-form .note {
  padding: 0 0 7px 0; }

.review-form .value {
  color: #f96808;
  padding: 0 0 5px 10px; }

.order-form table .input-error {
  width: 100%; }

.order-form .input-error {
  margin: 0 auto;
  width: 250px; }

.order-form input[type='submit'] {
  margin: 60px 0 20px;
  background: #f96808;
  text-transform: uppercase; }

.order-form .receipt td {
  padding: 5px 5px 10px 5px; }

/*------------------------------------------------------
                     Product CSS
  ------------------------------------------------------*/
.product {
  background: #ebebeb;
  display: block;
  font-size: .8em;
  padding: 10px;
  position: relative; }

.product img {
  height: auto;
  margin-bottom: 15px;
  max-width: 100%;
  padding: 0;
  width: 90%; }

.product p {
  padding: 5px 0; }

.product ul {
  list-style: initial;
  padding: 0 0 0 20px; }

.product hr {
  clear: both;
  margin: 5px 0;
  width: 100%; }

.product-name {
  float: left;
  font-size: 1.4em;
  font-weight: 600; }

.product-price {
  color: #f96808;
  float: right;
  font-size: 1.4em;
  font-weight: 700; }

/*------------------------------------------------------
                     Loading CSS
  ------------------------------------------------------*/
.loading {
  display: none;
  margin: 20px;
  text-align: center; }

.loading img {
  height: auto;
  padding: 0;
  width: auto; }

.loading.active {
  display: block; }

.admin-loading {
  display: block;
  text-align: center; }

.admin-loading img {
  height: 30px;
  margin-top: 6px;
  padding: 0;
  width: 30px; }

/*------------------------------------------------------
                     Admin CSS
  ------------------------------------------------------*/
.admin-control-panel {
  background: #f1f1f1;
  display: block;
  min-height: 100%;
  width: 100%; }

.admin-control-panel .h2 {
  margin: 0; }

.admin-control-panel select,
.admin-control-panel input,
.admin-control-panel textarea,
.admin-control-panel label {
  background: #fff;
  font-size: .9em;
  margin-bottom: 20px;
  width: 100%; }

.admin-control-panel label {
  color: #2bade3;
  font-size: 1.1em; }

.admin-control-panel input,
.admin-control-panel textarea {
  border-bottom: 1px solid #404141;
  border-radius: 0;
  padding: 10px; }

.admin-control-panel input[type='radio'],
.admin-control-panel input[type='checkbox'] {
  display: inline-block;
  margin: 0 15px;
  vertical-align: middle;
  width: auto; }

.admin-control-panel textarea {
  height: 140px; }

.admin-heading {
  padding: 10px 0; }

.admin-menu {
  background: #212121;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: #757575;
  display: inline-block;
  height: 100%;
  left: 0;
  list-style: none;
  padding: 80px 0 20px 0;
  position: fixed;
  top: 0;
  width: 250px;
  z-index: 998; }

.admin-menu li {
  padding: 0; }

.admin-menu a {
  color: #757575;
  display: block;
  padding: 10px 10px 10px 20px; }

.admin-menu a:hover {
  display: block;
  background: #343434;
  color: #fff;
  cursor: pointer;
  text-decoration: none; }

.admin-menu .h2 {
  display: block;
  color: #fff;
  padding: 20px 20px 20px 20px; }

.admin-menu-category:hover, .admin-menu-category.active {
  background: #343434;
  color: #fff;
  cursor: pointer; }

.admin-content {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: block;
  padding: 40px 60px 60px 310px;
  position: relative;
  width: 100%; }

.admin-heading {
  display: block;
  padding: 20px;
  overflow: hidden; }

.admin-edit {
  background: url("../img/primap.png") no-repeat -728px -178px;
  cursor: pointer;
  display: inline-block;
  height: 24px;
  margin: 0 7px;
  width: 24px; }

.admin-delete {
  background: url("../img/primap.png") no-repeat -728px -204px;
  cursor: pointer;
  display: inline-block;
  height: 25px;
  margin: 0 7px;
  width: 22px; }

.admin-row, .admin-hrow, .admin-editor {
  background: #fff;
  border-bottom: 1px solid #ccc;
  display: block;
  overflow: hidden;
  position: relative;
  margin-bottom: 20px;
  padding: 10px 0; }

.admin-editor {
  border-radius: 5px;
  padding: 10px 30px; }

.admin-editor select {
  border: 1px solid #aaa;
  border-radius: 0; }

.admin-editor-heading {
  padding-bottom: 20px; }

.admin-editor-row {
  border-bottom: 1px dotted #bbb;
  padding: 60px 0;
  position: relative; }

.admin-editor-row:last-child {
  border: none; }

.admin-hrow {
  background: #2BADE3;
  border-bottom: 2px solid #4492b2;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  color: #fff;
  font-weight: 700; }

.admin-rd {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  float: left;
  padding: 10px 0 10px 40px;
  width: 25%; }

.admin-close {
  background: url("../img/primap.png") no-repeat -755px -292px;
  cursor: pointer;
  display: inline-block;
  height: 27px;
  margin: 10px;
  width: 29px; }

.admin-error {
  background: #fff0f0;
  display: block;
  border: 1px solid #d20000;
  border-radius: 5px;
  bottom: 110%;
  color: #d20000;
  font-size: .9em;
  min-height: 40px;
  min-width: 40px;
  padding: 5px 40px 5px 10px;
  position: absolute;
  visibility: hidden;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
  -webkit-transition: visibility 0s .4s, -webkit-transform .3s;
  transition: visibility 0s .4s, -webkit-transform .3s;
  transition: visibility 0s .4s, transform .3s;
  transition: visibility 0s .4s, transform .3s, -webkit-transform .3s; }

.admin-error.bottom {
  top: 100%;
  bottom: auto; }

.admin-error:before {
  background: url("../img/primap.png") no-repeat -372px -144px;
  bottom: -12px;
  content: " ";
  display: inline-block;
  height: 14px;
  left: 10px;
  position: absolute;
  width: 22px;
  z-index: 100; }

.admin-error.bottom:before {
  background: url("../img/primap.png") no-repeat -372px -156px;
  bottom: auto;
  top: -10px; }

.admin-error.active {
  visibility: visible;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  -webkit-transition: visibility 0s, -webkit-transform .3s;
  transition: visibility 0s, -webkit-transform .3s;
  transition: visibility 0s, transform .3s;
  transition: visibility 0s, transform .3s, -webkit-transform .3s; }

.admin-error-close {
  background: url("../img/primap.png") no-repeat -394px -144px;
  display: inline-block;
  color: #d20000;
  content: 'x';
  cursor: pointer;
  height: 18px;
  position: absolute;
  right: 10px;
  top: 10px;
  width: 18px; }

/*------------------------------------------------------
                     Item Switcher CSS
  ------------------------------------------------------*/
.switch-item {
  display: none; }

.switch-item.active {
  display: block; }

/*------------------------------------------------------
                     Common CSS
  ------------------------------------------------------*/
.scroll-down {
  background: url("../img/primap.png") no-repeat -670px -506px;
  cursor: pointer;
  display: inline-block;
  height: 32px;
  width: 43px; }

.button-1, .button-1:hover, .button-3, .button-3:hover {
  background: #2bade3;
  border-radius: 20px;
  color: #fff;
  display: inline-block;
  padding: 7px 15px;
  text-transform: uppercase; }

.button-2, .button-2:hover {
  background: inherit;
  border: 2px solid #fff;
  color: #fff;
  display: inline-block;
  padding: 5px 10px;
  text-transform: uppercase; }

.button-3, .button-3:hover {
  text-transform: none; }

.button-4, .button-4:hover {
  background: #f96808;
  color: #fff;
  padding: 10px 40px;
  text-transform: uppercase; }

.button-5, .button-5:hover {
  background: #f96808;
  border: none;
  border-radius: 5px;
  color: #fff;
  display: inline-block;
  font-size: 1.1em;
  margin: 60px 0 20px;
  padding: 10px 0;
  text-align: center;
  text-transform: uppercase;
  width: 260px; }

.button-6 {
  background: #2bade3;
  border: none;
  border-radius: 5px;
  color: #fff;
  margin: 10px 0;
  padding: 5px 15px; }

.button-left, .button-right, .button-left:hover, .button-right:hover {
  background: #404141;
  border: none;
  color: #fff;
  display: inline-block;
  font-size: .9em;
  padding: 10px 15px;
  text-align: center;
  width: 130px; }

.button-left {
  border-bottom-left-radius: 5px;
  border-top-left-radius: 5px;
  margin: 0 0 0 10px; }

.button-right {
  border-bottom-right-radius: 5px;
  border-top-right-radius: 5px;
  left: -4px;
  margin: 0 10px 0 0;
  position: relative; }

.button-left.active,
.button-right.active {
  background: #2BADE3; }

p.error {
  background: #fae3e3;
  border: 1px solid #d20000;
  border-radius: 3px;
  color: #d20000;
  font-size: .9em;
  margin: 0 auto 15px;
  padding: 5px;
  width: 290px; }

header p {
  padding-bottom: 30px;
  padding-top: 0; }

.text-left, .text-left-mc {
  text-align: left; }

.text-center {
  text-align: center; }

.text-right, .text-right-mc {
  text-align: right; }

.float-left {
  float: left; }

.float-right {
  float: right; }

.no-float {
  float: none; }

.centered {
  margin-left: auto;
  margin-right: auto; }

.clear {
  clear: both; }

.form-inputs.hidden {
  display: none; }

.vital, .urgent {
  color: #d20000; }

.urgent {
  font-weight: 600; }

.heavy {
  font-weight: 700; }

.emphasis {
  color: #f96808; }

.note {
  font-size: .9em;
  font-style: italic; }

.small-font {
  font-size: .8em; }

.horizon-padding {
  padding: 10px 0; }

.no-margin {
  margin: 0; }

.vertical-padding {
  padding: 0 20px; }

.inline-block {
  display: inline-block; }

.success {
  color: #85ca20; }

textarea.large {
  height: 200px;
  width: 100%; }

.default-color {
  color: #404141; }

.confirmation {
  background: #f96808;
  color: #fff;
  font-size: 1.2em;
  font-weight: 700;
  padding: 20px;
  text-align: center; }

.visual {
  height: auto;
  width: 100%; }

.good {
  background: #f6fcee;
  color: #98c15b;
  display: inline-block;
  border: 1px solid #98c15b;
  width: 250px; }

.invisible {
  visibility: hidden; }

.step-number {
  background: #404141;
  border-radius: 5px;
  color: #fff;
  display: inline-block;
  font-size: 1.3em;
  margin: 0 10px;
  padding: 10px;
  text-align: center; }

.multiple {
  height: 350px; }

label.inline {
  display: inline-block;
  margin-right: 20px;
  text-align: right; }

/*------------------------------------------------------
                     Drag and Drop CSS
  ------------------------------------------------------*/
.dragging {
  -webkit-transform: scale(0.95);
      -ms-transform: scale(0.95);
          transform: scale(0.95);
  -webkit-transition: -webkit-transform .3s;
  transition: -webkit-transform .3s;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s; }

.drag-over {
  background: #f1f1f1; }

/*------------------------------------------------------
                     Animation CSS
  ------------------------------------------------------*/
.float-shadow, .hover-balloon {
  cursor: pointer;
  display: inline-block;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
          box-shadow: 0 0 1px rgba(0, 0, 0, 0); }

.float-shadow:before, .hover-balloon:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: -webkit-radial-gradient(center ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  /* W3C */
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform, opacity;
  -webkit-transition-property: opacity, -webkit-transform;
  transition-property: opacity, -webkit-transform;
  transition-property: transform, opacity;
  transition-property: transform, opacity, -webkit-transform; }

.float-shadow:hover, .float-shadow:focus, .float-shadow:active, .hover-balloon:hover {
  -webkit-transform: translateY(-5px);
  -ms-transform: translateY(-5px);
      transform: translateY(-5px);
  /* move the element up by 5px */ }

.float-shadow:hover:before, .float-shadow:focus:before, .float-shadow:active:before, .hover-balloon:hover:before {
  opacity: 1;
  -webkit-transform: translateY(5px);
  -ms-transform: translateY(5px);
      transform: translateY(5px); }

.floating, .scroll-down {
  animation-name: floating;
  -webkit-animation-name: floating;
  animation-duration: 1.5s;
  -webkit-animation-duration: 1.5s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite; }

@keyframes floating {
  0% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%); }
  50% {
    -webkit-transform: translateY(60%);
            transform: translateY(60%); }
  100% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%); } }

@-webkit-keyframes floating {
  0% {
    -webkit-transform: translateY(0%); }
  50% {
    -webkit-transform: translateY(60%); }
  100% {
    -webkit-transform: translateY(0%); } }

.push, .button-1, .button-2, .button-3, .button-4 {
  display: inline-block;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
          box-shadow: 0 0 1px rgba(0, 0, 0, 0); }

.push:hover, .push:focus, .push:active, .button-1:hover, .button-2:hover, .button-3:hover, .button-4:hover {
  cursor: pointer;
  -webkit-animation-name: push;
  animation-name: push;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1; }

@-webkit-keyframes push {
  50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8); }
  100% {
    -webkit-transform: scale(1);
    transform: scale 1; } }

@keyframes push {
  50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8); }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1); } }

.grow {
  cursor: pointer;
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
          box-shadow: 0 0 1px rgba(0, 0, 0, 0); }

.grow:hover, .grow:focus, .grow:active {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
      transform: scale(1.1); }

/*------------------------------------------------------
               Responsive CSS
  ------------------------------------------------------*/
@media only screen and (min-width: 960px) and (max-width: 1199px) {
  body {
    font-size: 95%; }
  .wrapper {
    width: 940px; }
  .one {
    padding: 40px 25px;
    width: 890px; }
  .one-half {
    width: 425px; }
  .one-third {
    width: 276px; }
  .one-fourth {
    padding: 0 5px;
    width: 210px; }
  #services h2 {
    font-size: 1.2em; }
  .hover-balloon {
    padding: 20px 5px 20px 65px;
    width: 220px; }
  .hover-balloon .icon {
    left: 5px; }
  .accordion {
    font-size: 85%;
    height: 380px; }
  .accordion .content {
    left: 230px;
    width: 300px; }
  .accordion .featured {
    height: auto;
    max-height: 230px;
    width: 200px; } }

@media only screen and (min-width: 768px) and (max-width: 959px) {
  body {
    font-size: 90%; }
  .wrapper {
    width: 758px; }
  .one {
    width: 728px;
    padding: 30px 15px; }
  .one-half, .one-fourth {
    padding: 5px;
    width: 350px; }
  .one-third {
    width: 220px; }
  .sprite {
    margin-bottom: 20px; }
  .accordion {
    font-size: 75%;
    height: 350px; }
  .accordion .content {
    left: 210px;
    width: 220px; }
  .accordion .featured {
    height: auto;
    max-height: 210px;
    width: 180px; } }

@media only screen and (max-width: 767px) {
  body {
    font-size: 80%;
    padding-top: 50px; }
  .wrapper {
    width: 90%; }
  .one, .one-half, .one-third, .one-fourth {
    padding: 20px 0;
    width: 100%; }
  .one {
    padding: 60px 0; }
  .one-half h1 {
    text-align: center; }
  .popup {
    width: 90%; }
  #desktop-menu {
    display: none; }
  #mobile-menu {
    display: block; }
  #support img.featured {
    float: none;
    margin: 0 auto; }
  .m-centered, .text-right-mc, .text-left-mc {
    text-align: center; }
  .float-left, .float-right {
    float: none; }
  #login-form::before {
    right: 65px; }
  #login-form.active {
    right: 10%; }
  .plans, .plans td, .plans tr, .plans .details, .plans .speeds, .plans tbody {
    background: #fff;
    display: block;
    margin: 0;
    width: 100%; }
  .plans, .plans tr, .plans tbody {
    background: none;
    border: none; }
  .plans td {
    padding: 10px; }
  .plans th {
    display: none; }
  .plans tr {
    margin-bottom: 20px; }
  .order-form table, .order-form tbody, .order-form tr, .order-form td {
    display: block;
    text-align: center;
    width: 100%; }
  .review-form table.last {
    float: left; }
  .review-form table {
    width: 100%; }
  .order-form table input, .order-form table select {
    width: 250px; }
  .order-form table label {
    margin: 0 auto;
    width: 260px; }
  .intro-image {
    text-align: center; }
  .accordion {
    height: auto; }
  .accordion:hover {
    text-decoration: none; }
  .accordion .featured, .accordion .title {
    display: none; }
  .accordion .content {
    display: block;
    left: auto;
    opacity: 1;
    position: relative;
    top: auto;
    width: 100%; }
  .accordion .panel {
    display: block;
    height: auto;
    padding: 20px;
    position: relative;
    width: 100%; }
  .accordion .panel.first,
  .accordion .panel.second,
  .accordion .panel.third,
  .accordion .panel.fourth {
    left: auto;
    -webkit-background-size: 150% auto;
            background-size: 150% auto; }
  #commitment,
  #about,
  .color-scheme-bridge,
  .color-scheme-dark-wood {
    background-position: center;
    -webkit-background-size: auto 100%;
            background-size: auto 100%; }
  #setup-guide img {
    width: 90%; } }

#hero-intro {
  background: #ebebeb; }
  #hero-intro .hero {
    display: block; }
    #hero-intro .hero-container {
      background: url("../img/hero/spring-background-small.jpg") no-repeat;
      -webkit-background-size: cover;
              background-size: cover;
      display: block;
      font-size: 0;
      margin: 0 auto;
      max-width: 1440px; }
    #hero-intro .hero-creative, #hero-intro .hero-copy {
      display: block;
      font-size: 1rem;
      position: relative;
      vertical-align: middle; }
    #hero-intro .hero-creative img {
      display: block;
      height: auto;
      margin: 0 auto;
      max-width: 500px;
      width: 100%; }
    #hero-intro .hero-copy {
      font-weight: 600;
      padding: 4em 1rem; }
    #hero-intro .hero-content {
      display: block;
      margin: 0 auto;
      max-width: 500px; }
    #hero-intro .hero-desktop {
      display: none !important; }
    #hero-intro .hero-mobile {
      display: block !important; }
  #hero-intro h1 {
    color: #FFF;
    font-size: 2.375em;
    font-weight: 700;
    margin: 0 0 1rem 0;
    padding: 0;
    text-align: left;
    text-transform: none; }
  #hero-intro p {
    color: #FFF;
    font-size: 1.23em;
    margin: 0 0 1rem 0;
    padding: 0; }
  #hero-intro img {
    padding: 0; }
  #hero-intro .button {
    background: #7CC41F;
    border-radius: 5px;
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.32);
            box-shadow: 0 3px 6px rgba(0, 0, 0, 0.32);
    color: #FFF;
    display: block;
    font-weight: 600;
    margin-top: 2rem;
    padding: .8rem 2rem;
    text-align: center;
    text-transform: uppercase; }
  @media screen and (min-width: 1000px) {
    #hero-intro .hero-container {
      background: url("../img/hero/spring-background-large.jpg") no-repeat;
      -webkit-background-size: cover;
              background-size: cover;
      direction: rtl;
      padding-top: 1rem; }
    #hero-intro .hero-creative, #hero-intro .hero-copy {
      display: inline-block;
      direction: ltr;
      width: 50%; }
    #hero-intro .hero-copy {
      padding: 0 1rem 0 2rem; }
    #hero-intro .hero-creative img {
      max-width: none; }
    #hero-intro .hero-desktop {
      display: block !important; }
    #hero-intro .hero-mobile {
      display: none !important; }
    #hero-intro .button {
      display: inline-block; } }
