@charset "UTF-8";
/*----------------------variables-------------*/
:root {

	--colorbkcard01:#F2F2F2;
	--colorbordercard01:#000000;
	--colorbkcardhover01:#E6E6E6;
	
	--colorbkcard02:#F1F5FD;
	--colorbordercard02:#000000;
	--colorbkcardhover02:#CDDDF9;
	
	--colorbksection01:#6495ED;
	--colortextsection01:#FFFFFF;

}


h1, h2, h3, h4, h5, h6, strong, b {
    font-weight:bolder;
  }

em {
    font-style: italic;
  }

body{
    min-height: 100vh;
    /* background:url(../images/FONDO01.jpg) no-repeat; */
    background-size: cover;
    background-position: center;
}

/*------------------ HEADER & MENU -----------------*/
/*estilo desde style-menu.css*/

/*---------------CONTENIDO-------------------------------*/
.sangria-lista{
    margin-left: 2em;
}
.lista-conpuntos-sangria{
    list-style: disc;
    margin-left: 2em;
}
/*----------------GRID CONTENIDO-------------------------*/

.ultra-grid-2cols-80-20X100{
	display: grid;
	/*gap: 1rem;*/
	grid-template-columns: 80% 20%;
	/*padding: 4rem;*/
}
.main-grid-1col-ceropadding{
	/*background-color: var(--colorbksection01);
	 color: var(--colortextsection01); */
	display: grid;
	padding: 0rem;
}
.main-hero-1col-ceropadding{
	 /*color: var(--colortextsection01);  
	display: grid;*/
    margin: 0px;
	padding: 0px;
}
.quehacemos-hero-01 {
    color: #fbfbfb;
    font-size: 1.5rem;
	top: 14%;
	left: 5%;
	/* margin-left:-240px;
	margin-top:-20px; */
    text-shadow: 2px 2px 2px black;
	position: absolute;
    width:35%;
	z-index:20;
}
.comoteayudamos-hero-02 {
	top: 48%;
	left: 5%;
	/* margin-left:-240px;
	margin-top:-20px; */
	position: absolute;
    width:35%;
	z-index:20;
}
.regresar-hero-01 {
    color: #fbfbfb;
    font-family: 'Oswald', sans-serif;
    font-size: 1.4rem;
	top: 85%;
	left: 5%;
    text-shadow: 2px 2px 2px #51b7ff;
	position: absolute;
    /* width:35%; */
	z-index:21;
}
.ctabtn-hero{
    top: 85%;
	/*left: 15%;
	 margin-left:-240px;
	margin-top:-20px; */
	position: absolute;
    text-align: center;
    width:100%;
	z-index:20;
}
.ctabtn-libre{
    background-color: #F2F2F2;
    margin-top:1rem;
    padding: 0rem 0rem 0rem 0rem;
    position: relative;
    text-align: center;
    width:100%;
}
.ctabtn-hero-movil{
    display: none;
}
.btn{
    display: inline-block;
    padding: .5rem 1.3rem;
    font-size: 1.1rem;
    border: 3px solid #fff;
    border-radius: 1rem;
    line-height: 1;
    /* margin: 0 .2rem; */
    transition: .3s;
    /* text-transform: uppercase; */
}

.btn.solid, .btn.transparent:hover{
    background-color: #fbfbfb;
    border-color: #003af5;
    color: #003af5;
}

.btn.transparent, .btn.solid:hover{
    background-color: #003af5;
    border-color: #ffffff;
    color: #fbfbfb;
}
.main-grid-1col-padding-1rem{
/*	background-color: #fff;*/
	display: grid;
	padding: 1rem;
}
.main-grid-1col-nosotros01{
    	background-color: #e6aa42;
        display: grid;
        padding: 1rem;
    }
.main-grid-1col-nosotros02{
	background-color: #51b7ff;
	display: grid;
	padding: 1rem;
}
.main-grid-titulo-partners{
	color: #003af5;
	display: grid;
	padding: 2rem 0rem 0rem 2rem;
}
.main-grid-titulo-productos{
	color: #999999;
	display: grid;
	padding: 2rem 0rem 0rem 2rem;
}
.main-grid-2cols{
	/* background-color: #e3a02b; */
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(2, 1fr);
	padding: 2rem 8rem;
}
.main-grid-2cols-home{
	background-color: #001c76;
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(2, 1fr);
	padding: 2rem;
}
.main-grid-2cols-02{
	background-color: #e6aa42;
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(2, 1fr);
	padding: 2rem 8rem;
}
.main-grid-2cols-03{
	background-color: #51b7ff;
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(2, 1fr);
	padding: 2rem 8rem;
}
.main-grid-2cols-04{
	background-color: #29c341;
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(2, 1fr);
	padding: 2rem 8rem;
}
.main-grid-3cols{
/*	background-color: #fff;*/
	display: grid;
	gap: 1.5rem;
	grid-template-columns: repeat(3, 1fr);
	padding: 2rem;
}
.main-grid-4cols{
/*	align-items: center;
	background-color: #fff;*/
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(4, 1fr);
	padding: 4rem;
}
.main-grid-3cols-works{
	display: grid;
/*	gap: 0.1rem;*/
	grid-template-columns: repeat(3, 1fr);
	padding: 4rem;
}

