html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/**
 * Remove the margin in all browsers (opinionated).
 */
body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 * 2. Add the correct display in IE.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
  /* 1 */
  display: block;
}

/**
 * Add the correct display in IE 9-.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Add the correct display in IE 10-.
 * 1. Add the correct display in IE.
 */
template,
[hidden] {
  display: none;
}

/* Links
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
a {
  background-color: transparent;
  /* 1 */
  -webkit-text-decoration-skip: objects;
  /* 2 */
}

/**
 * Remove the outline on focused links when they are also active or hovered
 * in all browsers (opinionated).
 */
a:active,
a:hover {
  outline-width: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
b,
strong {
  font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
  font-style: italic;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Add the correct background and color in IE 9-.
 */
mark {
  background-color: #ff0;
  color: #000;
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10-.
 */
img {
  border-style: none;
}

/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/**
 * Add the correct margin in IE 8.
 */
figure {
  margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}

/* Forms
   ========================================================================== */
/**
 * 1. Change font properties to `inherit` in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
select,
textarea {
  font: inherit;
  /* 1 */
  margin: 0;
  /* 2 */
}

/**
 * Restore the font weight unset by the previous rule.
 */
optgroup {
  font-weight: bold;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
 */
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Correct the text style of placeholders in Chrome, Edge, and Safari.
 */
::-webkit-input-placeholder {
  color: inherit;
  opacity: 1;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

* {
  box-sizing: border-box;
}

body {
  opacity: 0;
  width: 100vw;
  transition: opacity 1s;
  font-family: 'Inter', sans-serif;
  font-weight: 300;
  font-size: .8888888889vw;
  line-height: 1vw;
  color: #b8b8b8;
  overflow-x: hidden !important;
  outline: 0;
  background-color: #fff;
  position: relative;
 /* -webkit-font-smoothing: antialiased;
  opacity:0;*/ opacity:1;
}

@media screen and (max-width: 795px) {
  body {
    font-size: 14px;
    line-height:16px;
  }
}

@media screen and (max-width: 485px) {
  body {
    font-size: 14px;
    line-height:16px;
  }
}

p {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
  text-indent: 0;
}

a, a:hover, button {
  text-decoration: none;
  color: inherit;
  outline: 0;
  transition: all 0.3s;
}
h2, h3, h4 { margin:0; padding:0; }
strong {
  font-weight: bold;
}

a[href^="tel"] {
  color: inherit;
}

.slick-slide {
  outline: none;
}

ul {
  padding: 0;
  margin: 0;
}

li {
  list-style-type: none;
}


body.loaded {
  opacity: 1;
}

.grecaptcha-badge {
  display: none !important;
}

textarea:focus, input:focus{
    outline: none;
}
*:focus {
    outline: none;
}
.menuMovil { display:none; }

.whatsappFijo { display:block; position:fixed; z-index:9; background:#25d366; border-radius: 60px 0 0 60px; padding:.5vw 2vw .5vw 1.5vw; right:0; top:12vw;  transition:1s .5s; -webkit-transform: translateX(100px); transform: translateX(100px); opacity: 0; }
.loaded .whatsappFijo  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }
.whatsappFijo img { display:block; width:3.15vw; height:auto; }


header { display: block; position: fixed; left:0; top:0; overflow:hidden; width: 100%; height: 8.66vw; background:#fff;  z-index:9; padding:0 0 0 7.380952381vw; border-bottom:1px solid #000; transition: transform .3s ease;transition:1s .5s; -webkit-transform: translateY(-100px); transform: translateY(-100px); opacity: 0; }
.loaded header  { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
header.oculto {transform: translateY(-100%); }
header h1 { display:inline-block; float:left; position:relative; overflow:hidden; width:25.8333333333vw; margin-top:1.8vw; }
header h1 img { display:block; width:100%; height:auto;  }


#click-menu { display:none; }


header ul.menu { display: inline-block; float: right; position: relative; overflow: hidden; margin-top:3.75vw;}
header .menu li { display: inline-block; float: left; position: relative; overflow: hidden; color: #000; font-size: 1.1111vw; line-height: 1.333vw; font-weight: 600; margin-right: 2.67vw; cursor:pointer; }
header .menu li:hover { color:#bc7155; }


header .der { display: inline-block; float: right; position: relative; overflow: hidden; background: #000; border-radius: 60px 0 0 60px; padding: .8vw 3.8vw .8vw 2.08vw; margin-top:2.8vw; }
header .der .ancla { display: inline-block; float: left; position: relative; overflow: hidden; color: #fff; font-size: 1.1111vw; line-height: 1.333vw; font-weight: 600; margin-right:4.46vw; cursor:pointer; margin-top:.2vw;}
header .der .ancla:hover { color:#bc7155;  }
header .der .instagram { display: inline-block; float: left; position: relative; overflow: hidden; width: 1.78vw; }
header .der .instagram img { display:block; width:100%; height:auto; }

main { display:block; position:relative; overflow:hidden; }
.seccion { display:block; position:relative; overflow:hidden; }
 
#slide { height:70.2380952381vw; height:54vw; background-repeat:no-repeat; background-position:center; background-size:cover; background-attachment:fixed; padding:16.84vw 0 0 7.380952381vw; z-index:2; background-image:url('../img/foto-slide.jpg'); }
#slide .mascara { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 54vw; background: rgba(0, 0, 0, .7); }
#slide .c1 { display: block; position: absolute; right: -4vw; width: 35.53vw; height:auto; bottom: -16vw; z-index: 3; }
#slide h3 { display: block; color: #bc7155; font-weight: 400; font-size: 1.11111vw; line-height: 1.3333vw; text-transform: uppercase; letter-spacing: 1px;  -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#slide.muestra h3 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#slide h2 { display: block; color: #fff; font-size: 8vw; line-height: 8.3vw; font-weight: 800;  -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .7s; }
#slide.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1;}
#slide h2 span { display:block; color:#bc7155; }
#slide .frase { display: block; position: relative; overflow: hidden; width: 100%; margin-top: 7.5vw; z-index:4;}
#slide .frase p { display:inline-block; float:left; position:relative; color: #8c9293; font-weight: 400; font-size: 1.666vw; line-height: 1.888vw; width:54%;-webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .9s; }
#slide.muestra .frase p { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1;}

#slide .frase .solicitar { display: table; float: left;  margin-left:4vw;  -webkit-transform: translateX(100px); transform: translateX(100px); opacity: 0; transition: .5s .9s; }
#slide.muestra .frase .solicitar { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1;}
#slide .frase .solicitar p { display:block; position:relative; overflow:hidden; background: #bc7155; color: #ffff; font-weight: 700; font-size: 1.5vw; line-height:1.5vw; border-radius: 60px; padding: 1.5vw 2vw; cursor:pointer;  cursor:pointer; border:1px solid #bc7155; width:100%; float:unset; transition:unset; }
#slide .frase .solicitar p:hover { background:#fff; color:#bc7155;}

#slide .frase .verservicios { display: table; float: left; margin-left:1vw; -webkit-transform: translateX(100px); transform: translateX(100px); opacity: 0; transition: .5s 1.1s; }
#slide .frase .verservicios p { display: table; width:auto; background: #000d10; color: #ffff; font-weight: 700; font-size: 1.5vw; line-height:1.5vw; border-radius: 60px; padding: 1.5vw 2vw; cursor:pointer; border:1px solid #000d10; cursor:pointer;  transition:unset; }
#slide.muestra .frase .verservicios { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1;}
#slide .frase .verservicios p:hover { background:#fff; color:#000d10; }


#servicios {  padding:3vw 7.380952381vw; z-index:1; }

#servicios .c2 { display: block; position: absolute; right: -4vw; width: 35.53vw; height:auto; top: -35vw; z-index: 1; }
#servicios h3 { display: block; color: #bc7155; text-transform: uppercase; font-size: 1.111vw; line-height: 1.333vw; font-weight: 600; letter-spacing: 1px; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; /*transition: .5s .5s;*/transition: opacity 0.6s ease, transform 0.6s ease; }
#servicios.muestra h3 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#servicios h2 { display: block; color: #000d10; font-weight: 900; font-size: 5vw; line-height: 5vw; margin-top: 1vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; /*transition: .5s .7s;*/transition: opacity 0.9s ease, transform 0.9s ease; }
#servicios.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1;}
#servicios h2 span { display:block; }

#servicios .linea { display: table; position: relative; overflow: hidden; width: 10vw; background: #bc7155; height: 2px; margin-top: 2vw; -webkit-transform: translateY(100px); transform: translateY(100px); opacity: 0; /*transition: .5s .9s;*/ transition: opacity 1.1s ease, transform 1.1s ease;  }
#servicios.muestra .linea { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1;}

#servicios ul { display:block; position:relative; overflow:hidden; width:100%; margin-top:3vw; }
#servicios ul li { display:inline-block; float:left; position:relative; overflow:hidden; width:25%; }

#servicios ul li .imagen { display:block; width:100%;  -webkit-transform: translateY(500px); transform: translateY(500px); opacity: 0; }

#servicios ul li:nth-child(1) .imagen { /*transition: .5s 1s; */ transition: opacity .5s ease, transform 1s ease; }
#servicios.muestra ul li:nth-child(1) .imagen { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#servicios ul li:nth-child(2) .imagen { /*transition: .5s 1.2s;*/ transition: opacity .5s ease, transform 1.2s ease; }
#servicios.muestra ul li:nth-child(2) .imagen { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#servicios ul li:nth-child(3) .imagen { /*transition: .5s 1.4s;*/ transition: opacity .5s ease, transform 1.4s ease; }
#servicios.muestra ul li:nth-child(3) .imagen { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#servicios ul li:nth-child(4) .imagen { /*transition: .5s 1.6s;*/ transition: opacity .5s ease, transform 1.6s ease; }
#servicios.muestra ul li:nth-child(4) .imagen { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#servicios ul li .imagen img { display: block; width: 100%; height: auto; }




#servicios ul li .marco { display: block; width: 100%; border-left: 1px solid #8c9293; margin-top: 2vw; padding: 1vw; position: relative; overflow: hidden;  min-height:32vw; }

#servicios ul li .marco1 {  -webkit-transform: translateY(100px); transform: translateY(100px); opacity: 0; /*transition: .6s .5s;*/ transition: opacity .5s ease, transform .5s ease;  }
#servicios ul li .marco2 {  -webkit-transform: translateY(100px); transform: translateY(100px); opacity: 0; /*transition: .6s .7s;*/ transition: opacity .5s ease, transform .7s ease;  }
#servicios ul li .marco3 { -webkit-transform: translateY(100px); transform: translateY(100px); opacity: 0; /*transition: .6s .9s;*/ transition: opacity .5s ease, transform .9s ease;  }
#servicios ul li .marco4 {  -webkit-transform: translateY(100px); transform: translateY(100px); opacity: 0; /*transition: .6s 1.1s;*/ transition: opacity .5s ease, transform 1.1s ease;  }

#servicios ul li .marco1.visible { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#servicios ul li .marco2.visible { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#servicios ul li .marco3.visible { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#servicios ul li .marco4.visible { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }



#servicios ul li:last-child .marco { border-right: 1px solid #8c9293;  }
#servicios ul li .marco .icono { display:block; width:5.95vw;  }
#servicios ul li .marco .icono img { display:block; width:100%; height:auto; }
#servicios ul li .marco .numero { display: block; color: #d27152; font-weight: 600; font-size: 1.111vw; line-height: 1.33vw; margin-top: 1vw; }
#servicios ul li .marco h4 { display:block; color:#000408; font-weight:900; font-size:2.22vw; line-height:2.44vw; margin-top:1vw; min-height:4.9vw; }
#servicios ul li .marco .linea1 { display: table; position: relative; overflow: hidden; width: 3.5vw; background: #8c9293; height: 2px; margin-top: 1vw; }
#servicios ul li .marco p { display: block; color: #8c9293; font-size: 1.33vw; line-height: 1.55vw; font-weight: 500; margin-top: 2vw; width: 90%; }

#servicios ul li .marco .vermas { display: table; background: #bc7155; color: #ffff; font-weight: 700; font-size: 1vw; line-height: 1.3vw; border-radius: 60px; padding: .5vw 1vw; cursor: pointer; margin-top: 2vw; cursor: pointer; border: 1px solid #bc7155; position: absolute; bottom: 1vw; left: 1vw; }
#servicios ul li .marco .vermas:hover { background:#fff; color:#bc7155;}

#diferencia { display: block; position: relative; overflow: hidden; background: #000508; padding: 12.77vw 7.380952381vw; }

#diferencia h2 { display: block; color: #d27153; font-weight: 700; text-transform: uppercase; font-size: 2.666vw; line-height: 2.888vw;-webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#diferencia.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#diferencia h4 { display: block; color: #bc7155; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; font-size: 1.11vw; line-height: 1.33vw; margin-top:12vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .7s; }
#diferencia.muestra h4 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#diferencia h3 { display: block; color: #ffffff; font-weight: 300; font-size: 3.33vw; line-height: 3.66vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .9s; }
#diferencia.muestra h3 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#diferencia h3 span { display:block; font-weight:800; font-size:2.66vw; line-height:2.88vw; }
#diferencia p { display: block; color: #8c9293; font-weight: 500; font-size: 1.33vw; line-height: 1.88vw;margin-top: 2vw; width: 60%; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s 1.1s; }
#diferencia.muestra p { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#diferencia ul { display:block; position:relative; overflow:hidden; width:100%; margin:5vw 0 0 3vw; }
#diferencia ul li { display:inline-block; float:left; position:relative; overflow:hidden; width:50%; color:#8c9293; font-weight:500; font-size:1.33vw; line-height: 1.66vw; padding:2vw 1vw 2vw 6vw; border:solid #092023; border-width:1px 1px 1px 1px; min-height:7vw; }
#diferencia ul li.esp { border-width:1px 1px 1px 0;  }

#diferencia .ese { display: block; position: absolute; top: 8.51vw; left: 0; width: 128%; height: auto; }
#diferencia .ce { display: block; position: absolute; width: 11.9vw; height: auto; transform: rotate(180deg); left: -5vw; top: 45vw; }
#diferencia .cuadrado { display: block; position: absolute; width: 6vw; height: 3.3vw; background: #fff; border-radius: 30px; left: 3vw; top: 51.9vw; }


#casos { display: block; position: relative; overflow: hidden; padding: 4vw 7.380952381vw 4vw 7.380952381vw; }
#casos h3 { display: block; color: #d27152; font-size: 1.111vw; line-height: 1.33vw; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#casos.muestra h3 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#casos h2 { display: block; color: #000d10; font-size: 5vw; line-height: 5.5vw; font-weight: 900; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .7s; }
#casos.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#casos ul { display: block; position: relative; overflow: hidden; width: 100%; margin-top: 3vw; }
#casos ul li { display:inline-block; float:left; position:relative; overflow:hidden; width:49%; border-right:1.95vw solid #d27152; padding:2vw 4vw 2vw 4vw; vertical-align:top; min-height:26.5vw; background:#f6f4f2;  }
#casos ul li:nth-child(2), #casos ul li:nth-child(3) { border-color:#aa4829; background:#000508;}
#casos ul li .numero { display: block; color: #eae8e6; float: right; font-size: 8vw; line-height: 8vw; font-weight: 900; position: relative; overflow: hidden; }
#casos ul li:nth-child(2) .numero, #casos ul li:nth-child(3) .numero { color:#1a1a1a; }
#casos ul li:nth-child(2) h4, #casos ul li:nth-child(3) h4 { color:#fff; }



#casos ul li:nth-child(1)  { transition: .5s .9s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#casos.muestra ul li:nth-child(1)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#casos ul li:nth-child(2)  { transition: .5s 1.1s; -webkit-transform: translateX(500px); transform: translateX(500px); opacity: 0; }
#casos.muestra ul li:nth-child(2)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#casos ul li:nth-child(3)  { transition: .5s 1.3s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#casos.muestra ul li:nth-child(3)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#casos ul li:nth-child(4)  { transition: .5s 1.5s; -webkit-transform: translateX(500px); transform: translateX(500px); opacity: 0; }
#casos.muestra ul li:nth-child(4)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }


#casos ul li h5 { display: block; position:relative; overflow:hidden; width:100%; color: #d27152; font-size: 1.11vw; line-height: 1.33vw; text-transform: uppercase; letter-spacing: 1px; }
#casos ul li h4 { display: block; color: #000d10; font-size: 2vw; line-height: 2.2vw; font-weight: 900; }
#casos ul li p { display: block; color: #8c9293; font-size: 1.33vw; line-height: 1.66vw; font-weight: 400; margin-top: 1vw; }

#clientes { display:block; position:relative; overflow:hidden; width:100%; height:54vw; background:#595959; }
#clientes .izq { display:inline-block; float:left; position:relative; overflow:hidden; width:38.5965vw; padding:7.380952381vw;}
#clientes .izq h3 { display: block; color: #d27152; font-size: 1.111vw; line-height: 1.333vw; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;-webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#clientes.muestra h3 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#clientes .izq h2 { display:block; color:#000d10; font-size:5vw; line-height:5.5vw; font-weight:900; margin-top:1vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .7s; }
#clientes.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#clientes .izq h4 { display: block; position:relative; overflow:hidden; color: #d27152; font-size: 1.111vw; line-height: 1.333vw; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin-top:2vw; border-bottom:1px solid #ffffff; padding-bottom:1vw; margin-bottom:1vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .9s; }
#clientes.muestra h4 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#clientes .izq ul { display:block; position:relative; overflow:hidden; width:100%; }
#clientes ul li { display:block; position:relative; overflow:hidden; width:100%; color:#fff; font-size:1vw; line-height:1.33vw; font-weight:400; }

#clientes ul li:nth-child(1)  { transition: .5s .9s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#clientes.muestra ul li:nth-child(1)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#clientes ul li:nth-child(2)  { transition: .5s 1s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#clientes.muestra ul li:nth-child(2)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#clientes ul li:nth-child(3)  { transition: .5s 1.1s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#clientes.muestra ul li:nth-child(3)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#clientes ul li:nth-child(4)  { transition: .5s 1.2s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#clientes.muestra ul li:nth-child(4)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#clientes ul li:nth-child(5)  { transition: .5s 1.3s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#clientes.muestra ul li:nth-child(5)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#clientes ul li:nth-child(6)  { transition: .5s 1.4s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#clientes.muestra ul li:nth-child(6)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }


#clientes .imagen { display:inline-block; float:right; position:relative; overflow:hidden; width:60.6845vw; }
#clientes .imagen ul { display:block; position:relative; overflow:hidden; width:100%; }
#clientes .imagen ul li { display:inline-block; float:left; position:relative; overflow:hidden; width:100%;  }
#clientes .imagen ul li img { display:block; width:100%; height:auto; }

#logos2 { display:block; position:relative; overflow:hidden; width:100%; margin:0 auto 0 auto; width:100%; background:#fff; /*padding:2vw 7.380952381vw;*/ padding:2vw 0; }


#logos2  ul { display:block; position:relative; overflow:hidden; width:100%; vertical-align: middle; height:11vw; }
#logos2  ul li { float: none; display: inline-block; position:relative; overflow:hidden;vertical-align: top;  margin-right:2%; position:relative; overflow:hidden; vertical-align: middle; width:11vw !important; margin-right:2vw; vertical-align: middle; }
#logos2  ul li:last-child { margin-right:0; }
#logos2  ul li img { display:block; width:100%; height:auto; }
#logos2  ul li img.chico { width:80% !important; margin:0 auto }
#logos2  ul li:nth-child(4) img { width:75% !important; margin:0 auto }

#hacemos { display:block; position:relative; overflow:hidden; width:100%; height:54vw; background-repeat: no-repeat; background-position:center; background-size:cover; text-align:center; padding-top:9.4vw; background-image:url('../img/foto-hacemos.jpg'); background-attachment: fixed; }
#hacemos .mascara { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 54vw; background: rgba(0, 0, 0, .7); }

#hacemos h2 { display:block; color:#fff; font-size:4vw; line-height:4.4vw; font-weight:900; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#hacemos.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#hacemos h2 span { display:block;  }
#hacemos p { display: block; color: #8c9293; font-size: 1.33vw; line-height: 1.66vw; font-weight: 500; width: 55%; text-align: center; margin: 2vw auto 0 auto; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .7s; }
#hacemos.muestra p { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }




#hacemos .solicitar { display: table; margin:0 auto; -webkit-transform: translateX(50px); transform: translateX(50px); opacity: 0; transition: .5s .9s; }
#hacemos.muestra .solicitar { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1;}
#hacemos .solicitar p { display:block; position:relative; overflow:hidden; background: #bc7155; color: #ffff; font-weight: 700; font-size: 1.5vw; line-height:1.5vw; border-radius: 60px; padding: 1.5vw 2vw; cursor:pointer;  cursor:pointer; border:1px solid #bc7155; width:100%; float:unset; transition:unset; }
#hacemos .solicitar p:hover { background:#fff; color:#bc7155;}


#hacemos .ce { display: block; position: absolute; width: 15.5vw; height: auto; transform: rotate(90deg); left: 0; right: 0; margin: 0 auto; bottom: -6vw; }
#hacemos .cuadrado { display: block; position: absolute; width: 3.5vw; height: 6.4vw; background: #fff; border-radius: 60px; left: 0; right: 0; bottom: 8.5vw; margin: 0 auto; }

#proceso { display:block; position:relative; overflow:hidden; width:100%; background:#fff;  }
#proceso .cuadro { display:block; position:relative; overflow:hidden; width:100%; padding:7.380952381vw; }
#proceso .cuadro h3 { display: block; color: #d27152; font-size: 1.111vw; line-height: 1.333vw; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#proceso.muestra h3 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#proceso .cuadro h2 { display:block; color:#000d10; font-size:5vw; line-height:5.5vw; font-weight:900; margin-top:1vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#proceso.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#proceso .cuadro h2 span { display:block;  }
#proceso .cuadro .linea { display: table; position: relative; overflow: hidden; width: 3.57vw; background: #8c9293; height: 2px; margin-top: 2vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .7s; }
#proceso.muestra .linea { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#proceso .cuadro ul { display:block; position:relative; overflow:hidden; width:100%; margin-top:2vw; }
#proceso .cuadro ul li { display:inline-block; float:left; width:25%; position:relative; overflow:hidden; }
#proceso .cuadro ul li .numero { display:block; position:relative; margin-top:3vw; border-top:1px solid #8c9293; z-index:1;  }
#proceso .cuadro ul li .numero .circulo { display: block; position: absolute; left: 0; top: -2vw; border: 1px solid #8c9293; border-radius: 50%; width: 4vw; height: 4vw; background: #fff; }
#proceso .cuadro ul li .numero span { display: block; position: absolute;  left: 1vw; top: -.7vw; color: #d26e4e; font-size: 1.33vw; line-height: 1.33vw;  text-align: center; font-weight: 700; letter-spacing: 1px; }
#proceso .cuadro ul li:first-child .numero span { letter-spacing:2px; }

/*#proceso .cuadro ul li .numero p { display:block; position:absolute; left:0; top:-3.8vw; color:#d26e4e; font-size:1.33vw; line-height:1.33vw; border:1px solid #8c9293; border-radius:50%; padding:1vw; font-weight:700; letter-spacing:1px; z-index:2;  background:#fff;} */
#proceso .cuadro ul li h4 { display: block; color: #000408; font-size: 2vw; line-height: 2.2vw; font-weight: 900; margin-top: 3vw; }
#proceso .cuadro ul li .linea1 { display: table; position: relative; overflow: hidden; width: 3.57vw; background: #d37253; height: 2px; margin-top: 1vw; }
#proceso .cuadro ul li p { display: block; color: #8c9293; font-size: 1.22vw; line-height: 1.66vw; font-weight: 500; margin-top: 2vw; padding: 0 2vw 0 0;}
#proceso .foto { display:block; position:relative; overflow:hidden; width:100%; background-repeat:no-repeat; background-position:center; background-size:cover;  height:23.8vw; background-image: url('../img/foto-metodo.jpg')}
#proceso .foto .iso { display: block; position: absolute; right: 11vw; top: 9vw; width: 9vw; height: auto; }

#proceso ul li:nth-child(1)  { transition:1s .9s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#proceso.muestra ul li:nth-child(1)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#proceso ul li:nth-child(2)  { transition: 1s 1s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#proceso.muestra ul li:nth-child(2)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#proceso ul li:nth-child(3)  { transition: 1s 1.1s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#proceso.muestra ul li:nth-child(3)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#proceso ul li:nth-child(4)  { transition: 1s 1.2s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#proceso.muestra ul li:nth-child(4)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#evacuacion { display:block; position:relative; overflow:hidden; width:100%;  background:#fff;}
#evacuacion .izq { display:inline-block; float:left; width:50%; position:relative; overflow:hidden; padding:5vw 7.380952381vw; }
#evacuacion .izq h3 { display: block; color: #d27152; font-size: 1.111vw; line-height: 1.333vw; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;  -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#evacuacion.muestra h3 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#evacuacion .izq h2 { display:block; color:#000d10; font-size:5vw; line-height:5.5vw; font-weight:900; margin-top:1vw;  -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .7s; }
#evacuacion.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#evacuacion .izq h2 span { display:block;  }
#evacuacion .izq p { display: block; color: #8c9293; font-size: 1.22vw; line-height: 1.66vw; font-weight: 500; margin-top: 2vw;   -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .9s; }
#evacuacion.muestra p { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#evacuacion .imagen { display:inline-block; float:right; width:50%; position:relative; overflow:hidden; }
#evacuacion .imagen img { display:block; width:100%; height:auto; }

#capacitaciones { display:block; position:relative; overflow:hidden; width:100%; height:54vw; background-repeat:no-repeat; background-position:center; background-size: cover;  background-attachment: fixed; padding:7.380952381vw; background-image: url('../img/capacitaciones.jpg'); }
#capacitaciones .ce { display: block; position: absolute; bottom: -23vw; width: 32vw; height:auto; transform: rotate(180deg); left: 7.380952381vw; }
#capacitaciones h3 { display:block; color:#fff; font-size: 1.111vw; line-height:1.333vw; text-transform:uppercase; letter-spacing:1px; font-weight:400; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#capacitaciones.muestra h3 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#capacitaciones h2 { display: block; color: #fff; font-size: 8vw; line-height: 8.3vw; font-weight: 800; margin-top:2vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .7s; }
#capacitaciones.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#capacitaciones p { display:block; color:#fff; font-size:1.33vw; line-height:1.66vw; font-weight:500;margin-top:2vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .9s; }
#capacitaciones.muestra p { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#capacitaciones ul { display: block; position: absolute; width: 40%; left: 55vw; top: 31vw; }
#capacitaciones ul li { display:block; position:relative; overflow:hidden; width:100%; color:#fff; font-size:1.66vw; line-height:1.88vw; text-transform:uppercase; }

#capacitaciones ul li:nth-child(1)  { transition:1s .9s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#capacitaciones.muestra ul li:nth-child(1)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#capacitaciones ul li:nth-child(2)  { transition: 1s 1s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#capacitaciones.muestra ul li:nth-child(2)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#capacitaciones ul li:nth-child(3)  { transition: 1s 1.1s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#capacitaciones.muestra ul li:nth-child(3)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#capacitaciones ul li:nth-child(4)  { transition: 1s 1.2s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#capacitaciones.muestra ul li:nth-child(4)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#capacitaciones ul li:nth-child(5)  { transition: 1s 1.3s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#capacitaciones.muestra ul li:nth-child(5)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#capacitaciones ul li:nth-child(6)  { transition: 1s 1.4s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#capacitaciones.muestra ul li:nth-child(6)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#capacitaciones ul li:nth-child(7)  { transition: 1s 1.5s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#capacitaciones.muestra ul li:nth-child(7)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#capacitaciones ul li:nth-child(8)  { transition: 1s 1.6s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#capacitaciones.muestra ul li:nth-child(8)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#capacitaciones ul li:nth-child(9)  { transition: 1s 1.7s; -webkit-transform: translateX(-500px); transform: translateX(-500px); opacity: 0; }
#capacitaciones.muestra ul li:nth-child(9)  { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

#preguntas { display:block; position:relative; overflow:hidden; width:100%; background:#000000; padding:7.380952381vw; }
#preguntas .izq { display:inline-block; float:left; position:relative; overflow:hidden; width:50%; }
#preguntas .der { display:inline-block; float:left; position:relative; overflow:hidden; width:50%; }

#preguntas .izq h3 { display: block; color: #d27152; font-size: 1.111vw; line-height: 1.333vw; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#preguntas.muestra h3 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#preguntas .izq h2 { display:block; color:#c02c2c; font-size:5vw; line-height:5.5vw; font-weight:900; margin-top:1vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .7s; }
#preguntas.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#preguntas .izq h2 span { display:block;  }
#preguntas .der ul { display:block; position:relative; overflow;hidden; width:100%; padding:0 0 0 3.5vw; }
#preguntas .der ul li { display:block; position:relative; overflow:hidden; width:100%; padding:0 1vw 1vw .1vw; border-bottom:1px solid #3a3c3d; margin-bottom:1vw;}
#preguntas .der ul li::after{content:""; width:20px; height:20px; position:absolute; right:1vw; top:0; background:url("../img/flechita-gris-arriba.svg") center center no-repeat; background-size:contain; }
#preguntas .der ul li h3 { display: block; color: #b8b8b8; font-size: .888vw; line-height: 1vw; font-weight: 300; cursor:pointer;}
#preguntas .der ul li.active h3, #preguntas .der ul li:hover h3 { color:#d27152; }
#preguntas .der ul li .respuesta { display:none; padding-top: 1vw; position: relative; overflow: hidden; width: 96%; padding: 1vw 1vw 1vw 1vw; border: solid #3a3c3d; border-width: 1px 1px 1px 1px; margin-top: .5vw; color:#fff; }

#preguntas .izq .comunicate { display:block; margin-top:10vw;  -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s 1.1s; }
#preguntas.muestra .izq .comunicate { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#preguntas .izq .comunicate .whatsapp { display:table; color:#fff; font-size:3vw; line-height:3.3vw; font-weight:800; margin-top:.5vw; }
#preguntas .izq .comunicate .whatsapp:hover { color:#b8b8b8; }

#alcance { display:block; position:relative; overflow:hidden; width:100%; background:#fefefe;  }
#alcance .izq { display:inline-block; float:left; position:relative; overflow:hidden; width:38.5965vw; padding:7.380952381vw; padding:7.380952381vw 1vw 7.380952381vw 7.380952381vw;}
#alcance .izq h3 { display: block; color: #d27152; font-size: 1.111vw; line-height: 1.333vw; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#alcance.muestra h3 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#alcance .izq h2 { display:block; color:#c02c2c; font-size:5vw; line-height:5.5vw; font-weight:900; margin-top:1vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .7s; }
#alcance.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#alcance .izq h2 span { display:block;  }
#alcance .izq p { display: block; color: #8c9293; font-size: 1vw; line-height: 1.3vw; margin-top: 8vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .9s; }
#alcance.muestra p { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#alcance .izq p strong { font-weight:800; }
#alcance .izq p span { color:#c02c2c; font-weight:500; }
#alcance .izq p.otro { font-weight: 300; margin-top: 2vw; }
#alcance .izq p.otro span { color:#8c9293; }
#alcance .imagen { display:inline-block; float:right; position:relative; overflow:hidden; width:60.6845vw; }
#alcance .imagen img { display:block; width:100%; height:auto; margin-top:4vw; }

#contacto { display:block; position:relative; overflow:hidden; width:100%; background:#fafaf9; padding:7.380952381vw; }
#contacto .izq { display:inline-block; float:left; position:relative; overflow:hidden; width:50%; }
#contacto .izq h3 { display: block; color: #d27152; font-size: 1.111vw; line-height: 1.333vw; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .5s; }
#contacto.muestra h3 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#contacto .izq h2 { display:block; color:#000508; font-size:3.33vw; line-height:3.55vw; font-weight:900; margin-top:1vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .7s; }
#contacto.muestra h2 { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#contacto .izq h2 span { display:block;  }
#contacto .izq p { display: block; color: #8c9293; font-size: 1.22vw; line-height: 1.66vw; font-weight: 500; margin-top: 2vw; width:79%; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s .9s; }
#contacto.muestra p { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
#contacto .izq .email { display: block; position: relative; overflow: hidden; margin-top: 7vw;  -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s 1.1s; }
#contacto.muestra .izq .email { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#contacto .izq .email p { display:inline-block; position:relative; overflow:hidden; color: #5b5b5b; font-size: 1.111vw; line-height: 1.333vw; font-weight: 600; margin-top:0; width:auto;}
#contacto .izq .email p.fijo { width:7vw; }
#contacto .izq img { display: inline-block; width: 1.6vw; height: auto; margin: 0 1vw; }
#contacto .izq .whatsapp { display: block; position: relative; overflow: hidden; margin-top:1vw; -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; transition: .5s 1.3s; }
#contacto.muestra .izq .whatsapp { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

#contacto .izq .whatsapp p { display:inline-block; position:relative; overflow:hidden; color: #5b5b5b; font-size: 1.111vw; line-height: 1.333vw; font-weight: 600; margin-top:0; width:auto;}
#contacto .izq .whatsapp p.fijo { width:7vw; }
#contacto .izq .whatsapp:hover p, #contacto .izq .email:hover p { color:#d27152; }
#contacto form { display:inline-block; float:left; position:relative; overflow:hidden; width:50%; }
#contacto form ol { display:block; position:relative; overflow:hidden; width:88%; }
#contacto form ol li { display:block; position:relative; overflow:hidden; width:100%; margin-bottom:1vw;}
#contacto form ol li label { display: block; color: #8c9293; text-transform: uppercase; font-size: 1vw; line-height: 1.3vw; font-weight: 400; }
#contacto form ol li input {     display: block; position: relative; overflow: hidden; width: 100%; padding: .5vw; border: 1px solid #8c9293; border-radius: 15px; color: #8c9293; font-size: 1vw; line-height: 1.3vw; font-weight: 400; margin-top: .5vw; }
#contacto form ol li textarea {     display: block; position: relative; overflow: hidden; width: 100%; padding: .5vw; border: 1px solid #8c9293; border-radius: 15px; color: #8c9293; font-size: 1vw; line-height: 1.3vw; font-weight: 400; margin-top: .5vw; height:5vw;}
#contacto form button { display: inline-block; float:left; background: #bc7155; color: #ffff; font-weight: 700; font-size: 1.5vw; line-height: 1.5vw; border-radius: 60px; padding: 1vw 2.5vw; cursor: pointer; margin: 0 0 0 2vw; cursor: pointer; border: 1px solid #bc7155; text-align: center; }
#contacto form button:hover { background:#fff; color:#bc7155;}

#contacto form .whatsapp { display: inline-block; float:left; background: #25d366; color: #ffff; font-weight: 700; font-size: 1.5vw; line-height: 1.5vw; border-radius: 60px; padding: 1vw 2.5vw; cursor: pointer; margin: 0 0 0 2vw; cursor: pointer; border: 1px solid #25d366; text-align: center; }
#contacto form .whatsapp:hover { background:#fff; color:#25d366;}

footer { display:block; position:relative; overflow:hidden; width:100%; background:#000407; padding:2vw 7.380952381vw; }
footer h1 { display: inline-block; float: left; width: 25.8vw; position: relative; overflow: hidden; margin-top:2vw; }
footer h1 img { display:block; width:100%; height:auto; }
footer ul { display: inline-block; float: right; position: relative; overflow: hidden; margin-top: 4vw; }
footer ul li { display:inline-block; float:left; position:relative; overflow:hidden; color:#fafaf9; font-size:1.11vw; line-height:1.33vw; font-weight:500; margin-right:2vw; cursor:pointer;}
footer ul li .osmosis { margin-right:0; font-weight:400; font-size:.88vw; }
footer ul li:hover { color:#bc7155; }
footer .osmosisMobile { display:none; }


/*--------- OVERLAYS ---------- */

.overlayServicios {width: 90%;  color: #fff; background-color: #c02c2c; font-size: 0.94395vw; line-height: 1.17994vw; padding: 1.76991vw; overflow: hidden; transition: all .5s ease-in; transform-style: preserve-3d; transform: translateZ(600px) rotateX(20deg); }


.overlayServicios ol.pop  { display:block; position:relative; overflow:hidden; width:100%; margin-top:2vw;}
.overlayServicios  ol.pop li { display:inline-block; float:left; position:relative; overflow:hidden;  width:100%; }
.overlayServicios ol.pop li .der { display: inline-block; float: right; position: relative; overflow: hidden; width: 80%; border-left: 1px solid #fff; padding: 2vw 0 2vw 2vw; min-height:20vw;}
.overlayServicios ol.pop li .der .textos { display:block; position:relative; overflow:hidden; width:90%; }
.overlayServicios ol.pop li .der .textos p { display:block; margin:0 0 1vw 0; }
.overlayServicios ol.pop li .der .textos h2 { display:block; position:relative; overflow:hidden;  margin: 0 0 1vw 0; padding:0; font-size: 1.3vw; line-height: 1.6vw; font-weight: 600; }
.overlayServicios ol.pop li .der .textos h3 { display:block; position:relative; overflow:hidden;  margin: 0 0 1vw 0; padding:0; font-size: 1vw; line-height: 1.3vw; font-weight: 400; }

.overlayServicios ol.pop li .der .textos ul { display: block; width: 100%; position: relative; overflow: hidden; margin-bottom: 1vw; padding-left:1vw;}
.overlayServicios ol.pop li .der .textos ul li { display: block; position: relative; overflow: hidden; width: 100%; height: auto !important; color: #fff; font-size: .88vw; line-height: 1.1vw; font-weight: 400; }
.overlayServicios ol.pop li .der .textos ol { display: block; width: 100%; position: relative; overflow: hidden; margin-bottom: 1vw; padding-left:1vw;}
.overlayServicios ol.pop li .der .textos ol li { display: block; position: relative; overflow: hidden; width: 100%; height: auto !important; color: #fff; font-size: .88vw; line-height: 1.1vw; font-weight: 400; padding-left:2vw; }
.overlayServicios ol.pop li .der .textos ol li::before { content: "\f111"; font-family: FontAwesome; position: absolute; top: .1vw; left: 0; font-size: .6vw; z-index: 1; padding-left:1vw;  }

.overlayServicios ol.pop li .izq { display: inline-block; float: left; position: relative; overflow: hidden; width: 20%; padding: 3vw 0 4vw 0; min-height: 20vw; }
.overlayServicios ol.pop li .izq h2 {     display: block; color: #fff; font-size: 2.22vw; line-height: 2.55vw; font-weight: 800; }
.overlayServicios ol.pop li .izq .icono { display:block; width:6vw; margin-bottom:1vw; }
.overlayServicios ol.pop li .izq .icono img { display:block; width:100%; height:auto;  }

.overlayServicios .izquierda { display: block; position: absolute; top: .5vw; right: 6.5vw; width: 2.5vw; height: 2.5vw; cursor: pointer; z-index: 9; }
.overlayServicios .derecha { display: block; position: absolute; top: .5vw; right: 3.5vw; width: 2.5vw; height: 2.5vw;; cursor: pointer; z-index: 9; }

.overlayServicios .cerrarServicios { display: block; position: absolute; top: .5vw; right: .5vw; width: 2.5vw; height: auto; cursor: pointer; z-index: 9; }
.overlayServicios .izquierda img, .overlayServicios .derecha img, .overlayServicios .cerrarServicios img { display:block; width:100%; height:auto; }



@media screen and (max-width: 800px) {

  header { height: 60px; padding: 0 20px;}
  header h1 { width:200px; margin:12px 0 0 0; }

  
  #click-menu {  display: block; position: relative; width: 80px; height: 41px; cursor: pointer; z-index: 99; transition: all 1s; position: absolute; right: 0; top: 10px; cursor: pointer; z-index: 9; transition: all 1s; background: #000; border-radius: 60px 0 0 60px;}
  #click-menu span { position: absolute; left: 0; right: 0; top: 10px; margin: 0 auto; display: block; width: 30%; height: 3px; background-color: #fff;
        transition: all .3s;}
  #click-menu span:nth-child(2) {top: 20px; }
  #click-menu span:nth-child(3) {top: 30px; }
  #click-menu.active span:nth-child(1) {top: 20px; --webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); }
  #click-menu.active span:nth-child(2) {opacity: 0; top: -7.8125vw; }
  #click-menu.active span:nth-child(3) {top: 20px; --webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); }

  .whatsappFijo img { width:7vw; }
  .whatsappFijo { padding:10px 15px; top:20vw; }

  ul.menuMovil { display: block; width: 100%; background: #0e0f0d; padding: 50px; position: fixed; z-index: 995; top: 60px; opacity: 0; height:0; transition:all .5s;--webkit-transform: translate3d(0, -500px, 0); transform: translate3d(0, -500px, 0); font-family: "Encode Sans Condensed", sans-serif;}
  ul.menuMovil.abierto { opacity:1; height:auto;--webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  .menuMovil li { display:block; position:relative; width:100%; display:block;font-size:20px; line-height: 22px; font-weight: 700; text-transform: uppercase; margin-bottom:10px; padding-bottom:10px; color:#fff; border-bottom:1px solid #fff; }
  .menuMovil li:last-child { padding-bottom:0; margin-bottom: 0; border:0; }
  .menuMovil li a{ display:block; position:relative; overflow:hidden; width:100%; color:#fff; }
  .menuMovil li a:hover { color:#fff; }
  .menuMovil li .sub { display:none; width:100%; margin:10px auto; padding:10px 0;}
  .menuMovil li .sub li { display:block; position:relative; overflow:hidden; width:100%; color:#fff; font-size:18px; line-height: 20px; margin-bottom:10px;  font-weight: 400; text-transform: uppercase;padding-bottom: 10px; border-bottom: 1px solid #fff; padding-left:20px;}
  .menuMovil li .sub li:last-child { margin-bottom:0; padding-bottom:0; border:0; }

  #slide { height:100vh; padding:200px 25px 0 25px; background-attachment: unset; background-image:url('../img/foto-slide-mobile.jpg');}
  #slide h3  { margin-bottom:5px; }
  #slide .frase { margin-top:20px; }
  #slide .frase p { display:block; width:100%; float:unset; }
  #slide .frase .solicitar  { margin-left: 0; margin-top: 40px; }
  #slide.muestra .frase .verservicios p { margin-left:10px; margin-top:40px; }

  header .der, header ul.menu, #diferencia .ese, #proceso .foto { display:none; }

  #slide h3, #servicios h3, #diferencia h4, #casos h3, #clientes .izq h3, #clientes .izq h4, #hacemos h3, #proceso .cuadro h3, #evacuacion .izq h3, #capacitaciones h3, #preguntas .izq h3, #alcance .izq h3,#contacto .izq h3 { font-size:12px; line-height:14px; }
  #slide h2, #servicios h2, #clientes .izq h2, #proceso .cuadro h2, #evacuacion .izq h2, #capacitaciones h2, #preguntas .izq h2, #alcance .izq h2, #contacto .izq h2  { font-size:44px; line-height:46px; }
  #slide p, #slide .frase p, #servicios p, #diferencia p, #diferencia h3, #diferencia h3 span, #casos p, #clientes .izq p, #hacemos p, #proceso .cuadro p, #evacuacion .izq p, #capacitaciones p, #preguntas .izq p, #alcance .izq p, #contacto .izq p { font-size:16px; line-height:18px; }
  #slide .frase .solicitar p, #slide .frase .verservicios p, #hacemos .solicitar p { font-size:13px; line-height:15px; padding:10px 20px; }

  #servicios, #diferencia, #casos, #proceso { padding:40px 25px; }


  #servicios ul li { width:50%; margin-bottom:20px; }

  #servicios ul li .marco { padding:10px; margin-top:20px; min-height:320px; }
  #servicios ul li .marco .icono { width:13vw;  }
  #servicios ul li .marco .numero { font-size:14px; line-height:16px; margin-top:10px; }
  #servicios ul li .marco h4 { font-size:16px; line-height:18px; margin-top:10px; }
  #servicios ul li .marco p { font-size:14px; line-height:16px; margin-top:20px; }
  #servicios ul li .marco .vermas { font-size: 14px; line-height: 16px; padding: 5px 10px; margin-top: unset; left: 10px; bottom: 10px; }

  #diferencia h2 { font-size:24px; line-height:26px; } 
  #diferencia h4 { margin-top:10px; }
  #diferencia p { margin-top:90px; width:100%; }
  #diferencia .ce { top:48vw;  }
  #diferencia .cuadrado { top:54.9vw; }
  #diferencia ul { margin:40px 0 0 0; }
  #diferencia ul li {display: block; float: unset; position: relative; overflow: hidden; width: 100%; color: #8c9293; font-weight: 500; font-size: 13px; line-height: 18px; padding: 20px; border: solid #092023; border-width: 1px 1px 1px 1px; min-height:auto;}
  #casos ul { margin-top:40px; }
  #casos ul li { display:block; float:unset; width:100%; padding:20px; border-bottom:1px solid #1d2225 !important; }
  #casos ul li .numero { font-size:18px; line-height:18px; }
  #casos ul li h5 { font-size:11px; line-height:15px; }
  #casos ul li h4 { font-size:15px; line-height:18px; }
  #casos ul li p { font-size:13px; line-height:16px; }
  #casos h2 { font-size:34px; line-height:40px; }
  #clientes { height:auto; }
  #clientes .izq {display: block; float: unset; position: relative; overflow: hidden; width: 100%; height: auto; padding: 40px 25px; }
  #clientes ul li { font-size:14px; line-height:18px; }
  #clientes .izq h4 { margin-top:40px; margin-bottom:10px; padding-bottom:10px; }
  #clientes .imagen {display: block; float: unset; position: relative; overflow: hidden; width: 100%; }

  #logos2 { padding:20px 0 20px 20px;  }
  #logos2 ul { height: auto !important; }
  #logos2 ul li { margin: 0 20px 20px 0; width: 126px !important; }


  #hacemos {display: block; position: relative; overflow: hidden; width: 100%; height: 70vh; background-repeat: no-repeat; background-position: center; background-size: cover; text-align: center; padding-top: 40px; padding-bottom: 80px; padding: 40px 25px 80px 25px; background-attachment: unset; background-image:url('../img/foto-hacemos-mobile.jpg');}
  #hacemos .mascara { height:70vh; }
  #hacemos h2 { font-size:25px; line-height:28px; }
  #hacemos p { width:100%; margin:40px 0; }
  #proceso .cuadro { padding:0; }
  #proceso .cuadro h2 { font-size:35px; line-height:38px; }
  #proceso .cuadro ul { margin-top:40px; }
  #proceso .cuadro ul li { display:block; float:unset;; width:100%; margin-bottom: 20px; }
  #proceso .cuadro ul li .numero { margin-top:40px; }
  #proceso .cuadro ul li .numero .circulo {display: block; position: absolute; left: 0; top: -22px; border: 1px solid #000; border-radius: 50%; width: 40px; height: 40px; background: #fff; }
  #proceso .cuadro ul li .numero span {left: 7px; top: -10px;  font-size: 18px; line-height: 18px; }
  /*#proceso .cuadro ul li .numero p {display: block; position: absolute; left: 0; top: -30px; color: #d26e4e; font-size: 16px; line-height: 18px; border: 1px solid #8c9293; border-radius: 50%; padding: 10px; font-weight: 700; letter-spacing: 1px; z-index: 2; background: #fff; }*/
  #proceso .cuadro ul li h4 { font-size: 24px; line-height: 28px; margin-top: 30px; }
  #proceso .cuadro ul li p { font-size:16px; line-height:20px; }

  #evacuacion { height:auto; }
  #evacuacion .imagen { display:block; float:unset; width:100%; }
  #evacuacion .izq { display:block; float:unset; width:100%; padding:40px 25px; }

  #capacitaciones { height:120vw; padding:40px 25px;background-attachment: unset; }
  #capacitaciones ul {display: block; position: relative; width: 100%; left: 0; top: 0; margin-top: 20px; }
  #capacitaciones ul li { font-size:16px; line-height:20px; }

  #preguntas { padding:40px 20px; }
  #preguntas .izq { display:block; float:unset; width:100%; }
  #preguntas .der { display:block; float:unset; width:100%; margin-top:40px; }
  #preguntas .der ul { padding:0; }
  #preguntas .der ul li { padding:0 10px 10px 10px; margin-bottom:10px; }
  #preguntas .der ul li h3 { font-size:16px; line-height:20px; padding-right:15px;}
  #preguntas .der ul li .respuesta { font-size:14px; line-height:18px;  padding:10px; margin-top:10px;}

  #alcance { }
  #alcance .imagen { display:block; float:unset; width: 90%; margin: 0 auto; }
  #alcance .izq { display:block; float:unset; width:100%; padding:40px 20px; height:auto; }
  #alcance .izq p { margin-top:40px; }
  #contacto { padding:40px 20px; }
  #contacto .izq { display:block; float:unset; width:100% }
  #contacto .izq .email { margin-top:30px; }
  #contacto .izq .email p.fijo { font-size: 14px; line-height: 16px; width: 80px; }
  #contacto .izq img {display: inline-block; width: 5vw; height: auto; margin: 0 10px; }
  #contacto .izq .email p { font-size:14px; line-height:16px; }


  #contacto .izq .whatsapp p.fijo { font-size: 14px; line-height: 16px; width: 80px; }
  #contacto .izq .whatsapp p { font-size:14px; line-height:16px; }
  #contacto form { display:block; float:unset; width:100%; margin-top:40px; }
  #contacto form ol { width:100%; padding:0; margin:0; }
  #contacto form ol li { margin-bottom:10px; }
  #contacto form ol li label { font-size:14px; line-height:16px; padding-left:10px;}
  #contacto form ol li input {display: block; position: relative; overflow: hidden; width: 100%; padding: 10px; border: 1px solid #8c9293; border-radius: 15px; color: #8c9293; font-size: 14px; line-height: 16px; font-weight: 400; margin-top: 5px; }
  #contacto form ol li textarea {display: block; position: relative; overflow: hidden; width: 100%; padding: 10px; border: 1px solid #8c9293; border-radius: 15px; color: #8c9293; font-size: 14px; line-height: 16px; font-weight: 400; margin-top: 5px; height:100px; }
  #contacto form button {display: inline-block; float: left; background: #bc7155; color: #ffff; font-weight: 700; font-size: 14px; line-height: 16px; border-radius: 60px; padding: 10px 20px; cursor: pointer; margin: 0; cursor: pointer; border: 1px solid #bc7155; text-align: center; }
  #contacto form .whatsapp {display: inline-block; float: right; background: #25d366; color: #ffff; font-weight: 700; font-size: 14px; line-height: 16px; border-radius: 60px; padding: 10px 20px; cursor: pointer; margin: 0; cursor: pointer; border: 1px solid #25d366; text-align: center; }

  footer { padding:10px 25px 20px 25px;  }
  footer ul { display:none; }
  footer h1 { width:160px; margin-top:17px;}
  footer .osmosisMobile { display:inline-block; float:right; position:relative; overflow:hidden; font-size:12px; line-height:14px; color:#ffff; font-weight:500; margin-top:24px;}

  .overlay { width:80vw; padding:0px; font-size:15px; line-height: 17px; }
  .overlayServicios ol.pop { margin-top:20px; }
  .overlayServicios ol.pop li .izq {display: block; float: unset; position: relative; overflow: hidden; width: 100%; padding: 0; text-align: center;  }
  .overlayServicios ol.pop li .izq .icono {display: block; width: 50px; margin: 0 auto 10px auto; }
  .overlayServicios ol.pop li .izq h2 { font-size:25px; line-height:30px; }
  .overlayServicios ol.pop li .der {display: block; float: unset; position: relative; overflow: hidden; width: 100%; border-left: 0; padding: 30px 0 0 0; }
  .overlayServicios ol.pop li .der .textos { width:90%; }
  .overlayServicios ol.pop li .der .textos ul, .overlayServicios ol.pop li .der .textos ol {     display: block; width: 100%; position: relative; overflow: hidden; margin-bottom: 10px; margin-bottom:10px; padding-left:20px; margin-right: 0; vertical-align: top; }
  .overlayServicios ol.pop li .der .textos ul li, .overlayServicios ol.pop li .der .textos ol li { font-size:13px; line-height:17px; }
  .overlayServicios ol.pop li .der .textos ol li::before {content: "\f111"; font-family: FontAwesome; position: absolute; top: 1px; left: 0; font-size: 10px; z-index: 1; padding-left: 0; }
  .overlayServicios .cerrarServicios {display: block; position: absolute; top: 5px; right: 5px; width: 30px; height: auto; cursor: pointer; z-index: 9; }
  .overlayServicios .derecha {display: block; position: absolute; top: 5px; right: 40px; width: 30px; height: 30px; cursor: pointer; z-index: 9; }
  .overlayServicios .izquierda {display: block; position: absolute; top: 5px; right: 75px; width: 30px; height: 30px; cursor: pointer; z-index: 9; }
  .overlayServicios ol.pop li .der .textos h2 {display: block; position: relative; overflow: hidden; margin: 0 0 10px 0; padding: 0; font-size: 18px; line-height: 20px; font-weight: 600; }
  .overlayServicios ol.pop li .der .textos h3 {display: block; position: relative; overflow: hidden; margin: 0 0 10px 0; padding: 0; font-size: 16px; line-height: 18px; font-weight: 400; }


  #slide .mascara { height:100vh; }

}