html, body { font-family: 'Arvo', serif; }

section.main > .row {
	min-height: 70vh;
	max-height: 500px;
}

#logo-principal {
	width: 100%;
	max-width: 300px;
	margin: 10vh 0 5vh 0;
}

section.main .descricao p {
	margin: 0;
	padding: 10px 0;
	font-size: 2em;
	width: 100%;
	max-width: 300px;
}

section.main .descricao p .emoji-descricao { width: 1.2em; }

input:focus,
textarea:focus {
	outline: none !important;
	box-shadow: 0 0 5px #16a085 !important;
}

#me-avise button {
	background-color: transparent;
	border: none;
	padding: 0;
	font-size: 1.3em;
	transition: color .3s ease-in-out;
}

#me-avise button:hover { color: #16a085; }

#container-etapas ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

#container-etapas ul li { margin-bottom: 1em; }

#container-etapas ul .far,
#container-etapas ul .fas { margin-right: 5px; }

#container-etapas ul .fa-check-circle { color: #16a085; }

#container-etapas ul .fa-spinner { color: #2980b9; }

#container-etapas ul .fa-bullseye { color: #bdc3c7; }

#container-contato form textarea { min-height: 5em; }

#container-contato form button {
	padding: 5px 15px;
	font-size: 1.3em;
	transition: color .3s ease-in-out;
}

#container-contato form button:hover { color: #16a085; }

footer {
	display: flex;
	justify-content: center;
}

footer img {
	width: 100px;
}

.loading {
	-webkit-animation: rotacao-360 1.3s linear infinite;
	animation: rotacao-360 1.3s linear infinite;
}

#toast-container > .toast.icone-personalizado { background-image: none !important; }

#toast-container > .toast.icone-personalizado::before {
	position: fixed;
	font-family: FontAwesome;
	font-size: 24px;
	line-height: 18px;
	float: left;
	color: #FFF;
	margin: auto 0.5em auto -1.5em;
}

#toast-container > .toast.toast-loading::before {
	content: "\f110";
	-webkit-animation: rotacao-360 1.3s linear infinite;
	animation: rotacao-360 1.3s linear infinite;
}

#btn-whats {
	position: fixed;
	right: 20px;
	bottom: 20px;
	display: block;
	width: 50px;
}

@media (min-width: 1200px) {
	#btn-whats { width: 70px; }
}

#btn-whats img {
	display: block;
	width: 100%;
	transform: translate(0px, 0px);
	animation: float 6s ease-in-out infinite;
}

@keyframes float {

	from {

		-webkit-filter: drop-shadow(0 5px 5px rgba(0,0,0,0.5));
		filter: drop-shadow(0 5px 5px rgba(0,0,0,0.5));
		transform: translate(0px, 0px);
	}
	50% {
		-webkit-filter: drop-shadow(0 8px 5px rgba(0,0,0,0.2));
		filter: drop-shadow(0 8px 5px rgba(0,0,0,0.2));

		transform: translate(0px, -15px);
	}
	to {
		-webkit-filter: drop-shadow(0 5px 5px rgba(0,0,0,0.5));
		filter: drop-shadow(0 5px 5px rgba(0,0,0,0.5));

		transform: translate(0px, 0px);
	}
}

@-webkit-keyframes rotacao-360 {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0);
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@keyframes rotacao-360 {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0);
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@media (min-width: 768px) {

	#logo-principal {
		margin: 10vh 0;
	}

	section.main .descricao {
		margin-left: 50px;
		padding-left: 50px;
		border-left: 2px solid #ecf0f1;
	}
}

@media (min-width: 992px) {

	section.main > .row {
		min-height: 80vh;
		max-height: unset;
	}
}