*{
margin:0;
padding:0;
}

html{
 scroll-behavior:smooth;
}

body{
 /*background:#fff;*/
  background-color:rgba(175, 219, 250,0.2);
}
.inicio-pantalla{
width:100%;
max-width:1500px;
}

.header{
  position:fixed;
  margin-left:4px; 
  z-index:1000;
  display:flex;
  background-color:#F8F9F9;
  width:99%;
  height:75px;
 /* justify-content: space-evenly;*/
  justify-content: space-between;
  box-shadow:0 0 0 1px #db7093,
             0 0 0 2px #db7093,
			 0 10px 7px #000;
			 
 border-radius:10px;

}
.logo img{
  border-radius:100%;
  margin-left:1.5em;
}
.header  > .nav{
  padding-top: 2.2rem;
}
.header  .titulo_empresa > h1{
  padding-top: 0.5rem;
  color:#ff4500;
  font-family:georgian;
  font-weight:900;
  text-transform:uppercase;
  font-size:2rem;
  text-shadow: -3px 2px 2px #AA8DB4;  
  padding-bottom:0;
  /*transform: rotate(-1deg);*/
}
.header  .titulo_empresa p{
  font-family:georgian;
  font-weight:900;
  font-size:17px;
  color:#000;
  text-shadow: -3px 2px 2px #AA8DB4;
}
.tipo-letra strong{
  color:#000;
}
.header  > .nav ul li{
   display: inline-block;
   margin-right:1rem;

}
.header  > .nav ul li  a{
  text-decoration: none;
  padding: 0.5rem 1rem;
  transition: all 0.4s linear;
  background:#DAEFFC;
  border-radius: 25px;
  color:#000;
  font-family: "Segoe UI";
  font-size:1.4rem;
  font-style:oblique;
   text-shadow: #2C3E50 0.1em 0.1em 0.2em;
   border-bottom:1px solid #3CA4E7;
   padding-bottom:5px;
 }
 
 .header  > .nav ul li  a:hover{
    background: red;
	color: #fff;
 }
 
 
.header .titulo_empresa  strong{
  font-size:20px;
  color:#AB0F0F;
 /* padding-top:1rem;*/
  
} 
 /* ESTILOS DEL SLIDESHOW */
 
 .contenedor-slider{
    margin-top:2px; 
    width: 98%;
	height: 540px;
	background:#fff;
	margin-left:1rem;
	padding-top:5.7rem;
	/*background:#fff;*/
	background-color:rgba(175, 219, 250,0.2);
 }
 
#slider{
margin:0px auto;
margin-top:0.5rem;
box-shadow: 0 .1em 1em black;
-webkit-box-shadow: 0 .1em 1em black;
-moz-box-shadow: 0 .1em 1em black;
-o-box-shadow: 0 .1em 1em black;
}
 
ul.bjqs{
position:relative; 
list-style:none;
padding:0;
margin:0;
overflow:hidden; 
display:none;
}
li.bjqs-slide{
 position:absolute;
 display:none;
 }
ul.bjqs-controls{list-style:none;margin:0;padding:0;z-index:9999;}
ul.bjqs-controls.v-centered li a{position:absolute;}
ul.bjqs-controls.v-centered li.bjqs-next a{right:0;}
ul.bjqs-controls.v-centered li.bjqs-prev a{left:0;}
ol.bjqs-markers{list-style: none; padding: 0; margin: 0; width:100%;}
ol.bjqs-markers.h-centered{text-align: center;}
ol.bjqs-markers li{display:inline;}
ol.bjqs-markers li a{display:inline-block;}

p.bjqs-caption{
display:block;
width:96%;
margin:0;
padding:2%;
position:absolute;
bottom:0;
}
 
.bjqs-caption{
color:black;
background:whitesmoke;
opacity:.75;
}
 
/* BOTONERA UBICADA AL PIE DEL SLIDESHOW */
ol.bjqs-markers{
margin-top:5px;
}
ol.bjqs-markers li a{
padding: 5px 10px;
background: #000;
color: #fff;
margin: 5px;
text-decoration: none;
transition:background .5s ease;
-webkit-transition:background .5s ease;
-moz-transition:background .5s ease;
-o-transition:background .5s ease;
}
li.active-marker a, ol.bjqs-markers li a:hover{
background:gray!important;
}
 
/* CONTROLES ATRAS Y ADELANTE */
ul.bjqs-controls.v-centered li a {
display: block;
padding: 3px;
background: whitesmoke;
color: #000;
text-decoration: none;
opacity:.75;
 
transition:color .5s ease, background .5s ease;
-webkit-transition:color .5s ease, background .5s ease;
-moz-transition:color .5s ease, background .5s ease;
-o-transition:color .5s ease, background .5s ease;
}
ul.bjqs-controls.v-centered li a:hover{
    background:#000;
    color:#fff;
}

