/*
PORTADA

Navegación:
01 - BANNER PRINCIPAL
02 - INTRODUCCION
	2.1 - TITULO
03 - CENTRO DE APOYO AL ESTUDIANTE
*/

/*----------------*/
/*---- BANNER ----*/
/*----------------*/

.secBanner{position: relative;background: /*linear-gradient(to bottom, rgba(0,0,0,0.4) , rgba(0,0,0,0)),*/ url(/media/kypnizgp/bg-internacional.jpg);background-size: cover;background-position: center;height: 20rem;}

@media(min-width: 767.98px){
	.secBanner{height: 18rem;}
}

@media(min-width: 992.98px){
	.secBanner{height: 30rem;}
}



/*@media(max-height: 875.98px){
	.secBanner{height: 75vh;}
}

@media(max-height: 795.98px){
	.secBanner{height: 85vh;}
}
*/
/*------------------*/
/*-- INTRODUCCION --*/
/*------------------*/

.introduccion {z-index: 2;position: absolute;top: 12rem;text-align: left;max-width: 60rem;color: #FFFFFF;padding-left: 9rem;}

@media(max-width: 1199.98px){
	.introduccion {top: 10rem;text-align: left;padding-left: 0;max-width: 80%;margin: auto;left: 2rem;}
}

@media(max-width: 767.98px){
	.introduccion {top: 20%;}
}

/* TITULO */
.introduccion .h1-seo {position: relative;z-index: 999;padding: 0;font-size: 60px;text-transform: uppercase;font-weight: 800;background: none;margin: 0 0 2rem;text-indent: inherit;}

.secBanner h1{
	position: absolute;bottom: -25px;z-index: 999;min-width: 50%;margin: 0 0 0 -15px;padding: 8px 28px 8px 15px;color: #fff;font-size:3.1rem /*50px*/;text-transform: uppercase;font-weight: 300;background: #e32726;
	/*Para animación*/overflow: hidden; transform: scaleX(0); transform-origin: left; transition-duration: 0.2s;
}
.secBanner[data-scroll="in"] h1{transform: scaleX(1);}

.secBanner h1 span {font-weight: 400;
	/*Para animación*/position: relative;top: 10rem;transition-duration: 0.4s; transition-delay: 0.2s}

.secBanner[data-scroll="in"] h1 span {top: 0;}

.secBanner h1 span strong{font-weight: 700;}

@media(min-width:768px){
    .secBanner h1{font-size: 40px;}
}

@media(min-width:992.98px){
	.secBanner h1{margin: 0 0 0 -500px;text-indent: 500px;font-size: 50px;}
}



@media(max-width:992.98px){
	.secBanner h1{padding-right: 42px;text-align: right;}
}

@media(max-width:621.98px){
	.secBanner h1{bottom: 0px;padding: 8px 13px;}
}

@media(max-width:315.98px){
	.secBanner h1{font-size: 23px;}
}

.introduccion p {
	font-size: 1.1rem;
	margin-bottom: 1.5rem;
	color: #FFFFFF;
}

@media(max-width: 1199.98px){
	.introduccion .h1-seo {font-size: 65px;}
	
	.introduccion p {font-size: 0.95rem;}
}

@media(max-width: 992.98px){
	.introduccion .h1-seo {font-size: 55px;text-align: left;}
}


@media(max-width: 767.98px){
	.introduccion .h1-seo {font-size: 2.25rem;}
}

@media(max-width: 576.98px){
	.introduccion .h1-seo {font-size: 1.75rem;}
}


@media(max-width: 280.98px){
	.introduccion .h1-seo {font-size: 1.25rem;}
}

@media(min-width:1599.98px){
	.portada .container-fluid.relleno{ padding: 0 120px;}
	.portada .container-fluid.relleno-derecha{ padding: 0 120px 0 0;}
	.portada .container-fluid.relleno-izquierda{ padding: 0 0 0 120px;}
}


/*** ANIMACION SCROLL-IN ***/

/*.secBanner h1{
	transform: translateX(-50rem);
    opacity: 0;
	transition-delay: 0.5s;
	transition-duration: 1s;
}

.secBanner[data-scroll="in"] h1{
	transform: translateX(0);
    opacity: 1;
}*/


/*-----------------------------------*/
/*-- CENTRO DE APOYO AL ESTUDIANTE --*/
/*-----------------------------------*/

.secBanner.CAE{background: /*linear-gradient(to bottom, rgba(0,0,0,0.4) , rgba(0,0,0,0)),*/ url(../multimedia/bg/bg-cae.jpg);height: 36rem;overflow: hidden; position: relative;}


.secBanner.CAE img, .secBanner.CAE::before{
	width: 50rem;
    height: 50rem;
	position: absolute;
	border-radius: 50rem;
}

.secBanner.CAE img{
    top: -4rem;
    right: 0;
    object-position: bottom;
}

.secBanner.CAE::before{
    content: '';
    background-color: #023f75;
    bottom: 1.65rem;
    right: 9rem;
}

@media(max-width: 1599.98px){
	.secBanner.CAE img, .secBanner.CAE::before{
		width: 40rem;
		height: 40rem;
		position: absolute;
		border-radius: 50rem;
	}

	.secBanner.CAE img{
		top: 0;
	}

}


@media(max-width: 1339.98px){
	.secBanner.CAE img, .secBanner.CAE::before{
		width: 40rem;
		height: 40rem;
		position: absolute;
		border-radius: 50rem;
	}

	.secBanner.CAE img{
		top: 0;
	}

}

@media(max-width: 1229.98px){
	.secBanner.CAE img, .secBanner.CAE::before{
		z-index: 0;
	}

}

@media(max-width: 992.98px){
	.secBanner.CAE img, .secBanner.CAE::before{
		width: 45rem;
		height: 45rem;
	}
	.secBanner.CAE img{top: -4rem; right: -6rem;border-radius: 50rem 0 0 50rem;}
	.secBanner.CAE::before{right: 1rem;}

}

@media(max-width: 767.98px){
	.secBanner.CAE{height: 25rem;}
	
	.secBanner.CAE img, .secBanner.CAE::before{
		width: 35rem;
		height: 35rem;
	}
	.secBanner.CAE img{top: auto; bottom: -6rem;}
	.secBanner.CAE::before{bottom: -6rem; right: -2rem;}

}



/* TITULO */

.secBanner.CAE h1{
	position: absolute;
	overflow: visible;
    top: 45%;
	bottom: auto;
    z-index: 999;
    min-width: 50%;
    margin: 0;
    padding: 0 15px;
    color: #fff;
    font-size: 3rem;
    text-transform: none;
    font-weight: 700;
    background: none;
	text-indent: 0;
	line-height: 4rem;
	transform: scale(1) translate(0) !important;
	z-index: 1;
}

.secBanner.CAE h1 span{
	display: block;
    font-size: 4.5rem;
    font-weight: bold;
	top: 0;
}



@media(max-width: 1599.98px){
	.secBanner.CAE h1{
		top: 55%;
		margin: 0 0 0 6rem;
		font-size: 2rem;
		line-height: 3rem;
	}
	
	.secBanner.CAE h1 span {
		font-size: 3.5rem;
	}

}


@media(max-width: 1419.98px){
	.secBanner.CAE h1{ margin: 0; }
}

@media(max-width: 1229.98px){
	.secBanner.CAE h1{ z-index: 1; top: auto; bottom: 8.5rem;}
	
	.secBanner.CAE h1::before{
		content: '';
		position: absolute;
		opacity: 0.9;
		width: 79%;
		height: 0;
		top: 50%;
		background-color: #0A254B;
		box-shadow: 43px 80px 96px 140px rgba(10,37,75,1);
		z-index: -2;
	}
}


@media(max-width: 992.98px){
	.secBanner.CAE h1{ left: auto; text-align: left; font-size: 2.5rem; bottom: 3rem}
	.secBanner.CAE h1 span {font-size: 4rem;}


}

@media(max-width: 767.98px){
	.secBanner.CAE h1 span {
		font-size: inherit;
		display: inline;
	}
}




