/* Manter o formulario flex, com flex direction row e flex-wrap-wrap
>> classe .row, define as linhas de cada item Form, usar no html fazendo as marcações
>> classe . grupo_cxs, define as configurações de bloco de itens do form
>> classe .cx_text, define as propriedades inputs
>> classe .col-1.., 5 Tamanho dos inputs

**************	Form Padrão **************
      <form class="frm_registro">				
          <h1>Cad. Info Frete</h1>			
            <div class="row">	
                <div class="grupo_cxs col-1" id="grupo_cx_id">
                  <label for="">Id</label>
                  <input class="cx_text" type="text" id="cx_id" disabled>											
                </div>	
            </div>
      </form>

      >>>>> OPÇÃO, FRM CENTRALIZADO 
         <div class="row_center">
         </div>


************** Form Centralizado  **************


       <form class="frm_center">
          <div class='bloco_center'><p>Bloco 1</p></div>
          <div class='bloco_center'><p>Bloco 2</p></div>
          <div class='bloco_center'><p>Bloco 3</p></div>
          <div class='bloco_center'><p>Bloco 4</p></div>
        </form>

*/



.frm_registro{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	border-radius: 10px;
	/* background-color:white; 	 */
  padding-left: 50px;
  /* padding-right: 20px; */
  /* margin-bottom: 130px; */
  /* height: 500px; */

}


.frm_registro h2{
	border-bottom:solid 1px #CFCFCF; 
	border-right: solid 1px #CFCFCF;
	padding: 2px 10px 2px 10px;
	background-color: #e4e4e4;
	margin-top: 50px;
}


.container_center{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	z-index: 0;
  background-color:#f2f2f7;
  align-items: center;
  justify-content: center;
}

.container_center_5{
  padding-bottom: 80px;
}

.bloco_center {
  display: flex;
  height: 100px;
  width: 300px;
  margin-left: 30px;
  margin-top: 80px;
  margin-bottom: 100px;
  /* border: solid 1px gray; */
  align-items: center;
  justify-content: center;
}

.bloco_center2 { 
  margin-top: 160px;
  width: 550px;
}

.bloco_center3 { 
  width: 550px;
  height: 200px;
  margin-top: 30px;
}


.bloco_center4 {
  display: flex;
  flex-direction: row;
	flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  text-align: left;
  margin: 0px;
  width: 350px;
}

.bloco_center5 { 
  width: 100%;
  margin-top: -10px;
  height: 0px;
}


.cx_text{	
	outline: none;
	border:solid 1.8px  #e9e8e8;
	border-radius: 3px;
	height: 45px;
	width:100%;
	padding-left: 10px;
}

.cx_text2 {
  outline: none;
	border:solid 1.8px  #e9e8e8;
  background-color:rgb(244, 244, 244);
	border-radius: 3px;
	height: 45px;
	width:100%;
	padding-left: 10px;
  cursor: pointer;
}

.lb_text {
	font-weight: bold;
	font-size: 15px;
	color:#696969; 
}

.grupo_cxs{
	display: inline-block;
	margin-top: 25px;
  margin-left: -20px;
}

.grupo_btns a{ 
margin-left: -40px;
}

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6{
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;

}

.row{
  width:100%;
}

.row_center {
  text-align: center;
}

.col-1 {
  -ms-flex: 0 0 8.333333%;
  flex: 0 0 8.333333%;
  max-width: 8.333333%;
}

.col-2 {
  -ms-flex: 0 0 16.666667%;
  flex: 0 0 16.666667%;
  max-width: 16.666667%;
}

.col-3 {
  -ms-flex: 0 0 28%;
  flex: 0 0 28%;
  max-width: 28%;
 
}

.col-4 {
  -ms-flex: 0 0 43.5%;
  flex: 0 0 43.5%;
  max-width: 43.5%;

}


.col-5 {
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
  max-width: 60%;

}


.col-6 {
  -ms-flex: 0 0 90%;
  flex: 0 0 90%;
  max-width: 90%;

}



#msg_erro{
    position: fixed;
    bottom: 30px;
    right: 30px;
    /* right: -500px;  */
    background-color: #FF6A6A;
    color:white;
    border:solid 1px rgb(180, 176, 176);
    padding:6px 30px;
    font-size: 15px;
    box-shadow: 0px 0px 10px 1px #828282;
    display: none;
    z-index: 4;
}

#msg_sucess{
    position: fixed;
    bottom: 100px;
    right: 30px;
    background-color:#7c9256;
    color:white;
    border:solid 1px #7c9256;
    padding:6px 30px;
    font-size: 15px;
    box-shadow: 0px 0px 10px 1px #167450;
    display: none;
     z-index: 4;
}

#msg_duvida{
    position: fixed;
    bottom: 65px;
    right: 30px;
    background-color:#2b7e73;
    color:white;
    border:solid 1px #2b7e73;
    padding:6px 30px;
    font-size: 15px;
    box-shadow: 0px 0px 10px 1px #2b7e73;
    display: none;
    z-index: 4;
}

.frmt_tabela_fretes {
  border:solid 2px lightgray;
  border-bottom: 3px groove lightgray;       
  margin-top:50px ;
  border-radius: 30px;
  width:100%;
  
}
  
.frmt_tabela_fretes th {
  background-color: rgba(46, 46, 54, 0.295);
  font-weight: bold;
  color:#6d6363;
  padding:8px 40px;
  font-size: 13px;
  
}
  
.frmt_tabela_fretes td { 
  text-align: center;
  padding-top:10px;
  padding-bottom:10px;	
  font-size: 15px;
  cursor:pointer;
}
  

.frmt_tabela_fretes tr:hover{
  background-color:rgba(240,240,240,1);  
}

  
  
.styline_line_table_2{
  background-color:rgb(248, 248, 248);
      
}

.container_table{
  margin: 10px 20px;	
  display:block;
  overflow:auto;
  border:solid 1px rgb(231, 228, 228);
  border-radius:5px;
  /* background-color:rgb(255, 255, 255);  */
  background-color:rgb(228, 228, 228); 
  width: 100%;
  padding: 20px;

}

.container_center_color2 {
  background-color: #151143;
}

@media(max-width: 750px){

.grupo_cxs{
	display: block;
	margin-top: 15px;

}

.col-1,.col-2,.col-3,.col-4, .col-5, .col-6{
 -ms-flex: 0 0 90%;
  flex: 0 0 90%;
  max-width: 90%;
}

@media(max-width: 550px){ 

  .row {
    margin-left: -40px;
  }

  .cx_text, .cx_text2{
    width: 125%;
  }

}

}