ul.sinestilo li{
list-style:none;
}
.contenedor-slider  #slider .bjqs .texto-explicativo{
position:fixed;
display: inline-block;
z-index:1000;
background:rgba(213, 216, 220,0.2);
width:370px;
height:50px;
top:10rem;
left:38%;
text-align:center;
color:#FB1A1A;
/*color:#;*/
font-family: sans-serif;
font-size:2rem;
font-weight:900;
font-variant: small-caps;

}
.contenedor-slider  #slider .bjqs .texto-explicativo p {

  animation-duration: 1s;
  animation-name: slidein;
}

@keyframes slidein {
  from {
   margin-left:100%;
    margin-left: 100%;
    width: 300%;
  }

  to {
    margin-left: 0%;
    width: 100%;
  }
}
/*
@media only screen and (min-height: 767px) and (max-height: 940px) {
 .contenedor-slider  #slider .bjqs .texto-explicativo{
  display:none;}
}
*/

/* iconos de redes sociales colgantes */
.iconos-redes{
  position: fixed;
  margin-left: 15px;
  top:200px;
  z-index:2000;
  background-color:#fff;
  width:42px;
  height:200px;
}
.iconos-redes ul{
 list-style:none;
}

.iconos-redes ul li{
 width:30px;
 height:40px;
 font-size: 1.2rem;
 padding-bottom: 1ex;
}
.iconos-redes ul li a{
  display: inline-block;
  color: #fff;
  background: #000;
  padding: 10px 10px;
  text-decoration:none;
  -webkit-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition:all 500ms ease;
  
}

.iconos-redes ul li .icon-facebook {
  background:#3b5998;
}
.iconos-redes ul li .icon-whatsapp {
  background:#098005;
}
.iconos-redes ul li .icon-printer {
  background:#ae181f;
}
.iconos-redes ul li .icon-mail {
   background:#566573;
}

.iconos-redes ul li a:hover{
padding:10px 30px;
/*background:#000;
color:white;*/
border-radius:15px;
font-size:1.7rem;
}
/*fin redes sociales*/


.inicio-pantalla .main{
  background-color:rgba(175, 219, 250,0.2);
  width:98%;
  display:flex;
  flex-wrap: wrap;
  box-sizing:border-box;
  margin-left:2rem;
  padding-top:3rem;
}

h2{
text-align:center;
}
.inicio-pantalla .main h2{
    font-size:1.5rem;
	padding-bottom:1em;
	/*justify-content: space-evenly;*/
	text-align:center;
	margin-left: calc(100% / 2 - 110px);
    text-shadow: gray 0.1em 0.1em 0.2em;
}

.panel{
  display:flex;
  width:98%;
  height:450px;
  /*background-color:white;*/
  background-color:rgba(175, 219, 250,0.2);
  margin: 0 auto;
  border-style:solid;
  border:0px;
  border-color:red;
  justify-content: space-evenly;
  text-align:center;
  flex-wrap: wrap;
  font-size:1.2em;
  /*box-shadow:0 0 0 0px #fff,
            0 0 0 2px #ccc,
			0 5px 10px #000;*/
}
.panel .animate{
	transition: transform 1s;
    transform-style: preserve-3d;
    transform: rotateY(360deg);
}
.puno{
	width:432px;
	height:445px;
	padding-top:1px;
	background-color:#F8F8FF;
	float:left;

}
.puno:hover{
  
  box-shadow:0 0 0 1px #fff,
            0 0 0 2px #ccc,
			0 5px 10px #000;
 
}
.puno h5{
	font-size:1.3rem;
	text-align:center;
	padding-bottom:1em;
}
.puno img{
	width:400px;
	height:250px;
	
}
.puno img:hover{
    width:410px;
	height:253px;
	/*cursor:pointer;*/  
}
.pdos{
	width:432px;
	height:445px;
	margin-left:2px;
	padding-top:1px;
	background-color:#F8F8FF;
	float:left;
}
.pdos h5{
	font-size:1.3rem;
	text-align:center;
	padding-bottom:1em;
}
.pdos img{
	width:400px;
	height:250px;
}
.pdos:hover{
box-shadow:0 0 0 1px #fff,
            0 0 0 2px #ccc,
			0 5px 10px #000;
}
.ptres{
	width:440px;
	height:445px;
	padding-top:1px;
	background-color:#F8F8FF;
	float:left;
}

.ptres h5{
	font-size:1.3rem;
	text-align:center;
	padding-bottom:1em;
}
.ptres img{
	width:400px;
	height:250px;
}
.ptres:hover{
box-shadow:0 0 0 1px #fff,
            0 0 0 2px #ccc,
			0 5px 10px #000;
}




