:root {
		--largura-borda: 0.4vmin;
		--margem: 0.45vw;
		--pix-padrao: 0.1vmin;
	}
/*GERAL*/


	#insere_msg ul {margin-left: 20px; margin-top: 10px;}
    #insere_msg li {
        list-style-type: disc;
	}



/*AÇÃO*/
.carregando_modal { display: none; left:0; top:0; position:fixed; z-index: 10001; background: rgba(244,245,248,0.9); width:100% !important; height:100% !important; }

.alinha-direita { left:40%; }
.confirmacao { 
	display: none;
	max-width: 1000px;
	min-width: 400px;
	height: auto;
	max-height: 1000px;
	text-align: center;
	background-color: #ffffff;
	padding: 10px;
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 10002;
	transform: translate(-50%, -50%);
	-o-transition: all 0.6s ease;
	-webkit-transition: all 0.6s ease;
	transition: all 0.6s ease;
	overflow: hidden;
	box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
	rgba(0, 0, 0, 0.3) 0px 30px 60px -30px; 
  }
  .confirmacao .titulo_modal { 
	width: auto;
	height: auto;
	text-align: center;
	line-height: 40px;
	font-weight: 600;
	font-family: var(--fonte-padrao);
	font-size: 18px;
	padding: 10px 10px;
	color: var(--cor-texto);
  }
  .confirmacao .titulo_modal i.fa-exclamation-triangle { 
	font-size: 15px;
	line-height: 40px;
	padding: 0px 10px 0px 0px;
	color: red; 
  }
  .confirmacao .titulo_modal i.fa-award { 
	font-size: 15px;
	line-height: 40px;
	padding: 0px 10px 0px 0px;
	color: green; 
  }  
  .confirmacao .util_modal { 
	background-color: #ffffff;
	width: -moz-calc(100% - 40px);
	width: -webkit-calc(100% - 40px);
	width: -o-calc(100% - 40px);
	width: calc(100% - 40px);
	padding: 20px;
	height: auto;
	max-height: 800px;
	border-top: 1px solid #eaeaea;
	text-align: left;
  }
  .confirmacao .util_modal #insere_msg { 
	max-height: 600px;
	overflow-y: auto;
	overflow-x: hidden;
  }  
  .confirmacao .util_modal .opcao { 
	display: inline-block;
	width: 100%;
	vertical-align: top;
	height: auto;
	position: relative;
	padding: 5px 0px }
	
  .confirmacao .util_modal select { 
	display: inline-block;
	width: 70%;
	vertical-align: top;
	height: auto;
	position: relative;
	padding: 5px 15px;
	background-color: #e2e2e2;
	border-radius: 20px;	
	margin: 13px;}

  .confirmacao .util_modal .check { 
	display: inline-block;
	width: 44%;
	height: auto;
	position: relative;
	padding: 5px 15px;  }

  .confirmacao .util_modal .check input[type=checkbox] { 
	display: inline-block;
	width: auto;
	height: auto;
	position: relative;
	padding: 5px 15px;
	background-color: #e2e2e2;
	border-radius: 20px;	}

  .confirmacao .util_modal .check label { 
	display: inline-block;
	width: auto;
	height: auto;
	position: relative;
	padding: 5px 15px; }

