/* MAIN */
* {
	box-sizing:					border-box;
}

body {
	margin:						0px;
	padding:					0px;
	background:					#fff;
}

/* Contenedor de todos los elementos de la página */
.div_main {
	position:					relative;
	top:						2vw;
}

/* Contenedor de la lista completa de Diplomas, Certificaciones o Cursos */
.div_diplomas, .div_cursos {
	display:					flex;
	display:					-ms-flexbox; /* IE10 */
	flex-wrap:					wrap;
	-ms-flex-wrap:				wrap; /* IE10 */
	text-align:					justify;
	position:					relative;
	padding:					0px 0px 0px 0px;
}

/* Contenedor para cada uno de los Diplomas, Certificaciones o Cursos */
div[class^="div_single_diploma"], div[class^="div_single_curso"] {
	flex:						calc(96% / 4) !important;
	-ms-flex:					calc(96% / 4) !important;
	max-width:					calc(96% / 4) !important;
	background:					#f7f7f7 !important;
	margin-right:				9px !important;
	margin-bottom:              8px !important;
	padding:					8px 8px 6px 8px !important;
	border:						1px solid #d3d3d3 !important;
	border-radius:				3px !important;
	box-shadow:					1px 1px 4px rgba(0, 0, 0, 0.1) !important;
	-moz-box-shadow:			1px 1px 4px rgba(0, 0, 0, 0.1) !important;
	-webkit-box-shadow:			1px 1px 4px rgba(0, 0, 0, 0.1) !important;
}

div[class^="div_single_diploma"] {
	flex:						calc(98% / 3) !important;
	-ms-flex:					calc(98% / 3) !important;
	max-width:					calc(98% / 3) !important;
	margin-right:				6px !important;
	margin-bottom:              5px !important;
}

/* Contenedor de la Imagen */
.div_imagen_diploma {
	text-align:					center;
	position:					relative;
	width:				    	249px !important;
	height:					    160px !important;
	max-width:					249px !important;
	max-height:					160px !important;
	margin:						auto !important;
}

.div_imagen_curso {
	width:						182px !important;
	height:						134px !important;
	max-width:					182px !important;
	max-height:					134px !important;
	margin:						auto !important;
}

.div_separador_secciones {
	padding-bottom:				2vw;
}


/* Imagenes */
img[class^="imagen_diploma"], img[class^="imagen_curso"] {
	width:                      100% !important;
	height:                     100% !important;
	object-fit:                 fill !important;
	border:						1px solid rgba(0, 0, 0, 0.5) !important;
	box-shadow:					1px 1px 3px rgba(0, 0, 0, 0.3) !important;
	-moz-box-shadow:			1px 1px 3px rgba(0, 0, 0, 0.3) !important;
	-webkit-box-shadow:			1px 1px 3px rgba(0, 0, 0, 0.3) !important;
	cursor:						pointer;
}


/* Títulos y textos */
.titulo_principal_diplomas, .titulo_principal_cursos {
	font-family:				Tahoma;
	font-size:                  24px;
	font-weight:                bold;
	padding-bottom:				8px;
}

.titulo_unico_diploma {
	font-family:				Tahoma;
	font-size:                  18px;
	text-align:					left;
	font-weight:                bold;
	line-height:			    1.3em;
	padding:					12px 0px 12px 0px;
}

.cuerpo_unico_diploma {
	font-family:				Tahoma;
	font-size:                  15px;
	text-align:					left;
	line-height:			    1.4em;
	text-align:					justify;
}

.titulo_unico_curso {
	text-align:					left;
	font-family:				Tahoma;
	font-size:                  14px;
	font-weight:                bold;
	line-height:			    1.3em;
	padding:					12px 0px 12px 0px;
	height:						75px;
}

.cuerpo_unico_curso {
	text-align:					left;
	font-family:				Tahoma;
	font-size:                  12px;
	line-height:			    1.6em;
}

/* Enlaces */
a {
	color:					    rgb(21, 114, 175);
	text-decoration:		    none;
}