.inicio-pantalla .main  .contenedor-text{
 width:96%;
 height:330px;
 padding-left:2px;
 margin: 2px auto;
 background-color:#EBEDEF;
 padding-top:1em;
 padding-bottom:2rem;
 color:#000;
}
.contenedor-text p{
 font-family:georgian;
 font-size:1.2em;
}
.texto-correo{
 margin-right:2em;
 color:#05058A;
 font-size:15px;
 font-family:"Gill Sans Extrabold", Helvetica, sans-serif;
 font-style:bold;
}
.cuerpo-mensaje{
 padding-top:7rem;
 font-family:"Gill Sans Extrabold", Helvetica, sans-serif;
 font-size:2em;
}
.cuerpo-mensaje img{
  border-radius:90%;
}
.cuerpo-mensaje input[type="button"]{
 text-align:center;
 margin-left:43rem;
 font-size:22px;
 border-radius:15px;
 padding:2px 5px;
 cursor:pointer;
 background:#AED6F1;
 color:#000;
 }
.cuerpo-mensaje input[type="button"]:hover{
 font-size:23px;
 cursor:pointer;
 border-radius:15px;
 background-color:#A93226;
 color:#fff;
 text-shadow: black 0.1em 0.1em 0.2em;}
/* -------------- estilos del nuestra empresa -------------- */
.inicio-pantalla .nosotros{
  position:fixed;
  width:90%;
  height:80vh;
  background-color:rgba(28, 40, 77, 0.7 );
  top:6.50rem;
  margin-left:4.5em;
  z-index:1000;
  box-shadow:0 0 0 1px #000,
            0 0 0 2px #ccc,
			0 5px 10px #000;
 
 
}

.ventana{
   position:absolute;
   right:1px;
   margin-top:-15px;
   background-color:red;
   border-radius:50%;
   padding-left:7px;
   padding-right:7px;
   font-family:"Homer Simpson UI";
   font-size:27px;
   text-align:center;
   cursor:pointer;
   color:#fff;
   latter-spacing:1.5px;
  }
.ventana a{
  text-decoration:none;
  color:#fff;
}  
.ventana a:hover{
   background-color:#fff; 
   color:red;
   text-decoration:none;
   padding-left:7px;
   padding-right:7px;
   border-radius:50%;
}
.inicio-pantalla .nosotros .nosotros-info{
  /*position:relative;*/
  width:95%;
  height:95%;
  background-color:#D6DBDF;
  color:#fff;
  text-align:center;
  margin-left:3.5em;
  padding-top:2em;

}

/* -------------- estilos del clientes-especiales -------------- */

.clientes-especiales{
  width:93.5%;
  height:450px;
  background:#E8F6F3;
  border-top-style: ridge;
  border-top-color: coral;
  border-top-width: 7px;
  border-bottom-style: ridge;
  border-bottom-color: coral;
  border-bottom-width: 7px;
  padding-bottom:1.5rem;  
  margin-left:4em;
  margin-bottom:1em;
  display:flex;
  justify-content:flex-start;
  /*text-align:center;*/
  flex-wrap: wrap;
  overflow:scroll;
}
.clientes-empresas{
  width:51%;
  height:445px;
  
}
.clientes-contables{
  width:45%;
  height:445px;
  margin-left:2em;
  border-left:1px solid #4f4f4f;
  padding-left:3px;
 
 
}

.clientes-empresas  img{
  width:125px;
  height:125px;
  padding-right:3px;
  padding-bottom:3px;
  cursor:pointer;
}
.clientes-empresas  img:hover{
 -webkit-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition:all 500ms ease;
  box-shadow: 5px 2px 35px #566573;
  width:127px;
 
}

.clientes-contables  img{
  width:145px;
  height:145px;
  padding-right:3px;
  padding-bottom:3px;
  border-radius:90%;
  cursor:pointer;
}
.clientes-contables img:hover{
 -webkit-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition:all 500ms ease;
  box-shadow: 5px 2px 5px #999;
  width:147px;
 
}


/* -------------- estilos del footer -------------- */

.inicio-pantalla .footer{
width:96%;
height:10rem;
margin-left:35px;
background-color:rgba(28, 40, 51 );
color:#fff;
/*background:red; */
display:flex;
justify-content: space-evenly;
text-align:center;
flex-wrap: wrap;
z-index:1000;
}

.inicio-pantalla .footer .footer-empresa, .footer-link, .footer-social{
 padding-top: 1rem;
 width:33%;
 justify-content:justify;
 text-align: left;
}
.inicio-pantalla .footer .footer-empresa{
 padding-left:10px;
}

