@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 */
/* line 5, ../scss/main-index.scss */
.more {
  padding: 10px 20px;
  background-color: #578db6;
  color: white;
  border-radius: 3px;
  margin-top: 20px;
}

/* line 15, ../scss/main-index.scss */
a > .blurbtext > .more:hover {
  background-color: #57b681;
}

/* line 19, ../scss/main-index.scss */
.apptitle-container {
  margin: 0px 0 0 3%;
  padding-bottom: 20px;
  color: #555555;
}

/* line 25, ../scss/main-index.scss */
.apptitle {
  min-height: 25px;
  font: 700 1.8em/1.38 'Merriweather Sans';
}

/* line 30, ../scss/main-index.scss */
.app-subtitle {
  font: 500 1.2em/1.38 'Merriweather Sans';
  color: #787878;
}

/* line 35, ../scss/main-index.scss */
.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;
}

/* line 46, ../scss/main-index.scss */
.content-container {
  width: 100%;
}

/* line 49, ../scss/main-index.scss */
.hero-screenshot {
  float: left;
  width: 50%;
  height: 367px;
  margin: 10px 0 0 2.8888888889%;
  overflow: visible;
}

/* line 56, ../scss/main-index.scss */
.sy-pager {
  margin-bottom: 2em !important;
}

/* line 58, ../scss/main-index.scss */
.sy-pager li.sy-active a {
  background-color: #54606b;
}

@media (max-width: 320px) {
  /* line 63, ../scss/main-index.scss */
  .blurbtext {
    width: 288px;
    max-width: 640px;
    min-height: 201px;
    margin-top: 44px;
    margin-left: 19px;
  }

  /* line 70, ../scss/main-index.scss */
  .content-container {
    height: 563px;
    padding-bottom: 25px;
  }

  /* line 74, ../scss/main-index.scss */
  .hero-screenshot {
    width: 90%;
    height: 240px;
    margin-top: 0;
    margin-left: 23px;
  }
  /* line 80, ../scss/main-index.scss */
  .hero-screenshot img {
    width: 278px;
  }

  /* line 85, ../scss/main-index.scss */
  .apptitle-container {
    z-index: 99;
    font-size: .9em;
    margin-top: 10px;
    padding-left: 10px;
  }

  /* line 92, ../scss/main-index.scss */
  .apptitle {
    font-size: 1.2em;
  }

  /* line 95, ../scss/main-index.scss */
  .app-subtitle {
    font-size: .8em;
  }
}
/* line 102, ../scss/main-index.scss */
.slides {
  background-color: white;
}

/* line 107, ../scss/main-index.scss */
img {
  width: 100%;
}