@charset "UTF-8";

.content {max-width: 1104px; padding: 48px 20px 0px 48px;}
.sessao {padding-bottom: 48px;}
h1 {font-size: 2.8em; padding-bottom: 24px;}
h2 {font-size: 2em; padding-bottom: 24px;}
h3 {font-size: 1.12em; padding-bottom: 24px;}
.fonte {font-size: 0.8em; font-style: italic;}

#destaque .content {position: relative;}
#destaque .realcar {font-weight: bold; color: #0C7F7C;}
#destaque p {margin-bottom: 8px;}
#destaque ul { margin: 24px 0px 16px 0px; padding-left: 0px; } 
#destaque li {line-height: 1.6em; list-style-type: none; margin-bottom: 8px;}
#destaque #assunto {width: 756px; float: left; margin-right: 32px;}
#destaque #assunto p {font-size: 1.12em; line-height: 1.4em;}
#destaque #videodestaque {float: left; text-align: center;}

#beneficios .beneficio { width: 32%; margin-right: 1.3%; }
#beneficios h2 {text-align: center; margin-bottom: 16px;}
#beneficios p {line-height: 1.4em;}
#beneficios b {color: #0C7F7C;}

#resumo {background-color: #F6F6F6;}
#resumo #partes { width: 1130px; }
#resumo .parte {width: 46%; padding-right: 4%;}
#resumo h3 {padding-bottom: 8px; padding-top: 8px;}
#resumo ul {padding-top: 0px; margin-top: 0px;}
#resumo ul li {padding: 2px; line-height: 1.4em;}
#resumo img {border-radius: 4px; box-shadow: 0px 4px 16px rgba(129, 129, 129, 0.25); width: 100%; height: auto;}

#treinamentos .treina {padding: 16px; width: 232px; border-radius: 4px; box-shadow: 0px 4px 16px rgba(129, 129, 129, 0.25); margin-right: 12px; margin-top: 16px; background-color: #FFF;}
#treinamentos .treina h3 {margin-top: 4px;}
#treinamentos .treina p {line-height: 1.6em; font-size: .94em;}
#treinamentos .treina .saibamais {margin: 20px 0 8px 0;}

#aprenda {background-color: #F6F6F6;}
#aprenda h3 {padding-top: 16px; padding-bottom: 8px;}
#aprenda #videos .item {margin: 8px;}
#aprenda #videos .item a {display: block; width: 268px; height: 151px; background-size: cover; display: flex; align-items: center; text-align: center; border-radius: 4px; box-shadow: 0px 4px 16px rgba(129, 129, 129, 0.25);}
#aprenda #videos .item a:hover {box-shadow: none; border: 2px #0C7F7C solid; margin-top: -2px;}
#aprenda #videos .item a img {margin: auto;}
#aprenda #videos .mais {margin-top: 102px;}
#aprenda #artigos .item {padding: 8px 8px 8px 60px; width: 150px; height: 80px; border-radius: 4px; box-shadow: 0px 4px 16px rgba(129, 129, 129, 0.25); background-color: #FFF; margin: 12px; background-image: url("../images/fundo-metade-logo.png"); background-repeat: no-repeat; background-size: contain; }
#aprenda #artigos .item p {display: flex; align-items: center; height: 80px;}
#aprenda #artigos .mais {margin-top: 50px;}

#trilhas p {text-align: center;}
#trilhas .grupo {margin: 16px auto; width: 364px; float: none; }
#trilhas .grupo .trilha {width: 150px; height: 120px; padding: 8px; display: flex; align-items: center; border-radius: 4px; box-shadow: 0px 4px 16px rgba(129, 129, 129, 0.25); background-color: #FFF; margin: 8px;}
#trilhas .grupo .trilha p {font-size: 1.2em;}

#videoContainer {position: fixed; top: 0; left: 0; background-color: rgb(0, 0, 0, 0.7); width: 100%; height: 100%; display: none; align-items: center; justify-content: center; }
#videoContainer #videoModal {display: none;}
#videoContainer #videoModal p {margin-left: 4px;}

@media(min-width: 1200px) {
	.content {float: none; max-width: none; width: 1104px; margin: 0 auto;}
}

@media(max-width: 1100px) {
	#destaque #assunto {width: 656px;}
	
	#resumo div#partes { width: 930px; }
}

@media(max-width: 1000px) {
	#destaque #assunto {width: 600px;}
	
	#resumo div#partes { width: 830px; }
	
	#aprenda #videos .mais {margin-top: 0px; width: 100%;}
	#aprenda #videos .mais p {text-align: center;}
	
	#trilhas .grupo {width: auto;}
}

@media(max-width: 959px) {
	.content {padding: 24px 24px 0px 24px;}
	
	#destaque #assunto {width: 560px;}
	
	#resumo div#partes { width: 730px; }
}

@media(max-width: 880px) {
	#destaque #assunto {width: 50%;}
	
	#resumo div#partes { width: 570px; }
	
	#beneficios .beneficio {float: none; width: 100%; margin: 0px;}
	
	#aprenda #videos .mais {margin-top: 102px; width: auto;}
	#aprenda #videos .mais p {text-align: left;}
}

@media(max-width: 619px) {
	.content {padding: 12px 12px 0px 12px;}
	.sessao {padding-bottom: 12px;}
	
	#destaque #assunto { width: 100%; margin: 0px;}
	#destaque #videodestaque {float: none;}
	#destaque #videodestaque iframe {margin-top: 16px;}
	
	#resumo div#partes { width: auto; }
	#resumo .content .parte.um {width: auto;}
	#resumo .content .parte.dois {width: auto;}
	
	#treinamentos .content {padding: 0px; width: 100%;}
	#treinamentos h2 {margin-left: 12px; margin-top: 16px;}
	#treinamentos .treina {padding: 8px; width: 228px; margin: 16px auto; float: none;}
	
	#aprenda #videos .item {width: 100%; margin: 0px;}
	#aprenda #videos .item p a { margin: 12px auto; float: none;}
	#aprenda #videos .mais {margin-top: 0px; width: 100%;}
	#aprenda #videos .mais p {text-align: center;}
	
	#aprenda #artigos {width: 100%;}
	#aprenda #artigos .item {margin: 12px auto; float: none;}
	#aprenda #artigos .mais {margin-top: 0px; width: 100%;}
	#aprenda #artigos .mais p {text-align: center;}

	#trilhas .grupo {width: 100%;}
	#trilhas .grupo .trilha {margin: 12px auto; float: none;}
}

@media(max-width: 359px) {
	#destaque p a.botao {display: block; float: left; margin-top: 12px; margin-right: 64px;}
	
	#aprenda #videos .item a {width: 240px; height: 135px;}
	
	#rodape .content {padding: 0px;}
}