/*
Simple Grid
Learn More - http://dallasbass.com/simple-grid-a-lightweight-responsive-css-grid/
Project Page - http://thisisdallas.github.com/Simple-Grid/
Author - Dallas Bass
Site - dallasbass.com
*/
*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

body { margin: 0px; }

[class*='col-'] { float: left; padding-right: 20px; /* column-space */ }

.grid { width: 100%; max-width: 1140px; min-width: 755px; margin: 0 auto; overflow: hidden; }

.grid:after { content: ""; display: table; clear: both; }

.grid-pad { padding-top: 20px; padding-left: 20px; /* grid-space to left */ padding-right: 0px; /* grid-space to right: (grid-space-left - column-space) e.g. 20px-20px=0 */ }

.push-right { float: right; }

/* Content Columns */
.col-1-1 { width: 100%; }

.col-2-3, .col-8-12 { width: 66.66%; }

.col-1-2, .col-6-12 { width: 50%; }

.col-1-3, .col-4-12 { width: 33.33%; }

.col-1-4, .col-3-12 { width: 25%; }

.col-1-5 { width: 20%; }

.col-1-6, .col-2-12 { width: 16.667%; }

.col-1-7 { width: 14.28%; }

.col-1-8 { width: 12.5%; }

.col-1-9 { width: 11.1%; }

.col-1-10 { width: 10%; }

.col-1-11 { width: 9.09%; }

.col-1-12 { width: 8.33%; }

/* Layout Columns */
.col-11-12 { width: 91.66%; }

.col-10-12 { width: 83.333%; }

.col-9-12 { width: 75%; }

.col-5-12 { width: 41.66%; }

.col-7-12 { width: 58.33%; }

/* Pushing blocks */
.push-2-3, .push-8-12 { margin-left: 66.66%; }

.push-1-2, .push-6-12 { margin-left: 50%; }

.push-1-3, .push-4-12 { margin-left: 33.33%; }

.push-1-4, .push-3-12 { margin-left: 25%; }

.push-1-5 { margin-left: 20%; }

.push-1-6, .push-2-12 { margin-left: 16.667%; }

.push-1-7 { margin-left: 14.28%; }

.push-1-8 { margin-left: 12.5%; }

.push-1-9 { margin-left: 11.1%; }

.push-1-10 { margin-left: 10%; }

.push-1-11 { margin-left: 9.09%; }

.push-1-12 { margin-left: 8.33%; }

@media handheld, only screen and (max-width: 767px) { .grid { width: 100%; min-width: 0; margin-left: 0px; margin-right: 0px; padding-left: 20px; /* grid-space to left */ padding-right: 10px; /* grid-space to right: (grid-space-left - column-space) e.g. 20px-10px=10px */ }
  [class*='col-'] { width: auto; float: none; margin-left: 0px; margin-right: 0px; margin-top: 10px; margin-bottom: 10px; padding-left: 0px; padding-right: 10px; /* column-space */ }
  /* Mobile Layout */
  [class*='mobile-col-'] { float: left; margin-left: 0px; margin-right: 0px; margin-top: 0px; margin-bottom: 10px; padding-left: 0px; padding-right: 10px; /* column-space */ padding-bottom: 0px; }
  .mobile-col-1-1 { width: 100%; }
  .mobile-col-2-3, .mobile-col-8-12 { width: 66.66%; }
  .mobile-col-1-2, .mobile-col-6-12 { width: 50%; }
  .mobile-col-1-3, .mobile-col-4-12 { width: 33.33%; }
  .mobile-col-1-4, .mobile-col-3-12 { width: 25%; }
  .mobile-col-1-5 { width: 20%; }
  .mobile-col-1-6, .mobile-col-2-12 { width: 16.667%; }
  .mobile-col-1-7 { width: 14.28%; }
  .mobile-col-1-8 { width: 12.5%; }
  .mobile-col-1-9 { width: 11.1%; }
  .mobile-col-1-10 { width: 10%; }
  .mobile-col-1-11 { width: 9.09%; }
  .mobile-col-1-12 { width: 8.33%; }
  /* Layout Columns */
  .mobile-col-11-12 { width: 91.66%; }
  .mobile-col-10-12 { width: 83.333%; }
  .mobile-col-9-12 { width: 75%; }
  .mobile-col-5-12 { width: 41.66%; }
  .mobile-col-7-12 { width: 58.33%; }
  .hide-on-mobile { display: none !important; width: 0; height: 0; } }
html, body { height: 100%; }

h1, h2, h3, p { font-family: "Lato", sans-serif; }

.clear { clear: both; }

#header { padding-top: 75px; padding-bottom: 75px; }

.app-icon { display: block; margin: 0 auto; }

#app-name { font-size: 15pt; text-align: center; }

#slogan { font-size: 14pt; margin: 0; line-height: 0; font-weight: 300; text-align: center; }

#logo { width: 300px; height: 85px; margin: 0 auto; margin-top: 30px; }
#logo img { width: 25%; display: inline-block; float: left; }
#logo div { margin-left: 8%; width: 67%; float: left; }
#logo div h1 { text-align: left; }
#logo div h2 { text-align: left; }

#header-buttons { text-align: center; }

.header-btn { text-decoration: none; display: inline-block; text-align: center; border-radius: 7px; font-family: "Lato", sans-serif; }

#header-download-btn { transition: background-color, 0.7s, ease; -webkit-transition: background-color, 0.7s, ease; -moz-transition: background-color, 0.7s, ease; -ms-transition: background-color, 0.7s, ease; background-color: #3976FF; width: 150px; color: white; line-height: 45px; height: 45px; }
#header-download-btn:hover { background-color: #9fbdff; }

