html, body, main{
	/*height:100%;*/
}

body{
	/*overflow-y: clip;*/
	/*height: 100vh;*/
  transition: all 1s;
}

html{

}

.playerScorm{
	background-color: var(--cor_1_nav);
	color:  var(--cor_1_txt);
	height:40px;
	position: fixed;
	z-index: 9999;
	top: 0;
	padding:0;
}

.contentScormMenu{
	display: flex;
	align-items: center;
	justify-content:center;
	height: 40px;
}

.contentScormMenu .element-menu{
	display: flex;
	align-items: center;
	height: 100%;
	padding: 0 15px;
	position: relative;
	cursor: pointer;
	transition: all .3s;
	/*background-color: #66a0c3;*/
	position:  relative;
}

.sub-menu{
	position: absolute;
	top: 0;
	left: 0;
	background-color: var(--cor_3_nav);
	top:  40px;
	display: none;
}

.contentScormMenu .element-menu.select::after{
	content:"";
	width: 100%;
	height: 3px;
	background-color:  #00619a;
	bottom : 0px;
	left:  0;
	position:  absolute;
}

.contentScormMenu .element-menu:hover{
	background-color: var(--cor_1_link_hover);
	color: var(--cor_1_nav);
}

.contentScormMenu .element-menu:hover .sub-menu{
	display: block;
	min-width: 250px;
	max-width: 250px;
}

.contentScormMenu .element-menu .sub-menu .element-sub-menu{
	padding:  5px 15px;
	border-top: solid 1px rgba(255,255,255,.1);
	color: var(--cor_3_txt);
}

.contentScormMenu .element-menu .sub-menu .element-sub-menu:hover{
	/*background-color: #66a0c3;*/
	color: var(--cor_3_link_hover);
}

.contentScormMenu p{
	margin-bottom: 0;
	text-transform: uppercase;
	font-size:.9em;
}

.contentScormMenu .element-menu:hover .arrow-down{
	border-right: 2px solid var(--cor_1_nav);
  border-top: 2px solid var(--cor_1_nav);
}

.arrow-down{
	  width: 10px;
    height: 10px;
    border-right: 2px solid #fff;
    border-top: 2px solid #fff;
    margin-left: 10px;
    transform: rotate(135deg);
    margin-bottom: 7px;
}

.container-progress{
	position: fixed;
	transform: translateY(-50%);
	top:50%;
	width: 40px;
	right: 15px;
	z-index: 9999;
}

.element-container-progress{
	width:  50px;
	height:  50px;
	position:  relative;
	margin-bottom: 35px;
}

.element-container-progress div{
	/*background:  #005f98;*/
	background-color: var( --cor_2 );
	border-radius: 50%;
	width:  30px;
	height:  30px;
	box-shadow: 0px 0px 10px rgb(0 , 0 , 0 , .5 );
	border-radius: 50%;
	position:  absolute;
	transform: translate(-50% , -50%);
	left: 50%;
	top: 50%;
	z-index:2;
}

.element-container-progress::before{
	content: "";
	width:  5px;
	height:  5px;
	border-radius: 50%;
	background:  #fff;
	position:  absolute;
	transform: translate(-50% , -50%);
	left: 50%;
	top: 50%;
	z-index: 3;
}

.element-container-progress::after{
	content: "";
	position:  absolute;
	width: 0px;
	height: 55px;
	border-right: solid 2px var(--cor_2);
	transform:  translateX(-50%);
	left: 50%;
	bottom: -45px;
	z-index: -1;
}

.element-container-progress:nth-last-child(2)::after{
	border-right: dotted 2px var(--cor_2);
}

.element-container-progress:nth-last-child(1)::after{
	content:  unset;
}

.element-container-progress:nth-last-child(1){
	margin-bottom: 0;
	background:  unset;
	background-color: var(--cor_3);
	background-image: url(../imgs/icon_trofeu.png);
	background-size: 50%;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 50%;
	margin-left: 5px;
	width: 40px;
	height: 40px;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 50%);
}

/*.element-container-progress.complete{
	background-color: #005f98;
}*/

.element-container-progress svg{
	fill: none;
	position:  absolute;
	transform: rotate(270deg);
	z-index: -1
}

.element-container-progress .medal-progress, .element-container-progress .seen-progress{
	position: absolute;
	width: 30%;
	margin-top: 12%;
	background-color:unset;
	display: none;
	box-shadow: unset;
}

.element-container-progress.complete div, .element-container-progress.seen div{
	background-color: var(--cor_3);
}

.element-container-progress.complete::after, .element-container-progress.seen::after{
	border-right: solid 2px var(--cor_3);
}

.element-container-progress.complete .medal-progress{
	display: block;
	background-color: unset;
}

.element-container-progress.seen .seen-progress{
	display: block;
	background-color: unset;
}

.element-container-progress .medal-progress svg, .element-container-progress .seen-progress svg{
	stroke: none;
	fill: #fff;
	transform: rotate(0deg);
}

.element-container-progress.complete::before{
	display: none;
}

