﻿@charset "utf-8";

/* CSS DOCUMENT */

*{
      margin: 0;
      padding: 0;
      box-sizing: border-box;
}

body, html{
      background-image: linear-gradient(#00AFEF, #ABE9FF, #ABE9FF, #ABE9FF,  #00AFEF);
      font-family: Arial, Helvetica, sans-serif;
      }

p{
      font-size: 16px;
      line-height: 20px;
      margin-bottom:14px;

}


.indentado{
      text-indent: 100px;
}

.opaco{
      opacity: 0;
}


h1{
      font-size: 16px;
	text-align:left;
	/*text-indent: 10px;*/	
	color:#004080;
	border-top: 1px solid gray;
	border-bottom: 1px solid gray;
      margin: 16px 0px 16px 0px;

}

h2{
      font-size: 14px;
	text-align:left;
	/*text-indent: 10px;*/	
	/* color:#004080; */
	/* border-top: 1px solid gray; */
	/* border-bottom: 1px solid gray; */
      margin: 16px 0px 16px 0px;

}

h3{
      font-size: 16px;
	text-align:left;

}

h4{
      font-size: 16px;
	text-align:left;

}

h5{
      font-size: 16px;
	text-align:left;
      line-height:28px;

}

h6{
      font-size: 14px;
	text-align:left;

}

img{
	max-width:100%;
	height:auto;
}


.imagemcomsombra{
	box-shadow:2px 2px 4px black;
	border:4px solid white;
	/*background-color:#275d8c;*/
	transition:background-color 1s;	
}


header{
      width: 100vw;
      /* height: 10vh; */
      padding: 1%;
      /* border: 1px solid black; */
      background-image: linear-gradient(#00AFEF, #ABE9FF, #00AFEF);
      position:fixed;
      z-index:3;
      /* display: flex; */
      /* justify-content: space-around; */
                  
                  

}

header img{
      display: block;
      margin: auto;


}

header section#logotipo-topo{
}

header section#texto-cabecalho{
      display: none;
	
}

header section#texto-cabecalho p{
	font-size:24px;
	font-weight:bold;
	color: #F0F0F0;
	text-align: center;
	margin:0px auto 3px auto;
	text-shadow: 0.5px 0.5px 0.5px black;
}

header section#telefone-cabecalho{
      display: none;
	height: 60px;
	background-image: url(../00-img-site/03-icones-whatsup.png);
	background-repeat: no-repeat;
	background-position: center center;	
}

header section#telefone-cabecalho p{
	font-size: 30px;
	line-height:60px;
	font-weight: bolder;
	text-align: center;
	margin: 0px auto 3px auto;
	color:yellow;
	text-shadow: 1px 1px 1px black;
	/*vertical-align: middle;*/
}

header section#bandeiras{
      display: none;
}

header section#bandeiras ul{
	list-style-type:none;
	display:block;
	margin: 0;
	padding: 0;
}

header section#bandeiras ul li{
	display:block;
}

header section#bandeiras ul li a{
	display:block;
	text-decoration:none;
}

header section#bandeiras ul li a:hover{
	display: block;
	/*color: #FF0;*/
	transition-duration: 0.5s;
	opacity: 0.5;
}


