.contenedorOutline {
    position: absolute;
    text-align: right;
    bottom: 20px;
    right: 15%;
    top: 75%;
    /* On resizing
    transform: translate(-25%, -25%);
    transform-origin: center center;*/
}

/*.BlogImagenBackground {
  transition: all 0.3s ease;
}*/

.portfolio-item:hover {
    background-size: 100px 100px, 100% 100%;
}
.portfolio-item:hover figcaption.mask {
    padding-bottom: 30px;
    background-color: rgb(0, 51, 153);/*rgb(0, 68, 204);*/
}

img.social-btn {
    box-shadow: none;
}

img.InicioLogoFactory {
    width:70px;
    height:70px;
    border-radius: 4px;
    box-shadow: 0px 0px 4px #D7D6D5;
    background-color: #FFF;
    color: #FFF;
}

.contenedor-imagen {
    text-align: center;
}

.img-pie {
    text-align: center;
    font-size: 12px;
}

.parrafo {
    text-align: left;
    margin-top: 50px;
    margin-bottom: 10px;
    margin-left: 17px;
    padding-left: 10px;
    border-left: 3px;
}

.panel-ayuda {
    margin-top: 50px;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 10px;
    padding-top: 30px;
    border-right: 5px;
    border-bottom: 5px;
    /*background-color: rgba(13, 76, 146, .2);*/
}

.panel-ayuda > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute; 
    top: -20px;
    left:-20px;
    font-weight: bold;
    /*box-shadow: 1px 1px 1px #696969CC;*/
}

.portfolio-item.video {
    background-image: url(../img/youtube2icon.png);
    background-position: center 35%, center center;
}

.portfolio-item.blog {
    background-image: url(../img/bloggericon.png);
    background-position: center 35%, center center;
}

.portfolio-item.articulo {
    background-image: url(../img/img-info.png);
    background-position: center 35%, center center;
}

/* Inicio paletas de colores para módulos */

/* eFactory (genérica) */

.portfolio-item.generico {
    background-color: rgba(0, 49, 149, .3);
    background-image: url(../img/img-generico.png), url(../img/pantallas/como-lo-hago-generico-y-cuentas-por-cobrar.jpg);
    background-position: center 40%, center center;
}

.underline.generico {
  background-color: rgb(0, 49, 149);
}

.parrafo.generico {
     /*border-left: solid rgb(0, 49, 149);*/
}

.panel-ayuda.generico {
  border-right: solid rgb(0, 49, 149);
  border-bottom: solid rgb(0, 49, 149);
  background: rgba(0, 49, 149, .15);
}

.panel-ayuda.generico > .vignette {
  color: white;
  text-shadow: 1px 1px #000000;
    background-color: rgb(0, 49, 149);
}

/* Proyectos */

.portfolio-item.proyectos {
    background-color: rgba(13, 76, 146, .3);
    background-image: url(../img/obrasicon2.png), url(../img/pantallas/como-lo-hago-condominio-web.jpg);
    background-position: center 40%, center center;
}

.underline.proyectos {
    background-color: rgb(13, 76, 146);
}

.parrafo.proyectos {
     /*border-left: solid rgb(13, 76, 146);*/
}

.panel-ayuda.proyectos {
    border-right: solid rgb(13, 76, 146);
    border-bottom: solid rgb(13, 76, 146);
	background: rgba(13, 76, 146, .15);
}

.panel-ayuda.proyectos > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
    background-color: rgb(63, 126, 196);
}

/* Contabilidad */

.portfolio-item.contabilidad {
    background-color: rgba(19, 146, 13, .3);
    background-image: url(../img/money-contabilidad-icon.png), url(../img/pantallas/como-lo-hago-efactory-contabilidad-web.jpg);
    background-position: center 40%, center center;
}

.underline.contabilidad {
  background-color: #13920d;
}

.parrafo.contabilidad {
     /*border-left: solid rgb(19, 146, 13);*/
}

.panel-ayuda.contabilidad {
    border-right: solid rgb(19, 146, 13);
    border-bottom: solid rgb(19, 146, 13);
	background: rgba(19, 146, 13, .15);
}

.panel-ayuda.contabilidad > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
    background-color: rgb(19, 146, 13);
}