.graphicProgress{
	/*stroke: #507f9d;*/
	stroke: var( --cor_1 );
	stroke-width: 5;
	transition:  all .3s;
}

.btn-menu-mobile{
	width: 25px;
	height: 30px;
	padding:  3px 0;
}

.btn-menu-mobile div{
	width:  100%;
	height:  3px;
	border-radius: 10px;
	background-color: #fff;
	margin:  6px auto;
}

.contentScormMenuMobile .container-progress{
	position: relative;
	display:flex;
	width: 260px;
	transform: scale(0.9);
	top: 0;
	right:  0;
}

.contentScormMenuMobile .element-container-progress{
	width:  30px;
	height:  40px;
	position:  relative;
	margin-right: 15px;
}

.contentScormMenuMobile .element-container-progress div{
	background:  #005f98;
	border-radius: 50%;
	width:  25px;
	height:  25px;

	border-radius: 50%;
	position:  absolute;
	transform: translate(-50% , -50%);
	left: 50%;
	top: 50%;
}

.contentScormMenuMobile .element-container-progress::before{
	content: "";
	width:  3px;
	height:  3px;
	border-radius: 50%;
	background:  #fff;
	position:  absolute;
	transform: translate(-50% , -50%);
	left: 50%;
	top: 50%;
	z-index: 2;
}

.contentScormMenuMobile .element-container-progress::after{
	content: "";
	position:  absolute;
	width: 21px;
	height: 0px;
	border-top: solid 2px #005f98;
	transform:  translateY(-50%);
	top: 50%;
	left: unset;
	bottom: unset;
	right: -18px;
}

.contentScormMenuMobile .element-container-progress:nth-last-child(2)::after{
	border-right: dotted 2px #005f98;
}

.contentScormMenuMobile .element-container-progress:nth-last-child(1)::after{
	content:  unset;
}

.contentScormMenuMobile .element-container-progress:nth-last-child(1){
	margin-right: 0;
	background:  unset;
	background-color: #0d1929;
	background-image: url(../imgs/icon_trofeu.png);
	background-size: 60%;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 50%;
	height: 30px;
  margin-top: 5px;
}

.contentScormMenuMobile .element-container-progress.complete{
	background-color: #005f98;
}

.contentScormMenuMobile .element-container-progress svg{
	fill: none;
	position:  absolute;
	transform: rotate(270deg);
	top:  5px;
}

.menu-mobile{
	position: fixed;
	z-index: 10;
	left: 0;
	top: 40px;
	width: 100%;
	height:  calc(100% - 40px);
	background: #fff;
	transition:  all .3s;
	left: -100%;
	overflow-y: auto;
}

.menu-mobile.active{
	left:  0;
}

.menu-mobile .sub-menu {
    position: relative; 
    background-color: unset;
    display: block;
    top: 0;
}

.menu-mobile .element-menu{
	border-bottom: solid 2px #ccc;
	background:  #f5f5f5;
}

.menu-mobile .element-menu.select{
	border-bottom: solid 2px #ccc;
	background:  #005f98;
	color: #fff;
}

.menu-mobile .element-menu p{
	padding:  .5em 1em;
	margin-bottom: 0;
}

.menu-mobile .element-menu .element-sub-menu{
	border-top: solid 1px #ccc;
	background: #fff;
	padding-left: 20px;
	color: #9a9a9a;
}

.btn-download{
	position: absolute;
	right:2px;
	top: 4px;
	width:  32px;
	cursor:  pointer;
}

.contentScormMenuMobile .btn-download{
	position: relative;
	right:2px;
	top: 4px;
	width:  32px;
	height:  32px;
	cursor:  pointer;
}

.container-podcast .playerAudio{
	background-color: var(--cor_1);
	display:  flex;
	width:100%;
	min-height: 50px;
	color: #fff;
	align-items: center;
	padding: 1em;
}

.container-podcast .playerAudio .btn-play-audio{
	width: 50px;
	height: 50px;
	background-size: 100%;
	cursor: pointer;
	margin-right: 1em;
	background-repeat: no-repeat;
	background-position:center;
}

.container-podcast .playerAudio .btn-play-audio[status='play']{
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><defs></defs><rect width='100' height='100' opacity='0'/><path fill='white' d='M304.85,557.87V490.36a7,7,0,0,1,10.78-5.79l51.08,33.75a6.94,6.94,0,0,1,0,11.59l-51.08,33.76A7,7,0,0,1,304.85,557.87Z' transform='translate(-284.85 -474.12)' /></svg>");
}

.container-podcast .playerAudio .btn-play-audio[status='pause']{
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 101 101'><defs></defs><rect opacity='0' x='0.5' y='0.5' width='100' height='100'/><rect fill='white' x='18.22' y='9.79' width='22.42' height='81.43' rx='9'/><rect  fill='white' x='60.36' y='9.79' width='22.42' height='81.43' rx='9'/></svg>");
}

.container-podcast .playerAudio .container-time-line{
	width: 100%;
	position: relative;
	display: flex;
	align-items: center;
	margin: 0 1em;
}

