/*Barras inicio*/

.FloatingSection1, .FloatingSection2
{
  position:relative;
  background-color: #195999;
  background-color: rgba(25, 89, 153, 0.75);
  box-shadow: 2px 2px 2px rgba(30,30,30,0.3);
  width: 50%;
  height: 230px;
 -moz-transform: matrix(1, 0, -.5, 1, -100px, 0px);
 -webkit-transform: matrix(1, 0, -.5, 1, -100, 0);
 -o-transform: matrix(1, 0, -.5, 1, -100, 0);
 transform: matrix(1, 0, -.5, 1, -100, 0);
 -webkit-transition: .2s;
 -moz-transition: .2s;
 -ms-transition: .2s;
 transition: .2s;
}
.FloatingSection2
{
  width: 40%;
  height: 120px;
  background-color: rgba(255, 255, 255, 1);
}
.texto-inicio{
  position:absolute;
  width:100%;
  top:50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.texto-inicio p.titulos{
  text-align: right;
  font-size: 1.8em;
  margin-right: 30px;
  letter-spacing: 1pt;
  font-weight: 100;
}
h1, h4{
  color:#fff;
  letter-spacing:2pt;
  text-align: right;
  margin: 0;
  line-height: 46px;
  font-size: 30px;
  margin-right: 30px;
  -webkit-transition: .2s;
  -moz-transition: .2s;
  -ms-transition: .2s;
  -o-transition: .2s;
  transition:.2s;
}
h4{
  font-size: 24px;
  line-height: 34px;
}
@media only screen and (max-width : 1465px) {
.FloatingSection1, .FloatingSection2
{
  width: 60%;
  height: 170px;
}
.FloatingSection2
{
  width: 55%;
  height: 90px;
}

h1, h4{
  line-height: 36px;
  font-size: 23px;
}
h4{
  font-size: 17px;
  line-height: 22px;
}
}

@media only screen and (max-width : 959px) {
    .vacio{
  height: 60px;
}
.FloatingSection1, .FloatingSection2
{
  width: 75%;
  height: 140px;
}
.FloatingSection2
{
  width: 75%;
  height: 90px;
}

h1, h4{
  line-height: 28px;
  font-size: 20px;
}
h4{
  font-size: 17px;
  line-height: 21px;
}
}
@media only screen and (max-width : 700px) {
.FloatingSection1, .FloatingSection2
{
  width: 100%;
  height: 170px;
}
.FloatingSection2
{
  width: 100%;
  height: 90px;
}
}
@media only screen and (max-width : 520px) {
    .vacio{
  height: 60px;
}
.FloatingSection1, .FloatingSection2
{
  width: 100%;
  height: 110px;
}
.FloatingSection2
{
  width: 100%;
  height: 60px;
}

h1{
  line-height: 22px;
  font-size: 14px;
  letter-spacing: 1pt;
}
h4{
  font-size: 15px;
  line-height: 18px;
}
.FloatingSection2 .titulos{
  font-size: 16px !important;
}
}
.new, .new-trans {
    display: inline-block;
    position: relative;
    padding: 3px 6px;
    font-size: 14px;
    border-radius: 3px;
    top: 50px;
    left: -75px;
    background-color: red;
    color: white;
    -webkit-transform: rotate(-40deg);
    -ms-transform: rotate(-40deg);
    -o-transform: rotate(-40deg);
    transform: rotate(-40deg);
  }
  .new-trans{
    background-color: transparent !important;
    color: transparent !important;
    z-index: -1;
  }
/* BENEFICIOS */

.icon-ngs, .icon-citas, .icon-whats, .icon-satisfaccion,.icon-email, .icon-bussines, .icon-ticket, .icon-cuestionario, .icon-dispositivos, .icon-dispositivosmovil, .icon-design, .icon-seguridad, .icon-pacientes, .icon-doctores, .icon-usuarios, .icon-resultados, .icon-facturacion, .icon-inventarios, .icon-graficas, .icon-formulas, .icon-mensajes, .icon-agenda, .icon-respuestas, .icon-sucursales, .icon-qr, .icon-hl7, .icon-leal, .icon-export{
    width: 170px;
    height: 170px;
    cursor: pointer;

    background-image: url(../images/iconos/citas.png);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-transition: .1s;
    -moz-transition: .1s;
    -o-transition: .1s;
    -ms-transition: .1s;
    transition: .1s;
    text-align: center;
    border: 3px solid #195999;
    margin:20px auto;
    border-radius: 90px;
    -webkit-border-radius:90px;
}

.icon-ticket{background-image: url(../images/iconos/pre-orden.png);}
.icon-cuestionario{background-image: url(../images/iconos/cuestionario.png);}
.icon-dispositivos{background-image: url(../images/iconos/dispositivos.png);}
.icon-dispositivosmovil{background-image: url(../images/iconos/dispositivosmovil.png);}
.icon-design{background-image: url(../images/iconos/design.png);}
.icon-seguridad{background-image: url(../images/iconos/seguridad.png);}
.icon-pacientes{background-image: url(../images/iconos/pacientes.png);}
.icon-doctores{background-image: url(../images/iconos/doctores.png);}
.icon-usuarios{background-image: url(../images/iconos/usuarios.png);}
.icon-resultados{background-image: url(../images/iconos/resultados.png);}
.icon-facturacion{background-image: url(../images/iconos/facturacion.png);}
.icon-inventarios{background-image: url(../images/iconos/inventarios.png);}
.icon-graficas{background-image: url(../images/iconos/graficas.png);}
.icon-formulas{background-image: url(../images/iconos/formulas.png);}
.icon-mensajes{background-image: url(../images/iconos/mensajes.png);}
.icon-agenda{background-image: url(../images/iconos/agenda.png);}
.icon-respuestas{background-image: url(../images/iconos/respuestas.png);}
.icon-sucursales{background-image: url(../images/iconos/sucursales.png);}
.icon-ngs{background-image: url(../images/iconos/ngs.png);}
.icon-whats{background-image: url(../images/iconos/whatsapp.png);}
.icon-email{background-image: url(../images/iconos/email.png);}
.icon-satisfaccion{background-image: url(../images/iconos/satisfaccion.png);}
.icon-qr{background-image: url(../images/iconos/QR.png);}
.icon-hl7{background-image: url(../images/iconos/HLA7.png);}
.icon-leal{background-image: url(../images/iconos/LEALTAD.png);}
.icon-export{background-image: url(../images/iconos/agenda.png);}


.icon-citas:hover, .icon-bussines:hover, .icon-ticket:hover, .icon-cuestionario:hover, .icon-dispositivos:hover,.icon-dispositivosmovil:hover, .icon-design:hover, .icon-seguridad:hover, .icon-pacientes:hover, .icon-doctores:hover,
.icon-usuarios:hover, .icon-resultados:hover, .icon-facturacion:hover, .icon-inventarios:hover, .icon-graficas:hover, .icon-formulas:hover, .icon-mensajes:hover, .icon-agenda:hover,
.icon-respuestas:hover, .icon-sucursales:hover, .icon-ngs:hover, .icon-whats:hover, .icon-email:hover, .icon-satisfaccion:hover , .icon-qr:hover, .icon-hl7:hover, .icon-leal:hover, .icon-export:hover{
  background-color: #fff;
  transform: scale(1.05);
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -o-transform: scale(1.05);
  -ms-transform: scale(1.05);
  box-shadow: 0 0 10px 2px rgba(0,0,0,0.2)
}


.icon-titulo{
    font-size: 18px;
    line-height: 18px;
    margin-bottom: 20px;
    font-weight: 600;
    color: #666;
}
.icon-descripcion, .respuesta{
    font-size: 14px;
    line-height: 18px;
    font-weight: 100;
    color: #666;
}
.respuesta{margin-left: 25px; text-align: justify;}