body * {
  margin: 0;
  padding: 0;
  list-style: none;
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
  outline: 0; }

body {
  width: 100%;
  height: 100%;
  list-style: none;
  font-family: 'Open Sans', sans-serif; }

#wrapper {
  width: 100%;
  overflow: hidden;
  background-color: #f0f3f5; }

.img_blur {
  background-repeat: no-repeat;
  background-position: bottom right;
  background-size: 564px 822px;
  background-attachment: fixed;
  background-image: url(../img/bitmap.png);
  -webkit-filter: blur(25px);
  filter: blur(25px);
  -moz-filter: blur(25px);
  -o-filter: blur(25px);
  height: 100vh;
  position: fixed;
  width: 100%;
  opacity: 0.2; }

.container {
  text-align: left;
  max-width: 1170px;
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box; }

h1 {
  font-family: 'Avalon', sans-serif;
  font-size: 21px;
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #855de3; }

h2 {
  font-family: 'Avalon';
  font-size: 70px;
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.11;
  letter-spacing: -0.5px;
  color: #855de3; }

p {
  font-family: 'Open Sans', sans-serif;
  font-style: italic;
  color: #919da5; }

/*********** 
   HEADER
************/
#wrapper_header {
  background-color: transparent;
  position: absolute;
  top: 0;
  margin: 0 auto;
  width: 100%;
  display: block; }
  #wrapper_header #header {
    margin: 0 auto;
    width: 100%;
    display: block;
    height: 70px; }
    #wrapper_header #header .container {
      height: 100%; }
      #wrapper_header #header .container:after {
        content: "";
        display: block;
        clear: both; }
      #wrapper_header #header .container nav {
        display: block;
        float: right;
        margin-top: 25px; }
        #wrapper_header #header .container nav ul {
          display: inline-block; }
          #wrapper_header #header .container nav ul li {
            display: inline-block;
            height: 19px;
            width: 28px; }
            #wrapper_header #header .container nav ul li a {
              display: block;
              width: auto;
              height: 100%;
              vertical-align: middle;
              margin: auto;
              outline: 0;
              -webkit-transition: 0.3s ease;
              -moz-transition: 0.3s ease;
              -ms-transition: 0.3s ease;
              -o-transition: 0.3s ease;
              transition: 0.3s ease;
              transition-property: background-image; }
              #wrapper_header #header .container nav ul li a.btn {
                width: 19px;
                background: url(../img/icon-grid-grey.svg) no-repeat left center; }
                #wrapper_header #header .container nav ul li a.btn:hover {
                  background-image: url(../img/icon-grid.svg);
                  -webkit-transition: 0.3s ease;
                  -moz-transition: 0.3s ease;
                  -ms-transition: 0.3s ease;
                  -o-transition: 0.3s ease;
                  transition: 0.3s ease;
                  transition-property: background-image; }
              #wrapper_header #header .container nav ul li a.mail {
                background: url(../img/icon-mail.svg) no-repeat left center; }
                #wrapper_header #header .container nav ul li a.mail:hover {
                  background-image: url(../img/icon_mail_color.svg);
                  -webkit-transition: 0.3s ease;
                  -moz-transition: 0.3s ease;
                  -ms-transition: 0.3s ease;
                  -o-transition: 0.3s ease;
                  transition: 0.3s ease;
                  transition-property: background-image; }
          #wrapper_header #header .container nav ul li + li {
            margin-left: 16px; }
  #wrapper_header .progressContainer {
    left: 0;
    width: 100%;
    height: 3px;
    margin-bottom: 0px;
    position: fixed;
    top: 0;
    overflow: hidden;
    background-color: transparent;
    content: "";
    display: table;
    table-layout: fixed;
    z-index: 99999; }
    #wrapper_header .progressContainer .progressBar {
      width: 0%;
      float: left;
      height: 100%;
      z-index: 99999;
      max-width: 100%;
      background-color: #855de3;
      -webkit-transition: width .6s ease;
      -o-transition: width .6s ease;
      transition: width .6s ease; }

/***************
  END HEADER
****************/
/***************
       HI
****************/
.hi {
  width: 100%;
  display: block; }
  .hi .container {
    padding: 183px 0 148px;
    margin: 0 auto;
    width: 100%;
    display: block; }
    .hi .container h1 {
      padding-bottom: 25px; }
      .hi .container h1 p {
        font-size: 16px;
        font-weight: normal;
        font-style: italic;
        line-height: normal;
        letter-spacing: normal;
        display: inline-block; }

