@font-face {
  font-family: 'Armata';
  src: url("../fonts/armata_regular-webfont.eot");
  src: url("../fonts/armata_regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/armata_regular-webfont.woff") format("woff"), url("../fonts/armata_regular-webfont.ttf") format("truetype"), url("../fonts/armata_regular-webfont.svg#Armata") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'Arimo';
  src: url("../fonts/arimo-regular-webfont.eot");
  src: url("../fonts/arimo-regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/arimo-regular-webfont.woff") format("woff"), url("../fonts/arimo-regular-webfont.ttf") format("truetype"), url("../fonts/arimo-regular-webfont.svg#Arimo") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'Merriweather Sans';
  src: url("../fonts/merriweathersans-regular-webfont.eot");
  src: url("../fonts/merriweathersans-regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/merriweathersans-regular-webfont.woff") format("woff"), url("../fonts/merriweathersans-regular-webfont.ttf") format("truetype"), url("../fonts/merriweathersans-regular-webfont.svg#Merriweather Sans") format("svg");
  font-weight: normal;
  font-style: normal; }
/* Row Machine
  Create resizable row squares
  These have the margin on left so they look good on iphone centered
  To make right margins, just change margin-left to margin-right
*/
/* These don't seem to work. Gotta find out how to use them properly */
.more {
  padding: 10px 20px;
  background-color: #578db6;
  color: #fff;
  border-radius: 3px;
  margin-top: 20px; }

a > .blurbtext > .more:hover {
  background-color: #57b681; }

.apptitle-container {
  margin: 0px 0 0 3%;
  padding-bottom: 20px;
  color: #555555; }

.apptitle {
  min-height: 25px;
  font: 700 1.8em/1.38 'Merriweather Sans'; }

.app-subtitle {
  font: 500 1.2em/1.38 'Merriweather Sans';
  color: #787878; }

.blurbtext {
  float: left;
  width: 40%;
  max-width: 420px;
  min-height: 266px;
  margin: 10px 0 0 5.6666666667%;
  font-size: 1em;
  line-height: 1.38;
  text-align: justify;
  color: #787878; }

.content-container {
  width: 100%; }

.hero-screenshot {
  float: left;
  width: 50%;
  height: 367px;
  margin: 10px 0 0 2.8888888889%;
  overflow: visible; }

.sy-pager {
  margin-bottom: 2em !important; }

.sy-pager li.sy-active a {
  background-color: #54606b; }

@media (max-width: 320px) {
  .blurbtext {
    width: 288px;
    max-width: 640px;
    min-height: 201px;
    margin-top: 44px;
    margin-left: 19px; }

  .content-container {
    height: 563px;
    padding-bottom: 25px; }

  .hero-screenshot {
    width: 90%;
    height: 240px;
    margin-top: 0;
    margin-left: 23px; }
    .hero-screenshot img {
      width: 278px; }

  .apptitle-container {
    z-index: 99;
    font-size: .9em;
    margin-top: 10px;
    padding-left: 10px; }

  .apptitle {
    font-size: 1.2em; }

  .app-subtitle {
    font-size: .8em; } }
.slides {
  background-color: #fff; }

img {
  width: 100%; }