/* Reset */

* {
  margin:0;
  padding:0;
}

/* Fonts */

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,700,300);

/* Elements */

body {
  background:#ffffff;
  font-family: 'Open Sans', sans-serif;
  color:#7f8c8d;
  font-size:16px;
  line-height:1;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  text-align:center;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  padding: 6.770833333333333% 0 4.166666666666666% 0;
}

a {
  border:none;
  text-decoration:none;
}

p {
  font-size:1.3em;
  font-weight:300;
  padding:0 0 5.208333333333334% 0;
  line-height:1.6;
}

hr {
  padding:0;
  margin:0.5208333333333333% auto;
  width:84.375%;
  border:none;
  padding:0.15625% 0;
}

/* Classes */

ul.guides-list {
  padding-left:2.5%;
  padding-bottom:5%;
  list-style-type:none;
}

ul.guides-list li {
  padding:1.5% 0;
  font-size:1.2em;
}

ul.guides-list li a {
  color:#FFCF45;
  transition:all 0.3s ease;
}

ul.guides-list li a:hover {
  color:#FEC112;
}

.terms p,
.help p{
  text-align:left;
}

p.content-no-image {
  padding:5% 0;
}

h1.title {
  font-size:3.500em;
  font-weight:700;
  padding:3% 0;
  line-height:1;
  margin-top:2.55%;
}

h1.title .light {
  font-weight:300;
  padding:6.770833333333333% 0 2.604166666666667% 0;
}


h1.subpage-title {
  font-size:2.250em;
  font-weight:700;
  padding:6% 0 8% 0;
  line-height:.7;
}

h2.subtitle {
  font-size:2.250em;
  font-weight:400;
  padding:0;
  line-height:.81;
}

h3.section-title {
  font-size:2.75em;
  font-weight:300;
  padding:4.166666666666% 0;
}

h4.subsection-title {
  font-size:1.8em;
  font-weight:300;
  position:relative;
  margin: 0 0 4.166666666666666% 0;
  padding:0;
}

h4.subsection-title:before,
h4.subsection-title:after {
  content:'';
  position:absolute;
  height:10.344827586206897%;
  width:30%;
  top:55%;
  background:#2c3e50;
}

h4.subsection-title:before {
  font-size:1.8em;
  font-weight:300;
  left:0;
}

h4.subsection-title:after {
  font-size:1.8em;
  font-weight:300;
  right:0;
}

h5 {

}

h6 {

}

.wrapper {
  width:75%;
  max-width:1200px;
  margin:0 auto;
}

.header {
  padding:1.5625% 0;
  width:100%;
  overflow:hidden;
}

.footer {
  padding:5% 0 1.5625% 0;
  width:100%;
  overflow:hidden;
}

.header-left,
.header-right,
.footer-left,
.footer-right {
  width:50%;
  float:left;
  height:7.187499999999999%;
}

.header-left,
.footer-left {
  text-align:left;
}

.header-right,
.footer-right {
  text-align:right;
}

.logo {
  max-width:400px;
  width:62.5%;
  display:block;
  margin:0 auto;
}

.logo img {
  width:100%;
}

.page-logo {
  width:46.875%;
  max-width:450px;
  margin:0 auto;
  display:block;
  padding:5% 0;
}

.color-container .phone-number {
  color:#ffffff;
}

ul.nav {
  list-style-type:none;
  width:77.60416666666666%;
  overflow:hidden;
  padding:1.5625% 0;
  margin:0 auto;
}

.color-container ul.nav {
  padding:2.5% 0 5% 0;
}

ul.nav li a {
  color:#7f8c8d;
  transition:all 0.3s ease;
  font-size:1.125em;
}

.color-container ul.nav li a {
  color:#ffffff;
}

ul.nav li a:hover {
  color:#0061A4;
  font-size:1.2em
}

.color-container ul.nav li a:hover {
  color:#ffffff;
}

ul.nav li {
  width:33.333333%;
  float:left;
  text-align:center;
  font-weight:400;
  padding:1.342281879194631% 0;
}

ul.nav li.active {
  font-weight:700;
  font-size:1.2em;
  position:relative;
}

.color-container ul.nav li.active {
  color:#ffffff;
}

ul.nav li.active:after {
  content:'';
  margin:0 auto;
  height:8%;
  position:absolute;
  left:25%;
  right:25%;
  top: 90%;
  background:#0061A4;
}

