:root{
	--main-font-14: 14px;
	--main-font-16: 16px;
	--main-font-18: 18px;
	--main-font-20: 20px;
	--main-font-25: 25px;
	--main-font-30: 30px;
	--main-font-36: 36px;
	--main-font-45: 45px;
	--main-font-48: 48px;
	--main-font-60: 60px;
	--main-font-70: 70px;
	--main-font-90: 90px;
}

*{
	margin      : 0px;
	padding     : 0px;
	font-family :  'Roboto', sans-serif;
}

p{
	margin-bottom: 10px;
}

.pull-center{
	margin: 0 auto;
	display: table;
}

body {
	background : url('../imgs/bg_card.png');
	background-size:cover;
	width: 100%;
	height: 100vh;
	background-repeat: no-repeat;
	background-color: #f4f4f4;
}

.header{
	display         : flex;
	flex-direction  : row;
	justify-content : space-between;
	align-items     : flex-end;
	height: 60px;
}

.header .col-left{
	width: 10%;
	height: auto;
 }


 .header .col-left .azure{
	width: 35px;
    height: 80px;
    margin-left: 66px;
    background-image: linear-gradient(to bottom, #00ffc9, #00e1f1, #00bdff, #0091ff, #0050ff);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 5px;
    padding-right: 2px;
}

.header .col-right{
	width: 88%;
	height: 60px;

 }

 header .col-right ul {
	width: 100%;
	display: flex;
	list-style-type: none;
	margin-right: 15px;
	justify-content: flex-end;
	align-items: center;
	height: 60px;
}

.header .col-right ul li {
	margin-right: 15px;
    font-size: 12px;
}


.header .col-right ul li a .home {
	width: 40px;
	height: 40px;
	background-size: 100% 100%;
	background-image: url(../imgs/icones/icon_home.svg);
	background-repeat: no-repeat;
}

.header .col-right ul li a .home:hover {
	background-size: 100% 100%;
	background-image: url(../imgs/icones/icon_home_hover.svg);
	background-repeat: no-repeat;
}

.header .col-right ul li a .modulo {
	width: 40px;
	height: 40px;
	background-size: 100% 100%;
	background-image: url(../imgs/icones/icon_modulo.svg);
	background-repeat: no-repeat;
}

.header .col-right ul li a .modulo:hover {
	background-size: 100% 100%;
	background-image: url(../imgs/icones/icon_modulo_hover.svg);
	background-repeat: no-repeat;
}

.header .col-right ul li a .hamburgue {
	width: 40px;
	height: 40px;
	background-size: 100% 100%;
	background-image: url(../imgs/icones/icon_hamburgue.svg);
	background-repeat: no-repeat;
}

.header .col-right ul li a .hamburgue:hover {
	background-size: 100% 100%;
	background-image: url(../imgs/icones/icon_hamburgue_hover.svg);
	background-repeat: no-repeat;
}

.menu-topo li:nth-child(2)::before {
	display: inline-block;
    padding-right:17px;
    color: #6c757d;
    content: "/";
}

.header .col-right .menu_header{
	display         : flex;
	list-style-type : none;	   
}

.header .col-right .menu_header li{
	display      : flex;
	align-items  : center;
	padding-left : 20px;
	font-size    : 12px;
	margin-right: 35px;
}


.header .logo_senai{
	width  : 112px;
	height : 37px;
}

.cards .menu-hamburgue{
	background          : white;
    width               : 350px;
    height              : 100vh;
    z-index             : 10;
    position            : absolute;
    top                 : 0;
	margin              : 0;
	left                : -100%;
	transition-duration : 0.5s;	
    border-right: 3px #4949493b solid;
}


.cards .menu-hamburgue .top{
	width            : 100%;	
	height           : 50px;
	background-image : linear-gradient(to right, #0050ff, #0091ff, #00bdff, #00e1f1, #00ffc9);
	margin           : 0;
	display          : flex;
	align-items      : center;
	justify-content  : space-between;
}

.cards .menu-hamburgue .top img{
	padding-left: 20px;
}

.cards .menu-hamburgue .top a{
	padding-right: 20px;
    font-size: 30px;
    color: #004B70;
}

.cards .menu-hamburgue .menu-hamburgue-container{
    display: flex;
	flex-direction: column;
	background: #f4f4f4;
	height: 100vh;
}

.cards .menu-hamburgue .menu-hamburgue-container .card-menu-list-group{
margin: 0;
}

.cards .menu-hamburgue .menu-hamburgue-container .card-menu-list-group .card-menu-list-group-item{
	height: 30px;
    line-height: 30px;
    text-align: center;
    background: #618CB4;
    color: white;
}

.cards .menu-hamburgue .menu-hamburgue-container .card-menu-list-group .card-menu-list-group-itens{

    width: 100%;
	min-height: 30px;
	display: flex;
	justify-content: center;
	align-items: center;


}

.cards .menu-hamburgue .menu-hamburgue-container .card-menu-list-group .card-menu-list-group-itens .menu_inativo{
    background: #c1c1c1;
    color: #f0f0f0;
    cursor: no-drop;
}

.cards .menu-hamburgue .menu-hamburgue-container .card-menu-list-group .card-menu-list-group-itens .menu_inativo:hover{
    background: #c1c1c1;
	color: #f0f0f0;
}

.cards .menu-hamburgue 
.menu-hamburgue-container 
.card-menu-list-group 
.card-menu-list-group-itens a{
	background: #f4f4f4;
    width: 100%;
    min-height: 30px;
    text-decoration: none;
    text-align: center;
    color: #565656;
    border-bottom: 2px #dedede solid;
}

.cards .menu-hamburgue 
.menu-hamburgue-container 
.card-menu-list-group 
.card-menu-list-group-itens .checked{
    background: #e4e4e4!important;
    color: #618cb4!important;
}


.cards .menu-hamburgue 
.menu-hamburgue-container 
.card-menu-list-group 
.card-menu-list-group-itens  a:hover{
	background: #e4e4e4;
	color: #618cb4;
}

.cards .menu-hamburgue .menu-hamburgue-container .titulo-curso{
	background: #e6e6e6;
    text-align: center;
    height: 40px;
    line-height: 40px;
    font-weight: bold;
    color: #666666;
}

.cards .menu-hamburgue-action{
	transition-duration: 0.5s;
    left: 0px;
}

section .menu{
	position       : fixed;
	width          : 60px;
	height         : 89%;
	z-index        : 1;
	right          : 0;
	display        : flex;
	align-items    : center;
	justify-content: center;
	flex-direction : column;
}

section .menu #slider{
	height: 200px;
	transform: rotate(180deg);
	background-image: linear-gradient(to bottom, #00ffc9, #00e1f1, #00bdff, #0091ff, #0050ff);
	width: 3px;
	border-radius: 0;
}

section .menu .ui-state-disabled{
    opacity: 1!important;
}

section .menu .ui-slider-vertical .ui-slider-range-min{

	background-image: linear-gradient(to bottom, #00ffc9, #00e1f1, #00bdff, #0091ff, #0050ff);
	
}

section .menu #slider span{
	left:-8px;
	border-radius: 14px;
	width: 1em;
	height: 1em;
	border: 2px solid #00FFC9;

}

section .bt-up{
	font-size: 22px;
	color: #00FFC9;
	margin-bottom: 10px;
}
section .bt-down{
	font-size: 22px;	
	color: #0050FF;
	margin-top: 10px;
}

section .pagina{
  padding: 40px 60px 40px 60px;

}

section .pagina .conteudo_questao{
 height: 100%;

}

section .pagina .row{
 height: 100%;
 display: flex;
 align-items: center;
}

.font-14{
	font-size: 14px;
}

.font-16{
	font-size: 16px;
}

.font-18{
	font-size: 18px;
}

.font-20{
	font-size: 20px;
}

.font-25{
	font-size:25px;
}

.font-36{
	font-size: 36px;
}

.font-40{
	font-size:40px;
}

.font-45{
	font-size:45px;
}

.font-48{
	font-size: 48px;
}

.font-55{
	font-size: 55px;
}

.font-60{
	font-size: 60px;
}

.font-70{
	font-size:70px;
}

.font-90{
	font-size:90px;
}

.margin-top-10{
	margin-top: 10px;
}

.margin-top-20{
	margin-top: 20px;
}

.margin-top-30{
	margin-top: 30px;
}

.margin-botom-10{
	margin-bottom: 10px;
}

.margin-botom-20{
	margin-bottom: 20px;
}

.margin-botom-10{
	margin-bottom: 10px;
}

.margin-botom-40{
	margin-bottom: 40px;
}

.class_50{
	width: 50%;
}

.class_100{
	width: 100%;
}

.tablet{
    background: url(../imgs/tablet.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
	max-width: 74%;
    height: 600px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 70px;
    color: white;
    font-size: 20px;
}

.container_video{
	background: black;
}


.card-border-top-buttom{
    border-top: 5px #4D4C4D solid;
	border-bottom: 5px #4D4C4D solid;
	color: #4D4C4D;
    font-size: 30px;
	font-weight: bolder;	
}

.card-border-top-buttom div{
	width: 87%;	
}

.box-player{
	width: 100%;
	min-height: 100px;
	display: flex;
	align-items: center;
}

.box-player .descricao{
border-left: 5px #333333 solid;
color: #333333;
padding-left: 10px;
font-size: 16px;
}

.box-table{
	width: 100%;
	border-spacing: 5px;
    border-collapse: separate;
}

.box-table th, .box-table td{
	width: 50%;
	text-align: center;
}

.box-table th{
    color: white;
    background: #4D4C4D;
    border-spacing: 2px;
    height: 28px;
	font-weight: bolder;
	font-size: 16px;
}

.box-table td{
	color: #4D4C4D;
background: #ffffff;
border-spacing: 2px;
font-size: 16px;
}


.card-descricao{
	width: 100%;
    height: 100%;
	min-height: 340px;
	display: flex;
	justify-content: center;

}

.card-simples{
	border:1px #333333 solid;
}

.card-azul{
	background: #00BAE8;
	color: white;

}

.card-azul i{
	font-size: 120px;
}

.card-azul a{
	color: white;
	font-size: 20px;
}

.card-escuro{
	color: white;
	background: #333333!important;

}

.card-descricao p,.card-descricao div{

    padding: 20px
}

.load_questao{
	width: 100%;
	height: 112px;
    display: flex;
    justify-content: center;
    align-items: center;
}


.questao{
	margin-top: 20px;
	}

	.questao .form-check{
	margin-bottom:10px;
	}

	.questao .check-ativo{
	background: #1B8CD3;
	}

	.questao .form-check .form-check-label{
	height: 25px;
	}
	.questao .questao-titulo{
	font-size: 70px;
	}

	.questao button{
	margin-top: 20px;
	border-radius: 0px;
	width: 200px;
	}

	.questao .card{
		background-color: #fff0;
		border: 1px solid #1B8CD3;
		min-height: 118px;
		cursor: pointer;
	}

	.questao .card .card-body{
		padding: 0.25rem;
		width: 100%;
	}

	.questao .card .card-body p b{
		font-size: 30px;
	}

	.questao .questao-titulo span{
	color: #1B8CD3;
	height: 60px;
	}
	.questao .list-group-horizontal{
	width: 100%;
	margin-bottom: 20px;
	}

	.questao .list-group-horizontal .list-group-item{
	width: 50%;
	margin-right: 5px;
	padding: 0px;
	height: 8px!important;
	}
	
	.class_visible{
		display: none;
	}
	
	.class_block{
		display: block;
	}

	.itens-center{
		display    : flex;
		align-items: center;
		justify-content: center;
	}

	nav {

		height: 60px;
	}
	
	nav img {
	    width: 130px;
        margin: 0 auto;
	}


.list_itens_grupos_destaques{
    text-align: left;
    list-style: none;
    width: 100%;
    height: auto;
}

.list_itens_grupos_destaques li{
    background: #C1DEF1;
    border-left: 20px #0065AF solid;
    padding: 5px 0px 5px 10px;
    margin-bottom: 10px;
}

.list_itens_grupos_destaques li p{
    margin-bottom: 0px;
    font-size: 16px;
}

.list_itens_grupos_badge{
    text-align: left;
    list-style: none;
    width: 100%;
    height: auto;
}

.list_itens_grupos_badge li{
    background: #EEF4FC;
    margin-bottom: 10px;
    display: flex;
   
}

.list_itens_grupos_badge li .titulo{
	min-width: 110px;
    min-height: 90px;
    background: #49C1E7;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 30px;
    font-weight: bolder;
    color: white;
    padding: 10px;
}

.list_itens_grupos_badge li .descricao{
    padding: 10px;
    font-size: 18px;
    display: flex;
    align-items: center;
}



 .card-itens{
    background: url(../imgs/images/global/itens_titulos.svg);
    background-size: cover;
    width: 250px;
    height: 75px;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    font-size: 25px;
    color: white;
    font-weight: bold;
    margin: 5px;
}

.card-gradiente{
 
    -webkit-box-shadow: -4px 29px 18px -25px rgba(0,0,0,0.63);
-moz-box-shadow: -4px 29px 18px -25px rgba(0,0,0,0.63);
box-shadow: -4px 29px 18px -25px rgba(0,0,0,0.63);
}

.card-header-gradiente{
    background-image: linear-gradient(to right, #67e5f1, #00ccf5, #5f6cd9ab, #5f6cd9, #5f6cd9)!important;
    color: white;
    font-size: 20px;
    font-weight: bolder;
    -webkit-box-shadow: -4px 29px 18px -25px rgba(0,0,0,0.63);
-moz-box-shadow: -4px 29px 18px -25px rgba(0,0,0,0.63);
box-shadow: -4px 29px 18px -25px rgba(0,0,0,0.63);
text-align: center;
}

.card-marcador{
    width: auto;
    height: 160px;
    background: #ffffff00;
    border: 1px black solid;
    display: flex;
	align-items: center;
	margin-bottom: 10px;
}

.card-marcador .card-body{
    display: flex;
    align-items: center;
}

.card-marcador::before{
    content: "";
    background: url(../imgs/images/global/card_marcador.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: absolute;
    width: 130px;
    height: 130px;
    top: -117px;

}

.card-style{
    background: white;
    width: auto;
    min-height: 160px;
    border-radius: 15px;
    -webkit-box-shadow: -4px 29px 18px -25px rgba(0,0,0,0.63);
-moz-box-shadow: -4px 29px 18px -25px rgba(0,0,0,0.63);
box-shadow: -4px 29px 18px -25px rgba(0,0,0,0.63);
    display: flex;
    justify-content: left;
    align-items: center;
    color: black;
    font-size: 16px;
    padding: 10px 10px 10px 10px;
    margin-bottom: 10px;
}

.card-style-border-left-roxo{
    border-left: 13px #8789EC solid;
    text-align: left;
}

.card-style-border-left-anil{
    border-left: 13px #70B1F6 solid;
    text-align: left;
}

.card-style-border-left-azul{
    border-left: 13px #1A98F1 solid;
    text-align: left;
}

.card-style-border-left-azul-claro{
    border-left: 13px #49C1E7 solid;
    text-align: left;
}

.card-style-border-left-verde{
    border-left: 13px #3CADA9 solid;
    text-align: left;
}

.card-style-border-left-turquesa{
    border-left: 13px #32CCD8 solid;
    text-align: left;
}

.grupo-badge-azul{
    background: #49C1E7!important;
}

.grupo-badge-roxo-claro{
    background: #70B1F6!important;
}

.grupo-badge-roxo{
    background: #8789EC!important;
}

.card-style-bg-left-anil{
    background:  #70B1F6!important;  
}

.card-style-bg-left-roxo{
    background:  #8789EC!important;  
}

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

		.pagina{
			height: auto!important;
			padding-bottom: 47px;
		}	
		.font-48{
			font-size: 28px;
		}

		.font-90,.font-70{
			font-size: 33px;
		}
		.d-flex{
			display: contents!important;
		}

		section .pagina{
			padding: 20px 10px 40px 10px;
		}

		.margin-botom-20{
			margin-bottom: 10px;
		}

		.margin-botom-40{
			margin-bottom: 10px;
		}

		.menu_header li:nth-child(1),
		.menu_header li:nth-child(2),
		.menu_header li:nth-child(3),
		.menu_header li:nth-child(4),
		.menu_header li:nth-child(5){
			display: none;
		}

		.header .col-left .azure{
			width: 40px;
			height: 60px;
			margin-left: 9px;
		}
	
		.header .menu_header{
			margin-right: 15px;
		}

		.row{
		 margin-right: 0px;
    	 margin-left: 0px;
		}
		
		.titulo-pag-12{
			height: auto;
			width: auto;
			font-weight: bold;
		}
		#conteudo video{
			margin: 0px auto;
			display: table;
		}

		.card-border-top-buttom{
			font-size: 35px;
		}

		.margin-top-20{
			margin-top: 10px;
		}
		
	}

	@media screen and (max-width:770px){
		.header .col-right ul .titulo {
			display: none;
		}

		.menu-topo li:nth-child(2)::before{
			display: none;
		}

		.fixed-bottom{
			position: relative;
		}

		.font-40{
			font-size:30px;
		}

		.font-45{
			font-size:30px;
		}
		
		section .pagina {
			padding: 10px 30px 40px 10px!important;
		}

		.card-descricao{
			min-height: 210px;
		}

		.list_itens_grupos_badge li{
			flex-direction: column;
		}
		.list_itens_grupos_badge li .titulo{
			min-height: 60px;
		}

		.list_itens_grupos_badge li .descricao{

			font-size: 16px;
		}
	}

	@media screen and (max-width: 400px) {
		.card-border-top-buttom{
			font-size: 23px;
			justify-content: center;
		}

	}

	.load{
		width: 100%;
		background: #000000c2;
		height: 100vh;
		position: absolute;
		margin: 0;
		padding: 0;
		bottom: 0;
		display: flex;
	
		align-items: center;
		z-index: 1000;
	}
	.loader,.loader:after {
		border-radius: 50%;
		width        : 10em;
		height       : 10em;
	}

	.loader {
		margin           : 60px auto;
		font-size        : 10px;
		position         : relative;
		text-indent      : -9999em;
		border-top: 1.1em solid #0091ff;
	border-right: 1.1em solid #00bdff;
	border-bottom: 1.1em solid #00e1f1;
	border-left: 1.1em solid #00ffc9;
		-webkit-transform: translateZ(0);
		-ms-transform    : translateZ(0);
		transform        : translateZ(0);
		-webkit-animation: load8 1.1s infinite linear;
		animation        : load8 1.1s infinite linear;
	}

	@-webkit-keyframes load8 {
	0% {
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	}
	100% {
	-webkit-transform: rotate(360deg);
	transform: rotate(360deg);
	}
	}
	@keyframes load8 {
	0% {
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	}
	100% {
	-webkit-transform: rotate(360deg);
	transform: rotate(360deg);
	}
	}

	.blob {
		border-radius   : 50%;
		height          : 15px;
		width           : 15px;
		box-shadow      : 0 0 0 0 rgba(0, 0, 0, 1);
		transform       : scale(1);
		animation       : pulse 2s infinite;
		position        : absolute;
		right           : 26px;
		top             : 7px;
		background-image: linear-gradient(to right top, #fcc218, #fcd23d, #fce25b, #fdf177, #ffff92);
		display         : none;
		justify-content : center;
		align-items     : center;
	}

	.blob i{
		font-size: 12px;
	}
	
	@keyframes pulse {
		0% {
			transform: scale(0.65);
			/* box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7); */
			box-shadow: 0 0 0 0 rgba(255,102,102);
		}
	
		70% {
			transform: scale(1);
			box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
		}
	
		100% {
			transform: scale(0.75);
			box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
		}
	}



	.aviso{

		height: 100vh;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 35px;
    color: red;
    font-weight: bold;
	background: white;
	text-align: center;
	}



.container-item{
    background: white;
    min-height: 70px;
    display: flex;
    justify-content: space-between;
    /* align-items: center; */
    flex-direction: row;
    border-radius: 10px;
    /* border-top-right-radius: 10px; */
    -webkit-box-shadow: -1px 9px 15px -5px rgba(0,0,0,0.55);
-moz-box-shadow: -1px 9px 15px -5px rgba(0,0,0,0.55);
box-shadow: -1px 9px 15px -5px rgba(0,0,0,0.55);
background-image: linear-gradient(to right bottom, #d8d8d8, #e2e2e2, #ffffff, #ffffff, #ffffff);
margin-bottom: 20px;
}
.container-item .item-numero{
    background-image: linear-gradient(to right bottom, #007fff, #008dfe, #0098fa, #00a3f4, #00acec, #00b7eb, #11c1e9, #32cae6, #4bd8ea, #63e5ed, #7bf2f1, #92fff4);
    width: 60px;
    height: auto;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
   
    display: flex;
    justify-content: center;
    align-items: center;
}

.container-item .item-numero span{
    font-size: 28px;
    color: white;
}

.container-item .item-descricao{
	padding-right: 20px;
    display: flex;
    align-items: center;
    width: 90%;
    padding-left: 10px;
    justify-content: left;
}

.btn-download{
	color: white;
	background-color: #0065AF;
    border-color: #0065AF;
}

.btn-download:hover{
	color: white;
	background-color: #028cf0;
    border-color: #028cf0;
}

.titulo-destaque{
    font-size: 40px;
    line-height: 50px;
    text-align: center;
    border-top: 10px #333333 solid;
    border-bottom: 10px #333333 solid;
    padding: 30px 0 30px 0;
    color: #333333;
    font-weight: bolder;
    text-transform: uppercase;
}



.item_aviso{
    background: url(../imgs/images/global/item_aviso.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    max-width: 380px;
    min-height: 410px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
	padding: 50px 50px 20px 60px;
    color: white;
	margin: 10px auto;
}

.item_aviso .titulo{
    font-size: 18px;
    font-weight: bold;
}

.item_aviso .descricao{
    font-size: 16px;
    height: 210px;
    overflow-y: scroll;
}