
* {
    text-align: center;
    
    scroll-behavior: smooth;
    
    }
    
    body{
        
      
        width: 100%;  
        color: #000;
        font-family: 'Roboto Slab', serif!important;
        font-size: 30px;
        
    }
    @media (min-width:768px) {
       body{
        width: 100%; 
       }
        
    }
    
.voltar-topo{position: fixed;width: 30px;height: 30px;bottom: 20px;right: 20px;background-color: #0000008c;border-radius: 50%;font-size: 1.9em;font-weight: bold;color: #fff!important;}
.voltar-topo::before{
	content:'^';
	position: fixed;
	right: 28px;
	bottom: 7px;
	transition:400ms all;
	}

.navbar {
	margin: 0 auto;
    border-radius: 0;
	
}
.nav a{
	color: #000;
}
.navbar-brand img{
	height: 40px;
	margin-top: -5px;
	margin-right: 50px;
}

.nav>li>a:focus, .nav>li>a:hover {
    text-decoration: none;
    background-color: hsl(77 47% 63% / 1);
}
.sobre{
    
    
    padding: 0;
}
.sobre img{
    
    width: 100%;
}

@media (max-width: 768px) {
    .sobre{
        width: 100%;
        
        padding: 0;
    }


}

section p{
    width:80%;
    margin:0 auto;
    
}
@media (max-width: 768px) {
	.mobile{
		
		display:flex !important;
	}
}
.container{

    justify-content: center ;
}
    #card-menu {
        
        background-color:#202225;
        margin: 0;
		color: #fff;
        

    }
    #card-menu img {
        width: 100%;
		transition: 400ms all;
		opacity: 1;
    }
    #card-menu img:hover {
        opacity: 0.6;
    }
    .linhaHorizontal{
        width: 100%;
    }

/*Icones aumentam ao serem clicados */	
.zoom {
transition: 400ms all;
}

.zoom:hover {
  transform: scale(1.2); /* (150% zoom)*/
}
/*Fim de Icones aumentam ao serem clicados */	

.menu { /*antigo .saiba */
    color: #673074  ;
	margin: 20px;
	margin-top:40px;
}

 #card-menu h3{
		color: #fff;
    }
    #card-menu .block-title {
        color: #fff;
    
    }
    .galeria{
        padding-left: 7%;
        padding-right: 7%;
    }
    .galeria h3{
        padding-right: 70%;
        padding-bottom: 5%;
        font-size: 60px;
        padding-top: 3%;
        text-align: center;
        margin: 0;
        color: #c57d10;
        font-family: 'Montserrat', sans-serif;
}
.galeria img{
    
	max-width: 88%;
    height: auto;
	border-radius: 5px;
    padding-bottom: 7px;
}
.galeria p{
    font-size: 20px;
    font-family: 'Montserrat', sans-serif;
    color: #204350;
    padding-bottom: 10%;
}
#graffiteiras img{
    background-color: rgb(82, 82, 238); 
}
#estudio img{
    background-color: rgb(255, 127, 127);
}
#alcateia img{
    background-color: rgb(245, 245, 110);
}
#graffiti img{
    background-color: rgb(248, 171, 27);
}

.botao-edital{
    
    padding-top: 5%;
    padding-bottom: 10%;
}
.botao-edital  img{
    
    width: 20%;
    cursor: pointer;
    
}

    div {
        text-align: center;
    
    }
  
/*espaÃ§amento icone de 'ganhei um lar' */	
	.icone_lar{
		padding-bottom: 20px;
	}
@media (max-width: 768px) {
	.icone_lar img {
		max-width: 255px;
	}}


/*Fim de espaÃ§amento icone de 'ganhei um lar' */
    
   

@media (min-width: 768px) {

.carousel-multi-item-2 .col-md-3 {
float: left;
width: 25%;
max-width: 100%; } 
}

.carousel-multi-item-2 .card img {
border-radius: 2px; }
    
    #mitos-verdades img {
        max-width: 100%;
        text-align: center;
        min-height: 220px;
        background-clip: content-box;
        object-fit: cover;
    }



/*Fim de definicao da secao 'ganhei um lar' */   
    #verde h2{
        color: #673074 ;
    }


