html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {outline: none !important;}

html, body
{
	margin: 0px;
	padding: 0px;
	width: 100%;
	background: #fff;
}
html
{
	position: relative;
	overflow-x: hidden;
}
body
{
	font-family: 'Open Sans';
	min-height: 100vh;
}

header
{
	height: 80px;
	background-color: #fff;
	position: sticky;
	top: 0px;
	z-index: 999;
}
main
{
	margin: 0 auto;
	padding: 0 1em 6em;
}
footer
{
	position: absolute;
	bottom: 0px;
	width: 100%;
	background-color: #698A76;
	color: #000;
	overflow: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 15px 0;
}

::selection
{
	background: #698A76;
	color: #fff;
	font-weight: normal;
}

nav
{
	float: right;
}
nav > input[type=checkbox]
{
	display: none;
}

p, h1, h2, h3
{
	text-align: justify;
}

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

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

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

a
{
	color: #666;
	text-decoration: none;
}
a:hover
{
	color: #698A76;
	cursor: pointer;
	font-weight: bold;
}

input[type=text],
input[type=password],
input[type=date],
input[type=time],
input[type=file],
input[type=number],
input[type=button],
input[type=submit],
input[type=reset],
select,
textarea
{
	font-size: 13px;
	font-weight: bold;
	font-family: 'Open Sans';
}

input[type=button],
input[type=submit],
input[type=reset]
{
	display: inline-block;
	color: #fff;
	background: #698A76;
	border: 0px;
	margin-top: 4px;
	padding: 10px 17px;
	cursor: pointer;
}

input[type=button]:hover,
input[type=submit]:hover,
input[type=reset]:hover
{
	background: #10ad4d;
}

input[type=text],
input[type=password],
input[type=date],
input[type=time],
input[type=file],
input[type=number],
select,
textarea
{
	width: 600px;
	padding: 12px 20px;
	margin: 8px auto;
	box-sizing: border-box;
	display: block;
}

textarea
{
	height: 160px;
	resize: none;
}

kbd
{
	border-radius: 3px;
	padding: 2px 3px;
	border: 1px solid black;
}

details
{
	border: 1px solid #698A76;
	border-radius: 4px;
	padding: .5em .5em 0;
	margin: .5em 0px;
}

summary
{
	font-weight: bold;
	color: #fff;
	background-color: #698A76;
	margin: -.5em -.5em 0;
	padding: .5em;
}

details[open]
{
	padding: .5em;
}

details[open] > summary
{
	margin-bottom: .5em;
}

img
{
	width: 100%;
	max-width: max-content;
}

video
{
	width: 100%;
	max-width: max-content;
	margin: 1em 0px;
}

.link
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#contacto
{
	background-color: #698A76;
	overflow: auto;
}
#contacto > div
{
	font-family: 'Social Shapes';
	font-size: 35px;
	color: #fff;
	float: right;
	margin: 10px 15px 10px 0px;
}
#contacto > div a
{
	color: inherit;
}
#contacto > div a:hover
{
	background-color: #fff;
	border-radius: 30%;
}
#contacto > div a:nth-child(1):hover /* Whatsapp */
{
	color: #1bd741;
}
#contacto > div a:nth-child(2):hover /* Facebook */
{
	color: #1877f2;
}
#contacto > div a:nth-child(3):hover /* Twitter */
{
	color: #1da1f2;
}
#contacto > div a:nth-child(4):hover /* Linkedin */
{
	color: #2977c9;
}

#logo,
#logo_campus,
#logo_inv
{
	clear: left;
	position: relative;
	top: 10px;
	left: 20px;
	width: 320px;
	height: 40px;
	float: left;
	background-repeat: no-repeat;
}
#logo
{
	background-image: url('/images/logo.webp');
}
#logo_campus
{
	background-image: url('/images/campus/logo.png');
}
#logo_inv
{
	background-image: url('/images/logo_inv.png');
}

