/*---- 1. Cambios de color ----*/
::selection {
    background: var(--naranja-mas-c-2);
    color: var(--gris-30);
	text-shadow: none;
}
	/* Firefox */
	*::-moz-selection {
		background: var(--naranja-mas-c-2);
		color: var(--gris-30);
		text-shadow: none;
	}
body{
	background: var(--gris-30);
}
/*---- Generales Tipografías ----*/
h1{
	font-family: var(--roboto-serif);
	color: transparent;
	background: var(--amarillo-mas-c-2);
	background: linear-gradient(90deg, rgba(154,237,221,1) 0%, rgba(255,234,166,1) 33%, rgba(154,237,221,1) 66%, rgba(255,234,166,1) 100%);
	-webkit-background-clip: text;
	letter-spacing: -0.02em;
	filter: drop-shadow(1px 1px 4px rgba(0,0,0,.4));
}
h2, h3{color:var(--naranja-mas-c-2);}
	h2::before{color: var(--green-mas-c-2);}
h4{color: var(--gris-100);}
	.portada h4{color: var(--blanco); text-shadow: 1px 1px 4px rgba(0,0,0,.4);}
h5{color: var(--blanco);}
	.portada h5{text-shadow: 1px 1px 4px rgba(0,0,0,.4);}
h6{color: var(--naranja-mas-c-2);}
p, li{color: var(--blanco);}


header {
	background: var(--naranja-mas-c-2);
    background: -moz-linear-gradient(180deg, rgba(255,242,204,1) 30%, rgba(10,10,30,1) 30%);
    background: -webkit-linear-gradient(180deg, rgba(255,242,204,1) 30%, rgba(10,10,30,1) 30%);
    background: linear-gradient(180deg, rgba(255,242,204,1) 30%, rgba(10,10,30,1) 30%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1e1e28",endColorstr="#ffffff",GradientType=1);
}
	/*menu*/
	header .menu{
		background: var(--gris-10);
	}
		.menu nav a,
		.menu nav div label{
			color: var(--blanco);
		}
			.menu nav a:hover,
			.menu nav label:hover{
				color: var(--naranja-mas-c-2);
			}
				.menu nav label > a:hover{
					border-bottom: 6px var(--green-mas-c-2);
				}
		/*submenu*/
		.menu nav .sub-menu{
			box-shadow: 0 0 6px rgba(30,30,50,.5);
			background: var(--gris-50);
		}
			.menu nav .sub-menu li{
				border-bottom: 1px solid var(--gris-70);
			}  
				.menu nav .sub-menu li:hover{
					background: var(--gris-30);
				}
			/* submenu > submenu */
			.menu nav .sub-menu > li .sub-menu{
				background: var(--gris-70);
			}
			.menu nav .sub-menu > li .sub-menu li{
				border-bottom: 1px solid var(--gris-100);
			}
				.menu nav .sub-menu > li .sub-menu li a{
					color: var(--blanco);
				}
					.menu nav .sub-menu > li .sub-menu li:hover a{
						color: var(--naranja-mas-c-2);
					}
		/*boton campus*/
		.menu nav .campus-virtual{
			background: var(--naranja-mas-c-2);
			background: linear-gradient(90deg, rgba(154,237,221,1) 10%, rgba(255,234,166,1) 90%);
			color: var(--gris-30);
			text-shadow: 0 0 2px rgba(0,0,0,.25);
		}
			.menu nav .campus-virtual:hover{
				background: var(--green-mas-c-2);
				background: linear-gradient(90deg, rgba(255,234,166,1) 10%, rgba(154,237,221,1) 90%);
				color: var(--gris-30);
			}
			.menu nav .campus-virtual::before{
				color: var(--gris-70);
				}

		/*FALTA DEFINIR*/
		.menu > label::before{
			color: var(--gris-100);
			background-color: var(--blanco);
		}
			.menu > label:hover::before{
				color: var(--asd);
				box-shadow: 0 0 10px rgba(0,0,0,.25);
			}
	/* --- Menu sticky --- */
	.menu-fixed nav > div:first-of-type{
		border-top: 5px solid var(--gris-70);
	}
		.menu-fixed > label::before{
			background: var(--naranja-mas-c-2);
		}
	/*redes*/
	.contacto ul li,
	.contacto ul li a,
	.contacto ul li a:visited{
		color:var(--gris-50);
	}
		.contacto ul li a:hover{
			color: var(--asd);
		}
	.contacto span,
	.redes span{
		color        : var(--gris-30);
		background   : var(--blanco);
	}
		.redes span:hover{
			color: var(--blanco);
			background: var(--gris-30);
		}
/* Slider home */
.fondo-slider{
	background: transparent !important;
}
	#img-1, #img-2, #img-3, 
	#img-4, #img-5, #img-6, 
	#img-7, #img-8, #img-9, 
	#img-10{
		background: var(--gris-30);
		background: linear-gradient(45deg, rgba(10,10,30,1) 0%, rgba(30,30,50,1) 50%, rgba(70,70,90,1) 90%, rgba(110,110,130,1) 100%);
	}
	.slider-section .etiqueta{
		color: var(--gris-50);
	}
		.slider-section .nuevo-curso{background: var(--rojo-mas-c);}
		.slider-section .nuevo-taller{background: var(--naranja-mas-c-2);}
		.slider-section .nuevo-inicio{background: var(--green-mas-c-2);}
			.slider-section .nuevo-curso::before,
			.slider-section .nuevo-taller::before,
			.slider-section .nuevo-inicio::before{
				color: var(--gris-70);
			}
	.slider-section h1,
	.slider-section p{
		text-shadow: 0 0 4px rgba(0,0,0,.4);
	}
		.slider-section h1{
			color: var(--naranja-mas-c-2);
		}
		.slider-section p{
			color: var(--blanco);
		}
	.slider-section .bajada{
		text-shadow: 0 0 4px rgba(0,0,0,.9);
	}
	.slider-btn{
		background: var(--green-mas-c-2);
		color: var(--gris-50);
	}
	.slider-section > a,
	.slider-section > a:visited{
		color: var(--gris-30);
		background: var(--naranja-mas-c-2);
		background: linear-gradient(90deg, rgba(154,237,221,1) 10%, rgba(255,234,166,1) 90%);
		box-shadow: 0 0 6px rgba(0,0,0,.2);
	}
		.slider-section > a:hover{
			color: var(--gris-30);
			background: var(--green-mas-c-2);
			background: linear-gradient(90deg, rgba(255,234,166,1) 10%, rgba(154,237,221,1) 90%);
		}