#trat{
	padding:10px;
}
    
    #alinhar h4{
        text-align: center;
    }
    h3 {
        margin: 0 0 10px;
        
        color: #673074 ;
        
    }
    
    .background {
       background-color:#673074 ; 
    }
    
    .imagem-carrossel {
        object-fit: cover;
        height: 90%;
    }
 @media (max-width:780px)   {
 	.imagem-carrossel{
         width: 100%;
 		height: 100%;
 		margin-left:-5px;
 	}
 }
    .fonte-texto {
        font-family: 'McLaren', cursive;
        font-weight: 400;
        font-style: normal;
        color: black;
    }
    
    .card-text{
        font-family: "Trebuchet MS", Verdana, Lucida Sans;
    }

    
    .card-text a{
        color:#000;
    }
    
    .fonte-titulo-card {
        font-family: 'McLaren', cursive;
        font-size: 20px;
        color: black;
    }
    
    .fonte-texto-card-footer {
        font-family: 'McLaren', cursive;
        font-size: 15px;
    }
    .imagem-card {
        object-fit: cover;
        height: 286px;
    }
    
    .borda-card {
        border-color: #d2f9d7;
    }
    
    #footer-redes {
        font-size: 2em;
    }
    
    @media (min-width: 768px) {
        /* show 3 items */
        .carousel-inner .active,
        .carousel-inner .active + .carousel-item,
        .carousel-inner .active + .carousel-item + .carousel-item {
          display: block;
        }
      
        .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
        .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item,
        .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item {
          transition: none;
        }
      
        .carousel-inner .carousel-item-next,
        .carousel-inner .carousel-item-prev {
          position: relative;
          transform: translate3d(0, 0, 0);
        }
      
        .carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item {
          position: absolute;
          top: 0;
          right: -33.3333%;
          z-index: -1;
          display: block;
          visibility: visible;
        }
      
        /* left or forward direction */
        .active.carousel-item-left + .carousel-item-next.carousel-item-left,
        .carousel-item-next.carousel-item-left + .carousel-item,
        .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item,
        .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item {
          position: relative;
          transform: translate3d(-100%, 0, 0);
          visibility: visible;
        }
      
        /* farthest right hidden item must be abso position for animations */
        .carousel-inner .carousel-item-prev.carousel-item-right {
          position: absolute;
          top: 0;
          left: 0;
          z-index: -1;
          display: block;
          visibility: visible;
        }
      
        /* right or prev direction */
        .active.carousel-item-right + .carousel-item-prev.carousel-item-right,
        .carousel-item-prev.carousel-item-right + .carousel-item,
        .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item,
        .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item {
          position: relative;
          transform: translate3d(100%, 0, 0);
          visibility: visible;
          display: block;
          visibility: visible;
        }
      }
    
    
@media (max-width:345px){
	
	section h2{
    font-size: 30px;
    }
	
	.redes {
    padding: 10px;

}
.botao-edital h2 img {
    text-align: center;
    width: 100%;
}

.button_box_media{
    text-align: center;
    background-color: #f95d5d;
}
}

    .btn-prog {
        display: inline-block;
        padding: 10px 30px;
        font-size: 20px!important;
        font-weight: 400;
        line-height: 1.42857143;
        text-align: center;
        border-radius: 10px;
        color: #fff;
        background-color: #673074 ;
        margin-bottom: 85px!important;
		transition: 400ms all;
    }
    .btn-prog:hover {
 	background: #f58220;
		color: #fff!important;
    }
    
    .img-fluid.icones{
      max-width: 200px;
    }

    #prevencao h2, #pjftrabalhando h2{
        color: #673074 ;;
    }
    #facaasuaparte{
        background-color:#673074 ;
        color: #FFFFFF;
    }
    
    
    section{
        
    
    
    margin-bottom: 0px;
    
    margin: 0px;
    
    }
    #caminhos{
        margin-top: 7%;
        position: relative;
        box-sizing: border-box;
        margin-bottom: 5%;
        
    }
    .caminhoMapa{
        border:15px solid white;
        width: 70%;
    }
    .fundoEdital{
        left: 0;
        width: 100%;
        height: 105%;
        overflow: hidden;
       position: absolute;
       padding-top: 15%;
       z-index: -1;
       object-fit: cover;
       
        
    }
    #caminhos h2{
        font-size: 50px;
        padding-right: 45%;
        color: #593111 ;

        font-family: 'Urbanist', sans-serif;
    }
    
    section.tratamento{
        border: 4px solid #673074 ;
    margin: 25px auto;
    border-radius: 0.7em;
    padding: 0 1em 1em 1em;
    max-width: 1000px;
    background-color: #673074;
    color: #fff;
    }
    h2.tratamento{
         display: inline-block;
    top: -38px;
    position: relative;
    padding: 20px 10px 0px 20px;
    margin-bottom: 0;
    color: #fff;
}

.button_box{
    margin:0 auto;
    object-position: fit;
}
.my_button {
    height: 40%;
    border-radius: 8px;
    border-style: none;
    display: inline-block;
    object-position: fit;		
 }
 @media screen and (max-width: 768px){
    .my_button{
    height: 70%;
    display: block;
    text-align: center;
    margin: 0 auto;
    }
}
.button_box_media{
    text-align: center;
    background-color: #f95d5d;
}
.button_media{
    margin: 0 auto;
    width: 60%;
    height: 60%;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: space-between;
    justify-content: center;
}