nav{
                  
      width: 100vw;
      /* height: 7vh; */
      margin: 10vh 0 0 0 ;
      /* margin:auto 0 0 0 ; */     
      background-image: linear-gradient(#00AFEF, #ABE9FF, #00AFEF);
      position:fixed;
      z-index:4;
                  

}

nav > img{
      display: block;
      margin: auto;
}


nav > ul {
      list-style-type: none;
      display: none;
      
      
}

nav > ul > li > a {
      display: block;
      padding: 10px;
      font-weight:bold;  
      text-decoration: none;
      text-align: center;
      color: black;
      /* background-color: rgb(85, 84, 84); */
      /* background-image: linear-gradient(#848688, white,#848688); */
      background-image: linear-gradient(#00AFEF, #ABE9FF, #00AFEF);
      border-top: 1px solid black;
      border-bottom: 1px solid black;
      /* transition-duration: 0.5s;      */
            

}

nav > ul > li > a:hover { 
      color: white;           
      background-color: rgb(76, 99, 146);
      transform:scale(1.1);
      transition-duration: 0.5s;         

}   




main{
      width: 90vw;
      margin: auto;
      /* padding: 17vh 2% 0 2%; */
      padding: 17vh 2% 0 2%;     
      background-color: #00AFEF;
      display: grid;
      grid-template-areas:
      "anuncio-topo anuncio-topo anuncio-topo anuncio-topo anuncio-topo"
      "texto texto texto texto texto"
      "anuncio-pe anuncio-pe anuncio-pe anuncio-pe anuncio-pe"
      "footer footer footer footer footer";
      grid-template-rows:15vh auto 15vh auto;
      /* grid-template-rows:auto auto auto auto;  */
      gap:.5%;
      /* com o gap - as alturas das caixas dos anúncios se estabilizaram em todas as telas */
 

}


/*AREA ANUNCIO TOPO*/

section#anuncio-topo{
      /* margin: 0px 0px 2% 0px; */
      border-radius:5px 5px 0px 0px ;
	box-shadow:1px 1px 2px black;
      background-color: yellow;
      grid-area: anuncio-topo;
      display: flex;                  
      justify-content:center;
      align-items:center;      
      border-radius:5px 5px 0px 0px ;
	box-shadow:1px 1px 2px black;


}

/*ANIMACAO ANUNCIO TOPO e PE*/


img.slide-imagem{
      position: absolute;
      opacity: 0;
      animation-name: animacao-slide;
      animation-iteration-count: infinite;
      animation-duration: 15s;

      }

      @keyframes animacao-slide{
            25% {
      opacity: 1;
      }

            75% {
      opacity: 0;
      }

      }

      img.slide-imagem:nth-child(0){
      animation-delay: 0s;
      }

      img.slide-imagem:nth-child(1){
      animation-delay: 5s;
      }

      /*ANIMACAO ANUNCIO TOPO e PE*/


/*AREA TEXTO*/


section#texto{
      /* width: 100%; */
      background-color:rgba(255, 255, 255, 0.8);
	/* margin: 0 0 0 0; */
	padding:2%;
	border-radius:5px 5px 0px 0px ;
	box-shadow:1px 1px 2px black;
      grid-area: texto;

                  
}



/*AREA ASIDE*/
/* DESLIGADO PARA DISPOSITOS MOVEIS */

aside{
      display: none;
      border-radius:5px 5px 0px 0px ;
	box-shadow:1px 1px 2px black;
      background-color:rgba(255, 255, 255, 0.8);
      grid-area: aside;


}

/*AREA ANUNCIO PE*/

section#anuncio-pe{
      background-color: yellow;
      /* margin: 2% 0px 2% 0px; */
      border-radius:5px 5px 0px 0px ;
      box-shadow:1px 1px 2px black;
      grid-area: anuncio-pe;
      display: flex;
      justify-content: center;
      align-items: center;

}


/*AREA FOOTER*/

footer{
      
      /* margin: 0 0 0 0; */
      padding:2%;  
      background-color:#99CCFF;
      border-radius:5px 5px 0px 0px ;
      box-shadow:1px 1px 2px black;
      grid-area: footer;

}

section#razao-social{
      background-color: transparent;
      box-shadow: none;
      background-color:rgba(255, 255, 255, 0.2);
      margin: 1% 0 1% 0;
      padding:2%;      
      text-align: center;

}

section#razao-social > p{
      font-size: 14px;
      line-height: 20px;
      margin-bottom:14px;
}

section#telefones-pe{
      
      background-color: transparent;
      box-shadow: none;
      background-color:rgba(255, 255, 255, 0.2);
      margin: 1% 0 1% 0;
      padding:2%;
}

section#telefones-pe ul{
	list-style-type:none;
	height:auto;
	display:flex;
	/* flex-direction:row; */
	/*flex-wrap:wrap;*/
	flex-direction:column;
	/* justify-content:space-around; */
	/* align-items:center; */
}

section#telefones-pe ul li{
	/* font-size: 14px; */
	font-weight: bold;
	line-height: 60px;
	text-align: center;
	vertical-align: middle;	
}

section#telefones-pe ul li img{
	vertical-align: middle;
	margin:auto 5px 4px auto;
	box-shadow: 2px 2px 2px black;
	border-radius: 50px;
}

section#telefones-pe > p{
      font-size: 14px;
      line-height: 20px;
      margin-bottom:14px;
}


section#midias-sociais{

      background-color: transparent;
      box-shadow: none;
      background-color:rgba(255, 255, 255, 0.2);
      margin: 1% 0 1% 0;
      padding:2%; 

}


section#midias-sociais ul{	
	list-style-type:none;
	display:flex;
	/*flex-direction:row;*/
	/*flex-wrap:wrap;*/
	flex-direction:column;
	/* justify-content:space-around; */
	align-items:center;
}

section#midias-sociais ul li{
	width:43px;
	height:43px;
	margin:10px;
	box-shadow: 2px 2px 2px black;
	border-radius:50px; 
}

section#midias-sociais ul li a:hover{
	opacity: 0.5;
}

section#credito{

      background-color: transparent;
      box-shadow: none;
      background-color:rgba(255, 255, 255, 0.2);
      margin: 1% 0 1% 0;
      padding:2%;
      text-align: center;

}

section#credito > p{
      font-size: 14px;
      line-height: 20px;
      margin-bottom:14px;
}