/***************
     END HI
****************/
/***************
      GRID
****************/
.grid-section {
  width: 100%;
  display: block; }
  .grid-section .container {
    margin: 0 auto;
    width: 100%;
    display: block;
    padding-bottom: 115px; }
    .grid-section .container .grid {
      display: block; }
      .grid-section .container .grid .block {
        position: relative;
        display: inline-block;
        max-width: 370px;
        max-height: 599px;
        width: 31.62%;
        vertical-align: top;
        margin-bottom: 61px;
        overflow: hidden;
        outline: 0;
        -o-border-radius: 8px;
        -ms-border-radius: 8px;
        -moz-border-radius: 8px;
        -webkit-border-radius: 8px;
        border-radius: 8px;
        -webkit-transition: 0.3s ease;
        -moz-transition: 0.3s ease;
        -ms-transition: 0.3s ease;
        -o-transition: 0.3s ease;
        transition: 0.3s ease;
        box-shadow: 0 2px 3px 0 rgba(25, 34, 40, 0.05);
        -moz-box-shadow: 0 2px 3px 0 rgba(25, 34, 40, 0.05);
        -webkit-box-shadow: 0 2px 3px 0 rgba(25, 34, 40, 0.05);
        transition-property: transform, box-shadow; }
        .grid-section .container .grid .block:hover {
          box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.2);
          -moz-box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.2);
          -webkit-box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.2);
          -ms-transform: translate(0px, 10px);
          /* IE 9 */
          -webkit-transform: translate(0px, 10px);
          /* Safari */
          transform: translate(0px, -10px);
          -webkit-transition: 0.3s ease;
          -moz-transition: 0.3s ease;
          -ms-transition: 0.3s ease;
          -o-transition: 0.3s ease;
          transition: 0.3s ease;
          transition-property: transform, box-shadow;
          transition-duration: 0.4s; }
        .grid-section .container .grid .block .img_content {
          display: block;
          object-fit: contain; }
          .grid-section .container .grid .block .img_content img {
            width: 100%;
            height: auto;
            margin: 0 auto;
            display: block;
            -o-border-radius: 8px;
            -ms-border-radius: 8px;
            -moz-border-radius: 8px;
            -webkit-border-radius: 8px;
            border-radius: 8px; }
        .grid-section .container .grid .block .footer_content {
          display: block;
          width: 100%;
          background-color: #ffffff;
          text-align: center;
          padding: 22px 0;
          position: absolute;
          bottom: 0;
          -o-border-bottom-left-radius: 8px;
          -ms-border-bottom-left-radius: 8px;
          -moz-border-bottom-left-radius: 8px;
          -webkit-border-bottom-left-radius: 8px;
          border-bottom-left-radius: 8px;
          -o-border-bottom-right-radius: 8px;
          -ms-border-bottom-right-radius: 8px;
          -moz-border-bottom-right-radius: 8px;
          -webkit-border-bottom-right-radius: 8px;
          border-bottom-right-radius: 8px; }
          .grid-section .container .grid .block .footer_content h4 {
            font-family: Avalon-Demi;
            font-size: 21px;
            font-weight: normal;
            font-style: normal;
            font-stretch: normal;
            line-height: 1.29;
            letter-spacing: normal;
            text-align: center;
            color: #46434e; }
          .grid-section .container .grid .block .footer_content a {
            border: 0;
            background: none;
            font-size: 15px;
            font-weight: normal;
            font-style: italic;
            font-stretch: normal;
            line-height: 1.8;
            letter-spacing: normal;
            text-align: center;
            color: #9aa3a9;
            z-index: 3;
            outline: 0; }
            .grid-section .container .grid .block .footer_content a:hover {
              text-decoration: underline; }
      .grid-section .container .grid .block + .block {
        margin-left: 1.96%; }
      .grid-section .container .grid .block:nth-child(3n+1) {
        margin-left: 0; }

/***************
    END GRID
****************/
/***************
  about DE MI
****************/
.about {
  display: block; }
  .about .container {
    margin: 0 auto;
    width: 100%;
    display: block;
    padding: 115px 0 10%; }
    .about .container h3 {
      font-family: Avalon;
      font-size: 36px;
      font-weight: bold;
      line-height: normal;
      color: #855de3; }
    .about .container p {
      font-family: Avalon-Book;
      font-size: 24px;
      font-weight: normal;
      font-style: normal;
      line-height: 1.58;
      letter-spacing: normal;
      padding-top: 53px;
      max-width: 573px; }
    .about .container ul {
      display: block;
      padding-top: 53px; }
      .about .container ul li {
        display: block;
        vertical-align: middle; }
        .about .container ul li.mail {
          background: url(../img/icon-mailcolor.svg) no-repeat left center;
          padding-top: 1px; }
        .about .container ul li.in {
          background: url(../img/linked-in.svg) no-repeat left center;
          padding-top: 10px;
          margin-top: 10px; }
        .about .container ul li a {
          display: block;
          margin-left: 40px;
          font-family: Avalon-demi;
          font-size: 24px;
          font-weight: normal;
          line-height: 1.46;
          letter-spacing: normal;
          color: #855de3;
          vertical-align: middle;
          outline: 0; }
          .about .container ul li a:hover {
            text-decoration: underline; }

/***************
END about DE MI
****************/
/***************
     FOOTER
****************/
footer {
  margin: 0 auto;
  width: 100%;
  display: block; }
  footer .container {
    padding-bottom: 8%; }
    footer .container p {
      font-family: Avalon-Book;
      font-size: 14px;
      color: #b4b9bf;
      font-style: normal; }

/***************
  @media screen
****************/
@media only screen and (max-width: 1190px) {
  .container {
    padding-left: 25px !important;
    padding-right: 25px !important; }

  #contacto .container {
    padding-left: none !important;
    padding-right: none !important; } }
@media only screen and (max-width: 800px) {
  .hi .container {
    padding: 23% 0 16%; }

  .grid-section .container {
    padding-left: 12px !important;
    padding-right: 12px !important;
    padding-bottom: 0; }

  .grid-section .container .grid .block {
    width: 48.3%;
    max-width: 100%;
    margin-bottom: 20px; }

  .grid-section .container .grid .block:nth-child(3n+1) {
    margin-left: 1.96%; }

  .grid-section .container .grid .block:nth-child(2n+1) {
    margin-left: 0; }

  .about .container {
    padding: 20% 0 12%; } }
@media only screen and (max-width: 620px) {
  .hi .container {
    padding: 31% 0 21%; }

  .hi .container h2 {
    font-size: 36px; }

  .grid-section .container .grid .block {
    margin-bottom: 20px; }

  .grid-section .container .grid .block .footer_content {
    padding: 14px 0; }

  .grid-section .container .grid .block .footer_content h4 {
    font-size: 16px; }

  .grid-section .container .grid .block .footer_content a {
    font-size: 11px; }

  footer .container {
    padding-bottom: 80px; } }
@media only screen and (max-width: 480px) {
  .grid-section .container .grid .block .footer_content h4 {
    font-size: 14px; }

  .grid-section .container .grid .block .footer_content a {
    font-size: 10px; }

  .about .container ul li a {
    font-size: 19px; }

  footer .container p {
    font-size: 11px; } }
/***************
     retina
****************/
@media all and (-webkit-min-device-pixel-ratio: 2) {
  #wrapper_header #header .container .logo {
    background: url(../img/logo@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #wrapper_header #header .container .logo.sticky {
    background: url(../img/logo_color@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #wrapper_header #header.header_thankyou .container .logo {
    background: url(../img/logo_color@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #wrapper_header #header .container .logo.eng {
    background: url(../img/logo_en@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #wrapper_header #header .container .logo.eng.sticky {
    background: url(../img/logo_color_en@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #wrapper_header #header .container .logo.cn {
    background: url(../img/logo_ch@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #wrapper_header #header .container .logo.cn.sticky {
    background: url(../img/logo_color_ch@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  .more:after {
    background: url(../img/arrow@2x.png) no-repeat right top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #clientes .testimonios .container .comment:after,
  #contacto #map_col .container .bubble:after {
    background: url(../img/triangle@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #footer .contact_footer .container #blog .info_author_date .avatar {
    background: url(../img/sprite_icons@2x.png) no-repeat -52px 0;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #contacto .container #column_form .container h6:before {
    background: url(../img/sprite_icons@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #footer .social_footer .container .social ul li a span {
    background: url(../img/icons_social@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #footer .social_footer .container .social ul li:hover a span {
    background: url(../img/icons_social_blanco@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; }

  #clientes .testimonios .container .who .person {
    background: url(../img/sprite_people@2x.png) no-repeat left top;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    overflow: hidden; } }

/*# sourceMappingURL=style.css.map */