#menu
{
	text-align: center;
}
#menu li
{
	display: inline-block;
	list-style: none;
	border: 0px;
	padding: 0 10px;
	font-family: 'Open Sans';
	font-size: 16px;
	font-weight: bold;
	color: #000;
}
#menu li:hover
{
	cursor: pointer;
}
#menu li a
{
	text-decoration: none;
	color: inherit;
}
#menu li a::after
{
	display: block;
	content: "";
	width: 0;
	height: 2px;
	margin: auto;
	background-color: #098A56;
	transition: width 0.2s;
}
#menu li a:hover
{
	outline: none;
	border: none;
}
#menu li a:hover::after
{
	width: 100%;
}
#menu li ul
{
	position: absolute;
	max-height: 0px;
	overflow: hidden;
	padding: 0px;
	box-shadow: 0 5px 10px 0 rgba(0,0,0,0.3);
	transition: max-height .7s ease-in-out;
}
#menu li:hover > ul,
#menu li:target > ul
{
	max-height: 2000px;
}
#menu li ul li
{
	display: block;
	background-color: #fff;
	padding: 5px;
	border-bottom: 1px solid #000;
}
#menu li ul li:last-child
{
	border: none;
}
#menu .active
{
	color: #098A56;
}
#menu .active a::after
{
	width: 100%;
}

#cabecera-img
{
	position: relative;
	background-color: #000;
	background-image: url('/images/construction-worker.webp');
	background-size : cover;
	background-repeat: no-repeat;
	background-position: center;
/*	max-height: 720px;
	width: 100%;
	height: 100vh;*/
	overflow: hidden;
	aspect-ratio: 1.41;
}/*
#cabecera-img::before
{
	content: "";
	position: absolute;
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;
	background-color: rgba(0,0,0,0.25);
}*/
#cabecera-img div
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#cabecera-img h1, #cabecera-img h2
{
	position: relative;
	color: #fff;
	text-align: center;
}
#cabecera-img h1
{
	font-size: 72px;
}
#cabecera-img h2
{
	font-size: 28px;
}

/* CAROUSEL */
:root
{
	--img1: url('/images/formacion/monitor-tiempo-libre.webp');
	--img2: url('/images/formacion/director-tiempo-libre.webp');
	--img3: url('/images/formacion/director-campos-trabajo.webp');
}

.slide-track 
{
	display: flex;
	flex-flow: row;
	width: 100%;
}

.slide 
{
	position: relative;
	background-size : contain;
	background-repeat: no-repeat;
	background-position: center;
	max-width: 800px;
	width: 100%;
	overflow: hidden;
	aspect-ratio: 1.41;
	margin: 80px auto 0;
}
.slide.img1
{
	background-image: var(--img1);
}
.slide.img2
{
	background-image: var(--img2);
}
.slide.img3
{
	background-image: var(--img3);
}
/* FIN DE CAROUSEL */

table.cookies
{
	width: 100%;
	border-collapse: collapse;
}
table.cookies th, table.cookies td
{
	border: 1px solid;
	padding: 15px;
}

.cookiesettings
{
	margin: 50px 0	;
}
.cookiesettings a
{
	padding: 18px 36px;
	background-color: #698A76;
	color:#fff;
	border-radius: 25px;
	transition: .5s;
}
.cookiesettings a:hover
{
	background-color: #69AC76;
}
.calendar
{
	width: 95%;
	height: 95%;
	margin: 0px auto;
	border-spacing: 0px;
}
.calendar-day-head, .calendar-day, .calendar-day-np
{
	width: 14%;
	border: 1px solid #b3d4c0;
	padding: 5px;
}
.calendar-day-head
{
	text-align: center;
	font-weight: bold;
	color: #fff;
	background: #698A76;
}
.calendar-day
{
	vertical-align: text-top;
}
.calendar-day-np
{
	background-color: #b3d4c0;
}
.calendar-current-day
{
	background-color: #d3f4e0;
}
.calendar-content-head
{
	min-height: 40px;
}
.calendar-content
{
	min-height: 140px;
}
.calendar-list
{
	clear: both;
	width: 95%;
	margin: 0px auto;
}
.calendar-day-list
{
	margin: 20px 0px;
}
.calendar-data
{
	position: relative;
	margin-top: 5px;
	cursor: pointer;
}
.calendar-data-hidden::before
{
	content: "";
	position: absolute;
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;
	background: repeating-linear-gradient(-45deg, transparent 0 10px, rgba(0,0,0,0.1) 10px 20px);

}
.calendar-data .formacion
{
	position: relative;
	/*z-index: 1;*/
	padding: 0;
}
#calendar
{
	display: unset;
}
#calendar-list
{
	display: none;
}