div.header-image {
  text-align:center;
  margin-top:6.770833333333333%;
}

div.header-image img {
  margin:0 auto;
  max-width:1400px;
  margin-top:-6.770833333333333%;
  width:72.91666666666666%;
  padding:1.5625% 0;
}

div.resources-image {
  text-align:center;
  margin-top:6.770833333333333%;
}

div.resources-image img {
  margin:0 auto;
  max-width:1400px;
  margin-top:-6.770833333333333%;
  width:72.91666666666666%;
  padding:1.5625% 0 0 0;
  margin-bottom:-0.13416666666666666%;
}

div.contact-image {
  text-align:center;
  margin-top:6.770833333333333%;
}

div.contact-image img {
  margin:0 auto;
  max-width:1400px;
  margin-top:-6.770833333333333%;
  width:72.91666666666666%;
  padding:1.5625% 0 0 0;
  margin-bottom:-0.13416666666666666%;
}

a.color-button {
  width:50%;
  text-align:center;
  display:block;
  background:#00954B;
  border-radius:5px;
  padding:1.5625% 0;
  color:#ffffff;
  font-weight:300;
  margin:6.25% auto;
  transition:all 0.3s ease;
}

a.color-button:hover {
  background:#45B978;
}

ul.features {
  list-style-type:none;
  padding:10% 0 9.5% 0;
  overflow:hidden;
}

ul.features li {
  width:31.25%;
  color:#ffffff;
  float:left;
  text-align:center;
}

ul.features li i.feature-icon {
  color:#0061A4;
}

ul.features li i.fa-mobile {
  font-size:1.25em;
}

ul.features li i.fa-users {
  font-size:0.8em;
}

ul.features li .feature-title {
  font-weight:400;
  font-size:1.5em;
  display:block;
  padding-bottom:5%;
}

ul.features li .feature-description {
  color:#ffffff;
  font-size:1.125em;
  line-height:1.5;
}

ul.features li {
  width:31.25%;
  color:#ffffff;
  float:left;
}

ul.features li.feature-1-of-3,
ul.features li.feature-2-of-3, {
  margin-right:3.125%;
}

ul.platforms {
  list-style-type:none;
  overflow:hidden;
  padding:0 0 5% 0;
}

ul.platforms a li {
  width:17.875%;
  padding:2.083333333333333%;
  font-size:1.2em;
  color:#ffffff;
  float:left;
  background:#ffcf45;
  font-weight:300;
  margin-bottom:3.125%;
  transition:all 0.3s ease;
}

ul.platforms a:hover li {
  background:#FEC112;
}

ul.platforms li .platform-icon {
  display:inline-block;
  vertical-align:middle;
  margin-right:5%;
}

ul.platforms li .platform-label {
  display:inline-block;
  vertical-align:middle;
}

ul.platforms li.platform-1-of-4,
ul.platforms li.platform-2-of-4,
ul.platforms li.platform-3-of-4 {
  margin-right:3.125%;
}

ul.comparison-table {
  margin-bottom:10%;
}

ul.comparison-table:after {
  content: ".";
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}

ul.comparison-table,
ul.comparison-table li ul {
  list-style-type:none;
}

ul.comparison-table > li {
  float:left;
  position:relative;
}

ul.comparison-table li.comparison-table-1-of-3,
ul.comparison-table li.comparison-table-3-of-3 {
  width:32.29166666666667%;
  margin-top:3.1%;
}

ul.comparison-table li.comparison-table-2-of-3 {
  width:35.41666666666667%;
  box-shadow:0 0 5px rgba(0, 0, 0, 0.2);
  z-index:100;
}

ul.comparison-table li ul li {

  width:100%;
  text-align:center;
}

ul.comparison-table li ul li.comparison-table-title {
  background:#2c3e50;
  color:#ffffff;
  font-size:2em;
  font-weight:300;
  padding:6.451612903225806% 0;
}

ul.comparison-table li.comparison-table-2-of-3 ul li.comparison-table-title {
  padding:8.823529411764707% 0 8.823529411764707% 0;
  background:#34495e;
  position:relative;
}

ul.comparison-table li ul li.comparison-table-subtitle {
  background:#16a085;
  color:#ffffff;
  padding:6.451612903225806% 0;
}

