:root {
	--verde: #1dd1a1;
	--verde-18b38a : #18b38a;
	--verde-escuro: #10ac83;
	--vermelho: #ff6b6b; 
	--vermelho-menu: #ff6b6b; 
	--vermelho-escuro: #ee5253; 
	--azul: #57789e;
	--azul-curtida: #2e86de;
	--azul-escuro: #425c79;
	--branco: #fff;
	--bg-conjunto-input: #fff;
	--branco-botao: #fff;
	--branco-escurecido: #fafafa;
	--branco-submenu: #f4f4f4;
	--preto: #000;
	--cinza: #666;
	--cinza-escuro: #333;
	--cinza-claro: #888;
	--cinzinha: #eee;
	--cinza-itemLista: #f7f7f7;
	--itemLista-hover: #f2f2f2;
	--cinza-preload: #f9f9f9;
	--cinza-label: #999;
	--input-border: #e6e6e6;
	--input-placeholder: #bbb;
	--bg-body: #eeeff3;
	--input-color: #444;
	--etiqueta-border: #f0f0f0;
	--slider-border: #ccc;
	--msg-pac:#b0b0b0;
	--cinza-trash: #ddd;
	--cinza-999: #999999;
	--cinza-c3c3c3: #c3c3c3;
	--cinza-e9e9e9: #e9e9e9;
	--ativoRefeicao: #c8d6e5;
	--amarelo: #E8CB42;
	--escolhido: #1dd1a140;
	--box-shadow: rgba(0, 0, 0, 0.7);
	--cinza-table: #e6e6e6;
	--bg-calendario-block: #6d6e6a;
	--bg-seta: url('../img/setas.svg');
	--botao-invalido: #ccc;
	--preto-swal: #5a6268;
	--cinza-swal:#999;
	--questLinha-color: #222f3e80;  
	--bg-opcao-quest: #f1f1f1;
	--amareloRast: #ebbd13;
	--laranjaRast: #ffa425;
	--vermelhoClaroRast: #fa5423;
	--vermelhoEscuroRast: #e61c24;
	--cinza-8395a7: #8395a7;
  }
  
  @font-face { font-family: Circular; src: url('../fonts/circular-std-font-family/CircularStd-Bold.woff'); font-weight: 600; }
  @font-face { font-family: Circular; src: url('../fonts/circular-std-font-family/CircularStd-Medium.woff'); font-weight: 500; }
  @font-face { font-family: Circular; src: url('../fonts/circular-std-font-family/CircularStd-Book.woff'); font-weight: 400; }
  @font-face { font-family: Circular; src: url('../fonts/circular-std-font-family/CircularStd-Book.woff'); font-weight: 300; }
  
  @font-face {
	  font-family: 'Icones app';
	  src: url('../fonts/Icones-app.eot');
	  src: url('../fonts/Icones-app.eot?#iefix') format('embedded-opentype'),
		   url('../fonts/Icones-app.woff') format('woff'),
		   url('../fonts/Icones-app.ttf') format('truetype'),
		   url('../fonts/Icones-app.svg#Icones-app') format('svg');
	  font-weight: normal;
	  font-style: normal;
  }
  
  * {  -webkit-font-smoothing: antialiased !important; }
  *:focus { outline: none !important; }
  
  b { font-weight: 500; }
  strong { font-weight: 600; }
  
  a { color: var(--preto); font-weight: 500; transition: all ease 0.2s; }
  a:hover { color: var(--cinza) !important; font-weight: 500; text-decoration: none; }
  a:active { color: var(--preto); font-weight: 500 }
  
  
  h1 { font-weight: 300; margin: 0px; font-size: 38px; letter-spacing: -1px;}
  h3 { font-weight: 300; margin: 5px 0px; font-size: 16px;}
  
  .appGlobal { position: relative; display: inline-block; }
  .app { width: 100%; background: var(--branco); border-radius: 5px; background-size: cover; padding: 15px; text-align: left; display: inline-block; }
  
  
  .bagde { position: absolute; top: 5px; left: calc(100% - 65px); width: 60px; text-align: center; font-size: 30px; color: var(--preto); cursor: pointer;  }
  
  .btn-primary { background: #5CA1A0 !important;  border: 1px solid #5CA1A0 !important; } 
  .btn-primary:hover { background: #3D6E75 !important;  border: 1px solid #3D6E75 !important;  }
  .btn-primary:active { background: #3D6E75 !important;  border: 1px solid #3D6E75 !important;  }
  .btn-primary:focus { background: #3D6E75 !important;  border: 1px solid #3D6E75 !important;  }
  
  
  *:focus {
	  outline: none !important;
  }
  
  .botao { 
  
	  width: 100%;
	  height: 50px;
	  line-height: 50px;
	  color: var(--branco);
	  text-align: center;
	  display: inline-block;
	  cursor: pointer;
	  font-size: 20px;
	  font-weight: 500;
	  background: var(--verde);
	  border-radius: 5px;
  
  }
  
  .form-control:focus {
	box-shadow: none;
  }
  
  input::-webkit-contacts-auto-fill-button {
	  visibility: hidden;
	  display: none !important;
	  pointer-events: none;
	  position: absolute;
	  right: 0;
  }
  
  input::placeholder {
	  color: #c9c9c9;
	  font-weight: 200;
  }
  
  hr { border: 1px solid var(--bg-body); }
  
  select {
	  -moz-appearance: none;
	  -webkit-appearance: none;
  }
  
  body {
	  
	  background: var(--bg-body);
	  font-family: 'Circular', sans-serif;
	  font-weight: 400;
	  color: var(--preto);
	  text-align: center;
	  font-size: 15px;
  }
  
  .content { 
  
	  position: absolute;
	  top: 90px;
	  left: calc(50% - 360px);
	  width: 920px;
	  text-align: left;
	  display: inline-block;
  }
  
  
  .conjunto-input {
	  height: 60px;
	  padding: 0px 10px;
	  background: var(--branco);
	  text-align: left;
	  display: inline-block;
	  border-radius: 5px;
	  line-height: 100%;
	  vertical-align: top;
	  position: relative;
	  margin-bottom: 5px;
	  border: 1px solid #e6e6e6;
  }
  
  .conjunto-input input, textarea, select {
	  width: 100%;
	  height: 60px;
	  margin-top: 0px;
	  color: #444;
	  font-size: 18px;
	  border: none;
	  background: none;
	  font-weight: 300;
	  transition: all 0.3s ease;
	  -moz-appearance: none;
	  -webkit-appearance: none;
  }
  
  .conjunto-input input:valid{
  
	  display: inline-block;
	  margin-top: 8px;
  }
  
  
  .conjunto-input-refeicao {
  
	  padding: 10px 5px;
	  background: var(--branco);
	  text-align: left;
	  display: inline-block;
	  border-radius: 5px;
	  vertical-align: top;
	  position: relative;
	  margin-bottom: 5px;
	  border: 1px solid #e6e6e6;
	  font-family: Circular;
  }
  
  .conjunto-input-refeicao input, textarea, select {
	  width: 100%;
	  margin-top: 0px;
	  color: #444;
	  font-size: 18px;
	  border: none;
	  background: none;
	  font-weight: 300;
	  text-align: center;
	  transition: all 0.3s ease;
	  -moz-appearance: none;
	  -webkit-appearance: none;
	  font-family: Circular;
  }
  
  .tagEtiqueta {
	  display: inline-block;
	  background: #f1f1f1;
	  padding: 5px 10px;
	  font-weight: 300;
	  font-size: 13px;
  }
  
  .logo-container{
	  display: flex; 
	  justify-content: center; 
	  max-height: 100px
  }
  

  #conteudo{
	padding: 15px; 
	background-color: var(--branco); 
	border-radius: 5px; 
	margin-top: 20px; 
	gap: 15px; 
	display: flex; 
	flex-direction: column
}

  .bloquinhoCf{
	flex-direction: row; 
	display: flex; 
	align-items: center; 
	gap: 10px
}
  
  .zeroRast{
	  background-color: var(--verde);
	  color: var(--branco); 
  }
  
  .umRast{
	  background-color: var(--amareloRast)!important;
	  color: var(--branco); 
  }
  
  .doisRast{
	  background-color: var(--laranjaRast)!important;
	  color: var(--branco); 
  }
  
  .tresRast{
	  background-color: var(--vermelhoClaroRast)!important;
	  color: var(--branco); 
  }
  
  .quatroRast{
	  background-color: var(--vermelhoEscuroRast)!important;
	  color: var(--branco); 
  }

#instrucoes{
	padding: 12px 17px;
	background-color: var(--cinza-itemLista);
	border-radius: 5px;
	display: flex;
	flex-direction: column;
}

  .subTitulo{
	color: var(--cinza);
}
.bagde {
	position: absolute; 
	top: 5px; 
	left: calc(100% - 65px); 
	width: 60px; 
	text-align: center; 
	font-size: 30px; 
	color: #000; 
	cursor: pointer;  
}

.rast, .disb {
	transition: all 0.3s ease; 
	padding: 5px; 
	text-align: center; 
	font-size: 15px; 
	background: var(--cinza-itemLista); 
	font-weight: 200; 
	cursor: pointer; 
	border-radius: 5px; 
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--cinza);
}
.rastMarcado, .disbMarcado {
	transition: all 0.3s ease; 
	align-items: center; 
	justify-content: center; 
	padding: 5px; 
	text-align: center; 
	font-size: 15px; 
	font-weight: 200; 
	display: inline-flex; 
	border-radius: 5px; 
	background: var(--verde); 
	color: #fff; 
}

#bloquinhoCafeBtn{
	position: sticky; 
	bottom: 5px; 
	padding: 15px; 
	background-color: var(--branco); 
	border-radius: 5px; 
	margin-top: 20px;
}
#itemLista{
	background: var(--cinzinha); 
	height: 30px; 
	width: 30px; 
	border-radius: 5px; 
	align-items: center; 
	display: flex; 
	justify-content: center
}
#rowItemLista{
	flex-direction: row; 
	display: flex; 
	gap: 10px; 
	align-items: center;
}
  
  .titulo{
	  font-size: 16px;
	  font-weight: 600;
	  color: var(--cinza-escuro);
}
  
  .legendasRastreamentoContainer {
	  line-height: 17px;
	  color: var(--cinza);
	  display: flex;
	  gap: 10px;
	  align-items: center;
  }
  
  .rows{
	  padding: 0 5px;
  }
  
  .rast-legenda{
	  width: 42px;
	  height: 35px;
	  aspect-ratio: 1/1;
	  display: inline-flex;
	  justify-content: center;
	  align-items: center;
	  font-size: 16px; 
	  font-weight: 200; 
	  cursor: pointer; 
	  border-radius: 5px; 
  }
  
  .bloquinho{
	  padding: 15px;
	  background-color: var(--branco);
	  border-radius: 5px;
	  gap: 10px;
	  display: flex;
	  flex-direction: column;
  }
  
  .rast-container{
	  width: 100%; 
	  margin-bottom: 15px
  }
  
  .titulo-container{
	  width:100%; 
	  display: inline-block; 
	  vertical-align: middle
  }
  
  .fundo{
	  background-color: var(--branco);
	  border-radius: 5px;
	  padding: 15px;
  }
  
  .subtitulo{
	  font-size: 15px; 
	  margin: 0 0 5px 3px; 
	  text-align: left; 
	  color: var(--cinza)
  }
  
  .tituloSecundario { 
	  font-size: 16px; 
	  font-weight: 600; 
	  color:var(--cinza-escuro); 
  }
  
  
  .btn-salvar{
	  padding: 10px;
	  background-color: var(--branco);
	  border-radius: 5px;
	  margin-top: 10px;
	  position: sticky;
	  bottom: 5px;
  }
  
  .total{
	  margin-left: 5px
  }
  
  .row-quest{
	  width: 100%; 
	  text-align: center; 
	  display: grid; 
	  grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important; 
	  grid-column-gap: 2px
  }
  
  .swal2-popup .swal2-header{
	  display: none!important
  }
  
  .swalTitle {
	  font-size: 20px;
	  font-weight: 600;
	  color: var(--cinza-escuro);  
  }
  
  .swalSubtitle{
	  font-size: 16px;
	  font-weight: 400;
	  color: var(--cinza);
  }
  
  
  @media screen and (min-width: 680px){
	  .rows{
		  display: flex;
		  flex-direction: row;
		  justify-content: space-between;
		  gap:15px;
		  align-items: center
	  }
	  
	  .titulo-container{
		  align-items: center;
		  display: inline-flex;
	  }
	  
	  .rast-container{
		  margin-bottom: 0;
		  /* width: 55% */
		  width: 100%;
	  }
	  
	  .row-quest{
		  grid-column-gap: 10px
	  }
  
	  .btn-salvar{
		  bottom: 10px
	  }
	  
  }
  