.confirmacao .util_modal .avulso {
	display: grid;
	grid-template-columns: 20% 80%;
	align-items: center;
}	
  .confirmacao .util_modal .avulso input[type=text] {grid-column: 2; margin: 3px 0px; border: 1px solid #eaeaea; background-color: #f4f6f8; width: 80%; text-align: left; padding: 10px 2%; height: 20px; font-size: 11px; font-family: var(--fonte-padrao); font-weight: 400; color: var(--cor-texto-default); -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; left: 30%; }

  
  .confirmacao .util_modal .avulso label {grid-column: 1;}
  
  .confirmacao .util_modal .imagem { 
	display: inline-block;
	width: 44%;
	height: auto;
	position: relative;
	padding: 5px 15px;  
	}


  .confirmacao .util_modal .btn-padrao:hover {
	padding: 0px 20px;

	}
	.confirmacao .util_modal #listagem_usuario_cupom table {
		border-collapse: collapse;
		width: 100%;
		min-width: 400px;

	}
	.confirmacao .util_modal #listagem_usuario_cupom table tbody tr:nth-child(even) {
		background-color: rgba(157, 187, 201, 0.116);
	}
	.confirmacao .util_modal #listagem_usuario_cupom table tbody tr th {
		font-size: 16px;
		height: calc(+5px);
		text-align: center;
	}
	.confirmacao .util_modal #listagem_usuario_cupom table tbody tr td {
		text-align: center;
		font-family: Arial, Helvetica, sans-serif;
	}
	.fa-x{
		position: absolute;
		right: 20px;
		top: 20px;
	}
	.fa-x:hover{
		cursor: pointer;
	}
	
  .confirmacao .util_modal .btn-padrao {
	cursor: pointer;
	width: auto;
	position: relative;
	height: auto;
	margin: 15px 10px 0px 0px;
	display: inline-block;
	vertical-align: top;
	text-align: center;
	width: auto;
	font-size: 13px;
	line-height: 35px;
	padding: 0px 15px;
	font-weight: 600;
	color: rgba(0,0,0,0.5);
	font-family: var(--fonte-padrao);
	-moz-transition: all .3s ease;
	-o-transition: all .3s ease;
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
	background-color: #eaeaea; 
  }
  .confirmacao .util_modal .btn-padrao.continuar {
	 background-color: var(--cor-principal); color: #ffffff; 
  }
  .confirmacao .util_modal .btn-padrao.continuar.opaco {
	 opacity: 0.3;
	 cursor: not-allowed;
  }


  .confirmacao .util_modal .btn-padrao.video {
	 background-color: var(--cor-principal); color: #ffffff; 
  }

  .confirmacao .util_modal .concorda input[type=checkbox] { 
	display: inline-block;
	width: auto;
	height: auto;
	position: relative;
	padding: 5px 15px;
	background-color: #e2e2e2;
	border-radius: 20px;	}

  .confirmacao .util_modal .concorda a {
	text-decoration: underline;
	color: blue;
  }

  .confirmacao .util_modal .previa_contrato {
	  max-height: 700px;
	  width: 710px !important;
	  overflow-y: auto;
	  overflow-x: hidden;
  }
  .confirmacao .util_modal .previa_contrato p{
	max-width: 97%;
  }

/*TREINAMENTO*/

