/*
Theme Name: Theme Marianna Melo
Theme URI: 
Author: Geovani Assis Pereira
Author URI: https://geovaniassis.dev.br
Description: Tema oficial da Marianna Melo, iniciado em 19 de Fevereiro de 2026.
Created: 19 de Fevereiro de 2026
Requires at least: 6.4
Tested up to: 6.4
Requires PHP: 7.0
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

/***************************************************************************
       Cores
****************************************************************************

	Branco 			= #ffffff
	Preto 			= #2b2a2d
	Cinza Claro		= #f8f8f8
	Amarelo 		= #f3bd1c
	Amarelo Claro 	= #f5d472
	
/***************************************************************************
       Fonts
***************************************************************************/

@import url('https://fonts.googleapis.com/css2?family=Didact+Gothic&family=Exo:ital,wght@0,100..900;1,100..900&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

/***************************************************************************
       Variáveis
***************************************************************************/

:root {
	--cor-branco: #ffffff;
	--cor-preto: #2b2a2d;
	--cor-cinza-claro: #f8f8f8;
	--cor-amarelo: #f3bd1c;

	--fonte-didact: 'Didact Gothic', sans-serif;
	--fonte-exo: 'Exo', sans-serif;
	--fonte-lato: 'Lato', sans-serif;
}

@keyframes floatDireita {
  0%, 100% {
    transform: translateY(0) translateX(0);
  }
  25% {
    transform: translateY(-10px) translateX(5px);
  }
  50% {
    transform: translateY(5px) translateX(-5px);
  }
  75% {
    transform: translateY(-5px) translateX(10px);
  }
}
@keyframes floatEsquerda {
  0%, 100% {
    transform: translateY(0) translateX(0);
  }
  25% {
    transform: translateY(10px) translateX(-5px);
  }
  50% {
    transform: translateY(-5px) translateX(5px);
  }
  75% {
    transform: translateY(5px) translateX(-10px);
  }
}
@keyframes floatSobe {
  0%, 100% {
    transform: translateY(0) translateX(0) rotate(10deg);
  }
  25% {
    transform: translateY(10px) translateX(0px) rotate(10deg);
  }
  50% {
    transform: translateY(-5px) translateX(0px) rotate(10deg);
  }
  75% {
    transform: translateY(5px) translateX(0px) rotate(10deg);
  }
}
@keyframes faixaAmarela {
  0% {
    width: 2px;
    height: 2px;
  }
  36.66% {
    width: 2px;
    height: 2px;
  }
  83.33% {
    width: 100%;
    height: 2px;
  }
  100% {
    width: 100%;
    height: 100%;
  }
}

@keyframes pintarTexto {
  0% {
  	color: var(--cor-preto);
  }
  88%{
  	color: var(--cor-preto);
  }
  100% {
  	color: var(--cor-branco);
  }
}

.textoAnimado {
  animation: pintarTexto 4s forwards;
}

/***************************************************************************
        All
***************************************************************************/

html,
body {
	margin: 0;
	overflow-x: clip;
}

* {
	margin: 0;
	box-shadow: 0 0 0 0;
	border: 0 none;
	outline: 0;
	font-family: var(--fonte-lato);
	font-style: normal;
}

a {
	text-decoration: none !important;
	cursor: pointer;
}

button:focus {
	outline: none;
}


.transition_on *,
.transition_on {
	transition: ease .5s all !important;
}

.transition_off *,
.transition_off {
	transition: none !important;
}

.mrg-0 {margin: 0px;}
.mrg-top-30 {margin-top: 30px;}
.mrg-top-45 {margin-top: 45px;}
.mrg-top-50 {margin-top: 50px;}
.mrg-bot-30 {margin-bottom: 30px !important;}
.mrg-bot-40 {margin-bottom: 40px;}
.mrg-bot-50 {margin-bottom: 50px;}
.mrg-bot-60 {margin-bottom: 60px;}
.mrg-bot-70 {margin-bottom: 70px;}
.mrg-bot-75 {margin-bottom: 75px;}
.pdd-0 {padding: 0 !important;}
.pdd-15 {padding: 15px !important;}
.pdd-0-15 {padding: 0 15px !important;}
.pdd-50-0 {padding: 50px 0 !important;}
.pdd-80-0 {padding: 80px 0 !important;}
.pdd-25-0-0 {padding: 25px 0 0 !important;}
.pdd-0-15-0-0 {padding: 0 15px 0 0 !important;}
.pdd-lef-30 {padding-left: 30px !important;}
.pdd-lef-35 {padding-left: 35px !important;}
.pdd-lef-40 {padding-left: 40px !important;}
.pdd-lef-45 {padding-left: 45px !important;}
.pdd-lef-50 {padding-left: 50px !important;}
.pdd-lef-55 {padding-left: 55px !important;}
.pdd-lef-60 {padding-left: 60px !important;}
.pdd-lef-65 {padding-left: 65px !important;}
.pdd-lef-70 {padding-left: 70px !important;}
.pdd-lef-75 {padding-left: 75px !important;}
.pdd-lef-80 {padding-left: 80px !important;}
.pdd-lef-85 {padding-left: 85px !important;}
.pdd-lef-90 {padding-left: 90px !important;}
.pdd-lef-95 {padding-left: 95px !important;}
.pdd-lef-100 {padding-left: 100px !important;}
.pdd-lef-105 {padding-left: 105px !important;}
.pdd-lef-110 {padding-left: 110px !important;}
.pdd-lef-115 {padding-left: 115px !important;}
.pdd-lef-120 {padding-left: 120px !important;}
.pdd-lef-125 {padding-left: 125px !important;}
.pdd-lef-150 {padding-left: 150px !important;}
.pdd-bot-50 {padding-bottom: 50px !important;}
.pdd-bot-100 {padding-bottom: 100px !important;}
.txt-center {text-align: center !important;}
.txtWebCenter{text-align: -webkit-center !important;}
.txt-right {text-align: right !important;}
.nao-quebrar {white-space: nowrap;}
.align_self-center {align-self: center;}
.text_align_last-center {text-align-last: center;}
.align_items-center {align-items: center;}

.blc-left {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

.blc-center {
	display: flex;
	justify-content: center;
	align-items: center;
}

.blc-right {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.dpy-flex {display: flex;}
.dpy-flow-root {display: flow-root;}
.dpy-inline-block {display: inline-block;}
.flt-left {float: left;}
.flt-right {float: right;}

.btnPreto{
	color: var(--cor-preto);
    border: solid 2px;
    width: 250px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
	transition: ease .5s all;
}
.btnPreto:hover{
	color: var(--cor-preto);
    border: var(--cor-amarelo) solid 2px;
	transform: scale(1.1);
}

span.titulo{
	text-align: center;
	display: block;
	font-weight: 600;
}
h2.titulo{
	font-size: 45px;
	text-align: center;
	display: block;
	font-weight: 300;
}
h2.faixaBaixo::after{
    content: "";
    display: block;
    width: 220px;
    height: 2px;
    background: var(--cor-amarelo);
    margin: 10px auto;
    border-radius: 10px;
}
.linha{
	width: 2px;
	height: 200px;
	position: absolute;
	margin: -150px 0 0 50%;
	background: var(--cor-amarelo);
}

.a{
	text-decoration: none;
	
}

/***************************************************************************
	Menu
***************************************************************************/

	header{
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 99;
		box-shadow: 0 0 20px 0px #0000001a;
	}

	#menuPrimeiro{
		background-color: var(--cor-amarelo);
		padding: 5px 0;
	}
	#menuPrimeiro::before {
		transition: ease .5s all;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		height: 34px;
		content: "";
		background-color: var(--cor-amarelo);
		left: 60%;
		clip-path: polygon(2% 0%, 100% 0%, 100% 100%, 0 100%);
	}
	#menuPrimeiro .blcBranco img{
		width: 22px;
    	margin-right: 5px;
	}
	#menuPrimeiro .blcBranco a{
		color: var(--cor-preto);
		display: block;
	}
	#menuPrimeiro .blcBeje{
		display: flex;
    	justify-content: flex-end;
	}
	#menuPrimeiro .blcBeje.first{
    	justify-content: flex-start;
	}

	#menuPrimeiro .blcBeje li{
		display: block;
	}
	#menuPrimeiro .blcBeje a{
		color: var(--cor-preto);

	}
	#menuPrimeiro .blcBeje img{
		width: 18px;
		filter: brightness(0);
		transition: ease .5s all;
	    margin-right: 5px;
	}
	#menuPrimeiro .blcBeje img:hover{
		transform: scale(1.1);
	}

	#menuSegundo{
		background-color: var(--cor-branco);
		height: 100px;
		display: flex;
		align-items: center;
	}
	#menuSegundo .logomenu img{
		width: 260px;
		max-width: 100%;
		object-position: left;
		object-fit: cover;
	}
	#menuSegundo ul{
		padding: 0;
		margin: 0;
		display: flex;
		gap: 20px;
	    align-items: center;
	}
	#menuSegundo ul li{
		display: block;
	}
	#menuSegundo ul li a{
		color: var(--cor-preto);
		font-size: 20px;
		display: block;
		transition: all .5s all;
		font-family: var(--font-didact);
	}
	#menuSegundo ul li a:hover{
		transform: scale(1.1);
	}
	#menuSegundo ul li:last-child a {
		color: var(--cor-preto);
		border: solid 2px;
		width: 180px;
		height: 40px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 14px !important;
	}
	#menuSegundo ul li:last-child a:hover {
		color: var(--cor-preto);
		border: var(--cor-amarelo) solid 2px;
		transform: scale(1.1);
	}
	#menuSegundo ul li:last-child a img{
		width: 20px;
		margin-right: 8px;
	}





	#menuSegundo .submenu ul{
		position: absolute;
		width: 250px;
		background: var(--cor-amarelo);
		border-radius: 0px 10px 10px 10px;
		margin-top: -3px;
		opacity: 0;
		display: none;
		transition: all .5s all;
	}
	#menuSegundo .submenu:hover ul{
		opacity: 1;
		display: block;
	}
	#menuSegundo .submenu ul li{
		width: 100%;
	}
	#menuSegundo .submenu ul li a{
		color: var(--cor-branco);
		padding: 10px 20px 10px;
		width: 100%;
		display: block;
	}
	#menuSegundo .submenu ul li a:hover{
		transform: scale(1.07);
	}

	#menuSegundo .blc-right	{
		display: flex;
		justify-content: flex-end;
	}

	#espaco{
		height: 100px;
	}

	.drop #menuPrimeiro,
	.drop #menuPrimeiro::before{
		margin-top: -36px;
	}
	.drop #menuSegundo{
		height: 75px;
	}
	.drop #menuSegundo .logomenu img {
		width: 40px;
		height: 32px;
	}

	.drop #menuSegundo ul li a{
		font-size: 18px;
	}

