*,::after,::before{box-sizing:border-box}
 .container-com-rolagem {
      max-height: 150px; /* Altura máxima para que a barra de rolagem apareça quando o conteúdo for maior */
      overflow-y: auto;  /* Habilita a barra de rolagem vertical automaticamente se necessário */
      border: 1px solid #ccc; /* Apenas para visualizar a área do container */
      padding: 10px; /* Espaçamento interno */
    }

    .container-com-rolagem ul {
      list-style: none; /* Opcional: para remover os marcadores padrão da lista */
      padding: 0;      /* Opcional: para remover o padding padrão da lista */
      margin: 0;       /* Opcional: para remover a margem padrão da lista */
    }

    .container-com-rolagem li {
      padding: 5px 0; /* Espaçamento entre os itens */
    }
.contayner-carosel {
    width: 100%;
    height: 250px;
    margin: auto
}

.conteudo-fluido{
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
    margin-right: auto;
    margin-left: auto;
}

.conteudo-fluido-90{
    width: 90%;    
    margin-right: auto;
    margin-left: auto;
}
.conteudo-fluido-80{
    width: 80%;    
    margin-right: auto;
    margin-left: auto;
}
.conteudo-fluido-70{
    width: 70%;    
    margin-right: auto;
    margin-left: auto;
}
.conteudo-fluido-60{
    width: 60%;    
    margin-right: auto;
    margin-left: auto;
}
.conteudo-fluido-50{
    width: 50%;    
    margin-right: auto;
    margin-left: auto;
}
.conteudo-fluido-40{
    width: 40%;    
    margin-right: auto;
    margin-left: auto;
}
.conteudo-fluido-30{
    width: 30%;    
    margin-right: auto;
    margin-left: auto;
}
.rows{
	display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;	
}
.cor{border:solid 1px red}

/*todas iniciam com estes valores*/
.col,.col-1,.col1div2,.col-2,.col2div2,.col-3,.col-5,.col-4,.col4div2,.col-6,.col-7,.col-8,.col-9,.col-10,.col-12,.col12div2{
	position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 3px;
    padding-left: 3px;
}


@media (min-width:992px){
/*gera o numero de colunas automatico */
	.col {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}

/*equivale a 12 coluna */
.col-1{	
	-ms-flex:0 08.333333%;
	flex:0 8.333333%;
	max-width: 8.333333%;	
}
/*equivale a 12 coluna */
.col-1-orca{	
width: 8,33%;
}

.col1div2{		
	-ms-flex:0 08.333333%;
	flex:0 0 8.333333%;
	max-width: 8.333333%;   
	
}
/*equivale a 6 coluna */
.col-2{
	-ms-flex:0 0 16.666667%;
	flex:0 0 16.666667%;
	max-width:16.666667%;	 
}
.col-2-orca{
	width: 16,66%;
}
.col2div2{			
	-ms-flex:0 0 16.666667%;
	flex:0 0 16.666667%;
	max-width:16.666667%;
}
/*equivale a 5 coluna */
.col-2_5{
	-ms-flex:0 0 20%;
	flex:0 0 20%;
	max-width:20%;	 
}
/*equivale a 4 coluna */
.col-3{
	-ms-flex:0 0 25%;
	flex:0 0 25%;
	max-width:25%;	 
}
.col-3-orca{
	-ms-flex:0 0 25%;
	flex:0 0 25%;
	max-width:25%;
}
/*equivale a 3 coluna */
.col-4{
	-ms-flex:0 0 33.333333%;
	flex:0 0 33.333333%;
	max-width:33.333333%;	 
}
.col-4-orca{
	-ms-flex:0 0 33.333333%;
	flex:0 0 33.333333%;
	max-width:33.333333%;	 
}
.col4div2{
   -ms-flex:0 0 33.333333%;
	flex:0 0 33.333333%;
	max-width:33.333333%;	 
}
/*equivale a 3 coluna */
.col-5{
	-ms-flex:0 0 41.633333%;
	flex:0 0 41.633333%;
	max-width:41.633333%;	 
}
/*equivale a 2 coluna*/
.col-6{
	-ms-flex:0 0 50%;
	flex:0 0 50%;
	max-width:50%;	 
}

.col6div2{
	-ms-flex:0 0 50%;
	flex:0 0 50%;
	max-width:50%;	 
}

/*equivale a soma de 5+7*/
.col-7{
	-ms-flex:0 058.316667%;
	flex:0 0 58.316667%;
	max-width:58.316667%;	 
}
/*equivale a soma de 4+8*/
.col-8{
	-ms-flex:0 0 66.666667%;
	flex:0 0 66.666667%;
	max-width:66.666667%;	 
}
.col-8-orca{
	width: 66,66%; 
}

/*equivale a soma de 3+9*/
.col-9{
	-ms-flex:0 0 75%;
	flex:0 0 75%;
	max-width:75%;	 
}
.col-68cento{
	width: 63%;
}
/*equivale a soma 2+10*/
.col-10{
	-ms-flex:0 0 83.333333%;
	flex:0 0 83.333333%;
	max-width:83.333333%;	 
}
/*equivale a soma 2+10*/
.col-11{
	-ms-flex:0 0 91.63666667%;
	flex:0 0 91.63666667%;
	max-width:91.63666667%;	 
}
/*equivale a 1 coluna*/
.col-12{
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;	 
}
.col-12-orca{
width: 100%;
}
.col12div2{
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;	 
}
.conteudo-fluido-90{
		width: 100%;    
		margin-right: auto;
		margin-left: auto;
	}
}
	