a:focus, a:hover {
	color:					    rgb(0, 76, 124);
	text-decoration:		    underline;
}

/* Modal */
.modal_full {
	display:					none;
	background-color:			rgba(0,0,0,0.4);
	position:					fixed;
	z-index:					1;
	left:						0;
	top:						0;
	width:						100%;
	height:						100%;
}

.modal_contenido, .modal_contenido_especial {
	background-color:			#f7f7f7;
	margin:						15% auto; /* 15% from the top and centered */
	width:						600px;
	height:						446px;
	padding:					3px;
	border:						1px solid #d3d3d3 !important;
	border-radius:				5px !important;
	box-shadow:					1px 4px 4px rgba(0, 0, 0, 0.2) !important;
	-moz-box-shadow:			1px 4px 4px rgba(0, 0, 0, 0.2) !important;
	-webkit-box-shadow:			1px 4px 4px rgba(0, 0, 0, 0.2) !important;
}

.modal_contenido_especial {
	width:						550px;
	height:						600px;
}

.modal_imagen {
	width:						100% !important;
	height:						100% !important;
	object-fit:					fill !important;
}


/* RESPONSIVE */
/* STAGE 01 */
@media screen and (max-width: 1199px) {
	/* Contenedor para cada uno de los Diplomas, Certificaciones o Cursos */
	div[class^="div_single_diploma"] {
		flex:						calc(98% / 2) !important;
		-ms-flex:					calc(98% / 2) !important;
		max-width:					calc(98% / 2) !important;
	}

	div[class^="div_single_curso"] {
		flex:						calc(96% / 3) !important;
		-ms-flex:					calc(96% / 3) !important;
		max-width:					calc(96% / 3) !important;
	}

	/* Contenedor de la Imagen */
	.div_imagen_diploma {
		width:				    	300px !important;
		height:					    200px !important;
		max-width:					300px !important;
		max-height:					200px !important;
		margin:						auto !important;
	}

	.div_imagen_curso {
		width:						200px !important;
		height:						134px !important;
		max-width:					200px !important;
		max-height:					134px !important;
		margin:						auto !important;
	}
}

/* STAGE 02 */
@media screen and (max-width: 720px) {
	/* Contenedor para cada uno de los Diplomas, Certificaciones o Cursos */
	div[class^="div_single_diploma"] {
		flex:						calc(98% / 2) !important;
		-ms-flex:					calc(98% / 2) !important;
		max-width:					calc(98% / 2) !important;
		margin-right:				0.6vw !important;
		margin-bottom:              0.6vw !important;
	}

	/* Contenedor de la Imagen */
	.div_imagen_diploma {
		width:				    	40vw !important;
		height:					    26vw !important;
		max-width:					300px !important;
		max-height:					200px !important;
		margin:						auto !important;
	}

	.div_imagen_curso {
		width:				    	26vw !important;
		height:					    26vw !important;
		max-width:					198px !important;
		max-height:					134px !important;
		margin:						auto !important;
	}
	/* Títulos y textos */
	.titulo_unico_diploma {
		font-size:                  16px !important;
	}

	.cuerpo_unico_diploma {
		font-size:                  14px !important;
	}

	/* Modal */
	.modal_contenido, .modal_contenido_especial {
		margin:						25% auto; /* 15% from the top and centered */
		width:						450px;
		height:						335px;
	}

	.modal_contenido_especial {
		width:						413px;
		height:						450px;
	}
}

/* STAGE 03 */
@media screen and (max-width: 646px) {
	/* Contenedor para cada uno de los Diplomas, Certificaciones o Cursos */
	div[class^="div_single_curso"] {
		flex:						calc(96% / 2) !important;
		-ms-flex:					calc(96% / 2) !important;
		max-width:					calc(96% / 2) !important;
	}

	/* Contenedor de la Imagen */
	.div_imagen_curso {
		width:				    	40vw !important;
		height:					    26vw !important;
		max-width:					300px !important;
		max-height:					200px !important;
		margin:						auto !important;
	}
}