@charset "UTF-8";
/*Tipografía*/
@import url("https://fonts.googleapis.com/css2?family=Bitter:wght@100;400;700&family=Dancing+Script:wght@400;700&family=Roboto:wght@100;400;900&display=swap");
/*Color*/
/*Estructura General*/
.clearfix:after {
  content: ".";
  display: block;
  font-size: 0;
  line-height: 0;
  height: 0;
  clear: both;
  visibility: hidden; }


a.disabled-link[href="#"]{
  pointer-events: none!important;
}

.clearfix {
  display: inline-block; }

* html .clearfix {
  height: 1%; }

.clearfix {
  display: block; }

*, *:after, *:before {
  margin: 0;
  padding: 0;
  position: relative;
  width: 100%;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  text-rendering: optimizeLegibility; }

/* Body */
html {
  font-size: 85%; }

html, body {
  width: 100%;
  height: 100%;
  position: relative;
  float: left; }

body {
  font-family: "Roboto", sans-serif;
  display: block;
  background: #f1f1f1; }
  body main {
    height: 100%;
    min-height: 100%;
    display: block;
    padding-top: 10em; }
    body main footer:before {
      font-family: 'icomoon';
      content: '\e93e';
      font-size: 4em;
      color: #009ee2;
      height: 500px;
      padding-top: 1em;
      background: url("/images/footer.svg") no-repeat;
      background-size: cover;
      background-position: center top; }
      @media only screen and (max-width: 600px) {
        body main footer:before {
          font-size: 2.5em; } }
    body main footer section {
      max-width: none;
      width: 100%;
      padding-top: 2em;
      padding-bottom: 2em;
      background: #000000; }
      body main footer section a, body main footer section p, body main footer section i {
        width: auto;
        color: #ffffff; }
      body main footer section i {
        font-size: 1.2em;
        padding-right: 0.5em; }
      body main footer section p {
        text-align: center; }
      body main footer section .fingers {
        padding-bottom: 2em; }
        body main footer section .fingers a {
          text-align: center;
          padding: 1em;
          border-right: 1px solid #ffffff; }
          body main footer section .fingers a:last-child {
            border-right: none; }
          body main footer section .fingers a:hover {
            color: #eab300; }
  body section {
    width: 90%;
    max-width: 1080px; }
  body img {
    width: 100%;
    line-height: 0; }
  body p, body label {
    text-align: justify;
    font-size: 1.2em;
    padding: 0.2em 0;
    color: #303030; }
  body a {
    color: #009ee2;
    text-decoration: none;
    border: none;
    outline: none; }
  body b {
    color: #009ee2;
    font-weight: bold; }
  body ul, body ol {
    list-style: none; }
  body h1, body h2, body h3 {
    text-align: center;
    text-transform: uppercase; }
  body h1 {
    width: auto;
    color: #00749e;
    font-weight: bold;
    font-size: 2.5em; }
  body h2 {
    font-size: 1.2em;
    color: #ffffff; }
  body h3 {
    font-size: 1.2em;
    color: #00749e;
    padding-bottom: 0.5em; }
  body .blackbutton {
    width: auto;
    background: #009ee2;
    color: #ffffff;
    padding: 1em;
    padding-right: 2.5em;
    margin-top: 1em;
    border-radius: 10px;
    box-shadow: 2px 2px 5px #00749e; }
    @media only screen and (max-width: 600px) {
      body .blackbutton {
        font-size: 1em; } }
    body .blackbutton:hover:after {
      transform: translateX(0.2em); }
    body .blackbutton:after {
      width: auto;
      height: 100%;
      position: absolute;
      right: 0.5em;
      top: 0.5em;
      font-family: 'icomoon';
      content: '\e931';
      font-size: 1.5em;
      padding-left: 0.5em;
      color: #ffe600; }
  body .ir-arriba {
    position: fixed;
    bottom: 1em;
    right: 1em;
    width: auto;
    line-height: 0;
    padding: 0.2em;
    border-radius: 50%;
    z-index: 2800;
    background: rgba(0, 116, 158, 0.6);
    color: #ffffff;
    cursor: pointer; }
    body .ir-arriba:hover {
      transform: scale(1.1);
      -webkit-transform: scale(1.1); }
    body .ir-arriba i {
      font-size: 3em; }

body main article, body main footer, body main footer:before, body main footer section p, body main footer section .fingers, body section, header, header .for4e .logo, header section nav, header section nav a, header section nav ul, header section nav ul li ul, .h-blue section .bluehome, .h-blue section .bluehome a, .home .clients, .home .licensesband, .h-title, .h-brands, .h-brands a .h-brand-text, .c-brands, .c-brands .tab .tab-content, .c-brands .tab .tab-content .tab-social, .about .aboutdn, .about .aboutdn .aboutdn-list, .about .aboutdn .aboutdn-list ul, .aboutspace picture, .aboutsust, .sustentabilidad #materiasprimas, .sustentabilidad #aromasincreibles, .sustentabilidad #disenosinovadores, .sustentabilidad #formulacionessustentables, .sustentabilidad #materiasprimas ul, .sustentabilidad #materiasprimas ul li, .sustentabilidad #disenosinovadores .disenadores, .sustentabilidad #disenosinovadores .disenadores .disenostuff, .alianzas, .terminos ul li, .contactform, .contactform #contact .fenviar, .cosmetovigilancia form, .cosmetovigilancia form .cm-labels, .cosmetovigilancia form .cm-labeldos, .cosmetovigilancia form .cm-labels label, .cosmetovigilancia form .cm-labeldos label, .cosmetovigilancia form .forbutton, .home-banner, .home-banner .slider .slidex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex; }

.h-brands, .c-brands, .alianzas, .cosmetovigilancia form, .cosmetovigilancia form .cm-labels, .cosmetovigilancia form .cm-labeldos {
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap; }

/*Direction*/
body main article, body main footer, body main footer section, header .for4e .logo, header section nav ul li ul, .h-blue section, .h-blue section .bluehome a, .h-title, .h-brands a .h-brand-text, .c-brands .tab .tab-content, .about, .about .aboutdn .aboutdn-list, .about .aboutdn .aboutdn-list ul, .sustentabilidad, .sustentabilidad #materiasprimas, .sustentabilidad #aromasincreibles, .sustentabilidad #disenosinovadores, .sustentabilidad #formulacionessustentables, .sustentabilidad #materiasprimas ul, .sustentabilidad #disenosinovadores .disenadores .disenostuff, .terminos, .contactform, .cosmetovigilancia {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column; }

/*Justify items*/
body main article, body main footer, body main footer:before, body main footer section, body main footer section p, body main footer section .fingers, header, header .for4e, header .for4e .logo, header section nav a, .h-blue section, .h-blue section .bluehome a, .h-title, .h-brands a .h-brand-text, .c-brands .tab .tab-content, .c-brands .tab .tab-content .tab-social, .about, .aboutspace picture, .aboutsust, .sustentabilidad, .sustentabilidad #materiasprimas, .sustentabilidad #aromasincreibles, .sustentabilidad #disenosinovadores, .sustentabilidad #formulacionessustentables, .sustentabilidad #materiasprimas ul, .sustentabilidad #disenosinovadores .disenadores .disenostuff, .terminos, .contactform, .contactform #contact .fenviar, .cosmetovigilancia, .cosmetovigilancia form .forbutton, .home-banner, .home-banner .slider .slidex {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center; }

header section, header section nav, header section nav ul, .h-blue section .bluehome, .home .clients, .home .licensesband, .cosmetovigilancia form {
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between; }

.h-brands, .c-brands, .sustentabilidad #disenosinovadores .disenadores, .alianzas, .cosmetovigilancia form .cm-labels, .cosmetovigilancia form .cm-labeldos {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: space-around;
  justify-content: space-around; }

.about .aboutdn, .about .aboutdn .aboutdn-list, .about .aboutdn .aboutdn-list ul, .sustentabilidad #materiasprimas ul li, .terminos ul li, .cosmetovigilancia form .cm-labels label, .cosmetovigilancia form .cm-labeldos label {
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-justify-content: flex-start;
  justify-content: flex-start; }

/*Align items*/
body main article, body main footer, body main footer section, body main footer section p, body main footer section .fingers, header, header .for4e, header .for4e .logo, header section nav a, .h-blue section, .h-blue section .bluehome, .h-blue section .bluehome a, .home .clients, .home .licensesband, .h-title, .h-brands, .h-brands a .h-brand-text, .c-brands, .c-brands .tab .tab-content, .c-brands .tab .tab-content .tab-social, .about, .aboutspace picture, .aboutsust, .sustentabilidad, .sustentabilidad #materiasprimas, .sustentabilidad #aromasincreibles, .sustentabilidad #disenosinovadores, .sustentabilidad #formulacionessustentables, .sustentabilidad #materiasprimas ul, .sustentabilidad #materiasprimas ul li, .sustentabilidad #disenosinovadores .disenadores .disenostuff, .alianzas, .terminos ul li, .contactform, .cosmetovigilancia, .cosmetovigilancia form .cm-labels, .cosmetovigilancia form .cm-labeldos, .cosmetovigilancia form .cm-labels label, .cosmetovigilancia form .cm-labeldos label, .cosmetovigilancia form .forbutton, .home-banner, .home-banner .slider .slidex {
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center; }

body main footer:before, .c-brands .tabButton, .about .aboutdn, .about .aboutdn .aboutdn-list, .about .aboutdn .aboutdn-list ul, .sustentabilidad #disenosinovadores .disenadores, .terminos, .cosmetovigilancia form {
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  -webkit-align-items: flex-start;
  align-items: flex-start; }

/* * * * * * * * * * * 
* * * * * * * Animaciones * * * * * * *
* * * * * * */
body a, body .blackbutton:after, body .ir-arriba, header, header section nav a, header section nav ul li, header section nav ul li:hover ul, header section nav ul li ul, .h-blue section .bluehome a, .home .clients .clientband picture, .home .licensesband .clientband picture, .h-brands a img, .h-brands a .h-brand-text, .c-brands .tabButton, .c-brands .tab .tab-content .tab-social a, .alianzas li {
  transition: 0.2s all;
  -webkit-transition: 0.2s all; }

/* * * * * * * * * * * 
* * * * * * * Degradado * * * * * * *
* * * * * * */
header .for4e .logo, .h-blue, .h-blue section .bluehome a {
  background: #2cb9f5;
  background: -moz-linear-gradient(-45deg, #2cb9f5 0%, #009ee2 41%, #007db3 100%);
  background: -webkit-gradient(left top, right bottom, color-stop(0%, #2cb9f5), color-stop(41%, #009ee2), color-stop(100%, #007db3));
  background: -webkit-linear-gradient(-45deg, #2cb9f5 0%, #009ee2 41%, #007db3 100%);
  background: -o-linear-gradient(-45deg, #2cb9f5 0%, #009ee2 41%, #007db3 100%);
  background: -ms-linear-gradient(-45deg, #2cb9f5 0%, #009ee2 41%, #007db3 100%);
  background: linear-gradient(135deg, #2cb9f5 0%, #009ee2 41%, #007db3 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2cb9f5', endColorstr='#007db3', GradientType=1 ); }

header {
  width: 100%;
  position: fixed;
  z-index: 2000;
  pointer-events: none;
  padding-top: 1em;
  background: #ffffff;
  -webkit-transition: 0.3s all; }
  header .for4e {
    position: absolute;
    left: 0;
    bottom: -3em;
    z-index: 2020;
    width: 100%;
    max-width: none; }
    header .for4e .logo {
      width: 6em;
      height: 6em;
      border-radius: 50%;
      pointer-events: all; }
      header .for4e .logo i {
        width: auto;
        color: #ffffff; }
      header .for4e .logo .icon-e {
        font-size: 3em; }
  header section {
    width: 100%; }
    @media only screen and (max-width: 800px) {
      header section {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
        flex-direction: column; } }
    header section nav {
      pointer-events: all; }
      @media only screen and (max-width: 800px) {
        header section nav {
          max-width: none;
          max-height: 0;
          overflow: hidden;
          transition: 0.2s all;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
          -moz-box-orient: vertical;
          -moz-box-direction: normal;
          -ms-flex-direction: column;
          -webkit-flex-direction: column;
          flex-direction: column; } }
      header section nav a {
        padding-top: 1em;
        padding-bottom: 1em;
        height: 100%;
        font-weight: bold;
        text-transform: uppercase; }
      @media only screen and (max-width: 800px) {
        header section nav ul {
          background: #ffffff;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
          -moz-box-orient: vertical;
          -moz-box-direction: normal;
          -ms-flex-direction: column;
          -webkit-flex-direction: column;
          flex-direction: column; } }
      header section nav ul li a:hover {
        background: #009ee2;
        color: #ffffff; }
      header section nav ul li:hover ul {
        background: #ffffff;
        opacity: 1;
        max-height: 1000px; }
        @media only screen and (max-width: 800px) {
          header section nav ul li:hover ul {
            max-height: 0; } }
      header section nav ul li ul {
        position: absolute;
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        font-size: .9em; }
        @media only screen and (max-width: 800px) {
          header section nav ul li ul {
            max-height: 0;
            opacity: 1;
            position: relative;
            overflow: hidden;
            transition: 0.2s all;
            -webkit-transition: 0.2s all; } }
        header section nav ul li ul li {
          width: 100%;
          background: rgba(255, 255, 255, 0.3); }
          header section nav ul li ul li a {
            text-align: center;
            padding: 1em 0.5em; }
            @media only screen and (max-width: 800px) {
              header section nav ul li ul li a {
                background: none; } }
    header section .mobile {
      width: 100%;
      display: none;
      font-size: 2em;
      padding: 0.5em;
      color: #009ee2;
      pointer-events: all; }
      @media only screen and (max-width: 800px) {
        header section .mobile {
          display: -moz-box;
          display: -ms-flexbox;
          display: -webkit-flex;
          display: flex;
          display: -webkit-box;
          -webkit-box-pack: end;
          -moz-box-pack: end;
          -ms-flex-pack: end;
          -webkit-justify-content: flex-end;
          justify-content: flex-end; } }
    header section .active {
      padding-bottom: 3em;
      max-height: 9000px !important;
      transition: all 1s ease; }
    @media only screen and (max-width: 800px) {
      header section .arrow {
        display: block;
        float: right;
        height: 2em;
        width: 2em;
        position: absolute;
        right: 1em;
        top: 0.8em;
        transition: all 0.3s ease; }
        header section .arrow:before {
          width: auto;
          font-family: 'icomoon';
          content: '\e91c';
          font-size: 2em;
          color: #009ee2; }
        header section .arrow:hover {
          cursor: pointer; }
      header section .rotate {
        transition: all 0.3s ease;
        -webkit-transform: rotate(-180deg);
        -moz-transform: rotate(-180deg);
        -o-transform: rotate(-180deg);
        transform: rotate(-180deg); } }

.h-blue {
  padding-top: 5em;
  padding-bottom: 5em; }
  .h-blue p, .h-blue i {
    color: #ffffff; }
  .h-blue section h1 {
    color: #ffffff; }
  .h-blue section b {
    font-size: 1.1em;
    color: #ff9900; }
  .h-blue section .bluehome {
    padding-top: 2em; }
    .h-blue section .bluehome a {
      width: 30%;
      border-radius: 20px;
      box-shadow: 2px 2px 4px #000000;
      padding-top: 2em;
      padding-bottom: 2em; }
      .h-blue section .bluehome a:hover {
        transform: scale(1.1); }
      .h-blue section .bluehome a i {
        width: auto;
        font-size: 4em;
        padding-bottom: 0.2em; }

.home {
  padding-top: 0; }
  .home .h-brands {
    padding-top: 5em;
    padding-bottom: 5em; }
  .home .clients:before, .home .clients:after {
    background-image: -webkit-linear-gradient(left, #f1f1f1 0%, rgba(255, 255, 255, 0) 100%);
    background-image: -o-linear-gradient(left, #f1f1f1 0%, rgba(255, 255, 255, 0) 100%);
    background-image: linear-gradient(to right, #f1f1f1 0%, rgba(255, 255, 255, 0) 100%); }
  .home .clients, .home .licensesband {
    padding-top: 5em;
    padding-bottom: 5em;
    overflow: hidden; }
    .home .clients:after, .home .licensesband:after {
      right: 0;
      transform: rotateZ(180deg); }
    .home .clients:before, .home .licensesband:before {
      left: 0; }
    .home .clients:after, .home .clients:before, .home .licensesband:after, .home .licensesband:before {
      pointer-events: none;
      content: "";
      position: absolute;
      top: 0;
      width: 200px;
      height: 100%;
      z-index: 20; }
      @media only screen and (max-width: 600px) {
        .home .clients:after, .home .clients:before, .home .licensesband:after, .home .licensesband:before {
          width: 50px; } }
    .home .clients .clientband, .home .licensesband .clientband {
      -webkit-animation: scroll 40s linear infinite;
      animation: scroll 40s linear infinite;
      display: flex;
      width: calc(200px * 14); }
      .home .clients .clientband picture, .home .licensesband .clientband picture {
        width: 200px;
        padding: 1em;
        transform: scale(0.9);
        -webkit-transform: scale(0.9); }
        .home .clients .clientband picture:hover, .home .licensesband .clientband picture:hover {
          transform: scale(1);
          -webkit-transform: scale(1); }
@-webkit-keyframes scroll {
  0% {
    transform: translateX(0); }
  100% {
    transform: translateX(calc(-200px * 7)); } }
@keyframes scroll {
  0% {
    transform: translateX(0); }
  100% {
    transform: translateX(calc(-200px * 7)); } }
.h-title {
  width: 100%;
  padding-bottom: 1em; }
  .h-title p {
    text-align: center;
    max-width: 800px;
    padding-top: 2em; }

.h-brands a {
  width: 48%;
  margin-top: 2em;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4); }
  @media only screen and (max-width: 600px) {
    .h-brands a {
      width: 100%; } }
  .h-brands a img {
    transform: scale(1); }
  .h-brands a h2 {
    position: absolute;
    top: 10%;
    left: 0;
    color: #00749e; }
  .h-brands a:hover h2 {
    color: #ffffff; }
  .h-brands a:hover img {
    transform: scale(1.1); }
  .h-brands a:hover .h-brand-text {
    opacity: 1; }
  .h-brands a .h-brand-text {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    padding: 2em;
    background: rgba(0, 116, 158, 0.8);
    opacity: 0; }
    .h-brands a .h-brand-text p {
      color: #ffffff;
      text-align: center; }

.c-brands {
  max-width: 800px;
  margin-bottom: 2em;
  margin-top: 2em; }
  .c-brands input {
    display: none; }
    .c-brands input:checked + label {
      filter: grayscale(0);
      opacity: 1; }
    .c-brands input:checked + label + .tab {
      display: block; }
    .c-brands input:checked + label + .tab > .content {
      -webkit-animation: showTab 250ms ease-in-out;
      animation: showTab 250ms ease-in-out; }
  .c-brands .tabButton {
    width: 22%;
    filter: grayscale(1);
    opacity: 0.4;
    text-align: center;
    cursor: pointer;
    order: 1;
    -webkit-box-ordinal-group: 2; }
  .c-brands .tab {
    background: #ffffff;
    display: none;
    padding: 1.5em;
    text-align: left;
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -ms-flex-order: 2;
    order: 2; }
    .c-brands .tab .tab-content .tab-logo {
      width: 40%;
      padding-top: 2em; }
    .c-brands .tab .tab-content .tab-social {
      padding-top: 2em; }
      .c-brands .tab .tab-content .tab-social a, .c-brands .tab .tab-content .tab-social i {
        width: auto; }
      .c-brands .tab .tab-content .tab-social a {
        padding-left: 0.5em;
        padding-right: 0.5em; }
        .c-brands .tab .tab-content .tab-social a:hover {
          transform: scale(1.1); }
        .c-brands .tab .tab-content .tab-social a i {
          font-size: 2.5em; }
        .c-brands .tab .tab-content .tab-social a .icon-facebook {
          color: #00749e; }
        .c-brands .tab .tab-content .tab-social a .icon-instagram {
          color: #ff0099; }
        .c-brands .tab .tab-content .tab-social a .icon-amazon {
          color: #ff9900; }

@keyframes showTab {
  from {
    opacity: 0;
    transform: translateY(10px);
    -webkit-transform: translateY(10px); }
  to {
    opacity: 1;
    transform: translateY(0);
    -webkit-transform: translateY(0); } }
.about {
  padding-bottom: 2em; }
  .about .aboutdn {
    max-width: 800px;
    background: url("/images/about/aboutus.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
    .about .aboutdn .aboutdn-list {
      padding: 2em;
      background: linear-gradient(to right, #ffffff 40%, rgba(255, 255, 255, 0)); }
      .about .aboutdn .aboutdn-list h3 {
        text-align: left; }
      .about .aboutdn .aboutdn-list ul li {
        max-width: 100px;
        padding-top: 1em;
        font-size: 1.2em;
        color: #00749e; }
        .about .aboutdn .aboutdn-list ul li:before {
          width: auto;
          font-family: 'icomoon';
          content: '\e91e';
          font-size: 1.5em;
          color: #ff9900;
          padding-right: 0.2em; }
  .about .aboutmision {
    padding-top: 1em; }

.aboutspace {
  padding-top: 2em;
  padding-bottom: 2em; }
  .aboutspace picture {
    background: #ffffff;
    box-shadow: 2px 2px 5px #000000; }
    .aboutspace picture img {
      transform: scale(0.95); }

.aboutsust {
  width: auto;
  background: #00749e;
  margin-top: 1em; }
  .aboutsust li {
    width: auto;
    text-align: center;
    padding: 1em;
    border-right: 2px solid #ffffff; }
    .aboutsust li:last-child {
      border-right: none; }
    .aboutsust li:hover {
      background: rgba(0, 0, 0, 0.2); }
    .aboutsust li a {
      color: #ffffff;
      font-weight: bold; }

.sustentabilidad #materiasprimas, .sustentabilidad #aromasincreibles, .sustentabilidad #disenosinovadores, .sustentabilidad #formulacionessustentables {
  padding-top: 2em;
  padding-bottom: 2em;
  border-bottom: 1px solid #00749e; }
.sustentabilidad #materiasprimas ul {
  width: 90%;
  padding-bottom: 1em;
  padding-top: 1em; }
  .sustentabilidad #materiasprimas ul li {
    padding-bottom: 1em; }
    .sustentabilidad #materiasprimas ul li:before {
      width: auto;
      font-family: 'icomoon';
      content: '\e91e';
      font-size: 2em;
      color: #ff9900;
      padding-right: 0.2em; }
.sustentabilidad #disenosinovadores .disenadores {
  padding-top: 2em;
  padding-bottom: 2em; }
  @media only screen and (max-width: 600px) {
    .sustentabilidad #disenosinovadores .disenadores {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -moz-box-orient: vertical;
      -moz-box-direction: normal;
      -ms-flex-direction: column;
      -webkit-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: center;
      -moz-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center; } }
  .sustentabilidad #disenosinovadores .disenadores .disenostuff {
    width: 45%;
    padding: 1em;
    border-radius: 20px;
    box-shadow: 2px 2px 5px #000000; }
    @media only screen and (max-width: 600px) {
      .sustentabilidad #disenosinovadores .disenadores .disenostuff {
        width: 90%; }
        .sustentabilidad #disenosinovadores .disenadores .disenostuff:nth-child(1) {
          margin-bottom: 1em; } }

.alianzas li {
  width: 22%; }
  .alianzas li:hover {
    transform: scale(1.1); }

.terminos h1 {
  width: 100%; }
.terminos .term-advertice {
  color: #ff001a;
  padding-top: 2em;
  font-size: 1.5em; }
.terminos h3 {
  text-align: left;
  padding-top: 2em; }
  .terminos h3 b {
    font-size: 0.9em; }
.terminos p b {
  font-size: 1.2em;
  text-transform: uppercase;
  color: #9a9a9a; }
.terminos p span {
  color: #ff001a;
  font-weight: bold; }
.terminos ul li:before {
  width: auto;
  font-family: 'icomoon';
  content: '\e91e';
  font-size: 2em;
  color: #ff9900;
  padding-right: 0.2em; }

.contactform {
  padding-bottom: 5em; }
  .contactform h1 {
    text-align: center; }
  .contactform #contact {
    padding-top: 1em;
    font-family: "Roboto", sans-serif; }
    .contactform #contact fieldset {
      border: #009ee2 !important;
      margin-bottom: 1em;
      margin-right: 2%;
      margin-left: 2%;
      width: 46%;
      float: left;
      padding: 0; }
      @media only screen and (max-width: 800px) {
        .contactform #contact fieldset {
          width: 94%;
          margin: 1em 3%; } }
    .contactform #contact .textmen {
      width: 96%; }
      @media only screen and (max-width: 800px) {
        .contactform #contact .textmen {
          width: 94%;
          margin: 1em 3%; } }
      .contactform #contact .textmen textarea {
        height: 100px;
        max-width: 100%;
        resize: none; }
    .contactform #contact .fenviar {
      width: 96%;
      margin-left: 2%; }
      @media only screen and (max-width: 800px) {
        .contactform #contact .fenviar {
          width: 94%;
          margin: 1em 3%; } }
      .contactform #contact .fenviar button {
        width: 50%;
        max-width: 120px; }

#contact input[type="text"], #contact input[type="edad"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="localidad"], #contact input[type="url"], #contact textarea {
  width: 100%;
  border: 1px solid #009ee2;
  border-radius: 10px;
  background: none;
  padding: 10px;
  color: #009ee2;
  font-family: "Roboto", sans-serif; }

#contact input[type="text"]:hover, #contact input[type="edad"]:hover, #contact input[type="localidad"]:hover, #contact input[type="email"]:hover, #contact input[type="tel"]:hover, #contact input[type="url"]:hover, #contact textarea:hover {
  -webkit-transition: border-color 0.3s ease-in-out;
  -moz-transition: border-color 0.3s ease-in-out;
  transition: border-color 0.3s ease-in-out;
  border: 1px solid #009ee2;
  background: rgba(250, 250, 250, 0.5);
  color: #9a9a9a; }

#contact button[type="submit"] {
  cursor: pointer;
  border: none;
  border-radius: 10px;
  background: #009ee2;
  color: #ffffff;
  padding: 10px;
  font-size: 1em;
  transition: 0.2s all;
  -webkit-transition: 0.2s all; }

#contact button[type="submit"]:hover {
  opacity: 0.8;
  -webkit-transition: background 0.3s ease-in-out;
  -moz-transition: background 0.3s ease-in-out;
  transition: hover-color 0.3s ease-in-out; }

#contact button[type="submit"]:active {
  box-shadow: inset 0 1px 3px #009ee2; }

#contact input:focus, #contact textarea:focus {
  outline: 0;
  border: 1px solid #009ee2; }

::-webkit-input-placeholder {
  color: #000000; }

:-moz-placeholder {
  color: #000000; }

::-moz-placeholder {
  color: #000000; }

:-ms-input-placeholder {
  color: #000000; }

.confirmation {
  padding-bottom: 5em; }
  .confirmation h2 {
    padding-bottom: 0.5em; }

.cosmetovigilancia h3 {
  background: #00749e;
  color: #ffffff;
  border-radius: 10px;
  padding: 1em; }
.cosmetovigilancia p {
  width: auto;
  max-width: 800px; }
  .cosmetovigilancia p b {
    font-size: 1.2em; }
.cosmetovigilancia form {
  padding-top: 2em;
  padding-bottom: 5em; }
  .cosmetovigilancia form fieldset {
    padding: 1em;
    background: none;
    border: none; }
    @media only screen and (max-width: 600px) {
      .cosmetovigilancia form fieldset {
        padding: 0.5em; } }
    .cosmetovigilancia form fieldset input, .cosmetovigilancia form fieldset textarea, .cosmetovigilancia form fieldset select {
      padding: 0.5em; }
    .cosmetovigilancia form fieldset textarea {
      min-height: 200px; }
  .cosmetovigilancia form .cm-field30 {
    width: 30%; }
    @media only screen and (max-width: 600px) {
      .cosmetovigilancia form .cm-field30 {
        width: 33%; } }
  .cosmetovigilancia form .cm-field50 {
    width: 48%; }
    @media only screen and (max-width: 600px) {
      .cosmetovigilancia form .cm-field50 {
        width: 50%; } }
  .cosmetovigilancia form .cm-labels legend, .cosmetovigilancia form .cm-labeldos legend {
    padding-bottom: 0.5em; }
    .cosmetovigilancia form .cm-labels legend:after, .cosmetovigilancia form .cm-labeldos legend:after {
      content: '';
      background: #009ee2;
      width: 20%;
      height: 2px;
      position: absolute;
      bottom: 0;
      left: 0; }
  .cosmetovigilancia form .cm-labels label, .cosmetovigilancia form .cm-labeldos label {
    text-align: left; }
    .cosmetovigilancia form .cm-labels label input, .cosmetovigilancia form .cm-labeldos label input {
      width: auto;
      margin-right: 1em; }
  .cosmetovigilancia form .cm-labels label {
    width: 30%;
    max-width: 130px; }
  .cosmetovigilancia form .cm-labeldos label {
    width: 48%; }
    @media only screen and (max-width: 500px) {
      .cosmetovigilancia form .cm-labeldos label {
        width: 100%; } }
  .cosmetovigilancia form button {
    width: auto;
    padding: 0.5em 2em;
    border-radius: 10px;
    background: #000000;
    color: #ffffff; }

.home-banner {
  box-shadow: 2px 2px 5px #000000;
  overflow: hidden; }
  .home-banner .slider {
    float: left;
    height: auto;
    display: block; }
    .home-banner .slider .slidex a {
      position: absolute;
      bottom: 5%;
      right: 10%; }
    .home-banner .slider .slidex img {
      line-height: 0; }
  .home-banner .slick-slide {
    height: auto; }

.paginator-center {
  position: absolute;
  left: 0;
  top: 50%;
  pointer-events: none; }
  .paginator-center ul {
    padding: 0 1em;
    pointer-events: none; }
    .paginator-center ul li {
      width: auto;
      display: block;
      float: left;
      font-size: 5em;
      color: #ffffff;
      pointer-events: all;
      opacity: 0.4;
      transition: 0.5s all;
      -webkit-transition: 0.5s all; }
      .paginator-center ul li:hover {
        opacity: 0.8; }
    .paginator-center ul .next {
      float: right;
      text-align: right; }

.slick-dots {
  height: 1px;
  visibility: hidden; }

   .error_message,
.invalid-feedback {
    width: 100%;
    margin-top: .25rem;
    font-size: 0.875em;
    color: #dc3545;

}
   .error_message{
    font-size: 1.1em;
   }