/***************************************************************************
        Banner
***************************************************************************/

	#bannerPrincipal{
		background: var(--cor-cinza-claro);
		width: 100vw;
		height: calc( 100vh - 100px);
		display: flex;
	    align-items: center;
	}
	#bannerPrincipal .faixaAmarela::before{
		content: "";
		position: absolute;
		left: 0;
		bottom: 0;
		height: 2px;
		width: 2px;	
		background-color: var(--cor-amarelo);
		z-index: -1;
		animation: faixaAmarela 4s ease-in-out forwards;
	}

	#bannerPrincipal .areaBloc{
		display: flex;
	    flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		gap: 40px;
		padding: 20px;
	}

	#bannerPrincipal .titulo{
		display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
		gap: 10px;
		max-width: 800px;
		margin: 0 auto;
		line-height: 50px;
		margin-bottom: 10px;
	}
	
/***************************************************************************
        Banner Interno
***************************************************************************/

	#bannerInterno{
		background: var(--cor-cinza-claro);
		width: 100vw;
		height: calc( 350px - 100px);
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	#bannerInterno .titulo{
		display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
		gap: 10px;
	}

	.linha.interno{
		height: 60px;
		margin: -40px 0 0 50%;
	}

	#postTodos .blog img{
		width: 100%;
		height: 500px;
		object-fit: cover;
	}
	#postTodos .blog img.capa{
	    object-fit: scale-down;
	}
	#postTodos.portfolio .texto img{
		object-fit: scale-down;
		margin: 0;
		height: auto;
	}

	#postTodos .textosPost{
		display: flex;
		align-items: flex-start;
	}
	#postTodos .textosPost .data{
		width: 100px;
		height: 100px;
		background: #f8f8f8;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	    font-family: var(--fonte-exo);
		font-size: 26px;
	    line-height: 25px;
		margin-right: 30px;
	    text-transform: capitalize;
	}
	#postTodos .texto{
		width: calc(100% - 130px);
	}
	#postTodos h3{
	    font-family: var(--fonte-didact);
	    margin-bottom: 15px;
		border-bottom: 2px solid var(--cor-amarelo);
		width: max-content;
		padding-right: 40px;
		margin-top: 50px;
	}
	#postTodos h4{
		margin-top: 30px;
	}
	#postTodos .blog .seta{
		display: block;
		width: 57px;
	}
	#postTodos .blog p{
		font-size: 18px;
	}
	#postTodos .seta em {
		color: var(--cor-amarelo);
		font-size: 23px;
		border: solid 1px;
		width: 57px;
		height: 57px;
		font-weight: 100;
		opacity: 1;
		transition: ease .5s all;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-bottom: 50px;
	}
	#postTodos .seta:hover em{
		width: 117px;	
	}
	#postTodos .tituloLateral h2{
		color: var(--cor-preto);
		font-size: 22px;
		border-bottom: solid 2px var(--cor-amarelo);
	}
	#postTodos .tituloLateral ul{
		margin-bottom: 40px;
	}
	#postTodos .tituloLateral p,
	#postTodos .tituloLateral li a{
		font-family: var(--fonte-didact);
		margin-bottom: 15px;
		padding-left: 0px;
		color: var(--cor-preto);
		transition: ease .5s all;
		display: block;
	}
	#postTodos .tituloLateral p:hover,
	#postTodos .tituloLateral li:hover a{
		padding-left: 20px;
	}

	.spanCategoria{
		margin: 0 0 13px;
		display: block;
	}
	.spanCategoria a{
		font-family: var(--fonte-didact);
		margin-bottom: 15px;
		color: var(--cor-preto);
		transition: ease .5s all;
	    display: inline !important;
	}

	#postTodos .atencao{
		padding: 30px;
		background-color: #FDDEDE;
	}


