/* GLOBALS */
html {
  box-sizing: border-box;
  overflow-x: hidden;
}
*, *:before, *:after {
  box-sizing: inherit;
}
/* @font-face {
    font-family: 'poppins-regular';
    src: url('fonts/Poppins-Regular.ttf');
    font-weight: 400;
}
@font-face {
    font-family: 'poppins-bold';
    src: url('fonts/Poppins-Bold.ttf');
    font-weight: 400;
} */
@font-face {
    font-family: 'besom';
    src: url('/sites/all/themes/grupovips/fonts/Besom-free-font.otf');
    font-weight: 100;
}
body{
  background: black;
  padding: 0;
  margin: 0;
/*   font-family: 'poppins-regular'; */
}
/* strong{font-family: 'poppins-bold';} */

/* MAIN */
main{
  max-width: 320px;
  background: #1e3659;
  overflow: hidden;
  margin: auto;
}

main .bloque{padding: 0 0 50px 0;}

main .bloque.intro{padding: 20px 0 0 0; margin: auto; text-align: center; height: auto;}
main .bloque.intro h1{font-size: 34px;line-height: 36px;color: white;font-weight:700;text-transform: uppercase;}

main .bloque.intro h3{font-size: 24px;line-height: 26px;color: white;font-family: 'besom';font-weight: 100;margin:10px 0 0 0;}
main .bloque.intro h3:after{content: '';background: #1F57A4;height: 5px;border-radius: 3px;display: block;width: 180px;transform: rotate(-1.5deg);margin: auto;}

main .bloque.intro h2{font-size: 24px;line-height: 26px;color: white;font-family: 'besom';font-weight: 100;margin:10px 0 0 0;}
main .bloque.intro h2:after{content: '';background: #1F57A4;height: 5px;border-radius: 3px;display: block;width: 180px;transform: rotate(-1.5deg);margin: auto;}


main .bloque.intro img{margin: 30px 0 10px 0;}
main .bloque.pie{padding: 0 0 50px 0; margin: auto; text-align: center; height: auto;}
main .bloque.pie h3{font-size: 42px;line-height: 40px;color: white;font-weight:700; margin: 40px 0 20px 0;}
main .bloque.pie img{margin: 0 0 30px 0;}
main .bloque.pie p{font-size: 13px;line-height: 15px;color: white;margin:10px 0 0 0;}
main .bloque.pie p:after{content: '';background: #1F57A4;height: 5px;border-radius: 3px;display: block;width: 140px;transform: rotate(-1.5deg);margin: 5px auto 0 auto;top: 7px;position: relative;}

main .bloque .cabecera{padding: 20px 0; margin: auto; text-align: center; height: auto;}
main .bloque .cabecera h2{font-size: 46px;line-height: 46px;color: white;font-weight:700;}
main .bloque .cabecera .intro{font-size: 14px; color: white;}

main .bloque .ilustracion{padding: 5px 0; margin: auto; text-align: center; position: relative;}
main .bloque .ilustracion img{margin-bottom: 12px;}
main .bloque .ilustracion h3{text-transform: uppercase;word-spacing: -4px; font-size: 24px;line-height: 22px; color: white;font-family: 'besom';font-weight: 100; margin: 0;}
main .bloque .ilustracion.cercania{margin: 20px 0 5px 0;}
main .bloque .ilustracion.trabajamos{margin: 20px 0 40px 0;}
main .bloque .ilustracion.confianza{margin-bottom: 32px;}
main .bloque .ilustracion.adaptamos{margin: 60px 0 0 0;}
main .bloque .ilustracion.huella{margin: 10px 0 0 0;}
main .bloque .ilustracion.mundo{margin: 10px 0 0 0;}
main .bloque .ilustracion.responsabilidad{margin: 60px 0 30px 0;}
main .bloque .ilustracion.innovamos{margin: 70px 0 40px 0;}

main .bloque .ilustracion.crecemos::after{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-crecemos.svg') no-repeat;height:100px; width:90px;position:absolute;top:-40px;right:10px;}
main .bloque .ilustracion.cuidamos::before{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-cuidamos.svg') no-repeat;height:65px; width:70px;position:absolute;top:-20px;left:30px;}
main .bloque .ilustracion.trabajamos::before{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-trabajamos-before.svg') no-repeat;height:100px; width:45px;position:absolute;top:170px;left:15px;}
main .bloque .ilustracion.trabajamos::after{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-trabajamos.svg') no-repeat;height:100px; width:95px;position:absolute;top:0px;right:20px;}
main .bloque blockquote.ayudar::before{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-ayudar-before.svg') no-repeat;height:100px; width:45px;position:absolute;top:140px;left:-15px;}
main .bloque blockquote.ayudar::after{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-ayudar.svg') no-repeat;height:100px; width:50px;position:absolute;top:-20px;right:0px;}
main .bloque .ilustracion.cercania::after{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-cercania.svg') no-repeat;height:100px; width:90px;position:absolute;top:-60px;right:15px;}
main .bloque .ilustracion.confianza::before{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-confianza-before.svg') no-repeat;height:85px; width:70px;position:absolute;top:-50px;left:45px;}
main .bloque .ilustracion.confianza::after{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-confianza.svg') no-repeat;height:125px; width:80px;position:absolute;top:50px;right:10px;}
main .bloque .ilustracion.adaptamos::before{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-adaptamos.svg') no-repeat;height:85px; width:80px;position:absolute;top:-60px;left:20px;}
main .bloque .datos.gluten::after{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-gluten.svg') no-repeat;height:85px; width:80px;position:absolute;top:225px;left:100px;}
main .bloque .ilustracion.huella::after{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-huella.svg') no-repeat;height:115px; width:80px;position:absolute;top:-60px;right:-10px;}
main .bloque .ilustracion.mundo::before{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-mundo.svg') no-repeat;height:80px; width:80px;position:absolute;top:-20px;left:20px;}
main .bloque .ilustracion.responsabilidad::after{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-responsabilidad.svg') no-repeat;height:120px; width:80px;position:absolute;top:-80px;right:0px;}
main .bloque .ilustracion.innovamos::before{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-innovacion-before.svg') no-repeat;height:120px; width:80px;position:absolute;top:-70px;left:30px;}
main .bloque .ilustracion.innovamos::after{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-innovacion.svg') no-repeat;height:120px; width:80px;position:absolute;top:40px;right:10px;}
main .bloque .datos.papel::after{content: ''; display: block;background: url('/sites/all/themes/grupovips/img/igr2017/images/flecha-papel.svg') no-repeat;height:110px; width:80px;position:absolute;top:230px;left:110px;}

main .bloque .datos{position: relative; margin: 20px auto;}
main .bloque .datos .texto.centrado{text-align: center;}
main .bloque .datos .texto p{font-size: 14px; line-height: 16px; padding:0; margin: 0;}
main .bloque .datos .texto p.blanco{color: white;}
main .bloque .datos .texto p.azul{color: #1e3659;}
main .bloque .datos .texto .cifra{font-size: 70px; line-height: 50px;font-family: 'besom';font-weight: 100;padding: 10px 0 0 0;}
main .bloque .datos .texto .cifra.blanco{color: white;}
main .bloque .datos .texto .cifra.azul{color: #1e3659;}

main .bloque .datos.profesionales{
  background-image: url('/sites/all/themes/grupovips/img/igr2017/images/datos-fondo-profesionales.svg');
  background-repeat: no-repeat;
  background-size: 400px;
  height: 250px;
  background-position: center;

  /* max-width:470px;
  width: 100%; */

  width:470px;
  margin-left: -85px;
}
main .bloque .datos.profesionales .texto{position: absolute;top: 100px;left: 105px;width: auto;max-width: 230px;}
main .bloque .datos.profesionales img{position: absolute;right: 35px;width: 170px;bottom: 34px;}

main .bloque .datos.horas{
  background-image: url('/sites/all/themes/grupovips/img/igr2017/images/datos-fondo-horas.svg');
  background-repeat: no-repeat;
  background-size: 380px;
  height: 250px;
  background-position: center;

  /* max-width:420px;
  width: 100%; */

  width:420px;
  margin-left: -55px;
  margin-bottom: 0px;
}
main .bloque .datos.horas .texto{position: absolute;top: 90px;left: 120px;width: auto;max-width: 230px;}
main .bloque .datos.horas img{position: absolute;top: 30px;right: 90px;width:100px;}

main .bloque .datos.jovenes{
  background-image: url('/sites/all/themes/grupovips/img/igr2017/images/datos-fondo-jovenes.svg');
  background-repeat: no-repeat;
  background-size: 400px;
  height: 250px;
  background-position: center;

  /* max-width:470px;
  width: 100%; */

  width:470px;
  margin-left: -90px;
  margin-bottom: 5px;
}
main .bloque .datos.jovenes .texto{position: absolute;top: 70px;left: 105px;width: auto;max-width: 230px;}
main .bloque .datos.jovenes img{position: absolute;right: 5px;width: 235px;bottom: 34px;}

main .bloque .datos.proveedores{
  background-image: url('/sites/all/themes/grupovips/img/igr2017/images/datos-fondo-proveedores.svg');
  background-repeat: no-repeat;
  background-size: 380px;
  height: 250px;
  background-position: center;
  margin-bottom: 30px;

  /* max-width:470px;
  width: 100%; */

  width:470px;
  margin-left: -80px;
}
main .bloque .datos.proveedores .texto{position: absolute;top: 85px;right: 85px;width: auto;max-width: 230px;}
main .bloque .datos.proveedores img{position: absolute;left: 0;width: 270px;bottom: 0px;}

main .bloque .datos.gluten{
  background-image: url('/sites/all/themes/grupovips/img/igr2017/images/datos-fondo-gluten.svg');
  background-repeat: no-repeat;
  background-size: 310px;
  height: 250px;
  background-position: center;
  margin-bottom: 0;

  /* max-width:470px;
  width: 100%; */

  width:470px;
  margin-left: -78px;
}
main .bloque .datos.gluten .texto{position: absolute;top: 65px;left: 110px;width: auto;max-width: 230px;}
main .bloque .datos.gluten .texto .cifra.blanco{margin: 8px 0;}
main .bloque .datos.gluten img{position: absolute;right: 75px;width: 130px;bottom: 55px;}

main .bloque .datos.energia{
  background-image: url('/sites/all/themes/grupovips/img/igr2017/images/datos-fondo-energia.svg');
  background-repeat: no-repeat;
  background-size: 360px;
  height: 275px;
  background-position: center;
  margin-bottom: 0;

  /* max-width:470px;
  width: 100%; */

  width:470px;
  margin-left: -75px;
}
main .bloque .datos.energia .texto{position: absolute;top: 105px;right: 110px;width: auto;max-width: 230px;}
main .bloque .datos.energia img{position: absolute;left: 64px;width: 150px;bottom: 47px;}

main .bloque .datos.comedores{
  background-image: url('/sites/all/themes/grupovips/img/igr2017/images/datos-fondo-comedores.svg');
  background-repeat: no-repeat;
  background-size: 370px;
  height: 275px;
  background-position: center;

  /* max-width:470px;
  width: 100%; */

  width:470px;
  margin-left: -85px;
}
main .bloque .datos.comedores .texto{position: absolute;top: 100px;left: 100px;width: auto;max-width: 230px;}
main .bloque .datos.comedores img{position: absolute;right:30px;width: 195px;bottom: 43px;}

main .bloque .datos.papel{
  background-image: url('/sites/all/themes/grupovips/img/igr2017/images/datos-fondo-papel.svg');
  background-repeat: no-repeat;
  background-size: 370px;
  height: 235px;
  background-position: center;

  /* max-width:470px;
  width: 100%; */

  width:470px;
  margin-left: -80px;
}
main .bloque .datos.papel .texto{position: absolute;top: 65px;left: 105px;width: auto;max-width: 230px;}
main .bloque .datos.papel img{position: absolute;right:40px;width: 180px;bottom: 0px;}

main .bloque blockquote{padding: 5px 0; margin: auto; width: 100%; max-width: 270px;text-align: center; font-size: 18px; line-height: 22px;position: relative;}
main .bloque .fondo{
  background-image: url('/sites/all/themes/grupovips/img/igr2017/images/camion-fondo.svg');
  background-repeat: no-repeat;
  background-size: 360px;
  height: 220px;
  background-position: center;
  margin-bottom: 30px;
  margin: auto;

  /* max-width:430px;
  width: 100%; */

  width:430px;
  margin-left: -50px;
}
main .bloque .fondo blockquote{ padding-top: 30px;}
main .bloque blockquote .textopequeño{font-size: 16px; line-height: 17px; margin: 0; padding: 0;}
main .bloque blockquote img{display: block; text-align: center; margin: 0 auto 10px auto;}
main .bloque blockquote img.comillas{position: absolute; right: 70px; top: 10px;}
main .bloque blockquote .cifra{font-size: 76px; line-height: 56px;font-family: 'besom';font-weight: 100;padding: 10px 0 0 0;}
main .bloque blockquote.blanco{color: white;}
main .bloque blockquote.azul{color: #1e3659;}

.oculto {opacity: 0; transition: all ease-in-out .6s;}
.way.oculto {opacity: 1;}

main .bloque .datos.profesionales img {right:-150px; transition: all ease-in-out .6s;}
main .bloque .datos.profesionales.way img {right:35px;}

main .bloque .datos.horas img {top: -20px; opacity: 0; transition: all ease-in-out .6s;}
main .bloque .datos.horas.way  img {top: 30px; opacity: 1;}

main .bloque .datos.jovenes img {right:-125px; transition: all ease-in-out .6s;}
main .bloque .datos.jovenes.way img {right:5px;}

main .bloque .datos.proveedores img {left: -125px; transition: all ease-in-out .6s;}
main .bloque .datos.proveedores.way img {left: 0px;}

main .bloque .datos.gluten img {bottom: -50px; transition: all ease-in-out .6s;}
main .bloque .datos.gluten.way img {bottom: 55px;}

main .bloque .datos.energia img {left: -150px; transition: all ease-in-out .6s;}
main .bloque .datos.energia.way img {left: 81px;}

main .bloque .datos.comedores img  {right:-140px; transition: all ease-in-out .6s;}
main .bloque .datos.comedores.way img  {right:30px;}

main .bloque .datos.papel img {right:-145px; transition: all ease-in-out .6s;}
main .bloque .datos.papel.way img {right:40px;}


main .bloque .ilustracion {transform: translateY(50px); opacity: 0;  transition: all ease-in-out .6s;}
main .bloque .ilustracion.way {transform: translateY(0px); opacity: 1;  }

main .bloque.pie img {opacity: 0; transition: all ease-in-out .6s; transform: translateY(30px); }
main .bloque.pie img.way  {opacity: 1; transform: translateY(0px); }

/*anima cabecera*/
main .bloque.intro h1 {opacity:0;}
main .bloque.intro h2 {opacity:0;}
main .bloque.intro h3 {opacity:0;}
main .bloque.intro img {opacity:0; transform: translateY(50px); transition: all ease-in-out .6s;}
main .bloque.intro img.way {opacity:1; transform: translateY(0px);}
main .personas  {opacity:0;}

/*main .bloque .cabecera*/
main .bloque .cabecera.inferior {opacity: 0; transition: all ease-in-out .6s;}
main .bloque .cabecera.way {opacity: 1;}