
/* Estilos para la seccion de eventos con Tiempo Meta en Strunning*/

/* Listado de eventos y resultados */

.listaEventos {
	margin: auto;
	padding: 50px;
	transform: skew(0deg,-10deg);
	-ms-transform: skew(0deg,-10deg);
	-webkit-transform: skew(0deg,-5deg);
	width: 100%;
	max-width: 1280px;
}

/* Lista de proximos eventos */

.listaEventos #tm_events_list {
	align-items: top;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: auto;
	width: 100%;
	max-width: 1280px;
}

.listaEventos #tm_events_list div {
	background-color: #f1f1f1;
	display: flex;
	flex-direction: column;
	width: 22%;
	min-width: 240px;
	max-width: 240px;
	margin-bottom: 50px;
	transition: 250ms;
	padding-bottom: 15px;
	cursor: pointer;
}

.listaEventos #tm_events_list div:hover {
	opacity: 0.85;
}

.listaEventos #tm_events_list div .thumbnails {
	margin: 0px;
	width: 100%;
}

.listaEventos #tm_events_list div .thumbnails .thumbnail-img {
	margin: 0px;
	padding: 0px;
	width: 100%;
}

.listaEventos #tm_events_list div .thumbnails .thumbnail-img .overflow-hidden {
	border: 0px;
	margin: 0px;
	padding: 0px;
	width: 100%;
}

.listaEventos #tm_events_list div .thumbnails .thumbnail-img .overflow-hidden a {
	padding: 0px;
	border: 0px;
	text-decoration: none;
}

.listaEventos #tm_events_list div .thumbnails .thumbnail-img a.btn-more {
	/*display: none;*/
}



.listaEventos #tm_events_list div .thumbnails .thumbnail-img .overflow-hidden a img {
	border: 6px solid var(--color-principal);
	width: 240px;
	height:  240px;
}

.listaEventos #tm_events_list div .thumbnails a {
	color: black;
	text-decoration: none;
	margin-top: 0px;
	padding: 10px;
	width: 100%;
}

.listaEventos #tm_events_list div .thumbnails .caption {

	margin: 0px;
	padding: 0px;
	width: 100%;
}

.listaEventos #tm_events_list div .thumbnails .caption h3 {
	background-color: #e0e0e0;
	font-size: 1.1em;
	margin: 0px;
	padding: 18px;
	margin-bottom: 10px;
	margin-top: 10px;
	font-weight: lighter;
	border-bottom: solid var(--color-principal) 2px;
	border-top: solid var(--color-principal) 1px;

}

.listaEventos #tm_events_list div .thumbnails .caption h3 a {
	text-decoration: none;
	color: black;
	margin: 0px;
	padding: 0px;
	font-weight: 400;
}

.listaEventos #tm_events_list div .thumbnails .caption h5 {
	font-size: 1em;
	margin: 0px;
	padding: 6px 18px;
	font-weight: lighter;

}

.listaEventos #tm_events_list div .thumbnails .caption h5:empty {
	display: none;

}

.listaEventos #tm_events_list div .thumbnails .caption h5 a {
	text-decoration: none;
	color: black;
	margin: 0px;
	padding: 0px;
}

.listaEventos #tm_events_list div .thumbnails .caption p {
	margin: 0px;
	padding: 18px;
	font-weight: lighter;
}

.listaEventos #tm_events_list div .thumbnails .caption p:empty {
	display: none;
}



/* Lista de resultados */

.listaEventos #tm_events_result {
	align-items: top;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: auto;
	width: 100%;
	max-width: 1280px;
}

.listaEventos #tm_events_result div {
	background-color: #f1f1f1;
	display: flex;
	flex-direction: column;
	width: 22%;
	min-width: 240px;
	margin-bottom: 50px;
	transition: 250ms;
	padding-bottom: 15px;
	cursor: pointer;
	max-width: 240px;
}

/* Botones de navegación entre eventos de tiempo meta */
.botonesNavegacion {
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}
.botonesNavegacion .tm_prev_page {
	background-color: var(--color-principal);
	border: 1px solid black;
	border-radius: 6px;
	text-align: center;
	cursor: pointer;
	color: black;
	height: 50px;
	width: 130px;
	padding: 14px;

}
.botonesNavegacion .tm_next_page {
	background-color: var(--color-principal);
	border: 1px solid black;
	border-radius: 6px;
	text-align: center;
	cursor: pointer;
	color: black;
	height: 50px;
	width: 130px;
	padding: 14px;

}

.listaEventos #tm_events_result div:hover {
	opacity: 0.85;
}

.listaEventos #tm_events_result div .thumbnails {
	margin: 0px;
	width: 100%;
}

.listaEventos #tm_events_result div .thumbnails .thumbnail-img {
	margin: 0px;
	padding: 0px;
	width: 100%;
}

.listaEventos #tm_events_result div .thumbnails .thumbnail-img .overflow-hidden {
	border: 0px;
	margin: 0px;
	padding: 0px;
	width: 100%;
}

.listaEventos #tm_events_result div .thumbnails .thumbnail-img .overflow-hidden a {
	padding: 0px;
	border: 0px;
	text-decoration: none;
	margin: 0px;

}

.listaEventos #tm_events_result div .thumbnails .thumbnail-img a.btn-more {
	display: none;
}