/*Sección cursos*/
		#cursos h2{
			color: var(--blanco);
		}
			#cursos h2 b{
				color: var(--naranja-mas-c-2);
			}
		#cursos h4{
			color: var(--gris-210);
		}
	#cursos article{
		box-shadow: 0 0 8px rgba(0,0,0,.2);
		background: var(--gris-10);
		
	}
		#cursos article:hover{
			box-shadow: 5px 5px 20px rgba(0,0,0,.4);
		}
		#cursos article .categoria,
		#cursos article .doble-certificacion{
			border: solid 1px rgba(255,255,255,.5);
		}
			#cursos article .tecnologia{background-color: var(--naranja-mas-c);}
			#cursos article .oficio{background-color: var(--celeste-c);}
			#cursos article .formacion-laboral{background-color: var(--rojo-mas-c);}
			#cursos article .doble-certificacion{background: var(--amarillo-mas-c);}
				#cursos article:hover .tecnologia{background-color: var(--naranja);}
				#cursos article:hover .oficio{background-color: var(--asd);}
				#cursos article:hover .formacion-laboral{background-color: var(--rojo);}
				#cursos article:hover .doble-certificacion{background: var(--amarillo-o);}
				#cursos article .tecnologia::before,
				#cursos article .oficio::before,
				#cursos article .formacion-laboral::before,
				#cursos article .doble-certificacion::before{
					color: var(--gris-50);
				}
					#cursos article:hover .tecnologia::before,
					#cursos article:hover .oficio::before,
					#cursos article:hover .formacion-laboral::before,
					#cursos article:hover .doble-certificacion::before{
						color: var(--blanco);
						text-shadow: 0 0 2px rgba(0,0,0,.5);
					}
					#cursos article .tecnologia::after,
					#cursos article .oficio::after,
					#cursos article .formacion-laboral::after,
					#cursos article .doble-certificacion::after{
						color: var(--blanco);
						text-shadow: 0 0 3px rgba(0,0,0,.5);
					}
					#cursos article section ul li{
						color: var(--gris-230);
					}
					/*boton whatsapp - tarjeta home*/
						section.limitador:hover .whatsapp {
							background : var(--green-o);
						}
							.whatsapp{
								background : var(--green);
								color      : var(--blanco);
								text-shadow: 0 0 2px var(--green-o);
							}
					/*boton al curso*/
					#cursos article section > div > a{
						color: var(--gris-30);
						background: var(--naranja-mas-c-2);
						background: linear-gradient(90deg, rgba(154,237,221,1) 10%, rgba(255,234,166,1) 90%);
					}
						#cursos article section > div > a:hover{
							color: var(--gris-30);
							background: var(--green-mas-c-2);
							background: linear-gradient(90deg, rgba(255,234,166,1) 10%, rgba(154,237,221,1) 90%);
						}
						#cursos article section > div > a::before{
							color: var(--gris-70);
						}