.inicio-pantalla .footer ul li{
 padding:5px;
 padding-right:10px;
} 
.inicio-pantalla .footer ul li a{
  color:#fff;
  font-size:1rem;
  padding-right:5px;
  padding-bottom:3px;
  text-decoration:none;
  -webkit-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition:all 500ms ease;
}
.inicio-pantalla .footer  .footer-social ul li a{
 font-size:1.5em;
}
.inicio-pantalla .footer .footer-social ul{
list-style:none;
}
.inicio-pantalla .footer .footer-link li{
 margin-left:10em;
}
.inicio-pantalla .footer  ul li .icon-facebook {
  background:#3b5998;
}
.inicio-pantalla .footer  ul li .icon-whatsapp {
  background:#098005;
}
.inicio-pantalla .footer ul li .icon-printer {
  background:#ae181f;
}
.inicio-pantalla .footer ul li .icon-mail {
   background:#566573;
}

.inicio-pantalla .footer ul li a:hover{
padding:5px 5px;
background:red;
color:white;
border-radius:15px;
font-size:1.rem;
cursor:pointer;
}

.footer-ransystem{
width:100%;
height:70px;
margin-top:1em;
background-color:#fff;
color:#000;
text-align:center;
}
.footer-ransystem i{
 font-size:1.7em;
 padding-right:1px;
 font-style:bold;
 text-shadow: -2px 2px 2px #112B44;
}
.footer-ransystem strong{
 color:red;
 font-size:1.5em;
 text-shadow: 2px 2px 2px #112B44;
 
}
/* ------------------fin footer -------------------*/



/*@media only screen and (min-width: 767px)  and (max-width: 940px){*/

@media screen and (max-width: 900px){
  body{
   
  }
   .contenedor-slider{
	padding-top:1.7rem;
    height:200px;
 }
  
  .inicio-pantalla .main{
   width:98%;
   display:flex-wrap;
  }
  .inicio-pantalla .main .panel{
    padding-bottom:2rem;
	width:95%;
	padding-bottom:5rem;
  } 
  .puno, .pdos, .ptres{
   width:32%;
  }

  .puno img, .pdos img, .ptres img{
      width:70%;
	  height:70%;
  
  }
  .inicio-pantalla .main .contenedor-text{
   padding-top:2rem;
   /*background:red;*/
   color:#000;
   overflow:hidden;
}
   .header  .titulo_empresa > h1{
     font-size:14px;
   }
  .header  > .nav ul li  a{
  text-decoration: none;
  padding: 0.2rem 0.2rem;
  transition: all 0.4s linear;
  border-radius: 25px;
  color:#0F69AB;
  font-family: "Segoe UI";
  font-size:12px;
 }
  .contenedor-slider  #slider .bjqs .texto-explicativo{
    font-size:12px;
	top:5rem;
	width: 50%;
   }
   .footer{
    margin-top:15rem;
	overflow:hidden;
   }
   .inicio-pantalla .nosotros .nosotros-info{
	  width:95%;
	  height:90%;
	  background-color:#D6DBDF;
	  color:#fff;
	  text-align:center;
	  margin-left:3.5em;
	  padding-top:2em;

  }
  .nosotros, 
  .somos_global,
  .nosotros-info{
    width:90%;
	margin-right:7px;
    height:83vh;
	overflow: scroll;
	}

}

@media screen and (max-width: 700px){
  body{
   
  }
   .contenedor-slider{
	padding-top:1.7rem;
    height:200px;
 }
  
  .inicio-pantalla .main{
   width:98%;
   display:flex-wrap;
  }
  .inicio-pantalla .main .panel{
    padding-bottom:2rem;
	width:95%;
	padding-bottom:5rem;
  } 
  .puno, .pdos, .ptres{
   width:32%;
  }

  .puno img, .pdos img, .ptres img{
      width:70%;
	  height:70%;
  
  }
  .inicio-pantalla .main .contenedor-text{
   padding-top:2rem;
   /*background:red;*/
   color:#000;
   overflow:hidden;
}
   .header  .titulo_empresa > h1{
     font-size:14px;
   }
  .header  > .nav ul li  a{
  text-decoration: none;
  padding: 0.2rem 0.2rem;
  transition: all 0.4s linear;
  border-radius: 25px;
  color:#0F69AB;
  font-family: "Segoe UI";
  font-size:12px;
 }
  .contenedor-slider  #slider .bjqs .texto-explicativo{
    font-size:12px;
	top:5rem;
	width: 50%;
   }
   .footer{
    margin-top:15rem;
	overflow:hidden;
   }
   .nosotros,
   .somos_global,
   .nosotros-info{
    width:90%;
	margin-right:7px;
    height:83vh;
	overflow: scroll;
	}
}