.listaEventos #tm_events_result div .thumbnails .thumbnail-img .overflow-hidden img {
	border: 6px solid var(--color-principal);
	width: 240px;
	height:  240px;
}

.listaEventos #tm_events_result div .thumbnails a {
	color: black;
	text-decoration: none;
	margin-top: 10px;
	padding: 10px;
	width: 100%;
}

.listaEventos #tm_events_result div .thumbnails .caption {

	margin: 0px;
	padding: 0px;
	width: 100%;
}

.listaEventos #tm_events_result div .thumbnails .caption h3 {
	background-color: #e0e0e0;
	font-size: 1.1em;
	margin: 0px;
	padding: 18px;
	margin-bottom: 10px;
	margin-top: 10px;
	font-weight: lighter;
	border-bottom: solid var(--color-principal) 2px;
	border-top: solid var(--color-principal) 1px;

}

.listaEventos #tm_events_result div .thumbnails .caption h3 a {
	text-decoration: none;
	color: black;
	margin: 0px;
	padding: 0px;
	font-weight: 400;
}

.listaEventos #tm_events_result div .thumbnails .caption h5 {
	font-size: 1em;
	margin: 0px;
	padding: 6px 18px;
	font-weight: lighter;

}

.listaEventos #tm_events_result div .thumbnails .caption h5:empty {
	display: none;

}

.listaEventos #tm_events_result div .thumbnails .caption h5 a {
	text-decoration: none;
	color: black;
	margin: 0px;
	padding: 0px;
}

.listaEventos #tm_events_result div .thumbnails .caption p {
	margin: 0px;
	padding: 18px;
	font-weight: lighter;
}

.listaEventos #tm_events_result div .thumbnails .caption p:empty {
	display: none;
}

.products-list>.item {
	background: transparent;
}

/* Estilos para el detalle del resultado (Modal) */

/* Estilos para el detalle de los resultados por competidor - pop up */

#result_detail {
	color: black;
}
/* Titulo del pop up */

.modal-title {
	color: red;
	font-size: 1.2em;
	text-align: left;
}
/* Titulo de la categoria */

#tm_det_category {
	color: #f1cc06;
	font-size: 1.6em;
}
/* Nombre del participante */

.rd-name {
	font-size: 3em;
	text-align: center;
}
/* Numero del participante */

.rd-bib {
	color: black;
	text-align: center;
	font-size: 3em;
}

/* Categoria */
.rd-cat-title {
	color: #f1cc06;
	font-size: 1.8em;
	text-align: center;
	font-weight: bold;
}
/* titulo del tiempo oficial */

.rd-time-title {
	color: black;
	font-size: 2em;
}
/* marcador del tiempo oficial */

.rd-time-value {
	color: red;
	font-size: 2em;
}
/* titulo del tiempo chip */

.tm_det_chip_title {
	color: black;
	font-size: 2em;
}
/* marcador del tiempo chip */

.tm_det_chip_time {
	color: red;
	font-size: 2em;
}
/* titulo parciales */

.tm_det_splits_title {
	color: black;
	font-size: 2em;
}
/* Tabla de parciales */

.table-responsive {
	color: black;
	font-size: 1em;
}
/* Lugar general */
.rd-cat-pos {
	color: black;
	font-size: 2em;
	text-align: center;
	padding: 10px;
}
.nav-tabs>li>a {
	background-color: #f1cc06;
	color: #000;
	margin-right: 2px;
	margin-top: 20px;
	line-height: 1.42857143;
	border: 1px solid transparent;
	border-radius: 4px 4px 0 0;
}

/* Etilos parala seccion de inscripcion a un evento (event.php) */

.tag-box {

}

.tag-box #header{

}

.tag-box #header .pkm-header  {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	width: 100%;
}

.tag-box #header .pkm-header div {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.tag-box #header .pkm-header div .col-md-6:empty {
	display: none;
}

.tag-box #header .pkm-header div div h3:empty {
	display: none;
}

.tag-box #header .pkm-header div div h3 {
	color: black;
}

.tag-box #header .pkm-header div {
	color: var(--color-blanco);
	text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.51);
}

.tag-box #header .pkm-header div a{
	background-color: var(--color-principal);
	color: black;
	font-size: 2em;
	min-width: 270px;
	text-shadow: none;
}

.tag-box #header .pkm-header div img {
	border: 3px solid var(--color-principal);
	min-width: 230px;
	min-height: 230px;
}

@media (max-width: 768px) {

	.listaEventos #tm_events_list {
		align-items: center;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.listaEventos #tm_events_result {
		align-items: center;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.tag-box #header .pkm-header {
		display: flex;
		flex-direction: column;
		justify-content: center;
		width: 100%;
		margin: 0px;
	}
	.tag-box #header .pkm-header div {
		color: var(--color-negro);
		text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.51);
		text-align: center;
	}
	.tag-box #header .pkm-header div a {
		background-color: var(--color-principal);
		color: black;
		font-size: 1.4em;
		min-width: 200px;
		max-width: 200px;
		text-shadow: none;
		text-align: center;
	}
	.tag-box #header .pkm-header div h1 {
		font-size: 1.2em;
		text-align: center;
	}
	.tag-box #header .pkm-header div h3 {
		font-size: 1.1em;
		text-align: center;
	}
}