/* GRID */
.treinamento {
	display: grid;
	grid-template-columns: 15% 70% 15%;
	grid-template-rows: 4% 65% 25% 4%;
	width: 90%;
	max-width: 140vh;
	height: calc(100% - 40px);
	max-height: 95vh;
	grid-gap: var(--pix-padrao);
	border: var(--largura-borda) solid black;
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 10002;
	transform: translate(-50%, -50%);
	-o-transition: all 0.6s ease;
	-webkit-transition: all 0.6s ease;
	transition: all 5s ease-in-out 5s;
	overflow-y: hidden;
	overflow-x: hidden;
	box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
	rgba(0, 0, 0, 0.3) 0px 30px 60px -30px; 
	background-color: #ffffff;
	text-align: center;
	font-size: var(--pix-padrao);
  }

	.treinamento.escondido{
		display: none;
	}
	.escondido{
		display: none;
	}


  .treinamento .icone{
	font-size: calc(20 * var(--pix-padrao));
	margin-left: calc(10 * var(--pix-padrao));
	margin-top: calc(10 * var(--pix-padrao));
	margin-right: calc(10 * var(--pix-padrao));
	margin-bottom: 0;
	cursor: pointer;
	line-height: 0.5;
	}

  .treinamento .icone:hover{
	color: red;
  }
 
 
  .treinamento .video_slide{
	grid-row: 1;
	grid-column: 1;
	border: var(--largura-borda) solid #eaeaea;	  
	margin-left: calc(2 * var(--pix-padrao));
	margin-top: calc(2 * var(--pix-padrao));
  }
  .treinamento .titulo_treinamento {
	grid-row: 1;
	grid-column: 2;
	margin-left: calc(2 * var(--pix-padrao));
	margin-top: calc(2 * var(--pix-padrao));
 	text-align: center;
	font-weight: 600;
	font-family: var(--fonte-padrao);
	font-size: calc(30 * var(--pix-padrao));
	color: var(--cor-texto);
	background-color: #eaeaea;
	line-height: calc(36 * var(--pix-padrao));
  }

  .treinamento .titulo_treinamento i.fa-exclamation-triangle { 
	font-size: calc(30 * var(--pix-padrao));
	line-height: calc(36 * var(--pix-padrao));
	color: red; 
  }
  .treinamento .titulo_treinamento i.fa-award { 
	font-size: calc(30 * var(--pix-padrao));
	line-height: calc(36 * var(--pix-padrao));
	color: green; 
  }

  .treinamento .fechar {
	grid-row: 1;
	grid-column: 3;
	border: var(--largura-borda) solid #eaeaea;	  
	text-align: right;
	margin-left: calc(2 * var(--pix-padrao));
	margin-top: calc(2 * var(--pix-padrao));
	margin-right: calc(3 * var(--pix-padrao));
  }

  
  .treinamento .menu_treinamento { 
	grid-row: 2 / 4;
	grid-column: 1;
	border: var(--largura-borda) solid #eaeaea;
	font-size: calc(24 * var(--pix-padrao));
	background-color: #ffffff;
	text-align: left;
	overflow-y: auto;
	overflow-x: hidden;
	vertical-align: top;
	font-family: var(--fonte-padrao);
	text-decoration: underline;
	border-bottom: var(--largura-borda) solid #eaeaea;
	margin-left: calc(2 * var(--pix-padrao));
	margin-top: calc(2 * var(--pix-padrao));
  }

  .treinamento .menu_treinamento .item_menu_treinamento{ 
	text-transform: uppercase;
	cursor: pointer;
	width: auto;
}

  .treinamento .menu_treinamento .item_menu_treinamento .legenda{ 
	text-transform: uppercase;
	cursor: pointer;
    padding: 10px 10px 0px 0px;
}

  .treinamento .menu_treinamento .item_menu_treinamento .legenda.clicado{ 
	color: var(--cor-principal);
}


  .treinamento .menu_treinamento .item_menu_treinamento .legenda:hover{ 
	color: var(--cor-principal);
  }
  .treinamento .menu_treinamento .subitem_menu_treinamento{ 

	text-transform: capitalize;
	margin-left: 5px;
	padding-left: 10px;
	cursor: pointer;
	width: auto;
	background-color: #f1f1f1;
	text-indent: -10px;
	font-size: calc(20 * var(--pix-padrao));
}

  .treinamento .menu_treinamento .item_menu_treinamento:hover .subitem_menu_treinamento{ 
	color: #000000;
  }

  .treinamento .menu_treinamento .item_menu_treinamento .subitem_menu_treinamento:hover{ 
	color: var(--cor-principal);
  }

  .treinamento .menu_treinamento .item_menu_treinamento .subitem_menu_treinamento.clicado{ 
	color: var(--cor-principal);
  }

  
  
  .treinamento .cont_video_treinamento {
	border: var(--largura-borda) solid #eaeaea;
	grid-row: 2;
	grid-column: 2 / 4;
    display: flex;
    justify-content: center; 
    align-items: flex-start; 
	background-color: #ffffff;
	text-align: left;
	margin-left: calc(2 * var(--pix-padrao));
	margin-top: calc(2 * var(--pix-padrao));
	margin-right: calc(3 * var(--pix-padrao));
  }

 
   .treinamento .cont_video_treinamento .video_treinamento { 
	padding: 0.7vh;
	width: calc(100% - 2vh);
	height: calc(100% - 2vh); 

   } 


  .treinamento .bloco_slide {
	border: var(--largura-borda) solid #eaeaea;
	grid-row: 2;
	grid-column: 2 / 4;
	overflow: hidden;
	display: none;
	margin-left: calc(2 * var(--pix-padrao));
	margin-top: calc(2 * var(--pix-padrao));
	margin-right: calc(3 * var(--pix-padrao));
  }

  .treinamento .bloco_slide .cont_slide_show {
	width: calc(98%);
	height: calc(98%); 
	display: flex;
  	border-bottom: 1px double #eaeaea;
	position: relative;
	text-align: center;
	margin: 0 auto;
  }

  .treinamento .bloco_slide .cont_slide_show .slide {
	max-height: 54vh; 
	width: auto;
	max-width: 72vw;
	position: absolute;
	top: 50%;
	left: 50%;
	opacity: 0; 
    transition: opacity 0.5s ease-in-out; 
    transform: translate(-50%, -50%);
}

  .treinamento .bloco_slide .cont_slide_show .slide.active {
    opacity: 1; 
}

  .treinamento .bloco_slide .cont_slide_show  img{ 
	margin: auto;
}
  .treinamento .bloco_slide .cont_slide_show.item.anterior  {
	cursor:  url('../img/esquerda.png') 4 12,  pointer;
  }
  .treinamento .bloco_slide .cont_slide_show.topico.anterior  {
	cursor:  url('../img/duplaesquerdapq.png') 4 12,  pointer;
  }

  .treinamento .bloco_slide .cont_slide_show.item.proximo  {
	cursor:  url('../img/direita.png') 4 12,  auto;
  }
  .treinamento .bloco_slide .cont_slide_show.topico.proximo  {
	cursor:  url('../img/dupladireitapq.png') 4 12,  auto;
  }
  .treinamento .bloco_slide .cont_slide_show.amplia  {
	cursor:  zoom-in;
  }

  .treinamento .bloco_slide .cont_slide_show.naonavega  {
	cursor:  not-allowed;
  }


  .treinamento .cont_texto_imagem_treinamento {
	border: var(--largura-borda) solid #eaeaea;
	grid-row: 3;
	grid-column: 2 / 4;
	height: auto; 
	background-color: #ffffff;
	text-align: left;
	overflow-y: auto;
	overflow-x: hidden;
	margin-left: calc(2 * var(--pix-padrao));
	margin-top: calc(2 * var(--pix-padrao));
	margin-right: calc(3 * var(--pix-padrao));
  }

    .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento {
	display: inline-block;
	width: calc(100%);
	height: auto;	
	border: var(--largura-borda) solid black;
	padding: 0.7vh;
	background-color: #ffffff;
	text-align: left;
	overflow-y: hidden;
	overflow-x: hidden;
	border: 1px solid #eaeaea;
	font-size: calc(22 * var(--pix-padrao));
  }

  .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .titulo_texto_treinamento { 
	font-family: var(--fonte-padrao);
	font-size: calc(28 * var(--pix-padrao));
	font-weight: 600;
	width: 100%;
	height: auto;
	text-align: left;
	overflow: hidden;
	border-bottom: 1px solid #eaeaea;
	margin-left: calc(2 * var(--pix-padrao));

  }
	
  .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .texto_treinamento { 
	display: inline-block;
	width: 72%;
	height: auto;
	padding-left: 1.4vh;
	font-family: var(--fonte-padrao);
	text-align: left;
	overflow-y: auto;
	overflow-x: hidden;
	border-right: 1px solid #eaeaea;
	margin-left: 10px;
  }
  .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .texto_treinamento ul {
		list-style: circle;
  }

  .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .texto_treinamento ul li{
		list-style: circle;
		padding: 5px 10px;
  }

  .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .texto_treinamento ul li::marker {
	content: "•";
	color: black;
	font-size: var(--pix-padrao); 
    margin-right: 5px; 
}

	
   .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .cont_imagem_treinamento { 
	display: inline-block;
	width: 22%;
	height: auto;
	padding: 5px;
	overflow: hidden;
	vertical-align: top;
	border-left: 1px solid #eaeaea;
	}

  .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .cont_imagem_treinamento img{ 
	width: 100%;
	height: auto;
	cursor: pointer;
}

  .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .cont_imagem_treinamento legend{ 
	font-size: calc(13 * var(--pix-padrao));
    color: red;
    text-decoration: underline;
  }

 
  .treinamento .progressao {
	grid-row: 4;
	grid-column: 1;
	margin-left: calc(2 * var(--pix-padrao));
	margin-top: calc(2 * var(--pix-padrao));
}
  .treinamento .botoes_treinamento { 
	grid-row: 4;
	grid-column: 3;
	float: right;
	right: 10%;
	text-align: rigth;
	background-color: #ffffff;
	padding: 0px 0px 0px 10px;
	text-align: left;
	margin-left: calc(2 * var(--pix-padrao));
	margin-top: calc(2 * var(--pix-padrao));
	margin-right: calc(3 * var(--pix-padrao));
  }

  .treinamento .botoes_treinamento .btn-padrao {
	cursor: pointer;
	width: auto;
	position: relative;
	height: auto;
	margin: 5px 10px 0px 0px;
	display: inline-block;
	vertical-align: top;
	text-align: center;
	width: auto;
	font-size: calc(13 * var(--pix-padrao));
	line-height: calc(26 * var(--pix-padrao));
	padding: 0px 15px;
	font-weight: 600;
	color: rgba(0,0,0,0.5);
	font-family: var(--fonte-padrao);
	-moz-transition: all .3s ease;
	-o-transition: all .3s ease;
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
	background-color: #eaeaea; 
  }
  .treinamento .botoes_treinamento .btn-padrao.continuar {
	 background-color: var(--cor-principal); color: #ffffff; 
  }
  
  .treinamento .checkbox_leg {
	grid-row: 4;
	grid-column: 2;
	display: none;
	font-family: var(--fonte-padrao);
	font-size: calc(16 * var(--pix-padrao));
	margin-left: calc(2 * var(--pix-padrao));
	margin-top: calc(2 * var(--pix-padrao));
  }
  .treinamento .checkbox_leg .checkbox {
	display: inline-block;
	background-color: var(--cor-principal); 
	color: #ffffff; 
	margin-top: 10px;
	font-size: calc(28 * var(--pix-padrao));
  }
  

  .imagem_expandida { 
	position: absolute;
	width: 90%;
	max-width: 140vh;
	height: 90%;
	max-height: 93vh;
	text-align: center;
	background-color: #ffffff;
	padding: 0px;
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 10003;
	transform: translate(-50%, -50%);
	-o-transition: all 0.6s ease;
	-webkit-transition: all 0.6s ease;
	transition: all 5s ease-in-out 5s;
	overflow: hidden;
	border: 1vh solid blue;
	border-radius: 5vh;
	box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
	rgba(0, 0, 0, 0.3) 0px 30px 60px -30px; 
	}
  .cont_imagem_expandida { 
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: calc(100% - 4vw);
	height: calc(100% - 6vh);

  }
  .imagem_expandida a{
	line-height: 5vh;
	font-weight: 600;
	font-family: var(--fonte-padrao);
	font-size: 1.5vw;
	color: red;
	padding: 1.2vh 0px;
	text-decoration: underline;
	background-color: yellow;

  }	  

  .imagem_expandida img{
	padding: 1vh;
	margin-left: 4.5vw;
	border: 1px solid #eaeaea;
	overflow: auto;
	max-height: 98%;
  }
  
  .displayFlexColumn {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
	max-width: 400px;
  }

 @media screen and (orientation: portrait) { 

	.treinamento {

/*		display: grid;
*/		grid-template-columns: 20% 65% 15%;
		grid-template-rows: 4% 40% 50% 4%;


	}


  .treinamento .titulo_treinamento::after {
	font-size: 10px;
	color: red;
	line-height: .2;
	content: "\A<--- no celular, visualize na posição paisagem  --->";
	white-space: pre;
  }
  .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .texto_treinamento { 
	width: 65%;
  }
  .treinamento .icone{
	font-size: calc(35 * var(--pix-padrao));
  }

/*
  .treinamento .bloco_slide .cont_slide_show .slide {
	max-height: 27vh; 
	max-width: 72vw;

}
  .treinamento .bloco_slide .cont_slide_show .slide {
	top: 23%;
	left: 57%;
}

  .treinamento .icone{
/*	font-size: 0.6rem; 
	margin-top: 0.5vh;
	cursor: pointer;
	line-height: 0.5;
	}
	
	.treinamento .fechar{
		text-align: center;
	}
	.treinamento .fechar .icone{
		margin-left: 0.8vw;
	}
  
	.treinamento .fechar .fa-arrow-up-right-from-square{
		display: none;
	}

	.treinamento .menu_treinamento { 
		font-size:0.8rem;
	}
	
  .imagem_expandida a{
	line-height: 5vh;
	font-weight: 600;
	font-family: var(--fonte-padrao);
	font-size: 1em;
	color: red;
	padding: 1.2vh 0px;
	text-decoration: underline;
	background-color: yellow;

  }	  

	.treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento{
		width: 97%;
	}
	.treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .texto_treinamento{
		width: 75%;
		font-size: 1rem;

	}
  .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .cont_imagem_treinamento { 
		max-width: 19%;
	}
  .treinamento .botoes_treinamento .btn-padrao {
    right: 5vw;
    top: 1vh;
	font-size: 0.5rem;
	line-height: 3vh;
  }
  .treinamento .checkbox_leg {

	font-size: 1rem;
  }
*/
}

 @media screen and (max-width: 799px) { 

	.treinamento {

	grid-template-rows: 5% 63% 25% 5%;
	}


  .treinamento .icone{
	font-size: calc(27 * var(--pix-padrao));
	margin-top: calc(12 * var(--pix-padrao));

  }

  .treinamento .cont_texto_imagem_treinamento .cont_texto_treinamento .texto_treinamento { 
	width: 70%;
  }

 }