/* Recursos Humanos */

.portfolio-item.rrhh {
    background-color: rgba(255, 128, 0, .3);
    background-image: url(../img/img-crm.png), url(../img/pantallas/como-lo-hago-crm-sfa-mkt.jpg);
    background-position: center 40%, center center;
}

.underline.rrhh {
  background-color: #ff8000;
}

.parrafo.rrhh {
     /*border-left: solid rgb(255, 128, 0);*/
}

.panel-ayuda.rrhh {
    border-right: solid rgb(255, 128, 0);
    border-bottom: solid rgb(255, 128, 0);
	background: rgba(255, 128, 0, .15);
}

.panel-ayuda.rrhh > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
    background-color: rgb(255, 128, 0);
}

/* CRM */

.portfolio-item.crm {
    background-color: rgba(213, 170, 0, .3);
    background-image: url(../img/img-crm.png), url(../img/pantallas/como-lo-hago-crm-sfa-mkt.jpg);
    background-position: center 40%, center center;
}

.underline.crm {
  background-color: #d5aa00;
}

.parrafo.crm {
     /*border-left: solid rgb(213, 170, 0);*/
}

.panel-ayuda.crm {
    border-right: solid rgb(213, 170, 0);
    border-bottom: solid rgb(213, 170, 0);
	background: rgba(213, 170, 0, .15);
}

.panel-ayuda.crm > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
  background-color: rgb(213, 170, 0);
}

/* Ventas */

.portfolio-item.ventas {
    background-color: rgba(0, 153, 51, .3);
    background-image: url(../img/img-ventas.png), url(../img/pantallas/como-lo-hago-ventas-y-cuentas-por-cobrar.jpg);
    background-position: center 40%, center center;
}

.underline.ventas {
  background-color: #009933;
}

.parrafo.ventas {
     /*border-left: solid rgb(0, 153, 51);*/
}

.panel-ayuda.ventas {
  border-right: solid rgb(0, 153, 51);
  border-bottom: solid rgb(0, 153, 51);
	background: rgba(0, 153, 51, .15);
}

.panel-ayuda.ventas > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
    background-color: rgb(0, 153, 51);
}

/* Compras */

.portfolio-item.compras {
    background-color: rgba(177, 27, 112, .3);
    background-image: url(../img/img-compras.png), url(../img/pantallas/como-lo-hago-compras-y-cuentas-por-pagar.jpg);
    background-position: center 40%, center center;
}

.underline.compras {
  background-color: #b11b70;
}

.parrafo.compras {
     /*border-left: solid rgb(177, 27, 112);*/
}

.panel-ayuda.compras {
    border-right: solid rgb(177, 27, 112);
    border-bottom: solid rgb(177, 27, 112);
	background: rgba(177, 27, 112, .15);
}

.panel-ayuda.compras > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
    background-color: rgb(177, 27, 112);
}

/* Inventarios */

.portfolio-item.inventarios {
    background-color: rgba(105, 38, 12, .3);
    background-image: url(../img/img-inventarios.png), url(../img/pantallas/como-lo-hago-inventarios.jpg);
    background-position: center 40%, center center;
}

.underline.inventarios {
  background-color: #69260c;
}

.parrafo.inventarios {
     /*border-left: solid rgb(105, 38, 12);*/
}

.panel-ayuda.inventarios {
    border-right: solid rgb(105, 38, 12);
    border-bottom: solid rgb(105, 38, 12);
	background: rgba(105, 38, 12, .15);
}

.panel-ayuda.inventarios > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
    background-color: rgb(105, 38, 12);
}

/* Punto de Ventas */

.portfolio-item.puntoventas {
    background-color: rgba(34, 183, 173, .3);
    background-image: url(../img/img-puntov.png), url(../img/pantallas/como-lo-hago-punto-de-ventas-web.jpg);
    background-position: center 40%, center center;
}

.underline.puntoventas {
  background-color: #22b7ad;
}

.parrafo.puntoventas {
     /*border-left: solid rgb(34, 183, 173);*/
}

.panel-ayuda.puntoventas {
    border-right: solid rgb(34, 183, 173);
    border-bottom: solid rgb(34, 183, 173);
	background: rgba(34, 183, 173, .15);
}

