#base menu {
	clear:both;
	width:100%;
	background-color:var(--blue-lgt);
	padding:10px;
	overflow: hidden;
	margin-bottom:25px;
}
#base menu li { float:left; width:25%; }
#base menu li a {
	display: block;
	color:#ccc;
	border-bottom:5px solid #ccc;
	margin:2px;
	padding: 10px;
	text-align: center;
	font-size: 14px;
}
#base menu li a.enable { border-bottom:5px solid yellow; color:var(--blue); cursor:pointer; }
#base menu li a.ok { border-bottom:5px solid green; }
#base menu li a.selected { border-bottom:5px solid orange; }
.progresso-area {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	margin: 8px 0;
}
#progresso{ flex: 1; height: 12px; pointer-events: none; /* não aceita clique */ }
#section-3 { min-height:300px!important; }
#section-3 .pergunta{ padding: 15px; border-bottom:1px solid #ccc; }
#section-3 .pergunta li{ margin:5px }
#section-3 .pergunta input{ margin-right:7px }
div.menu { display:none }
#certificado{ outline: 1px solid #ccc; padding:70px 50px; }
#section-4 *{ color:black; text-align: center; max-width: 100% }
#base footer{ background-color: var(--blue-lgt); overflow: hidden; padding: 10px 20px }
#base footer a{ float:left; font-size:14px; cursor:pointer }
#base footer img{ width: 33px; margin-right:10px }
#base .loading{ width:100%; }
#base .left{ float:left }
#base .right{ float:right }
#base section{ min-height: 100px }
#base fieldset{ width: 100% }
#section-2 .video{ width:100%; }
#section-2 .video video{ width:100%; }
#base iframe{ width: 100%; height:550px }
#section-3 div.pergunta#pergunta-5{ border:none }
#base button.next{ background-color: white; color:var(--blue); border:1px solid var(--blue) }
.progresso-area{ position:relative; }
#progresso-controle{ width: 97%; position: absolute; background-color: transparent; overflow: hidden;  }
#progresso-controle button{ border-left: 1px solid var(--blue); width: 20%; float:left; margin: 0; background-color: transparent }
#progresso-controle button:first-child{ border:none }
#progresso-controle button.liberado{ border-left: 1px solid var(--blue); width: 20%; float:left; margin: 0; background-color: rgba(10,110,180,0.4) }
@media screen and (max-width: 660px) {
	*{ max-width: 100%!important; min-width: auto!important; }
	header.sub{ height: 105px; }
	header.sub h3{ font-size:16px; text-align:center; padding:0 10px; margin:0; margin-top:10px }
	header.sub menu{  margin: 0; margin-top:15px }
	header.sub menu li { border-top:1px solid white; width:100%; display: block }
	header.sub menu a{ padding:10px; }
	#base menu{ padding:0; margin-bottom: 10px; }
	#base menu li { width:50%; border: 1px solid var(--blue-avg) }
	#base section{ padding: 0 }
	#base footer{ padding: 0 }
	#base footer a{ width: 100%; padding-top:15px; margin-bottom:15px; border-top:1px solid #ccc }
	#base button.next{ margin:25px 0!important; width: 100%; float: none; }
	#progresso-controle{ width: 91%;  }
  #form1 #base #progresso-controle button{ margin: 0!important; }
  #base #playPause, #velocidade, #base #section-3 button.save{ width: 100%; margin:10px 0!important; }
}