﻿@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito&display=swap');

body {
	overflow-x: hidden;
}


.htext {
	font-family: Roboto;
	font-style: normal;
	font-weight: bold;
}

.page-title {
	font-size: 48px;
	line-height: 56px;
}

.page-subtitle {
	font-size: 36px;
	line-height: 42px;
}

	.movilidad h1 {
		margin-left: 53px;
		margin-top: 70px;
		color: #000000;
	}

	.movilidad p {
		margin-left: 53px;
		margin-top: 20px;
		margin-bottom:20px;
		font-family: Nunito;
		font-style: normal;
		font-weight: normal;
		font-size: 24px;
		line-height: 33px;
		color: #818181;
	}


	.movilidad  a {
		margin-left: 81px;
		font-size: 18px;
		line-height: 21px;
		/* identical to box height */
		background: #2A74F3;
		color: white;
		text-decoration: none;
		padding: 1rem 1rem;
		font-size: 2rem;
		border-radius: 10%;
	}

.d1 {
	margin-top: 0px;
	margin-top: -8rem;
	float: right;
	width: 50%;
}

.puntogrande {
	margin-left: 706px;
	margin-top: -400px;
}

.bigdot {
	height: 650px;
	width: 650px;
	background: #211A9A; /* fallback for old browsers */
	background: bottom; /* Chrome 10-25, Safari 5.1-6 */
	background: url('images/redesing/form-dot-650-loading.png'),linear-gradient(180deg, #1A4D9A 0%, #2A75F3 100%);
	background-repeat: no-repeat;
	border-radius: 50%;
	display: inline-block;
}


.mediumdot {
	height: 400px;
	width: 400px;
	background: #211A9A; /* fallback for old browsers */
	background: bottom; /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient( to bottom right, rgba(26, 77, 154, 1), rgba(75,129,211,1));
	border-radius: 50%;
	display: inline-block;
}

.smalldot {
	height: 300px;
	width: 300px;
	background: #211A9A; /* fallback for old browsers */
	background: bottom; /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient( to bottom right, rgba(26, 77, 154, 1), rgba(75,129,211,1));
	border-radius: 50%;
	display: inline-block;
}

.companies-section {
	margin-bottom: 50px;
}

.companies-section h1 {	
	text-align: center;
}

.puntomediano {
	margin-left: -222px;
	margin-top: -350px;
}

.puntomediano img:nth-child(2) {
	margin-left: -110px;
	margin-top: -670px;
}

.puntomediano img:nth-child(3) {
	margin-left: -90px;
	margin-bottom: 100px;
}

.companies-section .brands {
	margin-left:20%;
	width: 785px;
	height:298px;
}

.companies-section .brands img{
	width:100%;
}

.title-allneed {
	margin: auto;
	width: 673px;
	height: 53px;
}

.smalldot-container {
	margin-top: -200px;
	margin-left: 90%;
}

.smalldot-container img {
	margin-top: -130px;
	margin-left: 10px;
}

.needtext {
	text-align:center;
}

.needtext div {
	display: inline-block;
	width: 30%;
	padding: 10px 20px 0 20px;
    height: 120px;
}

.needtext div h1 {	
	font-size: 24px;
	line-height: 28px;
}

.needtext div p {	
	font-size: 14px;
	line-height: 19px;
}


.smalldot-container2 {
	margin-top: -100px;
	margin-left: -173px;
}

.smalldot-container2 img {
	margin-top: -480px;
	margin-left: -80px;
}

.use-formax {
	margin: auto;
	width: 817px;
	height: 84px;	
	text-align: center;
}


.use-formax-apps {
	text-align: center;
	margin-bottom : 50px
}

/*
.use-formax-apps div{
	display:inline-block;
	width:45%;
}*/

.use-formax-apps h1 {
	font-size: 24px;
}

.use-formax-apps p {
	width: 359px;
	height: 160px;
	margin: auto;
	font-family: Nunito;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 25px;
}

.use-formax-apps .contact {
	margin:auto;
	width: 200px;
	height: 50px;
	background: #2A74F3;
	padding: 1rem 1rem;
	border-radius: 10px;
}

.use-formax-apps .contact a{
	
	font-size: 18px;
	/* identical to box height */
	color: white;
	text-decoration: none;
	padding: 1rem 1rem;
}

.request-test {
	background: url(images/redesing/request-test-img.png);
}

.request-test h3{	
	text-align: center;
	color: white;
	padding-top: 30px;
	font-weight: bold;
	margin-bottom: 20px;
	margin-bottom: 40px;
}

.request-test .div-form {
	text-align: center;
	margin-top: 20px;
	margin-bottom: 70px;
}

.request-test input{
	border-radius: 5px;
	border: 1px solid white;
	padding: 5px;
	width: 350px; 
	color: #BEBFD1;
	font-family: Nunito;
}

.request-test button {
	background-color: transparent;
	color: white;
	padding: 5px 10px;
	font-size: 15px;
	border: 1px solid white;
}


/*Solutions*/

.dot-solutions-1000 {
	height: 1000px;
	width: 1000px;
	background: #211A9A; /* fallback for old browsers */
	background: bottom; /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient( to bottom right, rgba(26, 77, 154, 1), rgba(75,129,211,1));
	border-radius: 50%;
	display: inline-block;
}

.dots-solutions {
	width:100%;
	position:relative;
}

.dot-solutions-1 {
	position: absolute;
	top: -800px;
	left: -883px;
}

.dot-solutions-2 {
	position: absolute;
	top: -800px;
	right: -883px;
}

.Productivity-max {
	width: 70%;
	margin: auto;
	text-align: center;
}

.Productivity-max h1{
	font-family: Roboto;
	font-style: normal;
	font-weight: bold;
	font-size: 64px;
	line-height: 75px;
}

.Productivity-max p{
	font-family: Nunito;
	font-style: normal;
	font-weight: normal;
	font-size: 24px;
	line-height: 33px;
}


.Productivity-max-total div {
	font-family: Roboto;
	font-style: normal;
	font-weight: bold;
	font-size: 48px;
	line-height: 56px;
	text-align:center;
}

.Productivity-max-total p {
	font-family: Nunito;
	font-style: normal;
	font-weight: normal;
	font-size: 24px;
	line-height: 33px;
}


/*Benefits*/

.dot-benefits-600 {
	height: 600px;
	width: 600px;
	background: #211A9A; /* fallback for old browsers */
	background: bottom; /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(180deg, #1A4D9A 0%, #2A75F3 100%);
	/*linear-gradient( to bottom right, rgba(26, 77, 154, 1), rgba(75,129,211,1));*/
	border-radius: 50%;
	display: inline-block;
}



.dot-benefits{
	margin-top: -150px;
	margin-left:-265px;
}

.benefits-title {
	margin-top: -450px;
	width:786px;
	height:224px;
	margin-left:335px;
	text-align: right;
	margin-bottom: 250px;
}

.benefits-title h1 {
	font-family: Roboto;
	font-style: normal;
	font-weight: bold;
	font-size: 48px;
	line-height: 56px;
}

.benefits-title p {
	font-family: Nunito;
	font-style: normal;
	font-weight: normal;
	color:#818181;
	font-size: 24px;
	line-height: 33px;
}

.benefits-lists ul {
	list-style:none;
	padding: 20px 0 0 100px;

}

.benefits-lists-r ul {
	list-style: none;
	padding: 20px  100px 0 0;
}

.benefits-lists ul li {
	font-family: Nunito;
	font-style: normal;
	font-weight: normal;
	font-size: 24px;
	line-height: 24px;
	margin-bottom: 100px;
}

.dots-benefits {
	width: 50px;
	height: 314px;
	content: url('images/redesing/dots-benefits-1200.png');
}


/*LoadingPage1*/

.title-lp1{
	text-align:center;
	margin-bottom:100px;
	padding: 0 30px;
}


.loading-page-h1 {
	font-family: Roboto;
	font-style: normal;
	font-weight: bold;
	font-size: 48px;
	line-height: 56px;
}

.title-lp1 p{
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	font-size: 24px;
	line-height: 28px;
}

.apps-loadingpage {
	text-align:center;
}

.apps-loadingpage div p {
	font-family: Nunito;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 25px;
}

.div-inverse div:nth-child(1){
	float:right;
}
.div-inverse div:nth-child(2) {
	float: left;
}

.img-principal {
	width: 450px;
	height: 450px;
}

.loadingpage-moredetails-passtracker {
	margin: auto;
	width: 200px;
	height: 50px;
	background: #9E4E98;
	padding: 1rem 1rem;
	border-radius: 10px;
}

.loadingpage-moredetails {
	margin: auto;
	width: 200px;
	height: 50px;
	background: #2A74F3;
	padding: 1rem 1rem;
	border-radius: 10px;
}

.loadingpage-moredetails-a {
	font-size: 18px;
	/* identical to box height */
	color: white;
	text-decoration: none;
	padding: 1rem 1rem;
}

/*Contact*/
.contact-address {
	display:inline-block;
	width: 48%;
	margin-left: 20px;
}

.form-contact {
	display: inline-block;
	width: 48%;
}

.contact-address h1 {
	font-family: Roboto;
	font-style: normal;
	font-weight: bold;
	font-size: 48px;
	line-height: 56px;
}

.contact-address p {
	font-family: Nunito;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 25px;
	color: #818181;
}

.contact-address h3{
	font-family: Roboto;
	font-style: normal;
	font-weight: 500;
	font-size: 24px;
	line-height: 28px;
}

.contact-address ul{
	list-style:none;
}

.contact-address ul li {
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 16px;
}

.contact-address ul li span{
	color:blue;
	width:20px;
	height:20px;
}

.dot-contact {
	width: 600px;
	height: 600px;
	background: linear-gradient(180deg, #1A4D9A 0%, #2A75F3 100%);
	border-radius: 50%;
	display: inline-block;
}

.border-form-contact {
	width: 588px;
	height: 741px;
	background: #FFFFFF;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25), 0px -1px 10px rgba(0, 0, 0, 0.25);
	border-radius: 20px;
	margin-left: 60px
}

.label-form-contact {
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 21px;
	color: #818181;

	display:block;
}

.input-form-contact {
	width: 494px;
	height: 50px;
	background: #F9F9FB;
	border: 1px solid #9A9A9A;
	box-sizing: border-box;
	border-radius: 10px;
	margin-bottom:50px;
}

.area-form-contact {
	width: 494px;
	height: 150px;
	background: #F9F9FB;
	border: 1px solid #9A9A9A;
	box-sizing: border-box;
	border-radius: 10px;
	margin-bottom: 25px;
}

.btn-send-contact {
	background: #2A74F3;
	color: #FFF;
}


.footer-text-title {
	font-family: Roboto;
	font-style: normal;
	font-weight: bold;
	font-size: 18px;
	line-height: 21px;	
	color: #367BF0
}

.footer-text-title-ubication {
	font-family: Roboto;
	font-style: normal;
	font-weight: 900;
	font-size: 24px;
	line-height: 28px;
	color: #000000;
}

.footer-text-ul {
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 16px;
}

.footer-text-ul li{
	margin-bottom: 30px;
}

.footer-logo {
	text-align: center;
	margin-top: 50px;
	padding: 50px
}

 .footer-text-address {
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 16px;
	color: #000000;
}

 .footer-text-size-div1 {
	 width:60%;
	 float:left;
 }

.footer-text-size-div1-1 {
	width: 40%;
	float: left;
}

.footer-text-size-div1-2 {
	width: 60%;
	float: right;
}

.footer-text-size-div2 {
	width: 40%;
	float: right;
}

.footer-text-size-div2-1 {
	width: 40%;
	float: left;
	padding-left: 20px;
}

.footer-text-size-div2-2 {
	width: 60%;
	float: right;
}

@media (max-width:900px) {
	.movilidad {
		text-align: center;
	}

		.movilidad a {
			margin-left: 0;
		}

	.puntogrande {
		margin-top: 40px;
		margin-left: 0;
		text-align: center;
	}

	.puntogrande span {
		background: url('Images/redesing/Dot650.png');
	}

	.companies-section .brands {
		margin-left: 10%;
		width: 569px;
		height: 196px;
	}

	.puntomediano img{
		display:none;
	}

	.puntomediano {
		margin-left: -65px;
		margin-top: -200px;
	}

	 .puntomediano .mediumdot {
		height: 200px;
		width: 200px;
		border-radius: 0;
		
	}

	.smalldot-container {
		margin-top: -100px;
		margin-left: 100%;
	}


	.smalldot-container img,.smalldot-container2 img {
		display:none;
	}

	.smalldot {
		height: 150px;
		width: 150px;
		border-radius:0;
	}

	.smalldot-container span {
		background: url(images/redesing/Dot150right.png) no-repeat;
	}

	.smalldot-container2 {
		margin-top: -100px;
		margin-left: -10%;
	}

	.smalldot-container2 span{
		background: url(images/redesing/Dot150left.png) no-repeat;
	}

	.puntomediano span {
		background: url(images/redesing/Dot200brands.png) no-repeat;
	}


	.use-formax {		
		width: 523px;
		height: 126px;
		
	}

	.Productivity-max {
		width: 80%;		
	}


	.Productivity-max h1 {
		font-size: 48px;
		line-height: 56px;
	}

	.Productivity-max p {
		font-size: 18px;
		line-height:25px
	}

	.Productivity-max-total div {		
		font-size: 48px;
		line-height: 56px;		
	}

	.Productivity-max-total p {		
		font-size: 24px;
		line-height: 25px;
	}

	/*Solutions*/

	.dot-solutions-1000 {
		height: 800px;
		width: 800px;
	}

	.dot-solutions-1 {
		top: -600px;
		left: -800px;
	}

	.dot-solutions-2 {
		top: -600px;
		right: -800px;
	}

	.Productivity-max h1 {		
		font-size: 48px;
		line-height: 56px;
	}

	.Productivity-max p {
		font-size: 18px;
		line-height: 24px;
	}

	/*Benefits*/
	.dot-benefits-600 {
		height: 500px;
		width: 500px;		
	}
	.img-dot-benefits{
		background: url(images/redesing/dotsbefefits500.png) no-repeat;
	}
	.benefits-title {
		margin-top: -350px;
		width: 562px;
		margin-left: 220px;
	}

	.benefits-title h1 {		
		font-size: 36px;
		line-height: 42px;
	}

	.benefits-lists ul li {
		font-size: 18px;
		line-height: 24px;
		margin-bottom: 70px;
	}

	.dots-benefits {
		width: 42px;
		height: 303px;
		content: url('images/redesing/dots-benefits900600.png');
	}

	/*LoadingPage1*/
	.loading-page-h1 {		
		font-size: 36px;
		line-height: 42px;
	}

	.title-lp1 {
		text-align: center;
		margin: auto auto 100px auto;
	}
	
	.title-lp1 p {
		font-size: 18px;
		line-height: 24px;
	}

	.div-inverse div:nth-child(1){
		float:none;
	}
	.div-inverse div:nth-child(2) {
		float: none;
	}

	.img-principal {
		width: 350px;
		height: 350px;
	}

	/*Contact*/

	.contact-address {
		text-align: center;
		width: 100%;
		padding: 20px;
		margin: auto
	}

	.form-contact {
		width: 100%;
	}

	.contact-address{
		text-align:center;
		margin-bottom:50px;
	}

	.dot-contact{
		margin:auto;
		width:700px;
		height:700px;
	}
	.border-form-contact {
		margin: auto;		
	}

	.contact-address ul {
		padding:0px;
	}

	/*FOOTER*/
	.footer-text-title-ubication {
		font-size: 18px;
		line-height: 21px;
		color: #000000;
	}

	.footer-logo {
		text-align: center;
		margin-top: 100px;
		padding: 10px
	}

	.footer-text-address {
		font-size: 12px;
		line-height: 14px;
	}
}


@media (max-width:600px) {

	.movilidad {
		text-align: center;
		padding: 10px;
	}

		.movilidad a {
			margin-left: 0;
		}

		.movilidad p {
			font-size: 18px;
			margin-left: 0px;
			margin-top: 0px;
		}
	.movilidad h1 {
		margin-left: 0px;
		margin-top: 20px;		
	}
	.page-title {
		font-size: 36px;
		line-height: 42px;
	}

	.page-subtitle {
		font-size: 24px;
		line-height: 28px;
	}

		

	.puntogrande {
		margin-top: 40px;
		margin-left: 0;
		text-align: center;
	}

		.puntogrande .bigdot {
			height: 500px;
			width: 500px;
			text-align: center;
		}

		.puntogrande span {
			background: url('images/redesing/Dot500.png');
		}

	.companies-section .brands {
		margin-left: 10%;
		width: 458px;
		height: 171px;
	}

	.smalldot-container {
		margin-top: -100px;
		margin-left: 90%;
	}

	.smalldot-container2 {
		margin-top: -100px;
		margin-left: -5%;
	}

	.needtext div {		
		width: 80%;
		padding: 10px 50px 0 50px;
		
	}

	.use-formax {
		width: 384px;
		height: 84px;
	}

	
	.Productivity-max {
		width: 80%;
	}

	.Productivity-max h1 {
		font-size: 36px;
		line-height: 42px;
	}

	.Productivity-max p {
		font-size: 18px;
		line-height: 25px
	}

	.Productivity-max-total div {
		font-size: 36px;
		line-height: 42px;
	}

	.Productivity-max-total p {
		font-size: 18px;
		line-height: 25px;
	}
	

	/*Solutions*/

	.dot-solutions-1000 {
		height: 800px;
		width: 800px;
	}

	.dot-solutions-1 {
		top: -700px;
		left: -750px;
	}

	.dot-solutions-2 {
		top: -700px;
		right: -780px;
	}

	.Productivity-max h1 {
		font-size: 36px;
		line-height: 42px;
	}

	.Productivity-max p {
		font-size: 18px;
		line-height: 24px;
	}

	/*Benefits*/

	.dot-benefits-600 {
		display:none;
	}

	.benefits-title h1 {
		font-size: 24px;
		line-height: 28px;
	}

	.benefits-title p {		
		font-size: 18px;
		line-height: 24px;
	}

	.benefits-title {		
		width: initial;
		margin: auto auto 50px auto;
		text-align:center;
		padding: 0 20px;
	}

	.benefits-lists ul li {
		font-size: 18px;
		line-height: 24px;
		margin-bottom: 70px;
	}

	.dots-benefits {
		width: 42px;
		height: 303px;
		content: url('images/redesing/dots-benefits900600.png');
	}

	/*LoadingPage1*/
	.loading-page-h1 {
		font-size: 36px;
		line-height: 42px;
	}

	.title-lp1 {
		text-align: center;
		margin: auto auto 70px auto;
		padding: 0 20px;
	}

	.title-lp1 p {
		font-size: 18px;
		line-height: 24px;
	}

	.img-principal {
		width: 350px;
		height: 350px;
	}

	/*Contact*/

	.contact-address {
		text-align:center;
		width: 100%;
		padding:20px;
		margin:auto
	}

	.form-contact {
		width: 100%;
	}
	.border-form-contact {
		width: 469px;		
	}
	.dot-contact {
		margin: auto;
		width: 500px;
		height: 500px;
	}

	.input-form-contact {
		width: 394px;
	}

	.area-form-contact {
		width: 394px;		
	}

	.contact-address ul {
		padding: 0px;
	}
	/*Footer*/

	.footer-logo {
		text-align: center;
		margin: 50px 0 30px 0;
		padding: 40px;
	}

	.footer-text-size-div1 {
		width: 60%;
		float: left;
	}

	.footer-text-size-div1-1 {
		width: 100%;
		float: left;
	}

	.footer-text-size-div1-2 {
		width: 100%;
		float: right;
	}

	.footer-text-size-div2 {
		width: 40%;
		float: right;
	}

	.footer-text-size-div2-1 {
		width: 100%;
		float: left;
		padding-left: 20px;
	}

	.footer-text-size-div2-2 {
		width: 100%;
		float: right;
	}

	.request-test .div-form {
		text-align: center;
		margin-top: -25px;
		margin-bottom: 50px;
	}

	.request-test button {
		margin-top: 10px;
		width: 350px;
	}

}

.w-100 {
	width: 100%;
}