.inline-block {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
.ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
body {
  background: #f0f0f0;
}
header {
  background: #4b576b url(../images/index-bg.jpg) center top no-repeat;
  background-size: cover;
  padding: 40px 15px;
  border-top: 5px solid #242424;
  text-align: center;
}
header .header-content {
  width: 100%;
  max-width: 1200px;
  margin: auto;
  overflow: hidden;
}
header img {
  display: inline-block;
  max-width: 640px;
  width: 55.5%;
  vertical-align: top;
}
header .description {
  display: inline-block;
  margin-left: 5%;
  width: 37.5%;
  padding-top: 50px;
  vertical-align: top;
}
header h1 {
  font: 400 62px/1 'Oswald', sans-serif;
  text-transform: uppercase;
  color: #fff;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.7);
  text-align: center;
  letter-spacing: 1px;
  margin-bottom: 15px;
  padding: 0;
}
header h2 {
  font: 48px/1 'Open Sans Condensed', sans-serif;
  text-transform: uppercase;
  color: #fff;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.7);
  text-align: center;
  letter-spacing: 1px;
}
header .demos {
  margin-top: 40px;
}
header .demos h3 {
  font: 32px/1 'Open Sans Condensed', sans-serif;
  color: #fff;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.7);
  letter-spacing: 1px;
  text-align: center;
}
header .demos ul {
  list-style: none;
  margin-top: 20px;
  text-align: center;
}
header .demos li {
  display: inline-block;
  vertical-align: top;
  margin: 0 15px 20px 0;
}
header .demos li a {
  display: block;
  text-decoration: none;
  font: 16px/1 'Lato', sans-serif;
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
  padding: 6px 15px;
  background-color: #0099ff;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0099ff), to(#007acc));
  background-image: -webkit-linear-gradient(top, #0099ff, #007acc);
  background-image: -moz-linear-gradient(top, #0099ff, #007acc);
  background-image: -ms-linear-gradient(top, #0099ff, #007acc);
  background-image: -o-linear-gradient(top, #0099ff, #007acc);
  background-image: linear-gradient(to bottom, #0099ff, #007acc);
  -pie-background: linear-gradient(top, #0099ff, #007acc);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.3);
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.3);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
header .demos li a:active {
  background-color: #007acc;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#007acc), to(#0099ff));
  background-image: -webkit-linear-gradient(top, #007acc, #0099ff);
  background-image: -moz-linear-gradient(top, #007acc, #0099ff);
  background-image: -ms-linear-gradient(top, #007acc, #0099ff);
  background-image: -o-linear-gradient(top, #007acc, #0099ff);
  background-image: linear-gradient(to bottom, #007acc, #0099ff);
  -pie-background: linear-gradient(top, #007acc, #0099ff);
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), inset 0 1px 5px rgba(0, 0, 0, 0.3), inset 0 -1px 0 rgba(255, 255, 255, 0.3);
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), inset 0 1px 5px rgba(0, 0, 0, 0.3), inset 0 -1px 0 rgba(255, 255, 255, 0.3);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), inset 0 1px 5px rgba(0, 0, 0, 0.3), inset 0 -1px 0 rgba(255, 255, 255, 0.3);
}
.main {
  margin-top: 40px;
  padding: 0 15px;
}
.main section {
  margin: 60px auto 0 auto;
  width: 100%;
  max-width: 1000px;
  text-align: center;
}
.main section h2 {
  font: 46px/1 'Open Sans Condensed', sans-serif;
  color: #242424;
  text-align: center;
  letter-spacing: 1px;
}
.main section h2 .highlight {
  border-top: 3px solid #09f;
}
.main section ul {
  list-style: none;
  margin-top: 60px;
  display: inline-block;
}
.main .key-features li {
  font: 18px/1.4 'Lato', sans-serif;
  color: #242424;
  text-align: left;
  position: relative;
  display: inline-block;
  vertical-align: top;
  padding-left: 40px;
  width: 260px;
  margin: 0 30px 30px 0;
}
.main .key-features li:before {
  content: '\2713';
  position: absolute;
  left: 0;
  color: #ededed;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
  font-size: 20px;
  line-height: 1;
  padding: 4px 5px 2px 5px;
  background-color: #0099ff;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0099ff), to(#007acc));
  background-image: -webkit-linear-gradient(top, #0099ff, #007acc);
  background-image: -moz-linear-gradient(top, #0099ff, #007acc);
  background-image: -ms-linear-gradient(top, #0099ff, #007acc);
  background-image: -o-linear-gradient(top, #0099ff, #007acc);
  background-image: linear-gradient(to bottom, #0099ff, #007acc);
  -pie-background: linear-gradient(top, #0099ff, #007acc);
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
.main .options ul {
  -moz-column-count: 2;
  -moz-column-gap: 60px;
  -webkit-column-count: 2;
  -webkit-column-gap: 60px;
  column-count: 2;
  column-gap: 60px;
}
.main .options li {
  font: 16px/1.4 'Lato', sans-serif;
  color: #242424;
  text-align: left;
  margin: 0 0 20px 0;
  padding-left: 20px;
  position: relative;
}
.main .options li:before {
  content: '\2022';
  position: absolute;
  left: 0;
  top: -3px;
  color: #09f;
  font-size: 24px;
  line-height: 1;
}
@media only screen and (max-width: 1080px), only screen and (max-device-width: 1080px) {
  header .description {
    padding-top: 10px;
  }
  header h1 {
    font-size: 52px;
  }
  header h2 {
    font-size: 40.25806451612903px;
  }
  header .demos h3 {
    font-size: 26.838709677419356px;
  }
}
@media only screen and (max-width: 835px), only screen and (max-device-width: 835px) {
  header img {
    display: block;
    margin: auto;
    min-width: 300px;
  }
  header .description {
    display: block;
    margin: auto;
    width: 100%;
  }
}