/*
 * -------------------------------------------------------------------
 *	Generales
 * -------------------------------------------------------------------
 *
 *
*/
	h2 {
		font-size: 2.8rem !important;
		font-weight: 700;
	}

	img {
		display: block;
		max-width: 100%;
	}

	a,
	button {
		cursor: pointer;
	}

	.padding{padding: 4rem 0}

	.overflow{overflow: hidden}

	#clientes{background: #e9ecef}



/*
 * -------------------------------------------------------------------
 *	Teléfono
 * -------------------------------------------------------------------
 *
 *
*/
	.cel{font-size: 7.5em}
	.device{width: 2.6734590074em;	height: 5.4218748094em}
	.device-iphone-x .device-frame{
		width: 100%;	height: 100%;
		padding: 0.1748991874em;
		border-radius: 0.4247551694em;
		box-shadow: inset 0 0 0.0124927991em 0.0124927991em #c8cacb, inset 0 0 0 0.04372479685em #e2e3e4
	}
	.device-iphone-x .device-content{
		width: 2.3423998313em;	height: 5.0720764346em;
		border-radius: 0.249855982em
	}
	.device-iphone-x .device-stripe::after, .device-iphone-x .device-stripe::before{
		height: 0.04372479685em;
		border-width: 0 0.04372479685em
	}
	.device-iphone-x .device-stripe::before{bottom: 0.530944em}
	.device-iphone-x .device-stripe::after{top: 0.530944em}
	.device-iphone-x .device-header{
		top: 0.1748991874em;
		width: 1.2742655082em;	height: 0.1873919865em;
		margin-left: -0.6371327541em;
		border-bottom-left-radius: 0.124927991em;	border-bottom-right-radius: 0.124927991em
	}
	.device-iphone-x .device-header::after, .device-iphone-x .device-header::before{width: 0.0624639955em;	height: 0.0624639955em}
	.device-iphone-x .device-header::before{right: -0.062464em}
	.device-iphone-x .device-header::after{left: -0.062464em}
	.device-iphone-x .device-sensors::before{
		top: 0.174899em;
		width: 0.08745em;	height: 0.08745em;
		margin-left: 0.249855982em
	}
	.device-iphone-x .device-sensors::after{
		top: 0.1998847856em;
		width: 0.3123199775em;	height: 0.037478em;
		margin-left: -0.1561599888em;
		border-radius: 0.01873919865em
	}
	.device-iphone-x .device-btns{
		top: 0.7183359483em;	left: -0.01873919865em;
		width: 0.01873919865em;	height: 0.1998847856em
	}
	.device-iphone-x .device-btns::after, .device-iphone-x .device-btns::before{width: 0.01873919865em;	height: 0.3872767721em}
	.device-iphone-x .device-btns::before{top: 0.874495937em}
	.device-iphone-x .device-btns::after{top: 0.374783973em}
	.device-iphone-x .device-power{
		top: 1.24927991em;	right: -0.01873919865em;
		width: 0.01873919865em;	height: 0.624639955em
	}




.jumbotron {
	margin-bottom: 0 !important;
}

.atlas-cta {
	border-radius: 100px !important;
	padding: 12px 30px !important;
	font-weight: 700;
	transition: .3s ease-in-out !important;
}

.atlas-cta:hover {
	text-decoration: none;
	transform: translateY(-5px);
}

.atlas-cta-wide {
	width: 100%;
}

.cta-green {
	background: #ffbf00;
	color: #192440;
}

.cta-green:hover {
	color: #ffffff;
	background: #ffaa00;
}

.cta-blue {
	background: #192440;
	color: #ffffff;
}

.cta-blue:hover {
	color: #ffffff;
	background: #121a2e;
}

.cta-ghost {
	border: 2px solid #192440 !important;
	color: #192440;
}

.cta-ghost:hover {
	color: #ffffff;
	background: #121a2e;
}



