/* Homepage Hero*/
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}


#hero {
  height: 100vh;
  max-height: 680px;
  width: 100%;
	background: #7CA6B3;
background:  url("../images/hero_backgrounds/versatility.png")
      no-repeat center bottom / cover;
	margin-bottom: 5%;
	padding: 0% 5%;	
	
}


.hero-container {
  width: 90%;
  height: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
	text-align: center;
  /*   text-align: center; */
}
#hero .info h1 {
  font-size: 4vw;
	color: #ffffff;
	font-weight: 200;
  /* text-transform: uppercase; */
  margin-bottom: 2rem;
	line-height: 6.5vw;
}

#hero .info h1 span {
  font-size: 4vw;
	color: #ffffff;
	font-weight: 500;
  /* text-transform: uppercase; */
  margin-bottom: 5rem;
}

#hero .info h2 {
  font-size: 1.5vw;
  margin-bottom: 2rem;
	color: #ffffff;
}
#hero .info p {
  font-size: 1.2vw;
  max-width: 70%;
  color: #ffffff;
  padding: 3% 0%;
}
#hero .info a {
  text-decoration: none;
  display: inline-block;
  background-color: #56BC06;
  border-radius: 4px;
  font-size: 1.7rem;
  padding: 0.5em 2em;
  color: #ffffff;
}


#hero .info a:hover {
  text-decoration: none;
  display: inline-block;
  background-color:#4AA504;
  border-radius: 4px;
  font-size: 1.7rem;
  color: #ffffff;
	box-shadow: 0px 12px 24px -12px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0px 12px 24px -12px rgba(0, 0, 0, 0.5);
}

@media only screen and (max-width: 480px) {

	
	.hero-container {
		padding-top: 60%;
		width: 90%;
  height: 50%;
	}
	
#hero .info h1 {
  font-size: 2.2rem;
	color: #ffffff;
	font-weight: 300;
  /* text-transform: uppercase; */
  margin-bottom: 2rem;
	line-height: 3rem;
	padding-bottom: 2%;
}

#hero .info h1 span {
  font-size: 2.2rem;
	color: #ffffff;
	font-weight: 500;
  /* text-transform: uppercase; */
  margin-bottom: 5rem;
}
	
	#hero .info a {
  text-decoration: none;
  display: inline-block;
  background-color: #56BC06;
  border-radius: 4px;
  font-size: 1.7rem;
  padding: 0.5em 2em;
  color: #ffffff;
		font-weight: 500;
}
		
}

/* Dwell Hero*/
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}


#hero2 {
  height: 100vh;
  max-height: 350px;
  width: 100%;
	background: #7CA6B3;
background:  url("../images/hero_backgrounds/dwell_background.png")
      no-repeat center bottom / cover;
	margin-bottom: 5%;
	padding: 0% 5%;	
	
}


.hero2-container {
  width: 90%;
  height: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
	text-align: center;
  /*   text-align: center; */
}
#hero2 .info h1 {
  font-size: 4vw;
	color: #ffffff;
	font-weight: 200;
  /* text-transform: uppercase; */
  margin-bottom: 2rem;
	line-height: 6.5vw;
}

#hero2 .info h1 span {
  font-size: 4vw;
	color: #ffffff;
	font-weight: 500;
  /* text-transform: uppercase; */
  margin-bottom: 5rem;
}

#hero2 .info h2 {
  font-size: 1.5vw;
  margin-bottom: 2rem;
	color: #ffffff;
}


@media only screen and (max-width: 480px) {

	
	.hero2-container {
		padding-top: 60%;
		width: 90%;
  height: 50%;
	}
	
#hero2 .info h1 {
  font-size: 2.2rem;
	color: #ffffff;
	font-weight: 300;
  /* text-transform: uppercase; */
  margin-bottom: 2rem;
	line-height: 3rem;
	padding-bottom: 2%;
}

#hero2 .info h1 span {
  font-size: 2.2rem;
	color: #ffffff;
	font-weight: 500;
  /* text-transform: uppercase; */
  margin-bottom: 5rem;
}
	
}


/* Blooms Hero*/
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}


#hero3 {
  height: 100vh;
  max-height: 350px;
  width: 100%;
	background: #7CA6B3;
background:  url("../images/hero_backgrounds/blooms_bckgrd.png")
      no-repeat center bottom / cover;
	margin-bottom: 5%;
	padding: 0% 5%;	
	
}


