/*
Theme Name: eApp - 5 in 1 App Landing Page
Theme URI: http://live.envalab.com/html/eapp
Author: ENVALAB
Author URI: https://themeforest.net/user/envalab/portfolio
Description: eApp – Creative App Landing Page HTML5 Templateis collection of App marketing pages which are perfect suit for showcase your App or services smart and flexible way. It's not only for a mobile Apps but also for mobile games showcase or any application website showcase. It's include stunning, powerful and unique landing page templates which are perfect to promoting Apps or web services & made for iOS and Android Apps makers.
Version: 1.0
*/

/*
====================================================
*   eApp DEMO 1 CSS
*   CSS INDEX
====================================================

        TOC:
        0.  RESET CSS
        1.  HEADER AREA CSS
        2.  BANNER AREA CSS
        3.  SECTIONS AREA CSS
        4. FOOTER AREA CSS

===================================================================== */

/*----------------------------
---------- RESET CSS ---------
----------------------------*/
.mt{
	margin-top: 20px;
}
.mt-15{
	margin-top: 15px;
}
.mt-10{
	margin-top: 10px;
}
.display-block{
	display: block;
}
.mb-30 {
	margin-bottom: 30px;
}
.mb-50 {
	margin-bottom: 50px;
}
.mt-65{
	margin-top: 65px;
}
.mmt-20{
		margin-top: 20px;
}
.mmb-20{
		margin-bottom: 20px;
}
.mmn-50{
		margin-top: -50px;
}
.ptb-100 {
    padding-top: 110px;
	padding-bottom: 105px;
}
.ptb-80 {
    padding-top: 80px;
	padding-bottom: 80px;
}

.green{
	color: #526106 !important;
}

.brown{
	color: #b5a443 !important;
}
.red{
	color: #ae0f0a !important;
}
.strong-red{
	color: #751126 !important;
}
.orange{
	color: #a24224 !important;
}
.white{
	color: #ffffff !important;
}
.black{
	color: #000000 !important;
}
p{
	text-align: justify;
}
.small-font{
	font-size: 13px;
	text-align: left;
}
.bold{
	font-weight: bold;
}
.mobile{
	display: none;
}
.max-size{
	max-width: 300px;
}
.underline{
	text-decoration: underline;
}
.italic{
	font-style: italic;
}
/*--------------------------------------
-------- HEADER AREA CSS START --------
---------------------------------------*/
.header {
    position: relative;
    top: 0;
	padding: 15px 0;
    left: 0;
	transition: all 0.4s;
    width: 100%;
    z-index: 9;
	max-height: auto;
}
.header p{
	font-size: 13px;
}
.header img{
	vertical-align: bottom;
	margin-left: 20px;
}
.grid-logos{
	display: flex;
	width: 100%;
	align-items: flex-end;
	justify-content: space-around;
}
.header img:first-child{
	margin-left: 0;
}
.header img:last-child{
	margin-right: 0;
}

/*--------------------------------------
--------- HEADER AREA CSS END ---------
---------------------------------------*/

/*--------------------------------------
-------- BANNER AREA CSS START --------
---------------------------------------*/
.banner-area-lp4 {
	padding-top: 50px;
	padding-bottom: 30px;
	z-index: 1;
	position: relative;
	height: 320px;
}
.banner-area-lp4::before {
	content: "";
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
    background-image: url(../img/bg-banner.png);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
		z-index: -2;
		position: absolute;
		/*height: auto;*/
}
.banner-area-lp4::after {
	content: "";
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
    background-image: url(../img/img-banner.png);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 47%;
		z-index: -1;
		position: absolute;
		/*height: auto;*/
}
.single-banner {
    color: #fff;
		margin-top: 20px;
}
.single-banner h1 {
    color: #fff;
    max-width: 560px;
		line-height: 1.2;
		font-family: 'Aller-Bold', sans-serif;
		text-transform: uppercase;
}
.single-banner p {
    margin: 10px 0;
}
.single-banner.absolute{
	position: absolute;
	top: 0;
}
.headline{
	font-size: 19px;
  margin-bottom: 15px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-family: 'Bodoni-PosterItalic', sans-serif;
}
.absolute{
			top: 100px;
	    bottom: 0;
			left: 0;
	    width: 50%;
	    position: absolute;
			margin: auto;
			height: 100%;
}
.absolute-right{
	top: 0;
	bottom: 0;
	right: 0;
	width: 50%;
	position: absolute;
	margin: auto;
	height: 100%;
}

/*--------------------------------------
--------- BANNER AREA CSS END ---------
---------------------------------------*/

/*--------------------------------------
-------- SECTION AREA CSS START --------
---------------------------------------*/
.section-area-lp4 {
    padding-top: 50px;
    padding-bottom: 50px;
	z-index: 1;
	position: relative;
    overflow: hidden;
}


.section-area-lp4#bottomImg {
    height: 330px;
}

.section-area-lp4#km {
    padding-top: 70px;
}

/*.section-area::before {
	content: "";
	top: -30px;
	left: 0;
    opacity: 0.4;
	right: 0;
	bottom: -30px;
    background-image: url(../img/appbox-img-1/overview-shape.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
	z-index: -1;
	position: absolute;
}*/

.single-section-box h2 {
	line-height: normal;
	    margin-bottom: 5px;
	    margin-top: 0;
}
/*
#prato-certo .single-section-box p {
	margin-bottom: 0;
}
*/
.single-section-box p {
    margin-bottom: 15px;
		line-height: 20px;
}
.single-section-box h2,
.single-section-box h3,
.single-section-box h4,
.single-section-box {
	color: #fff;
}
.single-section-box ul {
    padding-bottom: 5px;
    padding-top: 15px;
}

#ementas::before {
	content: "";
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
    background-image: url(../img/bg-ementas.png);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: cover;
		z-index: -1;
		position: absolute;
}
#km::before {
	content: "";
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
    background-image: url(../img/bg-km.png);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
		z-index: -1;
		position: absolute;
}
#economia::before {
	content: "";
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
    background-image: url(../img/bg-economia.png);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: cover;
		z-index: -1;
		position: absolute;
}
#covid::before {
	content: "";
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
    background-image: url(../img/bg-comportamento.png);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
		position: absolute;
		z-index: -2;
}
#covid img{
	width: 100%;
}
#bottomImg::before {
	content: "";
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
    background-image: url(../img/footerIMG.png);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
		position: absolute;
		z-index: -2;
}
#bottomImg img{
	width: 100%;
}

.btSaber{
	margin: 10px 0 0;
    display: inline-block;
}

.hideDesktop{
	display: none;
}

.logoTurismo{
	margin-top: 70px;
}

/*--------------------------------------
--------- SECTION AREA CSS END ---------
---------------------------------------*/

/*--------------------------------------
--------- FOOTER AREA CSS START --------
---------------------------------------*/
.footer {
	padding: 22px 0;
	font-size: 15px;
	color: #000;
    z-index: 1;
    position: relative;
}

.footer-color{
	color: #585d36;
}
.footer a{
	color: #000000;
	text-decoration: underline;
}
.footer-content{
	font-size: 12px;
}