/*
 * -------------------------------------------------------------------
 *	Cabecera
 * -------------------------------------------------------------------
 *
 *
*/
	#banner {
		background-size: cover;	background-position: center center
	}
	#login{display: inline-block}
	#login .icon{
		float: right;
		width: 1em;	height: 1em;
		margin-top: 6px;	margin-left: 6px;
		font-size: 1.2rem;
		--ionicon-stroke-width: 3rem
	}

	#banner header {
		overflow: hidden;
	}

	#banner header img {
		max-width: 80px;
	}
	#banner p b{font-weight: 700}



/*
 * -------------------------------------------------------------------
 *	Clientes
 * -------------------------------------------------------------------
 *
 *
*/
	#clientes h2{font-size: 2rem !important}



/*
 * -------------------------------------------------------------------
 *	3 Beneficios directos
 * -------------------------------------------------------------------
 *
 *
*/
	.icono{
		display: block;	position: relative;
		width: 1em;	height: 1em;
		font-size: 4.5em;	/*color: #ffbf00;*/
		--ionicon-stroke-width: .38em;
	}
	.icono .triangulo{position: absolute;	top: -20px;	bottom: -20px;	left: -20px;	right: -20px}
	.icono.qr .triangulo{
		background:-webkit-linear-gradient(285deg, transparent 66%, #fff 66%),
			-webkit-linear-gradient(40deg, transparent 73%, #fff 73%),
			-webkit-linear-gradient(bottom left, #fff 42%, transparent 42%),
			-webkit-linear-gradient(#ffd24d, #ffd24d);
		background:-moz-linear-gradient(285deg, transparent 66%, #fff 66%),
			-moz-linear-gradient(40deg, transparent 73%, #fff 73%),
			-moz-linear-gradient(bottom left, #fff 42%, transparent 42%),
			-moz-linear-gradient(#ffd24d, #ffd24d);
		background:-o-linear-gradient(285deg, transparent 66%, #fff 66%),
			-o-linear-gradient(40deg, transparent 73%, #fff 73%),
			-o-linear-gradient(bottom left, #fff 42%, transparent 42%),
			-o-linear-gradient(#ffd24d, #ffd24d);
		background: linear-gradient(-15deg, transparent 66%, #fff 66%),
			linear-gradient(-130deg, transparent 73%, #fff 73%),
			linear-gradient(-45deg, #fff 42%, transparent 42%),
			linear-gradient(to bottom, #ffd24d, #ffd24d);
	}
	.icono.escudo .triangulo{
		background: -webkit-linear-gradient(280deg, transparent 46%, #fff 46%),
			-webkit-linear-gradient(30deg, transparent 86%, #fff 86%),
			-webkit-linear-gradient(300deg, #fff 35%, transparent 35%),
			-webkit-linear-gradient(#ffd24d, #ffd24d);
		background: -moz-linear-gradient(280deg, transparent 46%, #fff 46%),
			-moz-linear-gradient(30deg, transparent 86%, #fff 86%),
			-moz-linear-gradient(300deg, #fff 35%, transparent 35%),
			-moz-linear-gradient(#ffd24d, #ffd24d);
		background: -o-linear-gradient(280deg, transparent 46%, #fff 46%),
			-o-linear-gradient(30deg, transparent 86%, #fff 86%),
			-o-linear-gradient(300deg, #fff 35%, transparent 35%),
			-o-linear-gradient(#ffd24d, #ffd24d);
		background: linear-gradient(10deg, transparent 46%, #fff 46%),
			linear-gradient(120deg, transparent 86%, #fff 86%),
			linear-gradient(30deg, #fff 35%, transparent 35%),
			linear-gradient(to bottom, #ffd24d, #ffd24d);
	}
	.icono.iman .triangulo{
		background:-webkit-linear-gradient(330deg, transparent 74%, #fff 74%),
			-webkit-linear-gradient(290deg, transparent 56%, #fff 56%),
			-webkit-linear-gradient(275deg, #fff 37%, transparent 37%),
			-webkit-linear-gradient(#ffd24d, #ffd24d);
		background:-moz-linear-gradient(330deg, transparent 74%, #fff 74%),
			-moz-linear-gradient(290deg, transparent 56%, #fff 56%),
			-moz-linear-gradient(275deg, #fff 37%, transparent 37%),
			-moz-linear-gradient(#ffd24d, #ffd24d);
		background:-o-linear-gradient(330deg, transparent 74%, #fff 74%),
			-o-linear-gradient(290deg, transparent 56%, #fff 56%),
			-o-linear-gradient(275deg, #fff 37%, transparent 37%),
			-o-linear-gradient(#ffd24d, #ffd24d);
		background: linear-gradient(-60deg, transparent 74%, #fff 74%),
			linear-gradient(20deg, transparent 56%, #fff 56%),
			linear-gradient(-5deg, #fff 37%, transparent 37%),
			linear-gradient(to bottom, #ffd24d, #ffd24d);
	}



/*
 * -------------------------------------------------------------------
 *	Beneficios
 * -------------------------------------------------------------------
 *
 *
*/
	.feature img {
		width: 100%;
		max-width: 480px;
		border-radius: 20px;
		box-shadow: 15px 15px #ffd24d
	}

	#feature-first {
		background: linear-gradient(168deg, #ffffff 55%, #ffbf00 0);
	}

	#feature-last {
		background: #ffbf00;
	}
	#back .icon{
		float: left;
		width: 1em;	height: 1em;
		margin-top: 2px;	margin-right: 6px;
		font-size: 1.3rem
	}



/*
 * -------------------------------------------------------------------
 *	Precios
 * -------------------------------------------------------------------
 *
 *
*/
	#price-table {
		padding-top: 4rem !important;
		padding-bottom: 4rem !important;
	}

	#price-table__premium {
		background: #192440;
		color: #ffffff;
	}

	#price-table ul li {
		padding: 15px 0;
	}



/*
 * -------------------------------------------------------------------
 *	Contacto
 * -------------------------------------------------------------------
 *
 *
*/
	#contact {
		background-size: cover;
	}

	#contact ul li {
		padding: 3px 0;
	}

	#contact form {
		color: #ffbf00;
	}

	#contact form input,
	#contact form textarea {
		background: transparent;
		border: 1px solid #ffbf00;
		color: #ffffff;
	}



/*
 * -------------------------------------------------------------------
 *	Footer
 * -------------------------------------------------------------------
 *
 *
*/
	#copyright {
		background: #192440;
		padding: 2rem 3rem;
	}
	#copyright a{color: #ffbf00;	text-decoration: none}
	#copyright a:hover{color: #ffaa00}

	#social-media a {
		width: 40px;
		height: 40px;
		border-radius: 99%;
		background: #ffffff;
		transition: .4s ease;
	}

	#social-media a i {
		color: #192440;
		font-size: 1.2rem;
		line-height: 40px;
	}

	#social-media a:hover {
		background: #ffbf00;
	}

	#social-media a:hover i {
		color: #ffffff;
	}



/*
 * -------------------------------------------------------------------
 *	Responsivo
 * -------------------------------------------------------------------
 *
 *
*/
	/*Extra small devices (portrait phones, less than 576px)*/
	@media (max-width: 575.98px) {
		h2{font-size: 2.4rem !important}
		.padding{padding: 2rem 0}
		#banner{background-position: 34% center}
		#banner h1{font-size: 3rem}
		.cel{margin-bottom: -260px}
		#clientes h2{font-size: 1.5rem !important}
	}

	/*Small devices (landscape phones, 576px and up)*/
	@media (min-width: 576px) and (max-width: 767.98px) {
		#banner{background-position: 30% center}
		#banner h1{font-size: 3rem}
		.cel{margin-bottom: -300px}
	}

	/*Medium devices (tablets, 768px and up)*/
	@media (min-width: 768px) and (max-width: 991.98px) {
		#banner h1{font-size: 3.5rem}
		.cel{font-size: 6.5em}
	}

	/*Large devices (desktops, 992px and up)*/
	@media (min-width: 992px) and (max-width: 1199.98px) {
		#banner h1{font-size: 3.5rem}
		.cel{font-size: 6.5em}
	}

	/*Extra large devices (large desktops, 1200px and up)*/
	@media (min-width: 1200px) {
		
	}