/*   
  .perg{
	  margin-top: 10px;
  
  } */
  
  .dib{
	  grid-column-gap: 3px;
	  grid-row-gap: 3px;
	  color: var(--cinza)
  }
  
  #text{
	  width: 100%
  }
  
  @media screen and (min-width: 710px){
	  .dib{
		  display: flex!important;
	  }
  
	  .disb{
		  /* flex-basis: 0; */
		  -webkit-box-flex: 1;
		  -ms-flex-positive: 1;
		  flex-grow: 1;
		  width: auto!important;
		  transition: all 0.3s ease;
  
		  
	  }
  
	  .disbMarcado{
		  /* flex-basis: 0; */
		  -webkit-box-flex: 1;
		  -ms-flex-positive: 1;
		  flex-grow: 1;
		  width: auto!important;
		  transition: all 0.3s ease;
  
	  }
  }


  @media screen and (max-width: 710px) {
	.respostaDiv{
		display: grid!important;
		/* grid-template-columns: 1fr!important; */
	  }
  }


@media (min-width: 530px){
	.logo-container{
		max-height: 160px!important;
	}
}

@media (max-width: 545px) {
	.rast, .disb {
		padding: 10px!important; 
		width: 100%;
	}
	.rastMarcado, .disbMarcado {
		padding: 10px!important; 
		width: 100%;
	}
	.divDosBtns{
		width: 100%!important
	}
	.bloquinhoCf{
		flex-direction: column; 
		justify-content: center; 
		align-items: center; 
		gap: 0!important
	}
	.enunciadoCf{
		width: 100%!important
	}
	.subTitulo{
		padding-bottom: 5px;
	}

	.subTituloLegen{
		padding-bottom: 5px;
	}

	.rowConjunto{
		display: block!important;
	}
}


#swal2-content{
	width: 100%;
    height: 100%;
    align-items: center;
    display: flex!important;
    justify-content: center;
    flex-direction: column;
}