/***************************************************************************
        Portfolio na Home
***************************************************************************/

	#portfolioHome{
		padding: 75px 0;
		background-color: #f1f1f1;
	}
	#portfolioHome .areaPortfolio{
		margin-bottom: 30px;
	}
	#portfolioHome .areaPortfolio img{
		width: 100%;
		height: 600px;
		object-fit: cover;
	}
	#portfolioHome .areaPortfolio.curto img{
		height: 285px;
	}
	#portfolioHome .areaPortfolio .areaTexto{
		background: #ffffffc2;
		position: absolute;
		bottom: 30px;
		width: calc(100% - 30px);
		padding: 15px;
		opacity: 0;
		transition: ease .5s all;
		color: var(--cor-preto)
	}
	#portfolioHome .areaPortfolio:hover .areaTexto{
		opacity: 1;
	}

/***************************************************************************
        Frase e Foto
***************************************************************************/

	#quemsou{
		padding: 75px 0;
		background-color: var(--cor-branco);
	}
	#quemsou img{
		max-width: 460px;
		width: 100%;
	}
	#quemsou .areaImg{
		text-align: center;
	}
	#quemsou .areaImg::after{
		content: "";
		position: absolute;
		top: -30px;
		right: 0;
		width: 30px;
		height: 60px;
		background-color: var(--cor-amarelo);
	    animation: floatEsquerda 17s infinite ease-in-out;
	}
	
	#quemsou p{
		font-size: 25px;
		height: 100%;
		margin: 0 0 0 0;
		padding: 30px 0;
		align-content: center;
		min-height: 400px;
	}