.hero3-container {
  width: 90%;
  height: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
	text-align: center;
  /*   text-align: center; */
}
#hero3 .info h1 {
  font-size: 4vw;
	color: #ffffff;
	font-weight: 200;
  /* text-transform: uppercase; */
  margin-bottom: 2rem;
	line-height: 6.5vw;
}

#hero3 .info h1 span {
  font-size: 4vw;
	color: #ffffff;
	font-weight: 500;
  /* text-transform: uppercase; */
  margin-bottom: 5rem;
}

#hero3 .info h2 {
  font-size: 1.5vw;
  margin-bottom: 2rem;
	color: #ffffff;
}


@media only screen and (max-width: 480px) {

	
	.hero3-container {
		padding-top: 60%;
		width: 90%;
  height: 50%;
	}
	
#hero3 .info h1 {
  font-size: 2.2rem;
	color: #ffffff;
	font-weight: 300;
  /* text-transform: uppercase; */
  margin-bottom: 2rem;
	line-height: 3rem;
	padding-bottom: 2%;
}

#hero3 .info h1 span {
  font-size: 2.2rem;
	color: #ffffff;
	font-weight: 500;
  /* text-transform: uppercase; */
  margin-bottom: 5rem;
}
	
}


/* NoshnNibble Hero*/
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}


#hero4 {
  height: 100vh;
  max-height: 350px;
  width: 100%;
	background: #7CA6B3;
background:  url("../images/hero_backgrounds/noshnibble_bckgrd.png")
      no-repeat center bottom / cover;
	margin-bottom: 5%;
	padding: 0% 5%;	
	
}


.hero4-container {
  width: 90%;
  height: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
	text-align: center;
  /*   text-align: center; */
}
#hero4 .info h1 {
  font-size: 4vw;
	color: #ffffff;
	font-weight: 200;
  /* text-transform: uppercase; */
  margin-bottom: 2rem;
	line-height: 6.5vw;
}

#hero4 .info h1 span {
  font-size: 4vw;
	color: #ffffff;
	font-weight: 500;
  /* text-transform: uppercase; */
  margin-bottom: 5rem;
}

#hero4 .info h2 {
  font-size: 1.5vw;
  margin-bottom: 2rem;
	color: #ffffff;
}


@media only screen and (max-width: 480px) {

	
	.hero4-container {
		padding-top: 60%;
		width: 90%;
  height: 50%;
	}
	
#hero4 .info h1 {
  font-size: 2.2rem;
	color: #ffffff;
	font-weight: 300;
  /* text-transform: uppercase; */
  margin-bottom: 2rem;
	line-height: 3rem;
	padding-bottom: 2%;
}

#hero4 .info h1 span {
  font-size: 2.2rem;
	color: #ffffff;
	font-weight: 500;
  /* text-transform: uppercase; */
  margin-bottom: 5rem;
}
	
}

/* Bluestone Hero*/
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}


#hero5 {
  height: 100vh;
  max-height: 350px;
  width: 100%;
	background: #7CA6B3;
background:  url("../images/hero_backgrounds/bluestone_bckgrd.png")
      no-repeat center bottom / cover;
	margin-bottom: 5%;
	padding: 0% 5%;	
	
}


.hero5-container {
  width: 90%;
  height: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
	text-align: center;
  /*   text-align: center; */
}
#hero5 .info h1 {
  font-size: 4vw;
	color: #ffffff;
	font-weight: 200;
  /* text-transform: uppercase; */
  margin-bottom: 2rem;
	line-height: 6.5vw;
}

#hero5 .info h1 span {
  font-size: 4vw;
	color: #ffffff;
	font-weight: 500;
  /* text-transform: uppercase; */
  margin-bottom: 5rem;
}

#hero5 .info h2 {
  font-size: 1.5vw;
  margin-bottom: 2rem;
	color: #ffffff;
}


@media only screen and (max-width: 480px) {

	
	.hero5-container {
		padding-top: 60%;
		width: 90%;
  height: 50%;
	}
	
#hero5 .info h1 {
  font-size: 2.2rem;
	color: #ffffff;
	font-weight: 300;
  /* text-transform: uppercase; */
  margin-bottom: 2rem;
	line-height: 3rem;
	padding-bottom: 2%;
}

#hero5 .info h1 span {
  font-size: 2.2rem;
	color: #ffffff;
	font-weight: 500;
  /* text-transform: uppercase; */
  margin-bottom: 5rem;
}
	
}