.mapa
{
	height: 450px;
}

.imgRedonda
{
	width: 182px;
	height: 182px;
	border-radius: 50%;
}

#campus
{
	background-color: #698A76;
	overflow: auto;
}
#campus > div
{
	float: right;
	margin-right: 15px;
}
#campus select
{
	width: auto;
}

#condiciones:not(checked) ~ input[type=submit],
#condiciones:not(checked) ~ input[type=button],
#condiciones:not(checked) ~ input[type=date]
{
	pointer-events: none;
	opacity: 0.6;
}

#condiciones:checked ~ input[type=submit],
#condiciones:checked ~ input[type=button],
#condiciones:checked ~ input[type=date]
{
	pointer-events: auto;
	opacity: 1;
}

#privacidad h1,
#objetivos h1
{
	color: #098A56;
}
#objetivos a
{
	color: #698A76;
}

body.login
{
	background-image: url('/images/fondo.webp');
	background-size: cover;
	background-repeat: no-repeat;
}

body.login > header
{
	background-color: unset;
}

div.login
{
	padding: 3rem;
	background-color: #fff;
	border-color: #698A76;
	border-style: solid;
	border-width: 1px;
	border-radius: 15px;
}

.cols-2
{
	--cols: 2;
}
.cols-3
{
	--cols: 3;
}
.cols-4
{
	--cols: 4;
}
.cols-6
{
	--cols: 6;
}
.cols-8
{
	--cols: 8;
}

.seccion
{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	margin: 80px auto 0;
}
.seccion > div
{
	position: relative;
	flex-grow: 1;
	min-width: 300px;
	width: calc((100% / var(--cols, 1)) - (var(--cols) * 40px));
	max-width: 600px;
	text-align: center;
	padding: 20px;
}
.seccion img + h1
{
	max-width: 450px;
	margin: 20px auto;
	text-align: center;
}
.seccion > div > p
{
	min-width: 300px;
	text-align: center;
}
.seccion > div > p:first-of-type
{
	font-weight: bold;
}
.seccion > div > p.info
{
	text-align: justify;
	font-size: 0.9em;
	color: #698A76;
}

.seccion.mapa
{
	margin: 80px 0px 0px;
}
.seccion.mapa > iframe
{
	width: 100%;
}

.localizacion
{
	display: inline-block;
	vertical-align: top;
	margin: 5px 10px 5px 0;

	background-color: #698A76;
	border-style: solid;
	border-color: #698A76;
	border-width: 1px;

	text-align: center;
}
.localizacion > h1
{
	color: #fff;
	text-align: center;
}
.localizacion > div
{
	padding: 5px;
	background-color: #fff;
}
.localizacion > div > iframe
{
	min-width: 660px;
	width: 100%;
	height: 450px;
}

#informacion-contacto, #formulario-contacto, #informacion-contacto > div, #formulario-contacto > div
{
	display: inline-block;
	vertical-align: top;
	margin: 0 10px;
}
#informacion-contacto p, #informacion-contacto ul
{
	margin: 0px;
}

h3#direccion::before
{
	content: url('/images/contacto/house.png');
	position: relative;
	top: 5px;
	margin-right: 5px;
}
h3#telefono::before
{
	content: url('/images/contacto/telephone.png');
	position: relative;
	top: 5px;
	margin-right: 5px;
}
h3#whatsapp::before
{
	content: url('/images/contacto/whatsapp.png');
	position: relative;
	top: 5px;
	margin-right: 5px;
}
h3#email::before
{
	content: url('/images/contacto/email.png');
	position: relative;
	top: 5px;
	margin-right: 5px;
}
h3#horario::before
{
	content: url('/images/contacto/clock.png');
	position: relative;
	top: 5px;
	margin-right: 5px;
}

.consulta
{
	margin: 50px auto;
}

