/* YUI 3.5.0 reset.css (http://developer.yahoo.com/yui/3/cssreset/) - http://cssreset.com */
html {
  color: #000;
  background: #FFF;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
figure,
legend,
input,
textarea,
p,
blockquote,
th,
td {
  margin: 0;
  padding: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

fieldset,
img {
  border: 0;
}

address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: normal;
}

ol,
ul {
  list-style: none;
}

caption,
th {
  text-align: left;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}

q:before,
q:after {
  content: '';
}

abbr,
acronym {
  border: 0;
  font-variant: normal;
}

sup {
  vertical-align: text-top;
}

sub {
  vertical-align: text-bottom;
}

input,
textarea,
select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}

input,
textarea,
select {
  *font-size: 100%;
}

legend {
  color: #000;
}

#yui3-css-stamp.cssreset {
  display: none;
}

/* My styles */
body {
  font-family: 'Montserrat', sans-serif;
  background-color: #F5F5F5;
}

h1,
h2 {
  font-weight: 900;
}

a {
  font-style: italic;
  background-color: #69f0ae;
  color: black;
  text-decoration: none;
}

.grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[10];
  grid-template-columns: repeat(10, 1fr);
  -ms-grid-rows: (1fr)[10];
  grid-template-rows: repeat(10, 1fr);
  padding: 5%;
}

.hello {
  font-size: 10em;
  -ms-grid-column: 1;
  -ms-grid-column-span: 4;
  grid-column: 1/5;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
  color: #69f0ae;
}

@media screen and (max-width: 985px) {
  .hello {
    font-size: 7em;
  }
}

.introPara {
  -ms-grid-column: 6;
  -ms-grid-column-span: 5;
  grid-column: 6/11;
  -ms-grid-row: 2;
  -ms-grid-row-span: 3;
  grid-row: 2/5;
  font-size: 1.5em;
  line-height: 1.5em;
}

@media screen and (max-width: 985px) {
  .introPara {
    font-size: 1.25em;
  }
}

@media screen and (max-width: 750px) {
  .introPara {
    font-size: 1.25em;
    -ms-grid-column: 1;
    -ms-grid-column-span: 10;
    grid-column: 1/11;
  }
}

.headingOne {
  font-size: 3em;
  -ms-grid-column: 1;
  -ms-grid-column-span: 6;
  grid-column: 1/7;
  -ms-grid-row: 4;
  -ms-grid-row-span: 1;
  grid-row: 4/5;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  font-weight: 900;
}

.typesList {
  -ms-grid-column: 1;
  -ms-grid-column-span: 9;
  grid-column: 1/10;
  -ms-grid-row: 5;
  -ms-grid-row-span: 5;
  grid-row: 5/10;
  font-size: 5em;
}

.linksLi h1,
.linksLi a,
.linksLi li,
.linksLi p:hover {
  -webkit-text-decoration: #69f0ae underline;
  text-decoration: #69f0ae underline;
}

@media screen and (min-width: 750px) {
  .linksLi span.popup {
    height: 0;
    position: relative;
    cursor: pointer;
  }

  .linksLi span.popup:after {
    content: attr(data-popuptext);
    background: black;
    color: white;
    border-radius: 30px;
    opacity: 0;
    top: 0;
    left: 0;
    position: absolute;
    width: 30rem;
    -webkit-transition: 500ms ease;
    transition: 500ms ease;
    font-size: 20px;
    line-height: 1.5em;
  }

  .linksLi span.popup:hover:after {
    opacity: 1;
    top: 1.2em;
    left: 5em;
    padding: 3%;
    z-index: 1;
  }
}

.introGrid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[10];
  grid-template-columns: repeat(10, 1fr);
  -ms-grid-rows: (1fr)[5];
  grid-template-rows: repeat(5, 1fr);
  padding: 5%;
}

@media only screen and (max-width: 1000px) {
  .introGrid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-left: 5%;
    margin-right: 5%;
  }

  .introGrid .grid--gutters {
    margin-bottom: 10%;
  }
}

.hello {
  -ms-grid-column: 1;
  -ms-grid-column-span: 6;
  grid-column: 1/7;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
  z-index: 1;
}

.h3-Intro {
  -ms-grid-column: 6;
  -ms-grid-column-span: 4;
  grid-column: 6/10;
  -ms-grid-row: 4;
  -ms-grid-row-span: 1;
  grid-row: 4/5;
  padding-top: 5%;
}

@media only screen and (max-width: 1000px) {
  .h3-Intro {
    place-self: center;
  }
}

.introPOne {
  -ms-grid-column: 2;
  -ms-grid-column-span: 4;
  grid-column: 2/6;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2/4;
  place-self: center;
}

.introPTwo {
  -ms-grid-column: 6;
  -ms-grid-column-span: 4;
  grid-column: 6/10;
  -ms-grid-row: 4;
  -ms-grid-row-span: 2;
  grid-row: 4/6;
  place-self: center;
}

@media only screen and (max-width: 1200px) {
  .introPTwo {
    paddin-top: 30%;
  }
}

.introImg {
  -ms-grid-column: 6;
  -ms-grid-column-span: 4;
  grid-column: 6/10;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2/4;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.imgGrid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[10];
  grid-template-columns: repeat(10, 1fr);
  -ms-grid-rows: (1fr)[11];
  grid-template-rows: repeat(11, 1fr);
  padding: 5%;
  background-image: url(veggie.jpg);
  background-repeat: no-repeat;
  background-size: contain;
}