/*Seccion Certificacion*/
.certificacion{
	background: var(--amarillo-mas-c-2);
}
	.certificacion h2{ 
		color: var(--gris-30);
	}
	.certificacion p{
		color: var(--gris-70);
	}
/* Seccion Contacto - Formulario */
#contacto{
	color: var(--blanco);
	background: var(--gris-10);
}
	#formulario label{
		color: var(--gris-210);
	}
		#formulario label span{
			color: var(--naranja-mas-c);
		}
	#formulario select{
		color: var(--gris-170);
		background: var(--gris-50);
	}
	#formulario input,
	#formulario textarea{
		color: var(--gris-230);
		background: var(--gris-50);
	}
		#formulario select:focus,
		#formulario input:focus,
		#formulario textarea:focus{
			border: solid 2px var(--naranja-mas-c-2);
			outline: 0;
		}
		#formulario select::placeholder,
		#formulario input::placeholder,
		#formulario textarea::placeholder{ 
			color: var(--gris-150);
		}
		.select-contenedor::after{
			color: var(--naranja-mas-c-2);
		}
			.select-contenedor:hover::after{
				color: var(--green-mas-c-2);
			}
	#btn-form,
	#formulario input[type="submit"]{
		color: var(--gris-30);
		background: var(--naranja-mas-c-2);
		background: linear-gradient(90deg, rgba(154,237,221,1) 10%, rgba(255,234,166,1) 90%);
	}
		#btn-form:hover{
			color: var(--gris-30);
			background: var(--green-mas-c-2);
			background: linear-gradient(90deg, rgba(255,234,166,1) 10%, rgba(154,237,221,1) 90%);
			box-shadow: 0 0 10px rgba(0,0,0,.25);
		}
			#btn-form::before{
				color: var(--gris-70);
				}
	.politica-uso > p{
		color: var(--gris-240);
	}
	.politica-uso > a{
		color: var(--gris-210);
	}
		.politica-uso > a:hover{
			color: var(--naranja-mas-c-2);
		}
/*Seccion FAQ*/
#faq {
    background: var(--amarillo-mas-c-2);
}
    #faq h2,
    #faq b{
        color: var(--gris-50);
		text-shadow: none;
    }
		#faq h2::before{
			color: var(--gris-130);
		}
		#faq div ul li,
		#faq div ul li a,
		#faq div ul li a:visited{
			color: var(--gris-70);
		}
			#faq div ul li a:hover,
			#faq div ul li a:focus{
				color: var(--asd);
			}
/*Seccion Footer*/
.footer-contenido{
    background : var(--gris-10);
    color      : var(--blanco);
}
	.footer-contenido > div ul li{
		color: var(--blanco);
	}
		.footer-contenido > div ul li::before{
			color: var(--naranja-mas-c-2);
		}
.footer-contenido > div div{
	background: var(--naranja-mas-c-2);
}
	.footer-contenido > div div p{
		color: var(--gris-30);
	}
	.footer-contenido > div div a,
	.footer-contenido > div div a:visited{
		color: var(--gris-70);
	}
		.footer-contenido > div div a:hover{
			color: var(--gris-30);
		}
/*Boton Chat Clienty*/
.chat-box .chat-header,
.chat-box .chat-header span.chat-title,
.chat-box .chat-header span.chat-arrow{
	background: var(--gris-70) !important;
}
	.chat-box .chat-header span.chat-title{
		text-shadow: 0 0 2px rgba(0,0,0,.25);
	}