.titulo, .ano
{
	color: #fff;
	background-color: #698A76;
	text-align: center;
}

.datos
{
	margin: 0px;
	border-style: solid;
	border-color: #698A76;
	padding: 10px;
}

.datos > p > a
{
	text-decoration: none;
	cursor: pointer;
}

.formacion
{
	padding-left: 1.3em;
}

.curso
{
	padding-left: 2.6em;
}

.alumno
{
	padding-left: 3.9em;
}
.incidencias
{
	padding-left: 4.2em;
}

.incidencias::before
{
	content: "INCIDENCIAS: ";
	font-weight: bold;
	font-style: italic;
}

.informacion, .informacion_calendario
{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: #698A76;
	z-index: 1;
	display: none;
}

.informacion > select
{
	height: 100px;
	width: 240px;
	margin-bottom: 0px;
}

.informacion_calendario
{
	width: 50%;
}

.informacion #info, .informacion_calendario #info
{
	display: inline-block;
	color: #fff;
	font-weight: bold;
	padding: 5px;
}

.close
{
	background-color: #698A76;
	float: right;
}

.close > a
{
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
	cursor: pointer;
	color: #fff;
}

.informacion_calendario #datos
{
	text-align: left;
	background-color: #fff;
	padding: 10px;
	border-style: solid;
	border-color: #698A76;
}

#variosdias:not(checked) ~ input[type=date]
{
	pointer-events: none;
	opacity: 0.6;
}

#variosdias:checked ~ input[type=date]
{
	pointer-events: auto;
	opacity: 1;
}

#seleccioncurso
{
	position: absolute;
	top: 40%;
	left: 50%;
	transform: translateX(-50%);
}

#enlinea
{
	padding-top: 50px;
}

.foro th
{
	color: #fff;
	background-color: #698A76;
}
.foro tr:nth-child(2n)
{
	background-color: #eee;
}
.foro td
{
	vertical-align: top;
}
.foro blockquote
{
	margin: 5px;
	padding: 5px;
	border: 1px solid;
}

.hora > input[type=time]
{
	width: inherit;
	display: inline-block;
}

.pregunta
{
	background-color: #698A7636;
}

.respuesta > input[type=text]
{
	display: inline-block;
	width: 95%;
}

.barra_progreso
{
	display: none;
}

.notificacion
{
	position: absolute;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #ff0000;
}

.pagado
{
	position:relative;
	display: inline-block;
	width: 15px;
	height: 15px;
	background-size: contain;
}
.pagado.si
{
	background-image: url("/images/true.png");
}
.pagado.no
{
	background-image: url("/images/false.png");
}

.compartir
{
	position: relative;
	background-image: url("/images/sharing-icon.png");
	background-size: contain;
	background-repeat: no-repeat;
	display: inline-block;
	width: 15px;
	height: 15px;
}

.nodividir
{
	display: inline-block;
}

.centrar
{
	margin: 0 auto;
	text-align: center;
}

.ajustar
{
	width: 600px;
}

.copy,
.menuinf
{
	max-width: 350px;
	text-align: center;
	flex-grow: 1;
}

.copy a,
.menuinf a
{
	text-decoration: underline;
	color: inherit;
}

.text-left
{
	text-align: left;
}
.text-center
{
	text-align: center;
}
.text-right
{
	text-align: right;
}
.nowrap
{
	display: inline-block;
	margin: 0 5px 2px 0;
}

