﻿@media (min-width: 640px) { 

	.lista_matriculas{
		.lista_cursos{
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			align-items: stretch;
			align-content: stretch;
			gap: 1rem;

			& > .lista_matricula_curso{
				flex-basis: 40%;
				flex-grow: 1;
				container-name: container_curso;
				container-type: inline-size;
			}

			& > .lista_grupo_matriculas{
				flex-basis: 90%;
				flex-grow: 1;
			}
		}
	}

	@container container_curso (width < 500px) {
		.lista_curso.lista_curso.lista_curso{
			display: block;
			height: 100%;

			.thumbnail.thumbnail.thumbnail{
				display: block;
				width: 100%;
				height: auto;
				aspect-ratio: 16/8;
				background-position: bottom;
			}
			.lista_info_curso.lista_info_curso.lista_info_curso {
				display: block;
				padding-bottom: 4rem;

				h3{
					font-size: 1.2rem;
				}
			}
			.lista_curso_frequencia.lista_curso_frequencia.lista_curso_frequencia{
				bottom: -1rem;
			}
		}
	}



	.lista_assinaturas{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: stretch;
		align-content: stretch;
		gap: 1rem;

		& > .ass_curso{
			flex-basis: 40%;
			flex-grow: 1;
			container-name: container_assinatura_curso;
			container-type: inline-size;
			display: block;

			.ass_dados{
				padding-bottom: 4rem;
			}
		}

		& > .ass_descricao{
			flex-basis: 90%;
			flex-grow: 1;
		}
	}


	@container container_assinatura_curso (width < 500px) {
		
		.ass_thumbnail.ass_thumbnail.ass_thumbnail{
			display: block;
			width: 100%;
			height: auto;
			aspect-ratio: 16/8;
			background-position: bottom;
		}

		.ass_dados.ass_dados.ass_dados{
			display: block;
			padding-bottom: 4rem;

			h3{
				font-size: 1.2rem;
			}
		}
	}

}