body {
  background: #788f9c;
  font-family: 'Open Sans', sans-serif;
  font-size: 15px;
  line-height: 22px;
  color: #4d4d4d;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  /* Fix for webkit rendering */
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);
  -webkit-text-size-adjust: 100%;
  margin-top: 0px;
}

html {
  height: 100%;
  overflow-x: hidden;
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

.container {
  display: flex;
  position: relative;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 0;
}

.sidebar {}

.content {
  display: flex: 1 1 auto;
  align-items: flex-start;
  flex-grow: 1;
  background: rgba(255, 255, 255, 1);
  width: 70%;
  /* height: 100vh; */
}


/***** HEADER *****/

.header {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-around;
  background: rgba(255, 255, 255, 1);
  justify-content: center;
  width: 100%;
  border-bottom: solid;
  border-bottom-width: 1px;
  border-color: #999;
}

.tagline {
  flex: 1;
  text-align: center;
  margin: auto;
}

.logo {
  width: 100px;
}

.header-logo {
  flex: 0;
  text-align: center;
  margin: auto;
  padding: 10px 10px 10px 10px;
}

.header-menu {
  flex: 0;
  flex-wrap: wrap;
  text-align: center;
  margin: auto;
  padding: 20px 20px 20px 20px;
}

.header-menu a {
  padding-left: 10px;
}


/***** END HEADER *****/

.text-blue {
  color: #607f8a;
}

.text-orange {
  color: #c46d3a;
}

.text-red {
  color: #943847;
}

.text-light-grey {
  color: rgba(124, 124, 124, 1);
}

.text-dark-grey {
  color: rgba(60, 60, 60, 1);
}

.text-gradient {
  background: -webkit-linear-gradient(#DB8B3A, #c46d3a);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.text-large {
  font-size: 4em;
  font-weight: 700;
  line-height: 1em;
}

.text-small {
  font-size: .9em;
}

.text-heavy{
  font-weight: 600;
}

.hero-img {
  flex: 1;
  width: 100%;
}

.bgdark{
  background-color: rgba(92, 151, 191, 0.3);
}

.bgmedium{
  background-color: rgba(92, 151, 191, 0.1);
}

.bglight{
  background-color: rgba(92, 151, 191, 0.05);
}


/***** SERVICES *****/

.services {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  /* margin-bottom: 20px; */
}

.services-item {
  flex: 1;
  justify-content: center;
  text-align: center;
  margin: 10px 0px 10px 0px;
  font-weight: 500;
}

.services-item p {
  flex: 1;
}

.data-img {
  flex: 1;
  width: 30px;
  padding-top: 20px;
}


/***** END SERVICES *****/


/***** Stories *****/

.story {
  display: flex;
  justify-content: top;
  width: 100%;
  margin-bottom: 20px;
}

.story-head {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
}

.story-item {
  flex: 1;
  flex-flow: column wrap;
  align-items: flex-start;
  text-align: left;
  margin: 0px 20px 20px 50px;
  font-weight: 500;
}

.story-item p {
  /* display: flex;
  flex: 1;
  flex-flow: column wrap;
  align-items: flex-start; */
}

.title {
  display: flex;
  flex: 1;
  flex-flow: column wrap;
  align-items: flex-start;
  text-align: left;
  width: 50%;
  margin: 20px 0px 20px 50px;
  font-size: 2em;
  line-height: 1.1em;
  font-weight: 500;
}

.title hr {
  width: 100%;
  !important;
}

.callout {
  display: flex;
  flex: 1;
  flex-flow: column wrap;
  align-items: flex-end;
  text-align: left;
  /* width:20%; */
  margin: 30px 50px 30px 0px;
  font-family: 'Lato', sans-serif;
  font-size: 1.2em;
  font-weight: 300;
  font-style: italic;
}


/***** COPY *****/

.copy {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  justify-content: left;
  width: 100%;
}

.copy p {
  flex: 2;
  margin: 20px 30px 0px 0px;
}

.number-caption {
  font-style: italic;
  font-size: .9em;
  color: #666;
  width: 50%;
}

.why-list {
  display: flex;
  justify-content: flex-end;
  margin: 0px 40px 40px 0px;
}


/***** END COPY *****/

.story-img {
  flex: 1;
  width: 160px;
  padding-top: 0px;
}

.img-outline {
  outline: 1px solid rgba(0, 0, 0, .4);
  outline-offset: 4px;
}

.divider {
  display: flex;
  flex-flow: column wrap;
  justify-content: center;
  text-align: center;
  margin-top: 30px;
}

.line {
  align-self: center;
  width: 80%;
  border-bottom: thin solid #999;
}

.bottom-border {
  border-bottom: 1px solid rgba(0, 0, 0, .1);
}

.title-underline {
  border-bottom: 1px solid rgba(0, 0, 0, .5);
  margin-right: 50%;
}

.footer {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-around;
  width: 100%;
  padding: 15px 0px 15px 0px;
  border-top: 1px solid rgba(0, 0, 0, .1);
}


/* Typography */

/* @import url(https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic);
@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700); */
@import url(https://fonts.googleapis.com/css?family=Open+Sans&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic);
h1, h2, h3 {
  display: block;
  text-align: left;
}

h1 a, h2 a, h3 a {
  font-weight: inherit;
}

h1 {
  font-size: 1.8em;
  line-height: 1em;
  font-weight: 500;
}

h2 {
  font-size: 1.6em;
  line-height: 1em;
  font-weight: 500;
  margin: 10px 0px 4px 0px;
}

h3 {
  font-size: 1em;
  line-height: .8em;
  font-weight: 700;
  margin-bottom: 4px;
}

a, a:visited {
  text-decoration: none;
  color: #607f8a;
}

a:hover, a:focus {
  color: #c46d3a;
}

p a, p a:visited {
  line-height: inherit;
  text-decoration: none;
}

a:focus {
  outline: none;
}

em {
  font-style: italic;
}

strong {
  font-weight: 600;
}

small {
  font-size: 80%;
}

UL {
  margin-top: 0px;
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .tagline {
    display: flex;
    flex-flow: row wrap;
    align-items: flex-start;
    justify-content: center;
    font-size: 1.4em;
    max-width: 30%;
  }
}

@media only screen and (max-width: 768px) {

  .services-item p{
    font-size: .7em;
  }
  .data-img {
    width: 24px;
    padding-top: 10px;
  }
  .title {
    font-size: 1.3em;
    margin-right: 10%;
  }
  .tagline {
    display: flex;
    flex-flow: row wrap;
    align-items: flex-start;
    justify-content: center;
    font-size: .8em;
  }
  h2{
    font-size: 1.2em;
  }

}