.panel-ayuda.puntoventas > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
    background-color: rgb(34, 183, 173);
}

/* Tesoreria */

.portfolio-item.tesoreria {
    background-color: rgba(86, 29, 132, .3);
    background-image: url(../img/img-tesoreria.png), url(../img/pantallas/como-lo-hago-tesoreria.jpg);
    background-position: center 40%, center center;
}

.underline.tesoreria {
  background-color: #561d84;
}

.parrafo.tesoreria {
     /*border-left: solid rgb(86, 29, 132);*/
}

.panel-ayuda.tesoreria {
    border-right: solid rgb(86, 29, 132);
    border-bottom: solid rgb(86, 29, 132);
	background: rgba(86, 29, 132, .15);
}

.panel-ayuda.tesoreria > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
    background-color: rgb(86, 29, 132);
}

/* Producción */

.portfolio-item.produccion {
    background-color: rgba(19, 34, 194, .3);
    background-image: url(../img/img-produccion.png), url(../img/pantallas/como-lo-hago-condominio-web.jpg);
    background-position: center 40%, center center;
}                 

.underline.produccion {
  background-color: #1322c2;
}

.parrafo.produccion {
     /*border-left: solid rgb(19, 34, 194);*/
}

.panel-ayuda.produccion {
    border-right: solid rgb(19, 34, 194);
    border-bottom: solid rgb(19, 34, 194);
	background: rgba(19, 34, 194, .15);
}

.panel-ayuda.produccion > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
    background-color: rgb(19, 34, 194);
}

/* Importaciones */

.portfolio-item.importaciones {
    background-color: rgba(255, 69, 69, .3);
    background-image: url(../img/img-importaciones.png), url(../img/pantallas/como-lo-hago-costos-y-gastos-de-importacion.jpg);
    background-position: center 40%, center center;
}

.underline.importaciones {
  background-color: #ff4545;
}


.parrafo.importaciones {
     /*border-left: solid rgb(255, 69, 69);*/
}

.panel-ayuda.importaciones {
    border-right: solid rgb(255, 69, 69);
    border-bottom: solid rgb(255, 69, 69);
	background: rgba(255, 69, 69, .15);
}

.panel-ayuda.importaciones > .vignette {
	color: white;
	text-shadow: 1px 1px #000000;
    background-color: rgb(255, 69, 69);
}

/* Solmoviles */

.portfolio-item.solmoviles {
    background-color: rgba(40, 135, 206, .3);
    background-image: url(../img/img-mobile.png), url(../img/pantallas/como-lo-hago-efactory-super-mobile.jpg);
    background-position: center 40%, center center;
}

.underline.solmoviles {
  background-color: #2887ce;
}

.parrafo.solmoviles {
     /*border-left: solid rgb(40, 135, 206);*/
}

.panel-ayuda.solmoviles {
    border-right: solid rgb(40, 135, 206);
    border-bottom: solid rgb(40, 135, 206);
	   background: rgba(40, 135, 206, .15);
}

.panel-ayuda.solmoviles > .vignette {
  	color: white;
  	text-shadow: 1px 1px #000000;
    background-color: rgb(40, 135, 206);
}

/* Mantenimiento preventivo */

.portfolio-item.mp {
    background-color: rgba(191, 161, 38, .3);
    background-image: url(../img/img-mp.png), url(../img/pantallas/como-lo-hago-mp.jpg);
    background-position: center 40%, center center;
}

.underline.mp {
  background-color: rgb(191, 161, 38);
}

.parrafo.mp {
     /*border-left: solid rgb(191, 161, 38);*/
}

.panel-ayuda.mp {
  border-right: solid rgb(191, 161, 38);
  border-bottom: solid rgb(191, 161, 38);
  background: rgba(191, 161, 38, .15);
}

.panel-ayuda.mp > .vignette {
    color: white;
    text-shadow: 1px 1px #000000;
    background-color: rgb(191, 161, 38);
}

/* Inmobiliario */

.portfolio-item.inmobiliario {
    background-color: rgba(102, 0, 0, .3);
    background-image: url(../img/img-inmobiliario.png), url(../img/pantallas/como-lo-hago-inmobiliario-05.png);
    background-position: center 40%, center center;
}

