/* apply a natural box layout model to all elements */
*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }
 
a:link {
  color: #0e0e0e;
  text-decoration: none;
}

a.button:visited {
  color: #0e0e0e;
  text-decoration: none;
}

a:hover {
  color: #0e0e0e;
  text-decoration: none;
}

a:active {
  color: #0e0e0e;
  text-decoration: none;
}

 /* Global */

 h2:before { 
  display: block; 
  content: " "; 
  margin-top: -140px; 
  height: 146px; 
  visibility: hidden; 
}

section {
  text-align: center;
  width: 100%;
  padding: 5% 0 5% 0; 
}

.button {
  border: solid 1px #FF501D;
  border-radius: 3px;
  background-color: #fc693c;
  font-size: 1em;
  padding: 0.5em 0.65em 0.5em 0.65em;
  margin-top: 1em;
}

.dropshadow {
  -moz-box-shadow:    0px 1px 1px 0px #0e0e0e, inset 0px 2px 1px 0px #fefefe;
  -webkit-box-shadow: 0px 1px 1px 0px #0e0e0e, inset 0px 2px 1px 0px #fefefe;
  box-shadow:         0px 1px 1px 0px #0e0e0e, inset 0px 2px 1px 0px #fefefe;
}


 /* Nav section */

/* set fixed header */

#main {
  background-color: #008FB6;
  position: fixed;
  width: 100%;
  z-index: 10;
}

/* logo and nav positioning */

#nav_logo.col {
  padding-top: 1%;
  padding-left: 15%;
  float:left;
}

nav.col {
  float:left;
}

nav ul {
  text-align: right;
  padding-top: 3%;
  padding-right: 15%;
  padding-bottom: 1.5%;
}
nav ul li {
  display: inline-block;
  padding-right: 6%;
}



a.nav_link {
  color: #fefefe;
  font-family: "Source Sans Pro", "Helvetica Neue", sans-serif;
  font-size: 1.1em;
  font-weight: lighter;
  text-shadow: 1px 1px 1px #000;
  text-decoration: none;
}

a.nav_link:link {
  color: #fefefe;
}


/* Hero section styling */

#hero {
  background-color: #9AF0FF;
  text-align: center;
  width: 100%;
  /* adjust for fixed nav positioning */
  padding: 8% 0 0 0; 
}


/* tagged */
#arrow-left {
  width: 18%;
  margin-top: -7%;
  margin-right: -12%;
  text-align: inherit;
}

/* tagged */
video {
  width:40%;
  vertical-align: top;
  margin-top: 2%;
}

/* tagged */
#arrow-right {
  width: 18%;
  margin-top: -7%;
  margin-left: -12%;
  text-align: inherit;

}

/* tagged */
#main-C2A {
  margin-top: -5%;
}


/* tagged */
.bigbutton {
  font-size: 1.4em;
  letter-spacing: -1px;
  padding: 1.5%;
}


/* tagged */
.trigger {
  font-size: 1.1em;
  padding-bottom: 2%;
  margin-top: 3%;
}



/* How It Works Styling */

#how-it-works-section {
  color: #fefefe;
  background-color: #0C6387;
  text-shadow: 0px 1px 0px #0e0e0e;
}


#how-it-works-section h2 {
  color: inherit;
  
}

/* shorten width of cols */

#how-it-works-section div {
  padding: 2% 5% 2% 5%;
}

/* tighten spacing between cols */

#upload {
  margin: 0 -4% 0 -4%;
}


/* Features Styling */


#features-section {
  background-color: #E8FFFF;
  color: #0e0e0e;
}


#features-section h2 {
  color: inherit;
  text-shadow: 0px 1px 0px #fefefe;
  /* tighten and wrap the headline */
  padding-left: 15%;
  padding-right: 15%;
}

#feature-content {
  text-align: center;
}

#col1 {
padding: 2% 2% 2% 17%;
text-align: left;
}

#features-section h4 {
  font-size: 1.5em;
  text-shadow: 0px 1px 0px #fefefe;
  letter-spacing: 0;
  line-height: 1.2em;
  margin: 4% 0 0 0;
}

#col2 {
  padding: 2% 17% 2% 2%;
  text-align: left;
 
}

#col1 ul, #col2 ul {
  list-style-image: url(../images/checkmark.png);
} 


/* Testimonial Styling */

#testimonials-section {
  background-color: #9AF0FF;
  color: inherit;
}

#testimonials-section h2 {
  text-shadow: 0px 1px 0px #fefefe;
   /* tighten and wrap the headline */
  padding-left: 15%;
  padding-right: 15%;
}

.test {
  width: 36%;
  font-size: 0.85em;
  text-align: left;
  background: url(../images/testimonial_bubble.png) no-repeat center top;
  padding: 2% 4% 0 4%;
  margin-top: 2%;
}

.first-line {
  font-weight: bold;
  font-size: 1.4em;
  padding-bottom: 1%;
}

/* tighten gutter between testimonials */
#test1 {
  margin-right: -1%;
}

/* tighten gutter between testimonials */
#test2 {
  margin-left: -1%;
}

.tagline {
  position: relative;
  margin: 15% 0 0 -2%;
}

.tagline img {
  position: relative;
}

.tagline .text {
  position: absolute;
  left: 27%;
  bottom: 17%;
}


/* Signup page */

/* add Flexbox for easy positioning and alignment */
 
 /* adjust as needed */
 .flex-container {
  height: 100%;
  flex-flow: row wrap;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display:flex;
  align-items: center;
  justify-content: center;

}

 /* adjust as needed */
.flex-item {
  position:relative;
  text-align: center;
  padding:0;
  margin:0;
}

#signup-section {
  color: #fefefe;
  background-color: #0C6387;
  padding-top: 10%;
  padding-bottom: 12%;
}

#signup-section h4 {
  font-size: 1.5em;
  font-weight: lighter;
  padding-top: 8%;
  margin-bottom: 1%;
}

.form_input {
  border-radius: 3px;
  font-size: 1.4em;
  margin: 3% 0 0 0;
  width: 50%;
  
}


#final_call {
  padding: 3% 5% 3% 5%;
  margin-top: 7%;
}



 /*for troubleshooting layout 
*/

.border-parent {
  border:solid 2px blue;
}

.border-child {
	border:solid 1px red;
}