.my_button img{
    size: 100%;
    width: 70%;
    height: 100%;
    border-radius: 8px;
    padding:0px;
    display: inline-block;
    object-fit: cover;
}
.duvidas img {
    size: 100%;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    padding: 0px;
    display: inline-block;
    object-fit: cover;
}

.redes{
    padding: 40px;
}
.btn-warning{
    background-color: #f4b71e;
    width: 20%;
    height: 10%;
}
.btn-warning a{
    background-color:#f95d5d;
    width: 20%;
    height: 10%;
}
    /*
    class="my_button img"
    */

    #capa{
        
        margin:0;
        padding: 0;
    }
    
    #capa2{
        display: block;
        margin-left: auto;
        margin-right: auto;
        align-items: center;
    }
    
    ul.alinhar {
        list-style: none; /* Remove default bullets */
        margin: 1.5em;
      }
      li.alinhar{
              text-align:left;
              max-width:600px;
      }
      
      li.alinhar::before{
        content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
        color: #b02a29; /* Change the color */
        display: inline-block; /* Needed to add space between the bullet and the text */
        width: 1em; /* Also needed for space (tweak if needed) */
        margin-left: -1em; /* Also needed for space (tweak if needed) */
        font-size: 31px;
        margin-top: -15px;
      }



#cultura-quebrada{
	background-color: var(--laranja);
}


@media (max-width:345px){
	.redes {
   		padding: 10px;

	}
	.edital h2 img {
		text-align: center;
		width: 100%;
	}
	
	.button_box_media{
		text-align: center;
		background-color: #f95d5d;
	}
}

:root {
    
	--rosa: #D52756;
  	--laranja: #F58220;
  	--amarelo: #F4C121;
	--verde: #32D1BA;
  	--roxo: #673074;
}

.button{
    font-size: 100%;
    font-family: sans-serif;
    font-weight: bold;
    transition: 0.4s all;
    cursor: pointer;
    border: 0;
    margin: 0;
    padding: 0;

    opacity: 0.8;
    width: 22vw;
}

.button:hover{
    opacity: 1;
}

.wt-font{color: #fff;}
.bk-font{color: #000;}

.red-background{background-color: var(--rosa);}
.orange-background{background-color: var(--laranja);}
.yellow-background{background-color: var(--amarelo);}
.green-background{background-color: var(--verde);}
.purple-background{background-color: var(--roxo);}

.low-border{border-radius: 8px;}
.medium-border{border-radius: 16px;}
.high-border{border-radius: 32px;}
.veryHigh-border{border-radius: 64px;}

.shadow-animation:hover{transform: translateY(-5px);box-shadow: 0 5px 10px rgba(0, 0 ,0, 0.5);}
.scale-animation:hover{transform: scale(1.06);}

.i-space{padding: 0.6rem;}
#faixaFinal{
    
    height: 200%;

}
#faixaFinal img{
    width: 100%;
}
@media(max-width: 780px){
    .button{
        font-size: 1rem;

        width: 50%;
    }
    #card-menu {
        height: 100%;
        padding-left:  0;
        margin-left: 0;
        margin-right: 0;
        
    }
    #card-menu img{
        width: 100%;
        
    }
    
    .caminhoMapa{
        width: 70%;
        height: 100%;
        border: 5px solid white;
    }
    #caminhos h2{
        padding-right: 30%;
        font-size: 20px;
    }
    .fundoEdital{
        padding-top: 20%;
        height: 90%;
    }
    .botao-edital img{
        
        width: 30%;
        padding-bottom: 5%;

    }
    #galeria h3{
        
        padding-right: 30%;
        
        font-size: 30px;
        padding-bottom: 5%;
        /* padding-bottom: 0px; */
    }
    #faixaFinal{
        
        position: relative;
        width: 100%; /* ou a largura desejada para a div */
        height: 100px; /* ou a altura desejada para a div */
        overflow: hidden; /* para garantir que a imagem não ultrapasse os limites da div */
      }
    #faixaFinal img{
        position: absolute;
        top: 30%;
        left: 50%;
        transform: translate(-50%, -50%); /* para centralizar a imagem na div */
        width: 110%; /* ou o tamanho desejado para a imagem */
       padding: 0;
        object-fit: cover; /* para manter a proporção da imagem e preencher a div */
      }
    #galeria img{
        width: 300px;
        object-fit: contain;
    }
    

}


@media(max-width: 500px){
    .button{
        font-size: 1.5rem;

        width: 80%;
    }
    
   
}