/*----------------- TARJETAS CONTENIDO ----------*/
.tarjeta-servicios{
	/* background-color: #eeeeee; */
	border-color: #d5d5d5;
	border-radius: 10px;
	border-style: solid;
	border-width: 2px;
	/* font-size: 1.2rem; */
    overflow: hidden;
	padding:1.5rem;
	text-align: inherit;
}
.tarjeta-servicios:hover{
	background-color: #fbfbfb;
	box-shadow: 5px 5px 10px #666666;
	-webkit-box-shadow: 5px 5px 10px #666666;
/*	color:#fff;*/
	cursor:default;
}
.tarjeta-quien-eres{
    color:#fbfbfb;
	font-size: 1.2rem;
	padding:1.5rem;
    overflow: hidden;
	/* text-align:inherit; */
}
.tarjeta-partners{
	background-color: #fafafa;
	border-color: #003af5;
	border-radius: 10px;
	border-style: solid;
	border-width: 3px;
	/* font-size: 1.2rem; */
    overflow: hidden;
	padding:1.5rem;
	text-align: inherit;
}
.tarjeta-partners:hover{
	background-color: #e8f5ff;
	box-shadow: 5px 5px 10px #666666;
	-webkit-box-shadow: 5px 5px 10px #666666;
/*	color:#fff;*/
	cursor:default;
}
.tarjeta-videos{
	background-color: #0a0a0a;
	border-color: #003af5;
	border-radius: 10px;
	border-style: solid;
	border-width: 2px;
	/* font-size: 1.2rem; */
    overflow: hidden;
	padding:0.5rem;
	text-align:center;
}
.tarjeta-videos:hover{
	background-color: #313131;
	box-shadow: 5px 5px 10px #666666;
	-webkit-box-shadow: 5px 5px 10px #666666;
/*	color:#fff;*/
	cursor:default;
}
.tarjeta01-sin-borde{
	font-size: 1.2rem;
	padding:1.5rem;
	text-align: inherit;
}
.tarjeta01-contactenos{
	font-size: 1.2rem;
    background-color:#fbfbfb;
	border-color: #3e3d3d;
	border-radius: 10px;
	border-style: solid;
	border-width: 2px;
	padding:1.5rem;
	text-align: inherit;
}
.tarjeta01-curvaesq-borde{
	background-color: var(--colorbkcard01);
	border-color: var(--colorbordercard01);
	border-radius: 10px;
	border-style: solid;
	border-width: 2px;
	/* font-size: 1.2rem; */
	padding:1.5rem;
	text-align: inherit;
}
.tarjeta01-curvaesq-borde:hover{
/*	background-color: var(--colorbkcardhover01);*/
	box-shadow: 5px 5px 10px #666666;
	-webkit-box-shadow: 5px 5px 10px #666666;
/*	color:#fff;*/
	cursor:default;
}

.tarjeta02-curvaesq-borde{
	background-color: var(--colorbkcard02);
	border-color: var(--colorbordercard02);
	border-radius: 20px;
	border-style: solid;
	border-width: 2px;
	font-size: 1.2rem;
	padding:1.5rem;
	text-align: justify;
}
.tarjeta02-curvaesq-borde:hover{
	background-color: var(--colorbkcardhover02);
	box-shadow: 5px 5px 10px #666666;
	-webkit-box-shadow: 5px 5px 10px #666666;
/*	color:#fff;*/
	cursor:default;
}

/*-------------- TABLAS -----------------------*/
.tabla-responsive{
    overflow-x:auto;
}
#tablakolor {
    /* font-family: Arial, Helvetica, sans-serif; */
    background-color: #efefff;
    border-collapse: collapse;
    width: 80%;
  }
  
  #tablakolor td, #tablakolor th {
    border: 1px solid #ddd;
    padding: 8px;
  }
  
  #tablakolor tr:nth-child(even){background-color: #ffffff;}
  
  #tablakolor tr:hover {background-color: #ddd;}
  
  #tablakolor th {
    padding-top: 12px;
    padding-bottom: 12px;
    /* text-align: left; */
    background-color: #0000b3;
    color: white;
  }
  
/* table, th, td {
    background-color:#FFFFFF;
    border: solid #333333;
    border-width: thin;
    padding: 0.5rem;
    border-collapse: collapse;
  }
 */
/* --------------- FOOTER ---------------------*/

