:root {
	--main-bg-color: rgb(252, 254, 255);
	--header-bg-color: rgba(252, 254, 255, 0.3);
	--shadow-color: rgba(0,0,0,0.3);
	--box-bg-color: rgba(255,255,255, 0.35);
	--highlight-color: rgba(91,159,155,1);
	--brigth-color: rgba(121,200,164,1);
	--btn-default-bg-color: rgba(35,63,138,0.9);
	--btn-alternate-bg-color: rgba(171,199,232,1);
	--text-color-default: rgba(0,0,0,0.6);
	--text-color-dark: rgba(0,0,0,0.9);
	--text-color-blue: rgba(23,39,77,1);
	--text-color-light: rgba(121,200,164,1);
	--text-color-pink: rgba(236,76,125,1);
	--text-color-dark: rgba(0,0,0,0.8);
	--bg-blue: rgba(23,39,77,1);
	--box-radius: 20px;
}
body{
	font-family: 'Source Sans Pro', sans-serif;
	background: var(--main-bg-color);
	color: var(--text-color-default);
}
header{
	z-index: 1999;
	position: fixed;
	font-size: 0.9rem;
	padding: 0px;
	width: 100%;
	background-color: rgba(255,255,255,0.01);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	-moz-filter: blur(10px);
}
.menu_toggle{
	display: none;
}
h1, h2, h3, h4, h5{
	font-weight: 700;
	color: var(--text-color-blue);
	margin: 20px 0 5px 0;
	font-family: 'Source Sans Pro', sans-serif;
}
h1{
	font-size: 4rem;
	line-height: 4.5rem;
}
h2{
	font-size: 3.3rem;
	line-height: 4rem;
}
h3{
	font-size: 2.8rem;
	line-height: 3.2rem;
}
h4{
	font-size: 2.3rem;
	line-height: 2.8rem;
}
h5{
	font-size: 1.8rem;
	line-height: 2.2rem;
}
.titulo{
	color: var(--text-color-blue);
	font-weight: 400;
	margin: 20px 0 5px 0;
	font-size: 1.8rem;
	line-height: 2.2rem;
}
.container{
	max-width: 1280px;
	margin: 0px auto;
	padding: 10px 20px;
}
.site{
	font-family: 'Source Sans Pro', sans-serif;
}
input, textarea, button, .btn{
	font-family: 'Source Sans Pro', 'Gil Sans', Tahoma;
	-webkit-transition: all 0.30s ease-in-out;
	-moz-transition: all 0.30s ease-in-out;
	-ms-transition: all 0.30s ease-in-out;
	-o-transition: all 0.30s ease-in-out;
	outline: none;
	border-bottom: 1px solid #ccc;
}
select{
	border: 1px solid rgba(0,0,0,0.1);
}
input:focus, textarea:focus, button:focus, select:focus, .btn:focus {
	box-shadow: 0 0 16px -2px var(--shadow-color);
}
a:not(.btn), a:not(.btn):visited{
	color: var(--highlight-color);
}
a:not(.btn):hover, a:not(.btn):active{
	color: var(--text-color-light);
}
.form-dfs{
	min-width: 300px;
}
.form-dfs label{
	display: none;
}
.form-dfs .top-field{
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	border-bottom: 1px solid rgba(0,0,0,0.07);
}
.form-dfs .bottom-field{
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}
.form-dfs a, .form-dfs a:visited{
	color: var(--text-color-blue);
}
.form-dfs a:hover{
	color: var(--text-color-blue);
}
.form-dfs .form-g{
	padding: 0px 10px;
}
button, .btn{
	background-color: var(--btn-default-bg-color);
	color: var(--text-color-light);
	letter-spacing: 1px;
	font-weight: 400;
	position: relative;
	overflow: hidden;
	transition: background 400ms;
	border-radius: 25px;
	padding: 7px 20px;
	display: inline-block;
}
.btn.btn-light{
	background-color: #ffffff;
	color: rgba(114, 209, 250, 1);
	fill: rgba(114, 209, 250, 1);
}
header .container{
	padding: 10px 30px;
}
header .logo{
	margin: 0px 0px 0 20px;
}
.logo img{
	height: 85px;
}
header nav{
	position: relative;
	font-weight: 400;
}
header a{
	color: var(--text-color-blue) !important;
}
header .account-box svg{
	vertical-align: text-bottom;
    height: 20px;
	fill: var(--text-color-blue) !important;
}
nav ul, nav li{
	display: inline-block;
	padding: 0px;
}
nav li a{
	padding: 15px 12px;
}
nav a:hover, nav a:active {
    color: var(--highlight-color) !important;
}
#account .box{
	font-weight: 400;
	background-color: rgba(0,0,0,0.3);
	color: var(--text-color-blue);
	padding: 0px 5px;
	border-radius: var(--box-radius);
	float: left;
	margin-left: 6px;
}
#account .box svg, #account .box a{
	vertical-align: bottom;
	line-height: 26px;
}
.avt-img{
	float: left;
	margin: 0px 10px 0px -5px;
	vertical-align: bottom;
}
canvas{
	z-index: 900;
}
.top-header{
	background: rgb(221,232,240);
	background: linear-gradient(45deg, rgba(221,232,240,1) 0%, rgba(229,238,243,1) 75%, rgba(229,243,237,0.3) 89%, rgba(32,131,186,0.3) 100%);
	width: 100%;
	height: calc(65vh - 50px);
	min-height: 550px;
	z-index: 20;
}
.home .top-header{
	min-height: calc(100vh);
	height: auto;
	background-position: center center;
}
.top-header .bg_top_patterns{
	width: 100%;
	max-width: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
}