@media only screen and (max-width: 1000px) {
  .imgGrid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 5%;
    margin-top: 10%;
  }

  .imgGrid .grid--gutters {
    margin-bottom: 10%;
  }
}

.imgHead {
  -ms-grid-column: 2;
  -ms-grid-column-span: 4;
  grid-column: 2/6;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2/3;
}

.imgTextGrid {
  -ms-grid-column: 2;
  -ms-grid-column-span: 4;
  grid-column: 2/6;
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  grid-row: 1/4;
  padding: 10%;
  border-radius: 5%;
}

.imgTextGrid li {
  line-height: 2rem;
}

@media only screen and (max-width: 1000px) {
  .imgTextGrid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 5%;
    margin-top: 10%;
  }
}

.secThreeImg {
  -ms-grid-column: 3;
  -ms-grid-column-span: 5;
  grid-column: 3/8;
  -ms-grid-row: 6;
  -ms-grid-row-span: 2;
  grid-row: 6/8;
  width: 100%;
  height: auto;
  overflow: hidden;
}

.secThreeH2 {
  -ms-grid-column: 3;
  -ms-grid-column-span: 2;
  grid-column: 3/5;
  -ms-grid-row: 6;
  -ms-grid-row-span: 2;
  grid-row: 6/8;
  place-self: end start;
}

@media only screen and (max-width: 1000px) {
  .secThreeH2 {
    place-self: center;
  }
}

.secThreeP {
  -ms-grid-column: 3;
  -ms-grid-column-span: 5;
  grid-column: 3/8;
  -ms-grid-row: 8;
  -ms-grid-row-span: 2;
  grid-row: 8/10;
  padding-top: 5%;
}

.secThreePTwo {
  -ms-grid-column: 4;
  -ms-grid-column-span: 5;
  grid-column: 4/9;
  -ms-grid-row: 9;
  -ms-grid-row-span: 3;
  grid-row: 9/12;
  padding-top: 10%;
}

.secThreePThree {
  -ms-grid-column: 3;
  -ms-grid-column-span: 5;
  grid-column: 3/8;
  -ms-grid-row: 10;
  -ms-grid-row-span: 3;
  grid-row: 10/13;
  padding-top: 15%;
}

.footerGrid {
  background-color: lightgray;
  padding: 5%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[10];
  grid-template-columns: repeat(10, 1fr);
  -ms-grid-rows: (1fr)[4];
  grid-template-rows: repeat(4, 1fr);
}

@media only screen and (max-width: 1000px) {
  .footerGrid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.footerHeading {
  -ms-grid-column: 1;
  -ms-grid-column-span: 6;
  grid-column: 1/7;
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  grid-row: 1/4;
}

.terms {
  -ms-grid-column: 8;
  -ms-grid-column-span: 2;
  grid-column: 8/10;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
  place-self: end start;
}

@media only screen and (max-width: 1000px) {
  .terms {
    place-self: start;
  }
}

.footerP {
  -ms-grid-column: 1;
  -ms-grid-column-span: 4;
  grid-column: 1/5;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2/4;
  padding-top: 5%;
}

.listOne {
  -ms-grid-column: 8;
  -ms-grid-column-span: 1;
  grid-column: 8/9;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2/4;
}

.listTwo {
  -ms-grid-column: 9;
  -ms-grid-column-span: 1;
  grid-column: 9/10;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2/4;
}

.emailForm {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1/3;
  -ms-grid-row: 3;
  -ms-grid-row-span: 2;
  grid-row: 3/5;
  margin-top: 20px;
}

p {
  line-height: 1.5em;
}

.introHeadline {
  font-size: 10rem;
}

@media only screen and (max-width: 1200px) {
  .introHeadline {
    font-size: 8rem;
  }
}

@media only screen and (max-width: 1100px) {
  .introHeadline {
    font-size: 6rem;
  }
}

@media only screen and (max-width: 700px) {
  .introHeadline {
    font-size: 4rem;
  }
}

.footerHeadline {
  font-size: 5rem;
}

.secHeadStyle {
  font-size: 1.5rem;
  font-weight: 900;
}

.threeHeadStyle {
  font-weight: 700;
  color: #636363;
  text-decoration: underline;
}

.p-intro {
  font-size: 1.5rem;
}

.li-intro {
  list-style-type: circle;
  line-height: 3em;
}

@media only screen and (max-width: 1300px) {
  .li-intro {
    padding-top: 20%;
  }
}

@media only screen and (max-width: 1200px) {
  .li-intro {
    line-height: 1.5em;
  }
}

.imgText {
  background-color: rgba(255, 255, 255, 0.75);
}

.bStyle {
  background-color: #69f0ae;
  border: none;
  color: black;
  font-weight: 900;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}

.termsHead {
  font-weight: 700;
  color: #636363;
  text-decoration: underline;
  font-size: 2rem;
}

.footerList li {
  padding: 3px;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 50%;
  height: auto;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 20px;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5em;
  overflow: hidden;
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  left: 0;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

.highlight:hover {
  color: #ff6600;
}

.highlightBackground:hover {
  background-color: #ff6600;
}