/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.3.6,
* Autoprefixer: v10.3.1
* Browsers: last 4 version
*/

/* FONTS */
@font-face {
	font-family: 'PopReg';
    src: url(fuentes/Poppins-Regular.ttf);
    font-weight: 400;
}
@font-face {
	font-family: 'PopMed';
    src: url(fuentes/Poppins-Medium.ttf);
    font-weight: 500;
}
@font-face {
	font-family: 'PopSemBol';
    src: url(fuentes/Poppins-SemiBold.ttf);
    font-weight: 600;
}
@font-face {
	font-family: 'PopSemBolIta';
    src: url(fuentes/Poppins-SemiBoldItalic.ttf);
    font-weight: 600;
	font-style: italic;
}
@font-face {
	font-family: 'PopBol';
    src: url(fuentes/Poppins-Bold.ttf);
    font-weight: 700;
}
@font-face {
	font-family: 'PopExtBol';
    src: url(fuentes/Poppins-ExtraBold.ttf);
    font-weight: 800;
}

:root {
	--primary-color: #0049af;
	--secondary-color: #00c8fa;
	--max-width: 1200px;
}

*{
	border: 0;
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

body{
	background: #f9f9f9;
	background-image: url("img/bg_reingresos.jpg");
	background-repeat: no-repeat;
	background-position: 75% center;
	background-size: cover;
	background-attachment: fixed;
	font-family: 'PopReg';
}
.row-blu{
	background: var(--primary-color);
	color: #fff;
	padding: 4rem 0;
	text-align: center;
}
.row-bla{
	background: #fff;
	padding: 4rem 0;
}
.content{
    max-width: var(--max-width);
    margin: 0 auto;
}
header{
	padding-top: 2rem;
	margin-bottom: 1rem;
	width: 100%;
}
.header-content{
	margin: 0 auto;
	max-width: var(--max-width);
}
@media screen and (max-width: 768px){
	.header-content img{
		display: block;
		margin: 0 auto;
	}
}
.form-content{
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 40fr 2rem 60fr;
	grid-template-columns: 40fr 60fr;
	gap: 2rem;
	position: relative;
}
@media screen and (max-width: 768px){
	.form-content{
		-ms-grid-columns: 1fr;
		grid-template-columns: 1fr;
	}	
}

.form-content .item:last-child {
	-ms-flex-item-align: end;
	    -ms-grid-row-align: end;
	    align-self: end;
	padding-bottom: 3rem;
	padding-left: 2rem;
}
@media screen and (max-width: 768px){
	.form-content .item:last-child{
		padding-left: 0;
		-ms-grid-column-align:center ;
		    justify-self:center ;
	}	
}

.form-content .banner-title {
	font-family: 'PopExtBol';
	font-size: 2.75rem;
	color: var(--primary-color);
	line-height: 1.3;
}
@media screen and (max-width: 640px){
	.form-content .banner-title {
		font-size: 2.25rem;
	}	
}


.form-content .banner-description {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	text-align: center;
}

.form-content .banner-description span:first-of-type {
	background-color: var(--secondary-color);
	display: inline-block;
	padding: .5rem 1rem;
	border-radius: 1rem;
	color: #fff;
	font-size: 1rem;
	font-family: 'PopSemBol';
	position: relative;
	top: -4px;
	margin-bottom: .5rem;
}

.form-content .banner-description span:last-of-type {
	text-align: center;
	display: inline-block;
	color: var(--primary-color);
	font-size: 1.75rem;
	font-family: 'PopExtBol';
}

.form{
	background: var(--primary-color);
	padding: 1.5rem 1.5rem 0 1.5rem;
}
@media screen and (max-width: 768px){
	.form{
		padding: 1.5rem;
	}	
}
	.form input, .form select{
		border-radius: 0;
		color: var(--primary-color);
		font-family: 'PopMed';
		font-size: 15px;
		padding: .6rem;
		margin-bottom: .2rem;
		width: 100%;
	}
	::-webkit-input-placeholder{
        color: #0A4790;
    }
	::-moz-placeholder{
        color: #0A4790;
    }
	:-ms-input-placeholder{
        color: #0A4790;
    }
	::-ms-input-placeholder{
        color: #0A4790;
    }
	::placeholder{
        color: #0A4790;
    }
	.imgform{
		display: block;
		margin: 0 auto 1rem auto;
	}
	.politicas{
		color: #fff;
		font-size: 13px;
		margin: 1rem 0;
	}
	.chk{
		float: left;
		
        width: 20px!important;
	}
	.form .btn{
        background: var(--secondary-color);
        color: #fff;
        cursor: pointer;
        font-family: 'PopSemBol';
		font-size: 17px;
		padding: 1rem;
	}

	/* CARRERAS */
	.retoma .title {
		background-image: url(./img/latidos.png);
		background-repeat: no-repeat;
		background-position: 40% bottom;
		font-family: 'PopSemBolIta';
		font-size: 2.5rem;
		padding-bottom: 1rem;
	}
	@media screen and (max-width: 768px) {
		.retoma .title {
			background: none;
		}
	}

	.retoma .description {
		margin-bottom: 2rem;
	}
	.retoma .description p {
		display: inline-block;
		margin-left: auto;
		margin-right: auto;
		text-align: left;
		font-family: 'PopBol';
		font-size: 2.75rem;
		line-height: 1.3;
	}
	@media screen and (max-width: 768px) {
		.retoma .description p {
			font-size: 2.5rem;
		}
	}

	@media screen and (max-width: 768px) {
		.retoma .description p {
			text-align: center;
		}
	}
	.retoma .description span {
		color: var(--secondary-color);
	}

	.carreras-content{
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		-webkit-column-gap: 6rem;
		   -moz-column-gap: 6rem;
		        column-gap: 6rem;
		padding: 0 1.5rem;
	}

	.carreras-content .item {
		-webkit-box-flex: 1;
		    -ms-flex: 1;
		        flex: 1;
		font-size: 1.125rem;
		font-family: 'PopMed';
	}

	.carreras-content .item img{
		margin-bottom: 1rem;
	}
	.imgcarreras{
		position: absolute;
		bottom: 2rem;
		right: 5%;
	}

	/* BENEFICIOS */
	.content-beneficios{
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 1fr 1fr;
		grid-template-columns: 1fr 1fr 1fr;
		padding: 2rem;
	}
	@media screen and (max-width: 640px){
		.content-beneficios {
			-ms-grid-columns: 1fr 1fr;
			grid-template-columns: 1fr 1fr;
		}
	}
	@media screen and (max-width: 490px){
		.content-beneficios {
			-ms-grid-columns: 1fr;
			grid-template-columns: 1fr;
		}
	}
    .content-beneficios div{
		color: var(--primary-color);
        font-size: 1.125rem;
        margin-bottom: 2rem;
        padding: 1em 3rem;
        text-align: center;
		line-height: 1.3;
    }
	@media screen and (max-width: 768px){
		.content-beneficios div{
			padding: 1em 2rem;
		}
	}
	@media screen and (max-width: 490px){
		.content-beneficios div{
			padding: 1em 1rem;
		}
	}
    .ben-resal{
        font-family: 'PopSemBol';
    }


	/* GRACIAS */
	.body-gracias {
		background-position-y: -40px;
	}
	@media screen and (max-width: 768px){
		.body-gracias {
			background-position: left top;
		}
	}

	.header-gracias {
		padding: 2rem 0;
	}
	.gracias .content {
		background-image: url(./img/latidos.png);
		background-repeat: no-repeat;
		background-position: 70% bottom;
		padding-bottom: 2rem;
	}
	@media screen and (max-width: 768px){
		.gracias .content {
			background-position: 150px bottom;
		}
	}
	@media screen and (max-width: 440px){
		.gracias .content {
			background-position: 60px bottom;
		}
	}

	/*TEXTOS*/
	.txtven,
	.txtial{
		font-family: 'PopBol';
		font-size: 3rem;
		text-align: center;
		line-height: 1.4;
	}
	@media screen and (max-width: 640px){
		.txtven,
		.txtial{
			font-size: 2.5rem;
		}	
	}

	.txtven{
		color: var(--primary-color);
	}
	.txtial,
	.txtinfo{
		color: var(--secondary-color);
	}
	
	.txtinfo,
	.txtsigue,
	.txtweb{
		font-family: 'PopSemBol';
	}

	.txtel,.txtcel,.txtweb {
		text-decoration: none !important;
		color: #fff !important;
	}
	.txtel,.txtcel {
		font-family: 'PopBol' !important;
		font-size: 3rem;
		line-height: 1.3;
	}
	
	.txtinfo{
		font-size: 2rem;

	}
	.txtsigue{
		font-size: 1.25rem;
		margin-bottom: 1rem;
	}
	.txtweb{
		font-size: 1.5rem;
	}
	.line{
		display: block;
		margin: 0 auto 1rem auto;
	}
	.redes {
		margin-bottom: 2rem;
	}
	.redes a{
		display: inline-block;
		margin-right: 1rem;
	}
	.redes a:last-of-type {
		margin-right: 0;
	}

/*QUERIES*/
@media screen and (max-width: 736px){
	.content,
	.header-content{
		padding: 0 1rem;
	}
	
	.imgcarreras{
		position: relative;
		bottom: 0;
		margin: 0 auto;
		display: block;
		padding: 2rem 0;
	}
	.carreras-content .item{
		margin-bottom: 4rem;
	}
	.line{
		width: 100%!important;
	}
}

@media screen and (max-width: 414px){
	.carreras-content{
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
	}
	.imgno{
		width: 100%;
	}
}