.top-header>div{
	position: relative;
	display: block;
	visibility: visible;
	max-width: 1280px;
	margin: 0px auto;
}
.top-header>div:nth-child(1){
	z-index: 10;
	white-space: nowrap;
	letter-spacing: 0px;
	text-align: inherit;
	padding: 185px 0 0 170px;
}
.top-header>div:nth-child(1) h1{
	color: var(--text-color-default);
	font-size: 6rem;
	line-height: 6rem;
    height: 255px;
}
.top-header>div:nth-child(2){
	color: var(--text-color-default);
	padding: 50px 0 0 170px;
	z-index: 9;
}
.top-header>div:nth-child(3){
	padding: 30px 0 0 170px;
	z-index: 8;
}
.top-header>div:nth-child(4){
	padding: 0 0;
	z-index: 7;
	margin: -465px auto 0;
	height: auto;
	text-align: right;
}
.top-header>div:nth-child(4) img{
	height: 636px;
	border-width: 0px; margin: 0px;
}
footer{
	padding: 50px 20px 30px 20px;
	margin-top: 50px;
	background-color: rgb(221,232,240);
}
footer .container{
	padding: 0px 30px;
}
footer .container .titulo{
	color: var(--text-color-blue);
}
footer .container, footer .container a{
	font-size: 0.8rem;
	font-weight: 400;
	line-height: 24px;
}
footer .container a, footer .container a:active, footer .container a:visited{
	color: var(--text-color-blue);
}
footer p{
	line-height: 1rem;
	margin: 5px 0px;
}
.dfs-card{
	border-radius: 30px;
}
.dfs-card-shadow{
	box-shadow: 0px 0px 18px -4px var(--shadow-color);
}
.dfs-shadow-rb{
	box-shadow: 2px 2px 20px -3px var(--shadow-color);
}
.bg-transparent{
	background: none !important;
}
.dfs-bor_rad-15{
	border-radius: 15px;
	overflow: hidden;
}
.dfs-bor_sol-1{
	border: 1px solid var(--shadow-color);
}
#servicios img{
	position: relative;
	width: 100%;
    height: auto;
	vertical-align: bottom;
}
#servicios .dfs-flex>*{
	width: auto;
	height: auto;
	margin: 10px;
}
.contacto{
	padding-top: 150px;
	padding-bottom: 50px;
	background: rgb(255,255,255);
	background: linear-gradient(75deg, rgba(221,232,240,0) 0%, rgba(229,238,243,.5) 75%, rgba(229,243,237,0.3) 89%, rgba(32,131,186,0.3) 100%);
}
#contactForm{
	width: 40%;

}
fieldset{
	border: 0px none;
	background-color: #DAEBF3;
	border-radius: 20px;
}
fieldset legend{
	font-size: 2rem;
	font-weight: bold;
	color: var(--text-color-blue);
	padding: 0px 10px;
}
.solicita-llamada footer{
	margin-top: 0px;
}