/***************************************************************************
        Numero
***************************************************************************/
	#number{
		background: var(--cor-preto);
	}
	#number .col-lg-3{
		padding: 75px 0;
		text-align: center;
		border: solid 1px #f8f8f80a;
		display: flex;
		align-items: center;
		flex-direction: column;
		height: 500px;
	}
	#number h2{
		color: var(--cor-branco);
		font-size: 30px;
		transition: ease 1s all;
	    margin-bottom: 50px;
	}
	#number .col-lg-3:hover h2{
		color: var(--cor-amarelo);

	}
	#number h2::after{
		content: "";
		display: block;
		width: 40px;
		height: 2px;
		background: var(--cor-amarelo);
		margin: 10px auto;
		border-radius: 10px;
		transition: ease .5s all;
	}
	#number .col-lg-3:hover h2::after{
		width: 80px;
	}
	#number p{
		color: #ffffffa3;
		max-width: 280px;
		width: 100%;
		margin: 0;
		transition: ease .5s all;
		opacity: 1;
		height: auto;
		padding-bottom: 20px;
		min-height: 92px;
	}
	#number .areaImagem{
		padding: 50px;
		border-radius: 100%;
		border: solid 1px #f8f8f80a;
	    display: inline-block;
		transition: ease 1s all;
	    margin-top: 0px;
	}
	#number .col-lg-3:hover .areaImagem{
		border: solid 1px var(--cor-amarelo);
	    margin-top: 10px;
	}
	#number img{
		width: 40px;
		height: 40px;
	}