@media screen and (max-width: 480px)
{
	h1
	{
		font-size: 16px;
	}

	h2
	{
		font-size: 14px;
	}

	h3
	{
		font-size: 12px;
	}

	#logo,
	#logo_campus,
	#logo_inv
	{
		top: 15px;
		width: 250px;
		height: 30px;
	}
	#logo
	{
		background-image: url('/images/logo_small.png');
	}
	#logo_campus
	{
		background-image: url('/images/campus/logo_small.png');
	}
	#logo_inv
	{
		background-image: url('/images/logo_small_inv.png');
	}

	.formulario
	{
		padding: 10px;
		max-width: 260px;
	}

	.formulario input[type=button],
	.formulario input[type=submit],
	.formulario input[type=reset]
	{
		padding: 15px 8%;
	}

	.mapa
	{
		height: 350px;
	}

	.ajustar
	{
		width: 300px;
	}

	input[type=text],
	input[type=password],
	input[type=date],
	input[type=time],
	input[type=file],
	input[type=number],
	select,
	textarea
	{
		width: 300px;
	}
}
@media screen and (min-width: 480px) and (max-width: 640px)
{
	.formulario
	{
		padding: 20px;
		max-width: 360px;
	}

	.ajustar
	{
		width: 400px;
	}

	input[type=text],
	input[type=password],
	input[type=date],
	input[type=time],
	input[type=file],
	input[type=number],
	select,
	textarea
	{
		width: 400px;
	}
}

@media screen and (max-width: 720px)
{
	.localizacion
	{
		width: 100%;
	}
	.localizacion > div > iframe
	{
		min-width: 350px;
	}
}

@media screen and (max-width: 1072px)
{
	body
	{
		cursor: pointer;
	}

	#contacto > div
	{
		font-size: 28px;
	}

	#logo,
	#logo_campus
	{
		left: 0;
	}

	#cabecera-img h1
	{
		font-size: 36px;
	}
	#cabecera-img h2
	{
		font-size: 16px;
	}

	.nav-icon
	{
		width: 30px;
		position: absolute;
		top: 10px;
		right: 10px;
	}
	.nav-icon::after,
	.nav-icon::before,
	.nav-icon > div
	{
		background-color: #000;
		border-radius: 3px;
		content: '';
		display: block;
		height: 2px;
		margin: 7px 0;
		transition: all .2s ease-in-out;
	}
	nav > input[type=checkbox]
	{
		display: block;
		width: 40px;
		height: 40px;
		position: absolute;
		top: 4px;
		right: 2px;
		cursor: pointer;
		opacity: 0;
		z-index: 1;
	}
	nav > input[type=checkbox]:checked ~ #menu
	{
		opacity: 1;
		visibility: visible;
	}
	nav > input[type=checkbox]:checked + .nav-icon > div
	{
		transform: scale(0);
	}
	nav > input[type=checkbox]:checked + .nav-icon::before
	{
		transform: translateY(9px) rotate(45deg);
		border-radius: 50%;
	}
	nav > input[type=checkbox]:checked + .nav-icon::after
	{
		transform: translateY(-9px) rotate(-45deg);
		border-radius: 50%;
	}

	#menu
	{
		position: absolute;
		top: 80px;
		left: 0px;
		margin-top: 0px;
		text-align: left;
		padding: 0px;
		width: 100%;
		background-color: #fff;
		opacity: 0;
		visibility: hidden;
		transition: all .5s ease-in-out;
	}
	#menu li
	{
		display: block;
		padding: 5px 15px 5px 15px;
		font-size: 16px;
	}
	#menu li ul
	{
		position: relative;
		margin: 0 0 0 1rem;
		box-shadow: unset;
	}
	#menu .active
	{
		background-color: #098A56;
		color: #fff;
	}

	.seccion
	{
		margin: 40px auto 0;
	}

	.slide-track 
	{
		flex-flow: column;
	}
	.slide
	{
		margin: 40px auto 0;
	}

	#calendar
	{
		display: none;
	}
	#calendar-list
	{
		display: unset;
	}
	.calendar-day-list
	{
		position: relative;
	}
	.calendar-current-day
	{
		background-color: inherit;
	}
	.calendar-current-day::before
	{
		content: url('/images/formacion/seleccion.png');
		position: absolute;
		top: -15px;
		left: -10px;
		z-index: 1;
	}

	.informacion_calendario
	{
		width: 80%;
	}

	div.login
	{
		padding: unset;
		background-color: unset;
		border-color: unset;
		border-style: unset;
		border-width: unset;
		border-radius: unset;
	}

	.copy,
	.menuinf
	{
		min-width: 100%;
		margin: 0;
	}
	.copy
	{
		padding-bottom: 0px;
	}

	.menuinf
	{
		padding-top: 0px;
	}

	.respuesta > input[type=text]
	{
		width: 90%;
	}
}