.invalid-feedback{
	display: none;
	clear: both;
	color: red;
}

form .invalid input{
	border: 1px solid red;
}
form .invalid .invalid-feedback{
	display: block;
}
.message-form{
    text-align: center;
    padding-top: 20px;
    color: var(--text-color-pink);
}

@media screen and (max-width:1200px) {
	html{
		font-size: 15px;
	}
}
@media screen and (max-width:1024px) {
	.top-header>div:nth-child(1) {
		padding-top: 135px;
	}
	.top-header>div:nth-child(1), .top-header>div:nth-child(2), .top-header>div:nth-child(3){
		padding-left: 70px;
	}
	.top-header>div:nth-child(4) img {
		height: 590px;
		width: auto;
	}
	#integraciones img{
		width: 400px;
		height: auto;
	}
	.contacto .dfs-flex>*:nth-child(2){
		display: none;
	}
	#contactForm{
		width: calc(100vw - 200px);
	}
}
@media screen and (max-width:920px) {
	.top-header>div:nth-child(1) {
		padding-top: 185px;
	}
	.top-header>div:nth-child(1), .top-header>div:nth-child(2), .top-header>div:nth-child(3){
		padding-left: 40px;
	}
	.top-header>div:nth-child(1) h1{
		height: auto;
	}
	.top-header>div:nth-child(1) h1 br:first-child{
		display: none;
	}
	.top-header>div:nth-child(4){
		margin-top: 0px;
	}
	.top-header>div:nth-child(4) img {
		height: 600px;
		width: auto;
	}
	#integraciones img{
		width: 400px;
		height: auto;
	}
	#servicios .dfs-flex{
		flex-wrap: wrap;
	}
}
@media screen and (max-width:820px) {
	#integraciones .dfs-flex{
		flex-wrap: wrap;
	}
	#integraciones .dfs-flex>*{
		flex-basis: calc(100vw - 40px);
	}
	#integraciones .dfs-flex>*:nth-child(1){
		order: 2;
	}
	#integraciones .dfs-flex>*:nth-child(2){
		order: 1;
	}
	#integraciones img{
		width: auto;
		height: auto;
	}
}
@media screen and (max-width:600px){
	html{
		font-size: 14px;
	}
	header nav{
		display: none;
	}
	.top-header>div:nth-child(1) {
		padding-top: 110px;
	}
	.top-header>div:nth-child(1) h1 br:first-child{
		display: block;
	}
	.top-header>div:nth-child(1), .top-header>div:nth-child(2), .top-header>div:nth-child(3){
		padding-left: 20px;
	}
	.dfs-flex>*{
		margin: 10px 0px;
	}
	.dfs-mv-50 {
		margin-top: 20px !important;
		margin-bottom: 20px !important;
	}
	.top-header>div:nth-child(4) img, #integraciones img, #servicios img {
		height: auto;
		max-width: calc(100vw - 40px);
	}
	.inicio .dfs-flex{
		display: block;
	}
	#integraciones .dfs-flex>*:nth-child(2){
		padding-left: 0px !important;
		padding-right: 0px !important;
	}
	#contactForm{
		width: calc(100vw - 40px);
	}
}