/* ======================================= */
/*---- 2. Paginas internas: Nosotros, Empresas y FAQ ----*/
.pagina-interna section{
	background: var(--gris-70);
}
.pagina-interna article {
	border-bottom: 3px dotted var(--gris-70);
}
	.pagina-interna article h3:not(:first-of-type){
		border-top: solid 1px var(--gris-70);
	}
		.pagina-interna article b{
			color: var(--naranja-mas-c-2);
		}
			.pagina-interna article .destacado{
				color: var(--green-mas-c-2);
			}
/* ======================================= */
/*---- 3. Landings ----*/
	/* -- Columna Izquierda --*/
	section.izq b {
		color: var(--naranja-mas-c-2);
	}
	section.izq article {
		border-bottom: 1px solid var(--gris-130);
	}
		section.izq ul li a,
		section.izq ul li a:visited{
			color: var(--green-mas-c);
			}
			section.izq ul li a:hover{
				color: var(--green-c);
				}
				section.izq article ul li::before,
				section#faq p::before,
				section.izq  ul > ul li::before{
					color: var(--green-mas-c-2);
				}
	/* Contenidos en columnas */
	#plan-de-estudio .unidad-titulo{
		color: var(--naranja-mas-c-2);
	}
	/*Contenidos en acordeon*/
	#plan-de-estudio .acordeon .unidad-titulo{
		color: var(--gris-70);
		background: var(--naranja-mas-c-2);
		background: linear-gradient(90deg, rgba(154,237,221,1) 10%, rgba(255,234,166,1) 90%);
	}
		#plan-de-estudio .acordeon .unidad-titulo::after{
		color:var(--issd-c);
		}
			#plan-de-estudio .acordeon .activo::after{
			color: var(--gris-100);
			}
			#plan-de-estudio .acordeon .unidad-titulo:hover{
			color: var(--gris-30);
			background: var(--naranja-mas-c-2);
			}
			#plan-de-estudio .acordeon .unidad-titulo:hover::after{
			color:var(--green);
			}
	#plan-de-estudio .acordeon a + ul{
		background: var(--gris-10);
	}	
	/*Seccion Certificado*/
	#certificado img:not(:nth-of-type(1)):not(:nth-of-type(2)){
		filter: grayscale(1) invert(1) brightness(1.5) contrast(1);
	}
	/*Seccion Estudiar en Santo Domingo*/
	#estudiar-sd div{
		background: var(--gris-70);
		border: solid 1px var(--naranja-mas-c-2);
	}
	#estudiar-sd h6{
		color: var(--naranja-mas-c-2);
	}
	/* Seccion Galeria de fotos */
	#galeria section{
		background: var(--gris-70);
	}
		#galeria section div img{
			box-shadow: 1px 1px 4px rgba(0,0,0,.4);
		}
	/*Formulario*/
	#formulario form {
		background: var(--gris-10);
	}
		form input[type=text], 
		input[type=email],
		form textarea{
			color: var(--blanco);
			background: var(--gris-70);
		}
			form p.cod,
			form p.telefono{
				color: var(--gris-210);
				text-shadow: 1px 1px 3px rgba(0,0,0,.6);
			}
				form input[type=text]:focus, 
				form input[type=email]:focus, 
				form textarea:focus{
					outline: none;
					background: var(--gris-50);
					border: 1px solid var(--naranja-mas-c-2);
					box-shadow: 1px 1px 4px rgba(0,0,0,.4);
				}
	/* -- Columna Derecha --*/
	.tarjeta-landing{
		background: var(--gris-10);
	}
		.tarjeta-landing ul li::before{
			color: var(--green-mas-c-2);
		}

/* ======================================= */
/*---- 3. Media ----*/	
@media screen and (min-width:560px){
	/*seccion certificacion*/
	.certificacion article > div:first-child{
		border-right: solid 3px var(--naranja-mas-c-2);
	}
}
@media screen and (min-width:768px){
	/*menu*/
	.menu-fixed nav > div:first-of-type{
		border-top: 0;
	}
		.menu nav a:hover,
		.menu nav > div > label:hover{
			border-bottom: 6px solid var(--green-mas-c-2);
		}
	/*submenu*/
	.menu nav div > .sub-menu::before{
		border-bottom: 12px solid var(--naranja-mas-c-2) !important;
	}
}