.container-podcast .playerAudio .container-time-line:before{
	content: '';
	position: absolute;
	width: 100%;
	border-bottom: solid 4px rgba(0,0,0,.2);
}

.container-podcast .playerAudio .container-time-line .knob-time-line{
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(-50% , -50%);
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background-color: #fff;
	cursor: pointer;
}

.container-podcast .analyser_render{
	width: 100%;
	height:  100px;
	margin-bottom: -8px;
}

.container-podcast .btn-volume-audio, .container-podcast .btn-download-audio{
	width: 40px;
	cursor: pointer;
	margin-left: 15px;
	position:  relative;
}

.container-podcast .btn-volume-audio svg *{
	pointer-events: none;
}

.container-podcast .btn-volume-audio svg rect, .container-podcast .btn-volume-audio svg path, .container-podcast .btn-download-audio svg rect, .container-podcast .btn-download-audio svg path{
	fill: none;
}
.container-podcast .btn-volume-audio svg path, .container-podcast .btn-download-audio svg polyline, .container-podcast .btn-download-audio svg circle{
	fill: #fff;
}

.container-podcast .btn-volume-audio svg g path, .container-podcast .btn-download-audio svg path{
	fill: none;
	stroke: #fff;
	stroke-width: 5;
}

.container-podcast .volume-podcast{
	position: absolute;
	height: 100px;
	background-color: var(--cor_1);
	width: 30px;
	bottom: 65px;
	transform:  translateX(-50%);
	left: 50%;
}

.container-podcast .volume-podcast[status='disabled']{
	display: none;
}

.container-podcast .volume-podcast[status='enabled']{
	display: block;
}

.container-podcast .volume-podcast .line-volume{
	position: absolute;
    background-color: #fff;
    width: 2px;
    height: 70px;
    left: 14px;
    top: 15px;
}

.container-podcast .volume-podcast .line-volume .knob-volume{
	position: absolute;
	width: 10px;
	height: 10px;
	transform:  translate(-50%, -50%);
	top: 0;
	border-radius: 50%;
	background-color: #fff;
	left: 50%;
	cursor: pointer;
}

.container-audio-aula .playerAudio{
	/*background-color: var(--cor_1);*/
	background-color: var(--cor_5);
	display:  flex;
	width:100%;
	min-height: 50px;
	color: #fff;
	align-items: center;
	padding: 1em;
}

.container-audio-aula .playerAudio .btn-play-audio{
	width: 50px;
	height: 50px;
	background-size: 100%;
	cursor: pointer;
	margin-right: 1em;
	background-repeat: no-repeat;
	background-position:center;
	display:  flex;
}

.container-audio-aula .playerAudio .btn-play-audio[status='play']{}

.container-audio-aula .playerAudio .btn-play-audio rect{
	fill: none;
}

.container-audio-aula .playerAudio .btn-play-audio path, .container-audio-aula .playerAudio .btn-play-audio g rect{
	fill: var(--cor_1);
}

.container-audio-aula .playerAudio .btn-play-audio[status='pause']{}

.container-audio-aula .playerAudio .container-time-line{
	width: 100%;
	position: relative;
	display: flex;
	align-items: center;
	margin: 0 1em;
}

.container-audio-aula .playerAudio .current-time-audio, .container-audio-aula .playerAudio .total-time-audio{
	color: rgba(0,0,0,.5);
}

.container-audio-aula .playerAudio .container-time-line:before{
	content: '';
	position: absolute;
	width: 100%;
	border-bottom: solid 4px rgba(0,0,0,.2);
}

.container-audio-aula .playerAudio .container-time-line .knob-time-line{
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(-50% , -50%);
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background-color: var(--cor_1);
	cursor: pointer;
}

.container-audio-aula.play_sem_timeline .playerAudio {
    background-color: unset;
    border-radius: 50%;
    border: solid 3px var(--cor_5);
    width: 55px;
    height: 55px;
    color: #fff;
    align-items: center;
    padding: 0em;
}

.container-audio-aula.play_sem_timeline .playerAudio .btn-play-audio{
	width: 30px;
    height: 30px;
    cursor: pointer;
    margin-left: 10px;
}

@media ( max-width: 768px ){
	.container-progress{
		top: unset;
		right: 0;
		bottom: 0;
	    width: 100%;
	    display: flex;
	    transform: unset;
	    display: flex;
	    width: 100%;
	    background-color: var(--cor_1_nav);
	    justify-content: center;
	}

	.element-container-progress::after {
	    width: 55px;
	    height: 0px;
	    border-right: unset;
	    border-top: solid 2px #005f98;
	    transform: translateY(-50%);
	    left: 30px;
	    bottom: unset;
	    top: 50%;
	}

	.element-container-progress {
	    margin-bottom: unset;
	    margin-right: 20px;
	}

	.element-container-progress:nth-last-child(1) {
	    margin-left: 5px;
	    width: 33px;
	    height: 33px;
	    margin-top: 8px;
  }  
}