//
// AGAVE GREENLAKE CONSUMPTION PAGE
// --------------------------
#agave_greenlake {

	h1, h2, h3, h4 {
		color: $agave-dark;
	}

	.blocks-container {
		.block {
			text-align: center;
			margin-bottom: 45px;
			.icon-wrapper {
				margin-bottom: 30px;
			}
			.title {
				text-transform: uppercase;
				font-weight: 700;
				margin-bottom: 33px;
			}
			.content {
				font-size: 18px;
				line-height: 26px;
			}
		}
	}
	.section-one {
		-webkit-background-size: cover;
		background-size: cover;
		background-position: top center;
		background-repeat: no-repeat;
		background-color: #004D5C;
		padding: 150px 0 80px;

        @include breakpoint(medium) {
            padding-top: 300px;
        }

		h1 {
			font-family: allumi-std, "Open Sans", sans-serif;
			color: #fff;
			margin-bottom: 4rem;
			font-size: 100px;
			text-align: center;
		}
		h2 {
			font-family: allumi-std, "Open Sans", sans-serif;
			color: #fff;
			margin-bottom: 2rem;
			font-size: 3.625rem;
			text-align: center;
			text-transform: none;
		}
		h3 {
			font-family: allumi-std, "Open Sans", sans-serif;
			color: #fff;
		}
		p {
			color: #fff;
			font-size: 22px;
			line-height: 34px;
			margin-bottom: 1.5rem;
		}
		.content-container {
			padding-bottom: 80px;
		}

        .blocks-container {
            .block {
                .content {
                    @include breakpoint(large) {
                        padding-left: 30px;
                        padding-right: 30px;
                    }
                }
            }
        }

	}
	.section-two {
		padding: 80px 0;
		h2 {
			font-size: 36px;
			margin-bottom: 40px;
			text-align: center;
		}
		p {
			font-size: 22px;
		}
		.content-container {
			padding-bottom: 80px;
		}
		.block {
			.icon-wrapper {
				height: 100px;
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-webkit-box-pack: center;
				-ms-flex-pack: center;
				justify-content: center;
				-webkit-box-align: end;
				-ms-flex-align: end;
				align-items: flex-end;
				svg {
					display: block;
				}
			}
			.title {
				color: #004D5C;
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-webkit-box-pack: center;
				-ms-flex-pack: center;
				justify-content: center;
				-webkit-box-align: center;
				-ms-flex-align: center;
				align-items: center;
				h3 {
					font-size: 26px;
					line-height: 30px;
					font-weight: 700;
				}
			}
			.content {
				font-size: 18px;
				line-height: 26px;
				span {
					color: $agave-light-green;
					font-weight: 700;
				}
			}
		}
	}
	.section-three {
		background-color: #B5F5E7;
		padding: 60px 0;
		h2 {
			font-size: 36px;
			margin-bottom: 40px;
			text-align: center;
		}
		.achievement {
			max-width: 370px;
			margin: 0 auto 40px;
		}
		.icon {
			height: 100px;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-pack: center;
			-ms-flex-pack: center;
			justify-content: center;
			-webkit-box-align: end;
			-ms-flex-align: end;
			align-items: flex-end;
			margin-bottom: 30px;
			svg {
				display: block;
			}
		}
		.content {
			font-size: 18px;
			line-height: 26px;
			text-align: center;
		}
		.cta-wrapper {
			padding: 60px 0 0;
			margin-bottom: 20px;
			text-align: center;
			.btn-hollow {
				border-color: $agave-dark;
				color: $agave-dark;
				&:hover {
					background-color: $agave-dark;
					color: $agave-white;
				}
			}
		}
	}
}
@media print {
	#agave_greenlake {
		.section-one {
			padding-top: 300px;
			.blocks-container {
				.block {
					.content {
						padding-left: 30px;
						padding-right: 30px;
					}
				}
			}
		}
	}
}

// @media screen and (min-width: 40em) {
// 	#agave_greenlake {
// 		.section-one {
// 			padding-top: 300px;
// 		}
// 	}
// }
// @media screen and (min-width: 64em) {
// 	#agave_greenlake {
// 		.section-one {
// 			.blocks-container {
// 				.block {
// 					.content {
// 						padding-left: 30px;
// 						padding-right: 30px;
// 					}
// 				}
// 			}
// 		}
// 	}
// }