/***************************************************************************
        Blog na Home
***************************************************************************/
	#blogHome{
		padding: 75px 0;
		background-color: var(--cor-branco);
	}
	#blogHome .blogArea {
		display: block;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
	}
	#blogHome .blogArea .areaPost{
		background-color: #ffffff;
		transition: ease .5s all;
	}
	#blogHome .blogArea:hover .areaPost{
		background-color: #00000087;
	}
	#blogHome .blogArea:hover span{
		color: #ffffff;	
	}

	#blogHome h2{
		padding: 0 0 45px 0;
		margin: 0;
		font-weight: 300;
	}
	#blogHome .blogArea h2{
		padding: 45px 0;
	}
	#blogHome .blogArea .container,
	#blogHome .blogArea .container .row{
		min-height: 160px;
	}
	#blogHome .blogArea .row{
	    align-items: center;
	}
	#blogHome .blogArea span{
		font-weight: 900;
		color: #2b2a2d8c;
	    text-transform: capitalize;
		transition: ease .5s all;
	}
	#blogHome .blogArea h2{
		font-weight: 700;
		color: var(--cor-preto);
		transition: ease .5s all;
		font-size: 28px;
	}
	#blogHome .blogArea:hover h2{
		color: var(--cor-branco);
	}
	#blogHome .blogArea .txt-center{
	    justify-items: center;
	}
	#blogHome .blogArea .txt-center em{
		color: var(--cor-branco);
		transition: ease .5s all;
		font-size: 23px;
		border: solid 1px;
		width: 57px;
		height: 57px;
		display: block;
		font-weight: 100;
		align-content: center;
		opacity: 0;
		transition: ease .5s all;
	}
	#blogHome .blogArea:hover .txt-center em{
		opacity: 1;
        filter: drop-shadow(0px 0px 4px #000);
	}

/***************************************************************************
        Blog Interno
***************************************************************************/

	#postTodos{
		padding: 75px 0px;
	}



/***************************************************************************
        Pop-up
***************************************************************************/

	#popup{
		background: #00000066;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 99;
		display: none;
		align-content: center;
	    place-items: anchor-center;
	}
	#popup .bloco{
		width: 1500px;
		height: 100%;
		max-height: 700px;
		max-width: 100%;
		padding: 30px;
		background: var(--cor-branco);
		border-radius: 10px;
		box-shadow: 0 0 15px #0000003d;
		overflow: auto;
	}
	#popup .bloco .close{
		color: var(--cor-verde-escuro);
		position: absolute;
		font-family: 'Exo';
		font-size: 19px;
		cursor: pointer;
		justify-self: right;
	}
	#popup .bloco .tituloAzul {
    	font-weight: 600;
		margin: 0px;
		text-align: center;
	}
	#popup .bloco span{ 
		font-family: var(--fonte-didact);
		font-size: 16px;
		color: #000;
		font-weight: 500;
		margin-bottom: 50px;
	}
	#popup .bloco p,
	#popup .bloco li{
		text-align: left;
		font-size: 20px;
		line-height: 20px;
		width: 100%;
		font-weight: 600;
		font-family: var(--fonte-didact);
		margin-bottom: 15px;
	}
	#popup .bloco .areaBtn{
		width: 100%;
		display: flex;
		justify-content: center;
		gap: 45px;
	}
	#popup .bloco .btnAzul:hover{
		background: var(--cor-azul);
		color: var(--cor-branco);
		transform: scale(1.1);
	}
	#popup .bloco.area2{
		display: none;
	}

