﻿
/*---------HOJA DE ESTILOS PARA PORTFOLIO EXTRANET
 ----------------------------------------------------*/

/*GENERALES*/

html, body, #emazPortfolio {
    height: 100%;
    width: 100%;
}

* { outline:none;}

body {background-color:#ffffff;}

#emazPortfolio {color:#454545; font-size:22px;}

.pillAcceso{
    background:url(../img/pillHazteMazMin.png) no-repeat;
    width: 105px;
    height: 105px;
    right: 10px;
    bottom: 10px;
    position: fixed;
    z-index: 500;
}

.image-showcase-prev, .image-showcase-next { cursor: pointer;}

.icon {
    display:inline-block;
    width: 50px; 
    height: 50px;
    padding: 10px;
    position: absolute; top: 20px; right: 20px;
    border-radius: 50%; 
    border: 2px solid #444444; 
}


.titleMenuCategoria a:hover { color:#19d3ff;text-decoration: none;}

.titleMenuCategoria:hover::before {
    animation: fadeInDown 1s;
    opacity: 1;
}

.titleMenuCategoria::before {
    display: block;
    width: 63px;
    height: 75px;
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: url(../img/miniGlobo.png) center left no-repeat;
    opacity: 0;
}

/*-----------------------------
 PANTALLA 0 - INICIO
 -----------------------------*/

.mpresentacion {
    display:block;
    width: 100%;
    height: 100%;
    min-height: 100%;
    padding: 100px;
    position:absolute; 
}

.mLogo {
    display: inline-block;
    width: 50%;
    float:left;
    padding: 0px;
    margin: 0px;
    min-height: 300px;
}

    .logoPortfolioEmaz {
        width: 427px;
        margin: 430px auto 0;
        font-family: 'Droid Serif', serif;
        font-style: italic;
        font-size: 22px;
    }

    .logoPortfolioEmaz span {
        text-align: right;
        display: block;
    }

    .icoVideo {
        display:inline-block;
        height: 19px;
        position:absolute;
        bottom: 100px;
        left: 100px;
        z-index: 105;
    }

.mImagen {
    display: inline-block;
    position:relative;
    width: 50%;
    float:left;
    padding: 0px;
    margin: 0px;
    min-height: 100%;
}
    .globo {
        display: block;
        position: absolute;
        top: -120px;
        left: -185px;
        z-index: 110;
    }

    /*Animación Portada Cielo*/
    .mascaraCloud {
        overflow: hidden;
        width: 1776px;
        height: 1000px;
        position: absolute;
        /*top: 120px;
        right:50px;
        z-index:109;*/

            width: 100%;
            height: 100%;
    }

    .mascaraCloud img {
        position: absolute;
        left: 0;
        bottom: 0;
        z-index:109;
        width: 1776px;
        height: 1000px;
        opacity: 0.9;
        -webkit-animation: mascaraCloud-counter ease-out 100s infinite;
        animation: mascaraCloud-counter ease-out 100s infinite; 
    }
        @keyframes mascaraCloud-counter {
          0% {
           left: 500px;
            }
          100% {
            left: -1776px;
          }
        }
        @-webkit-keyframes mascaraCloud-counter {
          0% {
            left: 500px;
            }
          100% {
            left: -1776px;
          }
        }

    .fondo {
        display: block;
        position: absolute;
        top: 0px;
        right: 0px;
        bottom: 0px;
        left: 0px;
        margin: 0px;
        padding: 0px;
        background: url(../img/bgSkyBig.jpg) top right no-repeat;
        /*background: url(../img/montanas.jpg) top right no-repeat;
        background: url(../img/montanas2.jpg) top right no-repeat;*/
        background-size: cover;
    }

.scroll-down { bottom: 28px; z-index: 150;}


.anyo {
    display: inline-block;
    width: 70px;
    height: 40px;
    position: absolute;
    top: 135px;
    right: 13px;
    z-index: 101;
    text-transform: uppercase;
    font-size: 24px; 
    color: #7a7a7a;
    letter-spacing: .1em;
    text-align: center;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-y: hidden;
    -webkit-transform: rotate(-270deg) translateX(-50%);
    transform: rotate(-270deg) translateX(-50%);
    box-sizing: border-box;
    cursor:default;
}

    .anyoMascara {
        transform: matrix(1, 0, 0, 1, 0, 0);
        text-align: center;
        will-change: transform;
    }


.icoDispositivo {
    display:block;
    width: 97px;
    height: 54px;
    margin: 0 auto;
    margin-top: 60px;
    background: url(../img/icoDispositivos.png) top left no-repeat;
}

.icoVideo span {
    display:inline-block;
    float: left;
    width: 17px;
    height: 19px;
}
.icoVideo p {
    display: inline-block;
    float: left;
    margin: 0px;
    padding-top: 5px;
    padding-left: 10px;
    color: #5c5d5d;
    font-size: 10px;
    font-weight: 400;
    letter-spacing: 2px;
    line-height: 19px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icoVideo .st0 { stroke: #333333;}

.videoPopUp {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 998;
    display: none;
    width: 100%;
    height: 100%;
    background-color: rgba(11,11,11,0.9);
}

.videoenmedio {
    position: absolute;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    box-orient: vertical;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    flex-direction: column;
    -ms-flex-direction: column;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    box-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    box-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -ms-flex-align: center;
}

.tamvideo {
    width: 60%;
    min-height: 315px;
    margin: 0 auto;
}


/*-----------------------------
 PANTALLA 1 - DASHBOARD
 -----------------------------*/

.mockupDashboard {display:inline-block!important; margin:200px 0;}
.dashboard .titCajaColores {position: absolute;}

.titCajaColores {
    /*position: absolute;*/
    width: 312px;
    height: 295px;
    background: url(../img/cuadroColores.png) no-repeat;
    font-size: 43px;
    text-align: left;
    padding: 47px 30px;
    line-height: 1.1;
    z-index:-1;
}

.numberMockup1 hr, .numberMockup2 hr, .numberMockup3 hr, .numberMockup4 hr {   
    border: 0;
    border-top: 1px solid #e7e7e7;
    margin-top: -13px;
}


.numberMockup1 {
    position: absolute;
    top: 34%;
    left: 4%;
}

.numberMockup1 {
    width:500px;
    z-index:-5;
}


.numberMockup2{
    position: absolute;
    top: 34%;
    right: 3%;

}

.numberMockup2 hr, .numberMockup3 hr, .numberMockup4 hr{
    position: absolute;
    width: 500px;
    right: 0;
    z-index: -5;
}

.numberMockup3{
    position: absolute;
    top: 50%;
    right: 3%;

}

.numberMockup4{
    position: absolute;
    top: 50%;
    right: 7%;

}

/*--------------------------------
 PANTALLA 2 - DESGLOSE DASHBOARD
 ---------------------------------*/


/*GENERALES DESGLOSE*/
.boxConsultasPendientes .numberCircle, .boxMiGestor .numberCircle, .boxNovedades .numberCircle, .boxEstadoTrabajadores .numberCircle { margin: 20px auto 30px;} 
.titEmaz { font-weight:300; font-size:34px; text-align:center; margin-top:0px; text-align:center; display:block;}

.boxConsultasPendientes {
   background: #f8f8f8;
   height: 700px; 
}

.boxMiGestor {
    background: url(../img/bgMigestor.png) no-repeat #4baad7;
    background-position: right bottom;
    height: 700px;

}
.boxMiGestor p {color:#ffffff; text-align:center}

.boxMiGestor .numberCircle,
.boxNovedades .numberCircle,
.boxEstadoTrabajadores .numberCircle {margin-top: 63px;}

.boxNovedades {
    background: #f8f8f8;
    height: 700px;
}

.boxNovedades p,
.boxEstadoTrabajadores p {text-align:center}

.imgNovedades {margin:0 auto;}

.boxEstadoTrabajadores {
    background: #ffffff;
    height: 700px;
}

.numberCircle {
    border-radius: 50%;
    width: 26px;
    height: 26px;
    padding: 2px;
    background: #e7e7e7;
    text-align: center;
    font-size: 15px;
    margin-top: 50px;
}

.cont-1 ul li {  
    padding: 5px;
    border-left: 3px solid #7AD7B4;
    border-bottom: 1px solid #ccc;
    font-size:16px;
    text-align:left;
    margin-top: 15px;
}


/* -------------------------------- 
            COLORES
-------------------------------- */
.bVerde{ border-left: 3px solid #b6d079!important;}
.bTurquesa{ border-left: 3px solid #4ae0d7!important;}
.bRosa{ border-left: 3px solid #dc94d1!important;}
.bNaranja{ border-left: 3px solid #ff840b!important;}
.bAmarillo{ border-left: 3px solid #ffce0b!important;}
.bAzul{border-left: 3px solid #005f9b!important;}

.bgVerde{ background-color:  #b6d079;}
.bgTurquesa{ background-color:  #4ae0d7;}

.cls-1 { fill: #b8cd2b;}
.cls-1, .cls-2 { fill-rule: evenodd;}
.cls-2 { fill: #f7f7f7;}

.icoJornadas .titEmaz { margin-top: 10px; line-height: 33px;}

/*--------------------------------
 PANTALLA 3 - ABSENTISMO
 ---------------------------------*/

.zonaAbsentismo { 
  background: url(../img/bgAbsentismo.png) no-repeat center bottom fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.zonaAbsentismo img { margin:0 auto;}


/*--------------------------------
 PANTALLA 4 - ALERTAS
 ---------------------------------*/

.zonaAlertas {background-color:#353535;}
.zonaAlertas .titCajaColores { color:#ffffff;}


.zonaAlertas .image-showcase{
    height: 552px;
    position: relative;
    margin-bottom:150px;
}
		
.zonaAlertas .image-showcase *{
	-webkit-user-select: none;  /* Chrome all / Safari all */
	-moz-user-select: none;     /* Firefox all */
	-ms-user-select: none;      /* IE 10+ */
	user-select: none;
    
}
		
.zonaAlertas .image-showcase-header, .zonaAplicaciones .image-showcase-header{
	margin: 0 auto;
	width: 700px;
	height: 100px;
	margin-top: 20px;
	position: relative;
}
		
.zonaAlertas .image-showcase-text, .zonaAplicaciones .image-showcase-text {
    margin: 0 auto;
    width:330px;
}
		
.zonaAlertas .image-showcase-text > p, .zonaAplicaciones .image-showcase-text > p {
	width: 330px;		
	height: 200px;
	margin: 0 auto;
	color: #ffffff;
    text-align:center;
	position: absolute;
	opacity: 0;
	transition: all 0.4s;
	cursor: default;
	/*transition-timing-function: ease-in-out;  cubic-bezier(0.73, 0.28, 0.4, 1.12); */
}
.zonaAlertas .image-showcase-text img, .zonaAplicaciones .image-showcase-text img  {
    display: block;
    margin: 0 auto;
    margin-bottom: 15px;
}
		
.zonaAlertas .image-showcase-text > p.index_1, .zonaAplicaciones .image-showcase-text > p.index_1{
	opacity: 1;
}
		
		
.zonaAlertas .image-showcase-prev {
    left:0px;
    margin-top: 60px;
}

.zonaAlertas .image-showcase-next {
     right:0px;
     margin-top: 60px;
}
		
.zonaAlertas .image-showcase-center{
	position: absolute;
    right:0px;
}
		
.zonaAlertas .image-showcase-inner{
	position: relative;
	margin-top:-200px;
}
		
.zonaAlertas .image-showcase-computer{
	z-index: 10;
}
		
.zonaAlertas .image-showcase-background{
	position: absolute;
	top: 78px;
	left: 29px;
	width: 421px;
	height: 552px;
	opacity: 0;
	transition: all 0.4s;
	opacity: 0;
}
		
.zonaAlertas .image-showcase-background.index_1{
	width: 421px;
	height: 552px;
	opacity: 1;
	z-index: 5;
}
		

/*--------------------------------
 PANTALLA 4 - APLICACIONES
 ---------------------------------*/


.zonaAplicaciones .titCajaColores { padding: 26px 30px;}

.zonaAplicaciones .image-showcase{
	width: 100%;
	height: 920px;
	position: relative;
    overflow-x: hidden;
}
		
.zonaAplicaciones .image-showcase *{
	-webkit-user-select: none;  /* Chrome all / Safari all */
	-moz-user-select: none;     /* Firefox all */
	-ms-user-select: none;      /* IE 10+ */
	user-select: none;
}

.zonaAplicaciones .image-showcase-text > p {width:500px; color:#454545; transition: all 0.4s; cursor: default;}
.zonaAplicaciones .image-showcase-text {width:500px;}		


.zonaAplicaciones .image-showcase-header{
    margin-top:50px;
    margin-bottom:150px;
}

.zonaAplicaciones .image-showcase-prev {
    left:0px;
    margin-top: 117px;
}
.zonaAplicaciones .image-showcase-next {
    right:0px;
    margin-top: 117px;
    cursor: pointer;
}
		
.zonaAplicaciones .image-showcase-prev:hover, .image-showcase-next:hover{
	/*background: #ccc;
	color: white;*/
}
		
.zonaAplicaciones .image-showcase-center{
	position: absolute;
	left: 50%;
}
		
.zonaAplicaciones .image-showcase-inner{
	position: relative;
	left: -200px;
}
		
.zonaAplicaciones .image-showcase-computer{
	position: absolute;
	z-index: 10;
}
		
.zonaAplicaciones .image-showcase-background{
	position: absolute;
	top: 50px;
	left: -1025px;
	width: 590px;
	height: 393px;
	opacity: 0;
	transition: all 0.4s;
	/* transition-timing-function: ease-in-out; */
	transform: scale(0.8, 0.8);
	opacity: 0;
}
		
.zonaAplicaciones .image-showcase-background.index_1{
   	top: 23px;
    left: 107px;
	width: 574px;
	height: 393px;
	opacity: 1;
	transform: scale(1, 1);
	z-index: 5;
}
		
.zonaAplicaciones .image-showcase-background.index_0{
	top: 17px;
	left: -420px;
	width: 590px;
	height: 393px;
	opacity: 0.5;
	-webkit-filter: blur(5px);
	transform: scale(0.9, 0.9);
}
		
.zonaAplicaciones .image-showcase-background.index_2{
	top: 105px;
	left: 600px;
	width: 590px;
	height: 393px;
	opacity: 0;
	transform: scale(1, 1);
}


/*flechas*/


.zonaAlertas svg, .zonaAplicaciones svg {
  padding: 5px;
  width:30px;
}

.left { float:left;}
.right { float:right;}

.left:hover polyline,
.left:focus polyline {
  stroke-width: 3;
}

.left:active polyline {
  stroke-width: 6;
  transition: all 100ms ease-in-out;
}

.right:hover polyline,
.right:focus polyline {
  stroke-width: 3;
}

.right:active polyline {
  stroke-width: 6;
  transition: all 100ms ease-in-out;
}


/*--------------------------------
 PANTALLA 5 - UTILIDADES
 ---------------------------------*/

.zonaUtilidades .txtEmaz { font-size:20px;}
.lineas img {width:100%;}


/*--------------------------------
 PANTALLA 6 - MAS MAZ
 ---------------------------------*/
.acceso {background-color:#353535;}
.acceso p.titEmaz {color:#ffffff;}
.acceso p.txtEmaz {color:#828282;}

.padding0, margin0 {padding:0px; margin-left:0px;}
.marginLeft30 {margin-left:30px;}

.masMaz p {font-size:0.9em;}
.masMaz h2 {font-weight:300;}
.masMaz .contImage {height:500px;}

/*  *** 2023 * EMPRESA SALUDABLE */
#moverImgNutricion {
    padding-left: 20px;
    height: 200px;
}
.secciones-saludables {
    height: 240px;
}
.saludables {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch;
}
.saludable {
    width: 18.5%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    padding: 25px 5px 10px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(40,40,40,.1);
    margin-bottom: 20px;
    height: 180px;
}
.saludable .icon-section {
    height: 66px;
    display: flex;
    align-items: center;
}
.saludable h3 {
    font-size: 16px;
    line-height: 1.1;
    font-weight: 400;
    text-align: center;
}

/*--------------------------------
 PANTALLA 7 - SOLICITA ACCESO
 ---------------------------------*/

#checkPoliticaPrivacidad a, #checkPoliticaPrivacidad label { color: #828282 }
#checkPoliticaPrivacidad a:hover, #checkPoliticaPrivacidad label:hover { color: #2fb3c7 }

input[type=checkbox] {
  opacity: 0;
  float:left;
}

input[type=checkbox] + label {
    margin: 0 0 0 20px;
    position: relative;
    cursor: pointer;
    font-size: 16px;
    float: left;
    font-weight: 300!important;
    color: #fff;
}

input[type=checkbox] + label ~ label {
  margin: 0 0 0 40px;
}

input[type=checkbox] + label::before {
  content: ' ';
  position: absolute;
  left: -35px;
  top: -3px;
  width: 25px;
  height: 25px;
  display: block;
  background: white;
  border: 1px solid #A9A9A9;
}

input[type=checkbox] + label::after {
  content: ' ';
  position: absolute;
  left: -35px;
  top: -3px;
  width: 23px;
  height: 23px;
  display: block;
  z-index: 1;
  background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjE4MS4yIDI3MyAxNyAxNiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAxODEuMiAyNzMgMTcgMTYiPjxwYXRoIGQ9Ik0tMzA2LjMgNTEuMmwtMTEzLTExM2MtOC42LTguNi0yNC04LjYtMzQuMyAwbC01MDYuOSA1MDYuOS0yMTIuNC0yMTIuNGMtOC42LTguNi0yNC04LjYtMzQuMyAwbC0xMTMgMTEzYy04LjYgOC42LTguNiAyNCAwIDM0LjNsMjMxLjIgMjMxLjIgMTEzIDExM2M4LjYgOC42IDI0IDguNiAzNC4zIDBsMTEzLTExMyA1MjQtNTI0YzctMTAuMyA3LTI1LjctMS42LTM2eiIvPjxwYXRoIGZpbGw9IiMzNzM3MzciIGQ9Ik0xOTcuNiAyNzcuMmwtMS42LTEuNmMtLjEtLjEtLjMtLjEtLjUgMGwtNy40IDcuNC0zLjEtMy4xYy0uMS0uMS0uMy0uMS0uNSAwbC0xLjYgMS42Yy0uMS4xLS4xLjMgMCAuNWwzLjMgMy4zIDEuNiAxLjZjLjEuMS4zLjEuNSAwbDEuNi0xLjYgNy42LTcuNmMuMy0uMS4zLS4zLjEtLjV6Ii8+PHBhdGggZD0iTTExODcuMSAxNDMuN2wtNTYuNS01Ni41Yy01LjEtNS4xLTEyLTUuMS0xNy4xIDBsLTI1My41IDI1My41LTEwNi4yLTEwNi4yYy01LjEtNS4xLTEyLTUuMS0xNy4xIDBsLTU2LjUgNTYuNWMtNS4xIDUuMS01LjEgMTIgMCAxNy4xbDExNC43IDExNC43IDU2LjUgNTYuNWM1LjEgNS4xIDEyIDUuMSAxNy4xIDBsNTYuNS01Ni41IDI2Mi0yNjJjNS4yLTMuNCA1LjItMTIgLjEtMTcuMXpNMTYzNC4xIDE2OS40bC0zNy43LTM3LjdjLTMuNC0zLjQtOC42LTMuNC0xMiAwbC0xNjkuNSAxNjkuNS03MC4yLTcxLjljLTMuNC0zLjQtOC42LTMuNC0xMiAwbC0zNy43IDM3LjdjLTMuNCAzLjQtMy40IDguNiAwIDEybDc3LjEgNzcuMSAzNy43IDM3LjdjMy40IDMuNCA4LjYgMy40IDEyIDBsMzcuNy0zNy43IDE3NC43LTE3Ni40YzEuNi0xLjcgMS42LTYuOS0uMS0xMC4zeiIvPjwvc3ZnPg==') no-repeat center center;
  -ms-transition: all .2s ease;
  -webkit-transition: all .2s ease;
  transition: all .3s ease;
  -ms-transform: scale(0);
  -webkit-transform: scale(0);
  transform: scale(0);
  opacity: 0;
}

input[type=checkbox]:checked + label::after {
  -ms-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}

.enlacesDescargas img {margin-left:10px;}



/*--------------------------------
            ANIMACIONES
 ---------------------------------*/

/*#moverImgTrabajador,*/
#moverImgNutricion,  
#titCajaDashBoard,
#moverGrafica, 
#moverCajaProcesos, 
#moverIpadAbsentismo, 
#moverCajaAlertas, 
#moverCajaAplicaciones, 
#moverIconosUtilidades,
#moverCajaPrivilegios,
.saludable { opacity:0;}

#moverLinea1.active,
#moverLinea2.active
{ animation: flipInX 1s; opacity: 1;}

#moverImgNutricion.active {
    animation: fadeInRight 500ms;
    opacity: 1;
}

/*#moverImgTrabajador.active {
    animation: fadeInLeft 500ms;
    opacity: 1;
}*/

#titCajaDashBoard.active {
    animation: fadeInLeft 500ms;
    opacity: 1;
}

#moverGrafica.active {
    animation: zoomIn  500ms;
    opacity: 1;
}

#moverCajaProcesos.active {
    animation: fadeInLeft 500ms;
    opacity: 1;
}

#moverIpadAbsentismo.active {
    animation: fadeInUp 500ms;
    opacity: 1;
}

#moverCajaAlertas.active {
    animation: fadeInLeft 500ms;
    opacity: 1;
}

#moverCajaAplicaciones.active {    
    animation: fadeInLeft 500ms;
    opacity: 1;
}

#moverIconosUtilidades.active {
    animation: zoomIn 500ms;
    opacity: 1;
}

#moverCajaPrivilegios.active {    
    animation: fadeInLeft 500ms;
    opacity: 1;
}

.saludable.active {
    opacity: 1;
}
.saludable.active.menu {
    animation: fadeInRight 500ms;
}
.saludable.active.consejos {
    animation: fadeInRight 1000ms;
}
.saludable.active.bienestar {
    animation: fadeInRight 1500ms;
}
.saludable.active.habitos {
    animation: fadeInRight 2000ms;
}
.saludable.active.prevencion {
    animation: fadeInRight 2500ms;
}


/*--------------------------------
            MEDIAQUERIES
 ---------------------------------*/


/* Large desktops and laptops */
@media (min-width: 1900px) {
    .masMaz .empresa { padding-left: 20%;}
    .masMaz .salud { padding-right: 20%;}
}
@media (min-width: 1200px) {
    .masMaz .empresa { padding-left: 10%;}
    .masMaz .salud { padding-right: 10%;}
}

/* Landscape tablets and medium desktops */
@media (min-width: 992px) and (max-width: 1199px) {

    .mpresentacion { padding-left: 50px;}

    .masMaz .empresa { padding-left: 6%;}
    .masMaz .salud { padding-right: 6%;}

    .titleMenuCategoria { margin-left: 23%;}

}

/* Portrait tablets and small desktops */
@media (min-width: 768px) and (max-width: 991px) {
    .masMaz .empresa { padding-left: 6%;}
    .masMaz .salud { padding-right: 6%;}
}

@media (min-width: 768px) and (max-width:1024px) {

    .mpresentacion { padding-right: 80px;}
    .titleMenuCategoria { margin-left: 23%;}
    .titleMenuCategoria::before { background: none;}
    /* PANTALLA 0 - INICIO ------------*/

    .globo img {width: 510px; margin-top: -20px;}
    .logoPortfolioEmaz { margin-top:220px; width: 80%; font-size: 20px; margin-left: 30px;}

   /* PANTALLA 1 - DASHBOARD ----------*/
    .mockupDashboard { margin-top: 246px;}
}

@media (max-width: 992px) {

    /*  Empresa saludable */
    #moverImgNutricion {
        
    }
    #moverImgNutricion img {
        float: none!important;
        clear: both;
        margin: auto;
    }
    .secciones-saludables {
        margin-top: 0;
        height: initial;
     }
    .saludables {
        flex-wrap: wrap;
        justify-content: center;
    }
    .saludable {
        width: 32.3%;
        margin-right: 1.5%;
        height: initial;
    }
    .saludable:nth-child(3) {
        margin-right: 0;
    }

}

@media (max-width: 768px){

    .rowTop150.rowTopMovil { margin-top: 0px;}
    .rowTop150 { margin-top: 70px;}

    .mobilenav .rowTop20.presen {  margin-top: 10%;}

    /* PANTALLA 0 - INICIO  */

    .mLogo { width: 73%; position: absolute; bottom: 120px;}
    .mImagen {width: 96%; min-height: 73%;}

    .mpresentacion { padding-top: 90px;}

    .globo              { top: -110px; left: -130px;}
    .globo img          { width: 510px;}
    .logoPortfolioEmaz  { width: 427px; margin-left: auto;}
    .icoDispositivo     { display: none;}
    .icoVideo           { bottom: 48px; left: 40px;}
    .tamvideo           { width: 90%;}

     /* PANTALLA 1 - DASHBOARD */

    .titCajaColores { padding-top: 26px;}
    .mockupDashboard { margin-top: 230px;}

    /* PANTALLA 2 - GESTION PROCESOS */

    .boxConsultasPendientes, .boxMiGestor, .boxEstadoTrabajadores, .boxNovedades { top: -130px;}
    .boxMiGestor, .boxNovedades { margin-top:0px; padding-top:50px;}
    .boxEstadoTrabajadores { height: 610px;}
    .boxNovedades > div.numberCircle { margin-top: 15px;}


   /* PANTALLA 3 - GESTION PROCESOS */

    .icoJornadas, .icoCoste { margin-top:50px}
    .zonaAbsentismo { background-attachment: scroll;}

    /* PANTALLA 4 - UTILIDADES */
    .iconosUtilidades div { height:99px; margin-top:40px;}


     /* PANTALLA 5 - ALERTAS */

    .zonaAlertas .image-showcase-text, .zonaAplicaciones .image-showcase-text,
    .zonaAlertas .image-showcase-text > p, .zonaAplicaciones .image-showcase-text > p { width: 480px; margin-top: 20px;}
    .zonaAlertas .image-showcase-inner{ margin-top:10px;}
    .textoAlertas { margin-top:30px;}
    .zonaAlertas .image-showcase-computer { width:67%;}
    .zonaAlertas .image-showcase-background, .zonaAlertas .image-showcase-background.index_1 {
        top: 53px;
        left: 19px;
        width: 59%;
        height: auto;
    }

    .zonaAlertas .image-showcase-center { right: 42px; margin-top: 20px;}
    .zonaAlertas .image-showcase { margin-bottom: 180px;}

    .acceso .col-sm-12.rowTop150 { margin-top: 70px;}
    .paddingForm { padding-left: 30px; padding-right: 30px;}

    .zonaAplicaciones .image-showcase { height: 790px;}

    .masMaz .empresa { padding-right: 0;}
}


/* Landscape phones and portrait tablets */
@media (max-width: 767px) {

    .titleMenuCategoria a   { font-size: 20px;}
    .titleMenuCategoria     { padding: 7px 0; padding-left: 75px;}

    .mpresentacion { padding: 80px; padding-top: 90px;}
    .mLogo {
        width: 78%;
        position: absolute;
        bottom: 100px;
    }
    .mImagen {
        width: 100%;
        min-height: 73%;
    }

    .globo      { top: -120px;}
    .globo img  { width: 350px;}

    .logoPortfolioEmaz {
        position: relative;
        bottom: -130px;
        left: initial;
        margin: 0 auto;
        width: 360px;
        font-size: 15px;
    }

    .logoPortfolioEmaz span { position:static;}

    .logoPortfolioEmaz img {
        display: block;
        max-width: 100%;
        height: auto;
    }

    .mascaraCloud {
        overflow: hidden;
        top: 0px;
        right: 0;
    }
    .tamvideo { width: 90%;}

    .dashboard           { margin-top: 200px;}
    .dashboard .titCajaColores { position: relative; padding-top: 46px;}
    .mockupDashboard    { margin-top: 40px;}
    .numberMockup1      { top: 40%; width: 20px;}
    .numberMockup2      { top: 40%;}
    .numberMockup4      { top: 47%; right: 3%;}
    .numberMockup3      { top: 52%; right: 3%;}
    .numberMockup1 hr, .numberMockup2 hr, .numberMockup3 hr, .numberMockup4 hr { width: 40px;}

    .boxConsultasPendientes .numberCircle, 
    .boxMiGestor .numberCircle, 
    .boxNovedades .numberCircle, 
    .boxEstadoTrabajadores .numberCircle { margin: 0px auto 30px;}
    .titEmaz { font-size: 26px; line-height: 28px;}

    .boxConsultasPendientes { height: 610px;}
    .boxConsultasPendientes, .boxMiGestor, .boxEstadoTrabajadores, .boxNovedades { top: -150px;}
    .boxEstadoTrabajadores { padding-top: 40px; height: 600px;}
    .boxNovedades { height: 590px;}
    .rowTop150.rowTopMovil { margin-top: -80px;}

    #moverCajaProcesos.titCajaColores { padding-top: 65px; padding-left: 50px;}

    .titCajaColores { margin: 0 auto;}

    .zonaAlertas .image-showcase-center { right: 0px; margin-top: 170px; text-align: center;}
    .zonaAlertas .image-showcase-background, .zonaAlertas .image-showcase-background.index_1 {
        top: 44px;
        left: 0;
        right: 0px;
        width: 59%;
        margin: 0 auto;
        height: auto;
    }
    .zonaAlertas .image-showcase { height: 492px; margin-bottom: 130px;}
    .zonaAlertas .image-showcase-prev { margin-left: 5px; z-index: 500; position: absolute;}
    .zonaAlertas .image-showcase-next { margin-right: 5px; z-index: 500; position: absolute;}
    .zonaAlertas .image-showcase-text, .zonaAplicaciones .image-showcase-text, 
    .zonaAlertas .image-showcase-text > p, .zonaAplicaciones .image-showcase-text > p { width: 280px;font-size: 18px;}

    .zonaAplicaciones .image-showcase-header { width: 300px; height: 200px; text-align: center; margin: 30px auto 70px auto;}
    .zonaAplicaciones .image-showcase-text, .zonaAplicaciones .image-showcase-text > p { width: 280px;}
    .zonaAplicaciones .image-showcase-prev { margin-left: -25px; z-index: 500; position: absolute;}
    .zonaAplicaciones .image-showcase-next { margin-right: -25px; z-index: 500; position: absolute;}

    .zonaUtilidades         { height: 1010px;}
    .iconosUtilidades div   { margin-top: 20px;}

    /*#moverImgNutricion      { position: relative; top: -80px;}*/
    #moverImgTrabajador     { margin-top: 670px; margin-bottom: 20px;}
    #moverImgTrabajador img { height: 290px;}
    .salud                  { margin-top: 20px;}
    .masMaz .contImage      { height: 280px;}
    .masMaz .empresa        { margin-top: 220px; position: absolute;}

    .acceso .col-sm-12.rowTop150 {  margin-top: 40px;}
}

/* Portrait phones and smaller */
@media (max-width: 600px) {

   /*  Empresa saludable */
    #moverImgNutricion {
        height: initial;
        margin-top: 60px;
        margin-bottom: 40px;
    }
    #moverImgNutricion img {

    }
    .saludable {
        width: 48.5%;
        margin-right: 3%;
        height: initial;
        padding: 20px 5px 10px;
    }
    .saludable .icon-section {
        height: 56px;
    }
    .saludable .icon-section img {
        width: 80%;
        margin: auto;
    }
    .saludable h3 {
        font-size: 14px;
        margin-top: 10px;
    }
    .saludable:nth-child(2n) {
        margin-right: 0%;
    }
    .saludable:nth-child(3n) {
        margin-right: 3%;
    }

}

@media (max-width: 480px) {
    .mpresentacion { padding: 70px;}
    .icon {
        width: 40px;
        height: 40px;
        padding: 0;
        top: 10px;
        right: 10px!important;
        border: none; border-radius: initial;
    }
    .anyo                   { top: 115px; right: 5px;}
    .mLogo                  { width: 60%}
    .mImagen                { min-height: 300px;}
    .logoPortfolioEmaz      {  top: 220px; width: 210px;}
    .logoPortfolioEmaz span { margin-top: -10px;}
    .logoPortfolioEmaz p    { margin: 0 0 5px;}
    .globo                  { top: -80px; left: -90px;}
    .globo img              { width: 250px;}
    .pillAcceso             { right: 0; bottom: 0;}
    .icoVideo p             { display: none;}
}