ul.comparison-table li.comparison-table-2-of-3 ul li.comparison-table-subtitle {
  padding:8.823529411764707% 0;
  background:#0061A4;
}

ul.comparison-table li ul li.comparison-table-subtitle .comparison-table-dollar-sign {
  font-size:2em;
  font-weight:300;
  vertical-align:top;
}

ul.comparison-table li ul li.comparison-table-subtitle .comparison-table-price {
  font-size:4em;
  font-weight:700;
}

ul.comparison-table li ul li.comparison-table-subtitle .comparison-table-per-month {
  font-size:1em;
  font-weight:300;
}

ul.comparison-table li ul li.comparison-table-item {
  background:#ecf0f1;
  color:#95a5a6;
  padding:8.064516129032258% 0;
  position:relative;
}

ul.comparison-table li.comparison-table-2-of-3 ul li.comparison-table-item {
  padding:7.352941176470589% 0;
  background:#f5f7f7;
}

ul.comparison-table li ul li.comparison-table-subtitle a.color-button {
  width:50%;
  text-align:center;
  display:block;
  background:#00954B;
  border-radius:5px;
  padding:3.225806451612903% 0;
  color:#ffffff;
  font-weight:300;
  margin:6.451612903225806% auto 0 auto;
  transition:all 0.3s ease;
}

ul.comparison-table li.comparison-table-2-of-3 ul li.comparison-table-subtitle a.color-button {
  width:50%;
  text-align:center;
  display:block;
  background:#00954B;
  border-radius:5px;
  padding:2.941176470588235% 0;
  color:#ffffff;
  font-weight:300;
  margin:5.88235294117647% auto 0 auto;
  transition:all 0.3s ease;
}

ul.comparison-table li ul li.comparison-table-subtitle a.color-button:hover {
  background:#45B978;
}

ul.resources,
ul.resources ul {
  list-style-type:none;
  padding-bottom:10%;
  overflow:hidden;
}

ul.resources {
  display:block;
  padding:;
}

ul.resources > li {
  margin:0 auto;
  text-align:center;
  font-size:2em;
  font-weight:300;
  padding-bottom:2.5%;
  margin-bottom:1.5%;
  position:relative;
}

ul.resources > li:after {
  content:'';
  position:absolute;
  height:6%;
  width:50%;
  top:75%;
  left:25%;
  background:#2c3e50;
}

ul.resources ul li {
  float:left;
  width:42.875%;
  padding:2%;
  font-size:1.15em;
  background:#34495e;
  color:#ffffff;
  font-weight:300;
  margin:0 1.5625% 3.125% 1.5625%;
  transition:all 0.3s ease;
}

ul.resources ul a:hover li {
  background:#2c3e50;
}

ul.resources ul li .resource-icon {
  display:inline-block;
  vertical-align:middle;
  margin-right:4%;
}

ul.resources ul li .resource-label {
  display:inline-block;
  vertical-align:middle;
}
/* Class Differentiators For Different Containers */

.white-container {
  background:#ffffff;
}

.white-container h1,
.white-container h2,
.white-container h3,
.white-container h4,
.white-container p {
  color:#7f8c8d;
}

.white-container hr {
  background:#7f8c8d;
}

.color-container {
  background:#0061A4;
}

.color-container h1,
.color-container h2,
.color-container h3,
.color-container h4,
.color-container p {
  color:#ffffff;
}

.color-container hr {
  background:#ffffff;
}

.contact-wrap {
  overflow:hidden;
  margin:0 0 10% 0;
}

.contact-left {
  width:48.75%;
  margin:0 2.5% 0 0;
  padding:0;
  float:left;
}

.contact-right {
  width:48.75%;
  margin:0 0 0 0;
  padding:0;
  float:right;
}

.contact-header {
  width:95%;
  padding:2.5%;
  background:#34495e;
  color:#ffffff;
}

.contact-wrap h2 {
  color:#ffffff;
  font-weight:300;
  padding:2.5% 0;
}

.contact-body {
  width:90%;
  padding:5%;
  background:#ecf0f1;
}

.contact-item {
  width:90%;
  padding:5%;
  background:#ffffff;
  border-radius:5px;
  margin:0 0 5% 0;
}

.contact-item:last-child {
  margin:0;
}