/***************************************************************************
	Formulario de mensagem
***************************************************************************/

	#contato{
		padding: 75px 0;
		background-color: var(--cor-preto);
	}
	#contato img{
		width: 100%;
		max-width: 255px;
	}
	#contato .redesSociais{
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		gap: 20px;
		margin: 20px 0;
	}
	#contato .redesSociais li{
		border: solid 1px #f8f8f80a;
		border-radius: 100px;
		width: 40px;
		height: 40px;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: ease .5s all;
		cursor: pointer;
	}
	#contato .redesSociais img{
		width: 20px;
	    margin: -4px 0 0 0;
	    filter: grayscale(1) invert(0.2);
		transition: ease .5s all;
	}
	#contato .redesSociais li:hover{
		border: solid 1px var(--cor-amarelo);
		transform: scale(1.1);
	}
	#contato .redesSociais li:hover img{
	    filter: none;
		transform: scale(1.1);
	}
	#contato .txtFooter{
		color: #f8f8f89c;
	    text-align: left;
		margin-bottom: 4px;
	}
	#contato .txtFooter a{
		color: var(--cor-branco);
		text-decoration: underline !important;
		transition: ease .5s all;
	}
	#contato .txtFooter a:hover{
		color: var(--cor-amarelo);
	}
	#formContato h2{
		color: var(--cor-branco);
		text-align: center;
	}
	#formContato .input{
		width: 100%;
		background: transparent;
		border-bottom: solid 1px var(--cor-amarelo);
		padding-left: 120px;
		color: var(--cor-branco);
	}
	#formContato textarea{
		width: 100%;
		background: transparent;
		border-bottom: solid 1px var(--cor-amarelo);
		padding-left: 120px;
		color: var(--cor-branco);
		resize: none;
	    height: 110px;
	}
	#formContato .btnPreto{
		width: 100%;
		margin-top: 30px;
		color: #fff;
		border-color: #f8f8f854;
		transition: ease .5s all;
	    background: #ffffff00;
	}
	#formContato .btnPreto:hover{
		border-color: var(--cor-amarelo);
	}
	#formContato .label{
		color: #f8f8f89c;
		margin: 30px 0 -23px;
		display: block;
	}
	.wpcf7 form .wpcf7-response-output{
		color: #fff;
	}
/***************************************************************************
	footer
***************************************************************************/

	.whatsapp img {
		position: fixed;
		z-index: 8;
		bottom: 86px;
		left: 8px;
		width: 50px;
		height: 50px;
		opacity: 0.7;
		transition: ease 0.8s all;
	}

	.whatsapp a:hover img {
		opacity: 1;
		filter: drop-shadow(0px 0px 6px black);
	}

	footer{
		min-height: 75px;
		display: flex;
		align-items: center;
		background: var(--cor-branco);
		border-top: solid #A1A3A6 4px;
	}

	footer #logo{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 20px;
		flex-wrap: wrap;
	}
	footer #logo img{
		width: 120px;
	}
	footer #logo p{
		margin: 0px;
		font-size: 12px;
		line-height: 16.7px;
		color: var(--cor-preto);
		font-weight: 600;
	}

	footer #links{
		display: flex;
		align-items: center;
		justify-content: flex-end;
		gap: 20px;
		flex-wrap: wrap;
	}
	footer #links a{
		display: block;
		margin: 0px;
		font-size: 12px;
		line-height: 16.7px;
		color: var(--cor-preto);
		font-weight: 600;
	}

