* {
	box-sizing: border-box;
}

body {
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	width: 100vw;
}


/********************** BOTÃO OFERTA *************/

button {
	background: #d62828;
	padding: 10px 15px;
	border-radius: 8px;
	font-weight: bold;
	border: 0;
	color: white;
	width: 250px;
	height: 52px;
	display: inline-block;
	margin-top: 10px;
	text-align: center;
	font-size: 1em;
}

button:hover {
	background-color: #A5BE00;
}


/************************** CONTAINER GREEN FRIDAY *****/

header {
	height: 100vh;
	/* height: 100vh; */
	background: no-repeat center/cover url('imagens/header-image.jpg')
}

header span {
	color: #A5BE00;
	text-shadow: 2px 2px 4px #000000;
}

header .header-content {
	max-width: 1000px;
	margin: 150px auto;
	text-align: center;
	margin-top: 0;
}

header h1 {
	margin-bottom: 40px;
	font-size: 6em;
	letter-spacing: .1em;
	padding-top: 100px;
	text-align: center;
	font-family: 'Montserrat', sans-serif;
	text-shadow: 4px 2px 4px #242325;
}


/** .header-content h1:hover {
    color: #2B2F1E;
    border-color: #A5BE00; 
} */

header p {
	text-align: center;
	font-family: 'Puritan', sans-serif;
	font-size: 2em;
	padding-top: ;
}

.span-subtitle {
	color: white;
	font-family: 'Puritan', sans-serif;
}


/****************** FORMULÁRIOS */

.formulario {
	padding-top: 30px;
	text-align: center;
}

.email-lead,
.nome-lead {
	border: 0;
	border-radius: 8px;
	padding: 9px 15px;
	width: 250px;
	height: 50px;
	display: inline-block;
	font-size: 1em;
}


/******************** DIV MEIO COM A FRASE ************/

.middle-container {
	background-color: #242325;
	display: flex;
	text-align: center;
	height: 150px;
	justify-content: center;
}

.middle-container p {
	font-size: 20px;
	padding-top: 45px;
	padding-bottom: 45px;
	color: #DEB09D;
	font-family: 'Martel', serif;
}


/******************** CATÁLOGO ****/

.box-1 {
	background-image: url('imagens/cacto.jpg');
	opacity: 0.6;
}

.box-1:hover,
.box-2:hover,
.box-3:hover {
	opacity: 1;
}

.box-1 p,
.box-2 p,
.box-3 p {
	padding-top: 20px;
}

.box-2 {
	background-image: url('imagens/orquidea.jpg');
	opacity: 0.6;
}

.box-3 {
	background-image: url('imagens/suculenta2.jpg');
	opacity: 0.6;
}


/************************** DIV CONTATO ***/

.bottom-container {
	display: flex;
	justify-content: center;
}

.bottom-container div {
	padding: 100px;
	background-color: black;
	height: 500px;
}


/********************************* NAV-BAR STYLE ******/

* {
	padding: 0;
	margin: 0;
	text-decoration: none;
	list-style: none;
	box-sizing: border-box;
}

nav {
	background-color: black;
	opacity: .9;
	height: 70px;
	width: 100%;
}

label.logo {
	color: cornsilk;
	font-size: 25px;
	line-height: 80px;
	padding: 0 15px;
	font-weight: bold;
	margin-top: 100px;
	font-family: 'Comfortaa', cursive;
}

label span {
	color: #A5BE00;
}

nav ul {
	float: right;
	margin-right: 20px;
}

nav ul li {
	display: inline-block;
	line-height: 80px;
	margin: 0 5px;
}

nav ul li a {
	color: white;
	font-size: 17px;
	padding: 7px;
	border-radius: 3px;
	/*text-transform: uppercase; */
}

a.active,
a:hover {
	background: #A5BE00;
	transition: .5s;
}

.check-btn {
	font: 30px;
	color: white;
	float: right;
	line-height: 80px;
	margin-right: 40px;
	cursor: pointer;
	display: none;
}

#check {
	display: none;
}


/********************************* NAV BAR RESPONSIVA *******/

@media (max-width: 952px) {
	label.logo {
		font-size: 20px;
		padding-left: 20px;
		font-weight: 100;
	}
	nav ul li a {
		font-size: 16px;
	}
}

@media (max-width: 858px) {
	.check-btn {
		display: block;
	}
	ul {
		position: fixed;
		width: 100%;
		height: 100vh;
		background: #E8CCBF;
		top: 80px;
		left: -100%;
		text-align: center;
		transition: all .5s;
	}
	nav ul li {
		display: block;
		margin: 50px 0;
		line-height: 30px;
	}
	nav ul li a {
		font-size: 20px;
	}
	a:active,
	a:hover {
		background: none;
		color: #5434af;
	}
	#check:checked~ul {
		left: 0;
	}
}


/*************************** RODAPÉ *********/

footer {
	padding: 24px 5%;
	flex-direction: column;
	text-align: center;
	background-color: #f6b49a
}

footer p {
	font-family: 'Open Sans', sans-serif;
	padding-bottom: 20px;
}

.rodape-logos {
	display: flex;
	justify-content: center;
}

.rodape-texto {
	font-size: 15px;
}

.github,
.lkn {
	height: 40px;
	justify-content: center;
}


/********************** SITE RESPONSIVO *****/

@media (max-width: 952px) {
	.header-content h1 {
		margin-bottom: 40px;
		font-size: 4.5rem;
		letter-spacing: .1em;
		padding-top: 110px;
	}
	.header-content p {
		text-align: center;
		font-family: 'Hind Guntur', sans-serif;
		font-size: 1.3rem;
		font-weight: ;
	}
	.nome-lead,
	.email-lead,
	.button {
		width: 55%;
		/* margin: 8px; */
		margin-top: 10px;
	}
	.button {
		font-size: .8em;
	}
	.middle-container p {
		font-size: 15px;
		padding-top: 45px;
		padding-bottom: 45px;
		color: #DEB09D;
		justify-content: center;
	}
	.bottom-container {
		display: flex;
		justify-content: center;
		flex-direction: column;
		background: no-repeat center/cover;
	}
	label.logo {
        color: cornsilk;
        font-size: 20px;
        line-height: 80px;
        padding: 0 15px;
        font-weight: bold;
        margin-top: 100px;
        font-family: 'Comfortaa', cursive;
    }
}