.contact-item h3 {
  padding:0 0 5% 0;
}

.contact-item span {
  display:block;
  line-height:2.5;
}

.contact-item span strong {
  margin-right:1.5%;
}

/* Media Queries */

@media only screen and (min-width: 1101px) {
  body {
    font-size:16px;
  }
}

@media only screen and (min-width: 961px) and (max-width: 1100px) {
  body {
    font-size:14px;
  }
}

@media only screen and (min-width: 641px) and (max-width: 960px) {
  body {
    font-size:12px;
  }

  ul.platforms a li {
    width:44.270833334%;
    padding:2.083333333333333%;
  }

  ul.platforms li.platform-2-of-4,
  ul.platforms li.platform-4-of-4 {
    margin-right:0;
  }

  ul.platforms li.platform-1-of-4,
  ul.platforms li.platform-3-of-4 {
    margin-right:3.125%;
  }

  a.color-button {
    width:75%;
    padding:2% 0;
    font-size:1.2em;
  }

  ul.comparison-table li ul li.comparison-table-subtitle a.color-button,
  ul.comparison-table li.comparison-table-2-of-3 ul li.comparison-table-subtitle a.color-button {
    width:75%;
  }

  ul.comparison-table li.comparison-table-2-of-3 ul li.comparison-table-title:after {
    height:98.436975%;
  }

  ul.resources ul li {
    width:100%;
    padding:0;
    margin:0.5% 0 0.5% 0;
    padding:2% 0;
  }

  .wrapper {
    width:95%;
  }
}

@media only screen and (max-width: 640px) {
  body {
    font-size:12px;
  }

  .wrapper {
    width:95%;
  }

  ul.platforms a li {
    width:100%;
  }

  ul.platforms li.platform-1-of-4,
  ul.platforms li.platform-2-of-4,
  ul.platforms li.platform-3-of-4,
  ul.platforms li.platform-4-of-4 {
    margin-right:0;
  }

  ul.platforms li.platform-1-of-4 {
    margin-top:5%;
  }

  a.color-button {
    width:100%;
    padding:3% 0;
    margin:12.5% 0;
  }

  ul.features li {
    width:100%;
  }

  ul.features li.feature-1-of-3,
  ul.features li.feature-2-of-3 {  
    margin-bottom:10%;
  }

  ul.features li .feature-title {
    padding-bottom:3%;
  }

  ul.features li .feature-description {
    padding-bottom:10%;
  }

  .phone-number {
    font-size:1.25em;
    line-height:1.8;
  }

  ul.nav {
    padding-bottom:10%;
    padding-top:5%;
  }

  h1.title {
    font-size:3.00em;
    padding:0;
    line-height:1.5;
  }

  h2.subtitle {
    font-size:2.00em;
    padding:0;
    line-height:.81;
  }

  h3.section-title {
    font-size:2.75em;
    font-weight:300;
    padding:4.166666666666% 0;
  }

  h4.subsection-title {
    font-size:1.8em;
  }

  ul.resources ul li {
    width:100%;
    padding:0;
    margin:0.5% 0 0.5% 0;
    padding:2% 0;
  }

  ul.resources > li:after {
    content:'';
    position:absolute;
    height:6%;
    width:50%;
    top:85%;
    left:25%;
    background:#2c3e50;
  }

  .contact-wrap {
    overflow:hidden;
    margin:0 0 10% 0;
  }

  .contact-left {
    width:100%;
    margin:0 0 5% 0;
    padding:0;
  }

  .contact-right {
    width:100%;
    margin:0 0 5% 0;
    padding:0;
  }

  .contact-header {
    width:95%;
    padding:2.5%;
    background:#34495e;
    color:#ffffff;
  }

  .contact-wrap h2 {
    color:#ffffff;
    font-weight:300;
    padding:2.5% 0;
  }

  .contact-body {
    width:90%;
    padding:5%;
    background:#ecf0f1;
  }

  .contact-item {
    width:90%;
    padding:5%;
    background:#ffffff;
    border-radius:5px;
    margin:0 0 5% 0;
  }

  .contact-item:last-child {
    margin:0;
  }

  .contact-item h3 {
    padding:0 0 5% 0;
  }

  .contact-item span {
    display:block;
    line-height:2.5;
  }

  .contact-item span strong {
    margin-right:1.5%;
  }
}