/***************************************************************************
	SEO
***************************************************************************/
.cky-btn-revisit-wrapper{
	background-color: var(--cor-amarelo) !important;
	background: var(--cor-amarelo) !important;
    border: solid #fff 1px;
}
.cky-notice-btn-wrapper .cky-btn,
.cky-prefrence-btn-wrapper .cky-btn{
	color: var(--cor-amarelo) !important;
    background-color: transparent;
    border-color: var(--cor-amarelo) !important;
}
.cky-btn:last-child{
	background-color: var(--cor-amarelo) !important;
	border-color: var(--cor-amarelo) !important;
	color: var(--cor-branco) !important;
}

/***************************************************************************
	Responsivo
***************************************************************************/

@media (max-width: 1250px) {
}

@media (max-width: 1200px) {
	#menuSegundo ul li a {
	    font-size: 16px;
	}

}

@media (min-width: 992px) {
	.mobile {
		display: none !important;
	}
}

@media (max-width: 991px) {
	.mobile {
		display: block;
	}
	.desktop {
		display: none !important;
	}
	


	#menuPrimeiro::before{
		left: 50%;
	}

	#menuPrimeiro,
	#menuPrimeiro::before{
		display: none !important;
	}
	#menuSegundo {
    	height: 75px !important;
	}

	header #menuSegundo .hamburguer-bt {
		display: inline-block;
		height: fit-content;
		min-height: 32px;
		margin: 27px 15px;
		float: right;
	}

	header #menuSegundo .hamburguer-bt .hamburguer_line {
		background: var(--cor-amarelo);
		width: 30px;
		height: 4px;
		margin: 5px 0;
	}

	header #menuSegundo .hamburguer-bt.ativo .hamburguer-top {
		transform: rotate(45deg);
		margin-top: 11px;
	}

	header #menuSegundo .hamburguer-bt.ativo .hamburguer-middle {
		opacity: 0;
	}

	header #menuSegundo .hamburguer-bt.ativo .hamburguer-bottom {
		transform: rotate(-45deg);
		margin-top: -18px;
	}

	header #opt_menu {
		position: fixed;
		height: calc(100% - 60px);
		width: 320px;
		background: var(--cor-branco);
		z-index: 99;
		right: -150%;
		top: 60px;
		padding: 10px;
		display: block;
		overflow: auto;
	}

	header #opt_menu .navbar-nav li a {
		color: var(--cor-preto);
		font-size: 20px;
		font-weight: 500;
		transition: ease .5s all;
	}

	header #opt_menu .navbar-nav li a:hover {
		color: var(--cor-branco);
	}

	header #opt_menu .area-btn a {
		margin: 0 auto;
	}

	header #opt_menu.ativo {
		right: 0;
	}

	header .fundo_menu {
		background: #00000096;
		width: 100%;
		height: 100%;
		top: 75px;
		right: -100%;
		position: fixed;
		z-index: 89;
	}

	header .fundo_menu.ativo {
		right: 0;
	}

	header #opt_menu .navbar-brand {
		width: 100%;
		margin: 0;
		text-align: -webkit-center;
	}

	header #opt_menu .nav-item {
		text-align: center;
		padding: 10px;
		text-transform: uppercase;
	}

	header.drop #opt_menu,
	header.drop .fundo_menu {
		top: 75px;
	}

	header .blc-center {
		min-height: 98px;
		justify-content: space-around;
	}

	header .ona-menu img {
		width: 105px;
	}

	#menuSegundo {
		display: flex;
		z-index: 100;
	}

	#opt_menu ul {
		display: contents;
	}

	#opt_menu form {
		text-align: center;
	}

	#opt_menu form input {
		border: solid 1px var(--cor-preto);
		margin: 15px 0;
	}
	#espaco {
    height: 75px;
	}
	#menuSegundo{
		background: #ffffff;
	}
	#menuSegundo .blc-right {
    justify-content: flex-end;
	}

	#opt_menu li {
		display: block;
	}
	#opt_menu li a{
		margin: 0 0 10px 0;
		padding: 20px;
		min-height: 39px;
		display: flex;
		align-items: center;
		font-family: var(--font-didact);
	    justify-content: center;
		color: var(--cor-preto);
		text-transform: uppercase;
		font-size: 14px;
		font-weight: 600;
		margin: 0 10px;
	    filter: brightness(0);
	}
	#opt_menu li.baixar a{
		color: var(--cor-preto);
		border: solid 2px;
		width: 230px;
		height: 30px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 14px;
		margin: 20px auto;
	}
	#opt_menu li.logo{
		text-align: center;
		padding: 30px 30px 0 30px;
		position: absolute;
		bottom: 0;
		width: 100%;
		padding-bottom: 101px;
		background-color: var(--cor-branco);
	}
	#opt_menu li.logo img{
		width: 100px;
	}
	#opt_menu li.social{
		display: flex;
		align-items: center;
		justify-content: center;
	    gap: 25px;
		position: absolute;
		bottom: 0;
		width: 100%;
		padding-bottom: 40px;
		background-color: var(--cor-branco);
	}
	#opt_menu li.social a,
	#opt_menu li.social img{
		padding: 0;
		margin: 0;
	}









	#opt_menu .submenu ul a{
		margin-top: -10px;
		margin-left: 20px;
	}
	#opt_menu li a img{
		width: 25px;
    	margin-right: 10px;
	}
	
	footer #logo,
	footer #links{
		margin: 20px 0;
    	justify-content: center;
	}

	#owlDepoimentos .center{
		transform: scale(1.0);
	}
	#portfolioHome .areaPortfolio img{
	    height: 285px;
	}
	#blogHome .blogArea{
		margin: 30px 0;
	}
	#blogHome .blogArea h2{
		padding: 0px;
	}
	#blogHome .blogArea .txt-center {
		justify-items: end;
	}
	#blogHome .blogArea .txt-center em{
		color: var(--cor-preto);
		transition: ease .5s all;
		font-size: 23px;
		border: solid 1px;
		width: 57px;
		height: 57px;
		display: block;
		font-weight: 100;
		align-content: center;
		opacity: 1;
		transition: ease .5s all;
	}

	#portfolioHome .areaPortfolio .areaTexto{
		opacity: 1;
	}
	#formContato{
		height: 100vh;
		align-content: center;
        padding: 50px 015px;
	}
	#postTodos .textosPost {
    	flex-direction: column;
		margin-top: -30px;
	}
	#postTodos .textosPost .data{
		margin: 0 0 30px;
		width: 100%;
	}
	#postTodos .texto {
		width: 100%;
	}
	#contato .redesSociais img {
	    width: 25px;
	}
	#contato .redesSociais li {
    	width: 60px;
		height: 60px;
	}
	#menuSegundo .logomenu img{
        object-position: right !important;
        max-width: 150px !important;
        width: 150px !important;
        height: 50px !important;
	}
	#bannerPrincipal .areaBloc{
		gap: 24px;
		padding-top: 40px;
	}
	.spanCategoria{
	    margin: 0 0 32px;
	}
	#bannerInterno{
	    height: calc(250px - 100px);
	}
	.linha.interno {
		height: 40px;
		margin: -20px 0 0 50%;
	}
	#postTodos .tituloLateral h2{
	    margin-bottom: 16px;
	}

}

@media (max-width: 767px) {
	h2.titulo{
		font-size: 27px;
	}
	#bannerPrincipal .titulo {
    	line-height: 26px;
	}
	.btnPreto{
		width: 200px;
		font-size: 13px;
		border: solid 1px;
	}
	.linha {
		width: 2px;
		height: 70px;
		position: absolute;
		margin: -35px 0 0 50%;
		background: var(--cor-amarelo);
	}
	#postTodos .blog .informativos p {
		font-size: 16px;
		margin: 0;
	}
}

@media (max-width: 575px) {
	#postTodos .blog img.capaBlog{
		margin-left: -15px;
		width: calc(100% + 30px);
	}
	#postTodos .textosPost .data{
		margin: 0 0 30px -15px;
		width: calc(100% + 30px);
	}
	#postTodos .blog .texto{
	    padding: 24px;
	}
	#postTodos .blog{
		margin: 0 0 0 -15px;
		width: calc(100% + 30px);
	}
}

@media (max-width: 444px) {

}