#header-content p { margin: 0 auto; margin-bottom: 30px; margin-top: 30px; text-align: center; width: 60%; font-size: 15pt; }

#header-row-image { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
#header-row-image img { width: 424px; }

body { margin: 0; position: relative; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.col-1-4:last-child { margin-bottom: 40px; }

#featured-on { margin: 0 auto; text-align: center; margin-top: 40px; margin-bottom: 40px; }

.short-line { width: 15%; height: 2px; background-color: #B1B1B1; border-radius: 1px; margin: 0 auto; margin-bottom: 5px; }

#featured-on img { height: 55px; margin: 0 30px; display: inline-block; }

#video-demo { text-align: center; }
#video-demo h3 { color: #1D1D1D; margin: 0; padding-top: 30px; margin-bottom: 30px; font-size: 17pt; font-weight: 700; line-height: 0; }
#video-demo iframe { margin-bottom: 20px; }

.section-title { transition: background-color, 0.7s, ease; -webkit-transition: background-color, 0.7s, ease; -moz-transition: background-color, 0.7s, ease; -ms-transition: background-color, 0.7s, ease; height: 35px; width: 150px; color: white; text-align: center; line-height: 35px; border-radius: 3px; background-color: #14A1FF; }
.section-title:hover { background-color: #7acaff; }

#notes { width: 80%; margin: 0 auto; }

.note { width: 90%; }
.note h1 { margin-top: 40px; line-height: 0; }
.note h1 a { text-decoration: none; color: #040707; }
.note p { font-size: 13pt; }

.note-text { text-decoration: none; color: black; }

.social { text-align: center; }
.social img { margin-top: 50px; height: 40px; }

#Outflow-Screenshot { width: 50%; display: block; text-align: center; margin: 0 auto; }

.no-decoration { text-decoration: none; }

#archive { width: 80%; margin: 0 auto; }
#archive h3 { font-size: 12pt; font-weight: 400; }
#archive ul { padding: 0; }
#archive ul li { margin: 30px 0; list-style: none; }

.archive-title { text-decoration: none; color: black; font-family: "Lato", sans-serif; font-size: 15pt; font-weight: 600; }

.archive-post { text-decoration: none; color: black; font-size: 13pt; }

#note { display: block; width: 80%; margin: 0 auto; }

#note a { text-decoration: none; color: #3976ff; }

#note h1 { line-height: 0; padding: 0; }

#note h2 { font-size: 15pt; }

#note li { font-family: "Lato", sans-serif; font-size: 13pt; }

#note p { font-size: 13pt; }

#note ol li { padding-bottom: 10px; }

#demo-display { width: 100%; list-style: none; }
#demo-display li { display: inline-block; width: 33.33%; float: left; }
#demo-display li img { display: block; margin: 0 auto; }
#demo-display li p { text-align: center; width: 95%; }

footer { height: 140px; width: 100%; margin-bottom: 25px; }
footer a { text-decoration: none; }
footer a h3 { margin: 0; padding-top: 20px; color: white; font-family: 'Noto Sans', sans-serif; text-align: center; }
footer p { text-align: center; }
footer p a { color: #316bff; }

#features { background-color: #3976FF; margin-bottom: 75px; width: 100%; }

.feature-set { text-align: center; margin-top: 95px; display: block; }
.feature-set img { display: block; margin: 0 auto; width: 45px; }
.feature-set h3 { font-size: 15pt; font-weight: 700; line-height: 15px; color: #F1F1F1; margin-bottom: 15px; }
.feature-set p { color: #FAFAFA; margin: 0; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 400; font-family: 13pt; width: 80%; margin: 0 auto; }

#features div span:last-child { margin-bottom: 95px; }

#phone-demo { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; padding: 40px; text-align: center; position: relative; }
#phone-demo video { position: absolute; margin-left: 15px; margin-top: 63px; }
#phone-demo a { text-decoration: none; }
#phone-demo p { font-family: "Lato", sans-serif; color: #EAEAEA; }

#launch-list { width: 80%; text-align: center; padding: 10px 0; border: 2px #ECECEC solid; border-radius: 3px; margin: 0 auto; margin-top: 65px; }
#launch-list div { padding: 5px 0; text-align: center; display: inline-block; }
#launch-list div p { vertical-align: middle; display: inline-block; width: 30%; max-width: 400px; min-width: 300px; margin-right: 5%; line-height: 25px; font-size: 15pt; font-family: 'Lato', sans-serif; font-weight: 17pt; }
#launch-list div form { margin-top: 5px; }

input.button { transition: background-color, 0.7s, ease; -webkit-transition: background-color, 0.7s, ease; -moz-transition: background-color, 0.7s, ease; -ms-transition: background-color, 0.7s, ease; margin: 0; margin-left: -21px; padding: 0; height: 29px; width: 75px; background-color: #3976ff; color: white; border: 0; border-radius: 0 5px 5px 0; -webkit-appearance: none; cursor: pointer; }
input.button:hover { background-color: #86abff; }

input { background-color: white; width: 190px; border-radius: 5px 0 0 5px; font-size: 10pt; padding: 0; padding-left: 15px; margin: 0; background-color: #EFEFEF; border: 0; height: 29px; outline: 0; }

#mc-embedded-subscribe-form div { display: inline-block; }

@media screen and (max-width: 767px) { .feature-set { margin-top: 35px; }
  #header-content p { width: 80%; }
  #header-row-image { text-align: center; }
  #header { padding-top: 25px; padding-bottom: 25px; }
  #phone-demo { padding: 0px; }
  #features div span:last-child { margin-bottom: 35px; } }
@media screen and (max-width: 450px) { #launch-list { width: 95%; }
  input { height: 28px; }
  #header-row-image { background-image: green; }
  #header-row-image img { width: 100%; }
  #header-content p { width: 100%; } }