.underline.inmobiliario {
  background-color: rgb(102, 0, 0);
}

.parrafo.inmobiliario {
     /*border-left: solid rgb(102, 0, 0);*/
}

.panel-ayuda.inmobiliario {
  border-right: solid rgb(102, 0, 0);
  border-bottom: solid rgb(102, 0, 0);
  background: rgba(102, 0, 0, .15);
}

.panel-ayuda.inmobiliario > .vignette {
    color: white;
    text-shadow: 1px 1px #000000;
    background-color: rgb(102, 0, 0);
}

/* Clínicas */

.portfolio-item.clinicas {
    background-color: rgba(0, 128, 128, .3);
    background-image: url(../img/img-clinicas.png), url(../img/pantallas/como-lo-hago-efactory-clinicas.jpg);
    background-position: center 40%, center center;
}

.underline.clinicas {
  background-color: rgb(0, 128, 128);
}

.parrafo.clinicas {
     /*border-left: solid rgb(0, 128, 128);*/
}

.panel-ayuda.clinicas {
  border-right: solid rgb(0, 128, 128);
  border-bottom: solid rgb(0, 128, 128);
  background: rgba(0, 128, 128, .15);
}

.panel-ayuda.clinicas > .vignette {
    color: white;
    text-shadow: 1px 1px #000000;
    background-color: rgb(0, 128, 128);
}

/* Fin paletas de colores para módulos */

 .overlay {
    background: transparent;
    width: 100%;
    height: calc(100% - 50%);
    padding-bottom: 15px;
    position: relative;
    top: 25%;
}

#home-clh {
    color: rgb(31, 53, 146);
    position: relative;
    min-height: 400px;
    background: url(../img/como-lo-hago-cabecera.jpg) no-repeat;
    margin-top: 0px;
    padding-top: 150px;
    padding-bottom: 20px;
    /*background-position: 0px -270px;*/
    background-size: 100% 100%;
}
.titulo1 {
    font-size: 50px;
    font-weight: bold;
    color: rgb(31, 53, 146);
    margin-bottom: 5px;
    padding-right: 10px;
    padding-left: 10px;
}
.titulo2 {
    width: 80%;
    font-size: 40px;
    font-weight: bold;
    margin-bottom: 5px;
    padding-right: 10px;
    padding-left: 10px;
}
.underline{
  margin-top: 20px;
  margin-bottom: 20px;
  padding-left: 10px;
  width: 80%;
  height: 5px;
  background-color: #3A95C6;
}
.img-center {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-flow: column nowrap;
    align-self: center;
}
 .img-center > div {
      margin-top: 50px;
 }

 @media only screen and (max-width: 991px) {
     .img-center {
         flex-flow: row nowrap;
     }
}
 .infografia-img {
 
    border: 5px solid rgb(33, 123, 212);
    border-radius: 8px;
    box-shadow: 1px 1px 20px 0px rgb(86, 144, 167);
      padding-bottom: 10px;
 }
 .contenido-centrado {
     display: flex;
     justify-content: center;
     height: 100%;
     width: 100%;
     padding: 10px;

 }
 .item.carrusel-pantalla {
    width: 100%;
    margin: auto;

 }
.scroll-topContainer {
    visibility: hidden;
    background: rgb(51, 50, 50);
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.39);
    width: 50px;
    height: 50px;
    position: fixed;
    right: 20px;
    bottom: 20px;
    font-size: 35px;
    color: white;
    text-align: center;
    opacity: 0.8;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all 0.5s ease;
    z-index: 999999;
   
 }
 .shown {
    visibility: visible;

 }
 .scroll-topContainer > i {
      margin: -6px 0px 0px 1px;
 }
 .scroll-topContainer:hover {
      opacity: 1;  
 }

   #divider h3 {
    color: #3B0C96;
 }
 #divider .btn-lg {
    color: #3B0C96;
     border: 1px solid rgba(49, 10, 125, 0.88);
     transition: all 0.5s ease;
     background-color: white;
 }
#divider .btn-lg:hover {
    background: #3B0C96;
    color: white;
}
.paneles{
    margin: 5px !important;
    margin-right: 18px !important;
}

.flex-row{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.flex-item{
    flex-basis: 50%;
}