.div-2{
		width: 50%;    
	     padding: 1px;
	}
	
.div-3{
		width: 33.33%;    
	     padding: 1px;
	}
	
.div-4{
		width: 25%;    
	     padding: 1px;
	}
	
.div-5{
		width: 20%;    
	     padding: 1px;
	}
	
.div-2{
		width: 16.66%;    
	     padding: 1px;
	}


@media (max-width: 500px) {

	.img{
		margin-left: -3px;
	}
	
	.conteudo-fluido-90{
		width: 100%;    
		margin-right: auto;
		margin-left: auto;
	}
	.conteudo-fluido-80{
		width: 100%;    
		margin-right: auto;
		margin-left: auto;
	}
	.conteudo-fluido-70{
		width: 100%;    
		margin-right: auto;
		margin-left: auto;
	}
	.conteudo-fluido-60{
		width: 100%;    
		margin-right: auto;
		margin-left: auto;
	}
	.conteudo-fluido-50{
		width: 100%;    
		margin-right: auto;
		margin-left: auto;
	}
	.conteudo-fluido-40{
		width: 100%;    
		margin-right: auto;
		margin-left: auto;
	}
	.conteudo-fluido-30{
		width: 100%;    
		margin-right: auto;
		margin-left: auto;
	}

/*equivale a 12 coluna */
.col-1-orca{	
	-ms-flex:0 08.333333%;
	flex:0 8.333333%;
	max-width: 8.333333%;	
}

.col1div2{	
	-ms-flex:0 0 50%;
	flex:0 0 50%;
	max-width:50%;	 
}
.col2div2{	
	-ms-flex:0 0 50%;
	flex:0 0 50%;
	max-width:50%;	 
}

.col-3-orca{
	-ms-flex:0 0 25%;
	flex:0 0 25%;
	max-width:25%;	 
}

.col4div2{	
	-ms-flex:0 0 50%;
	flex:0 0 50%;
	max-width:50%;	 
}
.col12div2{	
	-ms-flex:0 0 50%;
	flex:0 0 50%;
	max-width:50%;	 
}
.col6div2{
	-ms-flex:0 0 50%;
	flex:0 0 50%;
	max-width:50%;	 
}
}