.pre-footer {
	width:100%;
	height:auto;	
	margin:auto;
	padding-bottom:10px;
	padding-top:10px;
	background-color:#fbfbfb;
	text-align:center;
}

footer {
	background:#fbfbfb;
	background:-webkit-linear-gradient(bottom, #4A4A4A, #222);
	background: -moz-linear-gradient(bottom, #4A4A4A, #222);
	background: -ms-linear-gradient(bottom, #4A4A4A, #222);
	background: -o-linear-gradient(bottom, #4A4A4A, #222);
	background: linear-gradient(to top, #4A4A4A, #222);
	font-family:"Poppins", sans-serif;
	font-weight: 400;
	font-size: 1rem;
    font-style: normal;
/*	text-align:center;*/
}

footer a {
	color: #fff;
	text-decoration:none;
}
footer a:hover {
	color:#ffffff;
	text-decoration:underline;
}
.footer-grid-3cols{
/*	background-color: #ccff00;*/
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(3, 1fr);
	padding: 2rem 0rem 3rem 0rem;
}
.footer-grid-4cols{
/*	background-color: #ccff00;*/
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(4, 1fr);
	padding: 2rem 0rem 3rem 0rem;
}
.tarjeta-footer{
/*	background-color:#CD6C2B;*/
	color:#fff;
	padding:1rem;
}

.footer-copyright {
	background: #000000;
	color:#ffffff;
    font-family:"Poppins", sans-serif;
	font-weight: 200;
    font-style: normal;
	font-size: 0.8rem;
	padding: 1rem;
	width:auto;
}

/*-----TEXTOS Y PARRAFOS--------*/

h1 {
    font-size: 1.8rem;
    font-style: normal;
}
h2 {
    font-size: 1.6rem;
    font-style: normal;
}
h3 {
    font-size: 1.2rem;
    font-style: normal;
}
.texto-destacado1 {
    font-size: 1.6rem;
    font-style:normal;
    font-weight: bold;
}
.texto-destacado1-white {
    color: #FFFFFF;
    font-size: 1.6rem;
    font-style:normal;
    font-weight: bold;
}
.texto-destacado2 {
    font-size: 1.3rem;
    font-style:normal;
    font-weight: bold;
}
.texto-destacado3 {
    font-size: 1.1rem;
    font-style:normal;
    font-weight: bold;
}
.texto-destacado-hero{
    font-size: 1.7rem;
    font-weight: bold;
}
.parrafo-justificado{
    text-align: justify;
}
.color-blanco{
    color: #ffffff;
}

/*-----CONTACTENOS-----*/
.contactenos-titulo {
    color:#ffffff;
    font-size: 1.5rem;
	top: 38%;
	left: 5%;
	position: absolute;
    width:35%;
	z-index:20;
}

.contact-form input, .contact-form textarea, .contact-form select{
    background:rgba(255, 255, 255,0.8);
    border:0; font-size:14px;
    color:#141414;
    font-family:'Open Sans', sans-serif;
    padding:5px 8px;
    resize:none
}

.contact-form input{
    border-width:1px;
    border-color:#cccccc;
    border-radius:5px;
    border-style:solid;
    height:1.6rem;
    width:95%;
}

.contact-form textarea{
    border-width:1px;
    border-color:#cccccc;
    border-radius:5px;
    border-style:solid;
    height:4rem;
    width:95%;
}

.texto-form{
    font-size:14px;
    color:#666666;
    font-family:'Open Sans', sans-serif;
}

.btnSubmit{
    background-color: #003af5;
    border:0;
    color:#ffffff;
    cursor:default;
    font-size:16px;
    font-family: 'Open Sans', sans-serif;
    font-weight:400;
    height:2rem;
    padding:0 20px 0 20px;
    text-transform:none;
    width:90%;
}

.btnReset{
    background-color: #00000d;
    border:0;
    color:#fff;
    cursor:default;
    font-size:16px;
    font-family: 'Open Sans', sans-serif;
    font-weight:400;
    height:31px;
    padding:0 20px 0 20px;
    text-transform:none;
    width:auto;
}

.texto-enviado-OK {
    color: #003af5;
    font-size: 1.1rem;
    font-style:normal;
    font-weight: bold;
}
.texto-enviado-ERROR {
    color: #c33d38;
    font-size: 1.1rem;
    font-style:normal;
    font-weight: bold;
}
    
/*----- IMAGENES VIDEOS  -----*/

.img-curvaesq-borde{
    border: solid;
    border-color: #fff;
    border-width:1px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
     box-shadow: 1px 1px 2px #666666;
    -webkit-box-shadow: 1px 1px 2px #666666;
    -moz-box-shadow: 1px 1px 2px #666666;
/*	height:100%;*/
    width:100%;
}

.img-content {
    /*	border: solid;
    border-color: #fff;
    border-width:0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    height:100%;*/
    width:100%;
}

.img-precios {
    border: solid;
    border-color: #fff;
    border-width:0px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
     box-shadow: 5px 5px 10px #666666;
    -webkit-box-shadow: 5px 5px 10px #666666;
    -moz-box-shadow: 5px 5px 10px #666666;
    width:100%;
    max-width: 700px;
}

.img-firma {
/*     border: solid;
    border-color: #fff;
    border-width:3px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px; */
    width:90%;
    max-width: 430px;
}

.img-banner {
    border: solid;
    border-color: #fff;
    border-width:3px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    width:90%;
    max-width: 900px;
}

.img-banner:hover {
     box-shadow: 5px 5px 10px #111111;
    -webkit-box-shadow: 5px 5px 10px #111111;
    -moz-box-shadow: 5px 5px 10px #111111;
}

.video_responsive {
	height:100%; 
	max-width:560px;
	min-height:315px;
	width:100%;
}



/*---------------------------RESPONSIVE ----------------------------*/

/*----------------GRID CONTENIDO-------------------------*/

@media(max-width:920px){


    /*----------------GRID CONTENIDO-------------------------*/

	.ultra-grid-2cols-80-20X100{
		grid-template-columns: auto;
	}
    /*.main-hero-1col-ceropadding{
         height: 50%; 
        background-color:crimson;
        width: auto;
    }*/
	.main-grid-1col{
		padding: 1rem;
	}
    .quehacemos-hero-01{
        background-color: #fbfbfb;
        color:#1F1F1F;
        font-size: 1.3rem;
        top: 0%;
        left: 0%;
        padding: 1rem;
        position:relative;
        text-shadow: 2px 2px 2px white;
        width:100%;
    }
    .comoteayudamos-hero-02{
        background-color: #fbfbfb;
        color: #1F1F1F;
        top: 0%;
        left: 0%;
        padding: 1rem;
        position:relative;
        width:100%;
    }
    .regresar-hero-01 {
        color: #fbfbfb;
        font-family: 'Oswald', sans-serif;
        font-size: 1rem;
        top: 40%;
        left: 5%;
        position: absolute;
        /* width:45%; */
        z-index:21;
    }
    .ctabtn-hero{
        display: none;
    }
    .ctabtn-libre{
        display: none;
    }
    .ctabtn-hero-movil{
        display:block;
        background-color: #F2F2F2;
        margin-top:1rem;
        padding: 0rem 0rem 0rem 0rem;
        position: relative;
        text-align: center;
        width:100%;
    }
    .main-grid-2cols{
		grid-template-columns:auto;
		padding: 0.5rem;
	}
	.main-grid-2cols-home{
		grid-template-columns:auto;
		padding: 0.5rem;
	}
    .main-grid-2cols-02{
		grid-template-columns:auto;
		padding: 0.5rem;
	}
    .main-grid-2cols-03{
		grid-template-columns:auto;
		padding: 0.5rem;
	}
    .main-grid-2cols-04{
		grid-template-columns:auto;
		padding: 0.5rem;
	}
	.main-grid-3cols{
		grid-template-columns:auto;
		padding: 1rem;
	}
	.main-grid-4cols{
/*		grid-template-columns:auto;*/
        grid-template-columns: repeat(2, 1fr);
		padding: 1rem;
	}
	.main-grid-3cols-works{
		grid-template-columns:auto;
		padding: 1rem;
	}

    /*----------------- TARJETAS CONTENIDO ----------*/
	.tarjeta-partners{
        width: 100%;
    }
    .tarjeta-quien-eres{
        width: 100%;
    }
	.tarjeta01-curvaesq-inicio{
        width: 100%;
	}
	.tarjeta01-curvaesq-borde{
        padding: 1rem;
	}
	.img-90x100-width {
        width: 90%;
	}

    /*---------------- TABLAS ---------------------*/
    #tablakolor{
        width: 100%;
    }

    /* --------------- FOOTER ---------------------*/
    
    .footer-grid-4cols{
        grid-template-columns:auto;
    }
    .footer-copyright{
        grid-column: auto;
    }

    /*-----TEXTOS Y PARRAFOS--------*/

    h1 {
        font-size: 1.6rem;
    }
	h2 {
		font-size: 1.4rem;
	}
	h3 {
		font-size: 1rem;
	}

    /*-----CONTACTENOS-----*/
    .contactenos-titulo{
        background-color: #fbfbfb;
        color:#1F1F1F;
        font-size: 1.3rem;
        top: 0%;
        left: 0%;
        padding: 1rem;
        position:relative;
        width:100%;
    }

    /*----- IMAGENES VIDEOS RESPONSIVE  -----*/

    .img-90x100-width {
        width: 90%;
        }

    .img-content{
        width: 100%;
    }
}