/*Fonts*/
@import url("https://fonts.googleapis.com/css?family=Oswald:300,400,700|Roboto:400,700|Slabo+27px&display=swap");
@font-face {
  font-family: 'icomoon';
  src: url("../fonts/fonts/icomoon.eot?fixq24");
  src: url("../fonts/fonts/icomoon.eot?fixq24#iefix") format("embedded-opentype"), url("../fonts/fonts/icomoon.ttf?fixq24") format("truetype"), url("../fonts/fonts/icomoon.woff?fixq24") format("woff"), url("../fonts/fonts/icomoon.svg?fixq24#icomoon") format("svg");
  font-weight: normal;
  font-style: normal; }
/*Colors*/
/*Estructura General*/
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  /* Safari and Chrome */ }
body main, body main article, body main article section, body .titleserv, body .titleserv h3, header, .sidebar, .sidebar .usuario, .sidebar .usuario .aditionalcoment, footer, footer section, footer section .finger, footer section .finger p, .alloftheme .atheme, .tecnologia .catalogo, .tecnologia .catalogo .hexagono, .servicios .service, .clientes, .dafirst, .dafirst .slider .slide1, .dafirst .slider .slide2, .dafirst .slider .slide3, .dafirst .slider .slide4, .dafirst .slider .slide1 .slcontent, .dafirst .slider .slide2 .slcontent, .dafirst .slider .slide3 .slcontent, .dafirst .slider .slide4 .slcontent, .dafirst .slider .slide1 .slcontent div, .dafirst .slider .slide2 .slcontent div, .dafirst .slider .slide3 .slcontent div, .dafirst .slider .slide4 .slcontent div, .dafirst .slider .slide1 .slcontent div ul, .dafirst .slider .slide2 .slcontent div ul, .dafirst .slider .slide3 .slcontent div ul, .dafirst .slider .slide4 .slcontent div ul, .catalogo, .catalogo .catinfo ul li, .loggst {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex; }

footer section, .tecnologia .catalogo, .clientes {
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap; }

/*Direction*/
body main, body main article, body main article section, .sidebar, footer section .finger, .alloftheme .atheme, .tecnologia .catalogo .hexagono, .dafirst .slider .slide1 .slcontent div, .dafirst .slider .slide2 .slcontent div, .dafirst .slider .slide3 .slcontent div, .dafirst .slider .slide4 .slcontent div, .dafirst .slider .slide1 .slcontent div ul, .dafirst .slider .slide2 .slcontent div ul, .dafirst .slider .slide3 .slcontent div ul, .dafirst .slider .slide4 .slcontent div ul {
  -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; }

.alloftheme, .tecnologia .catalogo {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -moz-box-orient: horizontal;
  -moz-box-direction: normal;
  -ms-flex-direction: row;
  -webkit-flex-direction: row;
  flex-direction: row; }

/*Justify items*/
body main, body main article, body .titleserv h3, .sidebar .usuario .aditionalcoment, footer, .alloftheme, .alloftheme .atheme, .tecnologia .catalogo .hexagono, .dafirst, .dafirst .slider .slide1, .dafirst .slider .slide2, .dafirst .slider .slide3, .dafirst .slider .slide4, .loggst {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center; }

header, footer section, .dafirst .slider .slide1 .slcontent div, .dafirst .slider .slide2 .slcontent div, .dafirst .slider .slide3 .slcontent div, .dafirst .slider .slide4 .slcontent div, .dafirst .slider .slide1 .slcontent div ul, .dafirst .slider .slide2 .slcontent div ul, .dafirst .slider .slide3 .slcontent div ul, .dafirst .slider .slide4 .slcontent div ul, .catalogo {
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between; }

.sidebar .usuario, .tecnologia .catalogo, .clientes, .dafirst .slider .slide1 .slcontent, .dafirst .slider .slide2 .slcontent, .dafirst .slider .slide3 .slcontent, .dafirst .slider .slide4 .slcontent {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: space-around;
  justify-content: space-around; }

.sidebar, footer section .finger p {
  -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, body main article, body .titleserv, body .titleserv h3, footer, footer section .finger p, .alloftheme, .alloftheme .atheme, .tecnologia .catalogo, .tecnologia .catalogo .hexagono, .clientes, .dafirst, .dafirst .slider .slide1, .dafirst .slider .slide2, .dafirst .slider .slide3, .dafirst .slider .slide4, .dafirst .slider .slide1 .slcontent, .dafirst .slider .slide2 .slcontent, .dafirst .slider .slide3 .slcontent, .dafirst .slider .slide4 .slcontent, .dafirst .slider .slide1 .slcontent div ul, .dafirst .slider .slide2 .slcontent div ul, .dafirst .slider .slide3 .slcontent div ul, .dafirst .slider .slide4 .slcontent div ul, .catalogo, .catalogo .catinfo ul li, .loggst {
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center; }

header, footer section, footer section .finger, .dafirst .slider .slide1 .slcontent div, .dafirst .slider .slide2 .slcontent div, .dafirst .slider .slide3 .slcontent div, .dafirst .slider .slide4 .slcontent div {
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  -webkit-align-items: flex-start;
  align-items: flex-start; }

.sidebar .usuario .aditionalcoment {
  -webkit-box-align: end;
  -moz-box-align: end;
  -ms-flex-align: end;
  -webkit-align-items: flex-end;
  align-items: flex-end; }

/* * * * Motion * * * */
body .btncontact, header i, .alloftheme .atheme, .alloftheme .atheme .atbg1, .alloftheme .atheme .atbg2, .alloftheme .atheme .atbg3, .tecnologia .catalogo .hexagono, .clientes div {
  transition: 0.2s all;
  -webkit-transition: 0.2s all; }

body h4 {
  transition: 0.2s all;
  -webkit-transition: 0.2s all; }
  body h4:hover {
    transform: scale(1.05);
    -webkit-transform: scale(1.05); }

@keyframes fadeIn {
  0% {
    opacity: 0;
    left: -100%; }
  100% {
    opacity: 1;
    left: 0; } }
@-moz-keyframes fadeIn {
  0% {
    opacity: 0;
    left: -100%; }
  100% {
    opacity: 1;
    left: 0; } }
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
    left: -100%; }
  100% {
    opacity: 1;
    left: 0; } }
@-o-keyframes fadeIn {
  0% {
    opacity: 0;
    left: -100%; }
  100% {
    opacity: 1;
    left: 0; } }
@-ms-keyframes fadeIn {
  0% {
    opacity: 0;
    left: -100%; }
  100% {
    opacity: 1;
    left: 0; } }
.clearfix:after {
  content: ".";
  display: block;
  font-size: 0;
  line-height: 0;
  height: 0;
  clear: both;
  visibility: hidden; }

.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; }

html, body {
  width: 100%;
  height: 100%;
  position: relative;
  float: left;
  color: #434343; }

body {
  font-family: "Roboto", sans-serif;
  font-size: 1em; }
  body main {
    padding: 0;
    transition: margin-right .5s;
    -webkit-transition: margin-right .5s; }
    body main article section {
      width: 95%;
      max-width: 1200px; }
  body img {
    width: 100%;
    line-height: 0; }
  body p, body label {
    width: 100%;
    text-align: justify;
    padding: 1em 0; }
    @media only screen and (max-width: 500px) {
      body p, body label {
        font-size: 0.9em; } }
  body a {
    color: #434343;
    text-decoration: none;
    border: none;
    outline: none;
    transition: 0.3s all;
    -webkit-transition: 0.3s all;
    -moz-transition: 0.3s all;
    -ms-transition: 0.3s all;
    -o-transition: 0.3s all; }
    body a:hover {
      color: #06557a; }
  body b {
    color: #434343;
    font-weight: bold; }
  body ul, body ol {
    list-style: none; }
  body h1 {
    float: left;
    font-family: "Oswald:400", sans-serif;
    color: #434343;
    text-align: center;
    font-size: 2em; }
  body h2 {
    font-size: 2em;
    font-family: "Oswald:400", sans-serif;
    color: #06557a;
    text-align: center;
    padding-bottom: 0.5em; }
  body .titleserv h3 {
    background: #002953;
    color: #ffffff;
    width: 95%;
    height: 50px;
    padding-bottom: 0; }
  body .titleserv .h32 {
    background: #0080bc; }
  body .titleserv .titletriang1 {
    width: 0;
    height: 0;
    border-right: 50px solid transparent;
    border-top: 5% solid transparent;
    border-left: 5% solid #002953;
    border-bottom: 50px solid #002953; }
  body .titleserv .titletriang2 {
    width: 0;
    height: 0;
    border-right: 50px solid transparent;
    border-top: 5% solid transparent;
    border-left: 5% solid #0080bc;
    border-bottom: 50px solid #0080bc; }
  body h4 {
    font-size: 1.1em;
    font-family: "Oswald:400", sans-serif;
    text-align: center;
    text-transform: uppercase;
    padding: 0.5em;
    padding-left: 0;
    padding-bottom: 0;
    color: #ffffff; }
  body .justscreen {
    max-width: 1200px; }
  body .backtotop {
    position: fixed;
    width: 4em;
    height: 4em;
    bottom: 1em;
    right: 2em;
    padding: 0.2em;
    border-radius: 50%;
    text-align: center;
    background: #06557a;
    z-index: 1000; }
    body .backtotop a {
      color: #ffffff; }
      body .backtotop a i {
        font-size: 2em; }
  body .btncontact {
    width: auto;
    color: #ffffff;
    padding: 0.5em 1em;
    border-radius: 10px;
    border: 2px solid #0080bc;
    background: none; }
    body .btncontact:hover {
      color: #0080bc;
      border: 2px solid #ffffff; }

#navbar {
  transition: top 0.5s; }

header {
  background: rgba(0, 0, 0, 0.8);
  z-index: 1500;
  padding: 1em 2em;
  position: fixed;
  top: 0;
  left: 0; }
  header i {
    font-size: 2.5em;
    color: #0080bc; }
    header i:hover {
      color: #06557a; }
  header .logo {
    width: 35%;
    max-width: 200px; }
  header .openbtn {
    width: auto;
    cursor: pointer;
    padding: 0;
    border: none;
    background: none; }

.sidebar {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 2000;
  top: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.8);
  overflow-x: hidden;
  transition: 0.5s;
  -webkit-transition: 0.5s;
  padding-top: 3em;
  font-size: 0.9em; }
  .sidebar a {
    color: #ffffff; }
    .sidebar a:hover {
      color: #0080bc; }
  .sidebar h3 {
    color: #ffffff;
    text-align: left;
    padding-left: 0.5em;
    padding-bottom: 1em; }
  .sidebar .closebtn {
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0, 128, 188, 0.7);
    padding: 0.5em;
    font-size: 1.5em;
    z-index: 2002; }
  .sidebar .usuario {
    padding-bottom: 1.5em;
    padding-top: 2em; }
    .sidebar .usuario a {
      font-size: 1.2em;
      width: auto; }
    .sidebar .usuario .aditionalcoment {
      position: absolute;
      right: 0;
      top: 0;
      height: auto;
      pointer-events: none;
      opacity: 0;
      transition: 0.5s all;
      -webkit-transition: 0.5s all; }
      .sidebar .usuario .aditionalcoment p {
        width: auto;
        padding: 0.5em;
        background: #000000;
        color: #ffffff;
        font-size: 0.7em;
        border-radius: 10px; }
    .sidebar .usuario a:hover .aditionalcoment {
      opacity: 1; }
  .sidebar .menu {
    width: 100%; }
    .sidebar .menu li a {
      display: block;
      padding: 1em; }
      .sidebar .menu li a:hover {
        background: rgba(0, 128, 188, 0.7);
        color: #ffffff; }
      .sidebar .menu li a .izquierda {
        width: auto;
        margin-right: 1em; }
      .sidebar .menu li a .derecha {
        width: auto;
        float: right; }
    .sidebar .menu li ul {
      display: none;
      background: rgba(0, 0, 0, 0.8); }
      .sidebar .menu li ul a:hover {
        background: rgba(0, 128, 188, 0.7); }
      .sidebar .menu li ul .materiales a:hover {
        background: #002953; }
    .sidebar .menu .activado > a {
      background: #0080bc;
      color: #ffffff; }
  .sidebar .bottmenu {
    -ms-flex-item-align: end;
    -webkit-align-self: flex-end;
    align-self: flex-end;
    padding-bottom: 2em;
    border-top: 1px solid #ffffff;
    margin-top: 2em; }
    .sidebar .bottmenu a {
      width: 40%;
      float: left;
      text-align: center; }
    .sidebar .bottmenu .contactus {
      width: 100%;
      float: left; }
      .sidebar .bottmenu .contactus a {
        width: 100%;
        text-align: left;
        padding: 1em; }
        .sidebar .bottmenu .contactus a:hover {
          color: #ffffff;
          background: #0080bc; }
        .sidebar .bottmenu .contactus a i {
          font-size: 1.2em;
          padding-right: 0.5em; }
    .sidebar .bottmenu h2 {
      float: left;
      padding-bottom: 1em;
      font-size: 1em; }

footer {
  background: #000000;
  font-size: 0.9em; }
  footer section {
    width: 95%;
    max-width: 1200px;
    color: #ffffff; }
    @media only screen and (max-width: 750px) {
      footer section {
        -webkit-box-pack: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: space-around;
        justify-content: space-around; } }
    footer section .finger {
      width: 25%;
      padding-top: 4em;
      padding-bottom: 2em; }
      @media only screen and (max-width: 750px) {
        footer section .finger {
          width: 40%; } }
      @media only screen and (max-width: 500px) {
        footer section .finger {
          width: 100%; } }
      footer section .finger h1, footer section .finger h2, footer section .finger b, footer section .finger a {
        text-align: left;
        color: #ffffff; }
      footer section .finger h1 {
        font-size: 1.2em;
        padding-bottom: 0.5em;
        color: #0080bc;
        border-bottom: 1px solid #0080bc; }
      footer section .finger .another {
        padding-top: 1em; }
      footer section .finger h2 {
        font-size: 1em;
        padding-top: 0.5em;
        padding-bottom: 0; }
      footer section .finger p {
        padding: 0;
        padding-top: 0.5em; }
      footer section .finger i {
        width: 2em; }
      footer section .finger b {
        width: auto; }
      footer section .finger .icon-Vector-Facebook {
        font-size: 1.5em;
        padding-right: 0.5em; }
      footer section .finger a:hover {
        color: #0080bc; }

.alloftheme .atheme {
  width: 33.3%;
  padding: 5em 1em; }
  .alloftheme .atheme:hover {
    color: #ffffff;
    background: #000000; }
  .alloftheme .atheme i, .alloftheme .atheme p {
    pointer-events: none;
    text-align: center; }
  .alloftheme .atheme i {
    font-size: 2em; }
  .alloftheme .atheme .atbg1, .alloftheme .atheme .atbg2, .alloftheme .atheme .atbg3 {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    opacity: 0; }
    .alloftheme .atheme .atbg1:hover, .alloftheme .atheme .atbg2:hover, .alloftheme .atheme .atbg3:hover {
      opacity: 0.8; }
  .alloftheme .atheme .atbg1 {
    background: url("../images/alloftheme/001.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .alloftheme .atheme .atbg2 {
    background: url("../images/alloftheme/002.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .alloftheme .atheme .atbg3 {
    background: url("../images/alloftheme/003.jpg") no-repeat;
    background-size: cover;
    background-position: center; }

.nosotros {
  background: #052547;
  background: -moz-linear-gradient(-45deg, #052547 0%, #041e3a 18%, black 100%);
  background: -webkit-gradient(left top, right bottom, color-stop(0%, #052547), color-stop(18%, #041e3a), color-stop(100%, black));
  background: -webkit-linear-gradient(-45deg, #052547 0%, #041e3a 18%, black 100%);
  background: -o-linear-gradient(-45deg, #052547 0%, #041e3a 18%, black 100%);
  background: -ms-linear-gradient(-45deg, #052547 0%, #041e3a 18%, black 100%);
  background: linear-gradient(135deg, #052547 0%, #041e3a 18%, black 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#052547', endColorstr='#000000', GradientType=1 ); }
  .nosotros section {
    width: 100%;
    padding: 10em 0;
    background: url("../images/nosotros.png") no-repeat;
    background-size: cover;
    background-position: center; }
    .nosotros section p {
      width: 40%;
      padding: 0;
      padding-left: 2em;
      color: #ffffff;
      line-height: 1.5em; }
      @media only screen and (max-width: 750px) {
        .nosotros section p {
          width: 80%; } }

.tecnologia {
  padding: 5em 0; }
  @media only screen and (max-width: 650px) {
    .tecnologia {
      padding-bottom: 0; } }
  .tecnologia .catalogo {
    padding-bottom: 2em;
    padding-top: 1em; }
    .tecnologia .catalogo .hexagono {
      width: 27%;
      min-width: 130px;
      border-radius: 10px;
      padding: 2em 1em; }
      .tecnologia .catalogo .hexagono:hover {
        box-shadow: 2px 2px 5px #333; }
      .tecnologia .catalogo .hexagono i, .tecnologia .catalogo .hexagono p {
        width: 100%;
        text-align: center; }
      .tecnologia .catalogo .hexagono i {
        font-size: 2em; }

@media only screen and (max-width: 650px) {
  .servicios .service {
    -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; } }
.servicios .service .servside {
  width: 50%;
  padding: 5em 0;
  padding-right: 2em; }
  .servicios .service .servside:nth-child(2) {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    background: url("../images/bgservicio.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
    @media only screen and (max-width: 650px) {
      .servicios .service .servside:nth-child(2) {
        position: relative;
        height: 300px; } }
  @media only screen and (max-width: 650px) {
    .servicios .service .servside {
      width: 100%;
      padding-right: 0;
      padding-top: 3em;
      padding-bottom: 3em; } }
  .servicios .service .servside .menu {
    width: 100%; }
    .servicios .service .servside .menu li a {
      display: block;
      padding: 1em; }
      .servicios .service .servside .menu li a:hover {
        background: rgba(0, 128, 188, 0.7);
        color: #ffffff; }
      .servicios .service .servside .menu li a .izquierda {
        width: auto;
        margin-right: 1em; }
      .servicios .service .servside .menu li a .derecha {
        width: auto;
        float: right; }
    .servicios .service .servside .menu li ul {
      display: none;
      background: rgba(0, 0, 0, 0.8); }
      .servicios .service .servside .menu li ul a:hover {
        background: rgba(0, 128, 188, 0.7); }
      .servicios .service .servside .menu li ul .materiales a:hover {
        background: #002953; }
    .servicios .service .servside .menu .activado > a {
      background: #0080bc;
      color: #ffffff; }

#clients {
  padding: 5em 0; }

.clientes div {
  width: 18%;
  min-width: 130px;
  padding: 0 0.5em;
  transform: scale(0.8);
  -webkit-transform: scale(0.8); }
  .clientes div:hover {
    transform: scale(1);
    -webkit-transform: scale(1); }

.dafirst {
  height: 700px;
  overflow: hidden;
  background: #000000; }
  @media only screen and (max-width: 600px) {
    .dafirst {
      height: 400px;
      font-size: 0.9em; } }
  .dafirst .slider {
    height: 100%;
    float: left; }
    .dafirst .slider .slide1, .dafirst .slider .slide2, .dafirst .slider .slide3, .dafirst .slider .slide4 {
      height: 100%;
      padding: 2em; }
      .dafirst .slider .slide1 .slback, .dafirst .slider .slide2 .slback, .dafirst .slider .slide3 .slback, .dafirst .slider .slide4 .slback {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%; }
      .dafirst .slider .slide1 .slcontent, .dafirst .slider .slide2 .slcontent, .dafirst .slider .slide3 .slcontent, .dafirst .slider .slide4 .slcontent {
        width: 80%;
        max-width: 1000px;
        height: auto;
        padding: 2em;
        pointer-events: none;
        background: rgba(0, 0, 0, 0.6);
        border-radius: 10px;
        overflow: hidden; }
        @media only screen and (max-width: 750px) {
          .dafirst .slider .slide1 .slcontent, .dafirst .slider .slide2 .slcontent, .dafirst .slider .slide3 .slcontent, .dafirst .slider .slide4 .slcontent {
            -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; } }
        .dafirst .slider .slide1 .slcontent div, .dafirst .slider .slide2 .slcontent div, .dafirst .slider .slide3 .slcontent div, .dafirst .slider .slide4 .slcontent div {
          width: 40%;
          height: 100%; }
          @media only screen and (max-width: 750px) {
            .dafirst .slider .slide1 .slcontent div, .dafirst .slider .slide2 .slcontent div, .dafirst .slider .slide3 .slcontent div, .dafirst .slider .slide4 .slcontent div {
              width: 100%;
              padding-bottom: 0.5em;
              padding-top: 0.5em;
              -webkit-box-align: center;
              -moz-box-align: center;
              -ms-flex-align: center;
              -webkit-align-items: center;
              align-items: center; } }
          .dafirst .slider .slide1 .slcontent div h1, .dafirst .slider .slide1 .slcontent div p, .dafirst .slider .slide2 .slcontent div h1, .dafirst .slider .slide2 .slcontent div p, .dafirst .slider .slide3 .slcontent div h1, .dafirst .slider .slide3 .slcontent div p, .dafirst .slider .slide4 .slcontent div h1, .dafirst .slider .slide4 .slcontent div p {
            color: #ffffff;
            text-align: left; }
          .dafirst .slider .slide1 .slcontent div h1, .dafirst .slider .slide2 .slcontent div h1, .dafirst .slider .slide3 .slcontent div h1, .dafirst .slider .slide4 .slcontent div h1 {
            padding-bottom: 1em; }
          .dafirst .slider .slide1 .slcontent div p, .dafirst .slider .slide2 .slcontent div p, .dafirst .slider .slide3 .slcontent div p, .dafirst .slider .slide4 .slcontent div p {
            padding-top: 0; }
          .dafirst .slider .slide1 .slcontent div a, .dafirst .slider .slide2 .slcontent div a, .dafirst .slider .slide3 .slcontent div a, .dafirst .slider .slide4 .slcontent div a {
            pointer-events: all;
            margin-left: 0; }
          .dafirst .slider .slide1 .slcontent div i, .dafirst .slider .slide2 .slcontent div i, .dafirst .slider .slide3 .slcontent div i, .dafirst .slider .slide4 .slcontent div i {
            padding-right: 1em; }
          .dafirst .slider .slide1 .slcontent div ul li, .dafirst .slider .slide2 .slcontent div ul li, .dafirst .slider .slide3 .slcontent div ul li, .dafirst .slider .slide4 .slcontent div ul li {
            color: #ffffff;
            padding-bottom: 1em; }
  .dafirst .slhome .slide1 .slback {
    background: url("../images/banner/001.jpg") no-repeat;
    background-size: cover;
    background-position: top; }
  .dafirst .slhome .slide2 .slback {
    background: url("../images/banner/002.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slhome .slide3 .slback {
    background: url("../images/banner/003.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slseg .slide1 .slback {
    background: url("../images/banner/s001.jpg") no-repeat;
    background-size: cover;
    background-position: top; }
  .dafirst .slseg .slide2 .slback {
    background: url("../images/banner/s002.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slseg .slide3 .slback {
    background: url("../images/banner/s003.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slprev .slide1 .slback {
    background: url("../images/banner/p001.jpg") no-repeat;
    background-size: cover;
    background-position: top; }
  .dafirst .slprev .slide2 .slback {
    background: url("../images/banner/p002.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slprev .slide3 .slback {
    background: url("../images/banner/p003.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slcos .slide1 .slback {
    background: url("../images/banner/c001.jpg") no-repeat;
    background-size: cover;
    background-position: top; }
  .dafirst .slcos .slide2 .slback {
    background: url("../images/banner/c002.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slcos .slide3 .slback {
    background: url("../images/banner/c003.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slcos .slide4 .slback {
    background: url("../images/banner/c004.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slcos .slide5 .slback {
    background: url("../images/banner/c005.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slprod .slide1 .slback {
    background: url("../images/banner/pr001.jpg") no-repeat;
    background-size: cover;
    background-position: top; }
  .dafirst .slprod .slide2 .slback {
    background: url("../images/banner/pr002.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slprod .slide3 .slback {
    background: url("../images/banner/pr003.jpg") no-repeat;
    background-size: cover;
    background-position: center; }
  .dafirst .slick-slider, .dafirst .slick-list, .dafirst .slick-track {
    height: 100%; }

.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: 2.5em;
      color: #ffffff;
      pointer-events: all;
      opacity: 0.2;
      transition: 0.5s all;
      -webkit-transition: 0.5s all; }
      .paginator-center ul li:hover {
        opacity: 1; }
      @media only screen and (max-width: 600px) {
        .paginator-center ul li {
          font-size: 2.5em; } }
    .paginator-center ul .next {
      float: right;
      text-align: right; }

.slick-dots {
  bottom: 0px;
  margin-left: 0;
  position: absolute;
  left: 50%;
  bottom: 1em;
  z-index: 1000;
  list-style: none;
  width: auto;
  background: rgba(0, 0, 0, 0.6);
  border-radius: 5px;
  opacity: 0.2;
  transition: 0.5s all;
  -webkit-transition: 0.5s all; }
  .slick-dots:hover {
    opacity: 1; }
  @media only screen and (max-width: 800px) {
    .slick-dots {
      left: 45%; } }
  @media only screen and (max-width: 600px) {
    .slick-dots {
      left: 40%; } }
  @media only screen and (max-width: 400px) {
    .slick-dots {
      left: 30%; } }
  .slick-dots li {
    width: auto;
    float: left;
    padding: 0.5em; }
  .slick-dots button {
    display: block;
    width: 0.8em;
    height: 0.8em;
    padding: 0;
    border: none;
    border-radius: 100%;
    background-color: #434343;
    text-indent: -9999px; }
  .slick-dots li.slick-active button {
    background-color: #06557a; }

.catalogo {
  padding-top: 10em;
  padding-bottom: 5em; }
  @media only screen and (max-width: 900px) {
    .catalogo {
      padding-top: 5em; } }
  @media only screen and (max-width: 650px) {
    .catalogo {
      -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; } }
  .catalogo .catinfo {
    width: 50%; }
    @media only screen and (max-width: 650px) {
      .catalogo .catinfo {
        width: 100%; } }
    .catalogo .catinfo ul {
      padding-top: 1em; }
      .catalogo .catinfo ul li {
        margin-bottom: 1em;
        vertical-align: middle; }
        .catalogo .catinfo ul li:before {
          font-family: 'icomoon';
          font-size: 1.2em;
          width: 2em;
          color: #0080bc; }
      .catalogo .catinfo ul li.one:before {
        content: '\f071'; }
      .catalogo .catinfo ul li.two:before {
        content: '\f0e4'; }
      .catalogo .catinfo ul li.three:before {
        content: '\f14e'; }
      .catalogo .catinfo ul li.four:before {
        content: '\f243'; }
      .catalogo .catinfo ul li.five:before {
        content: '\f041'; }
      .catalogo .catinfo ul li.six:before {
        content: '\f09e'; }
      .catalogo .catinfo ul li.seven:before {
        content: '\f1b6'; }
      .catalogo .catinfo ul li.eight:before {
        content: '\f287'; }
      .catalogo .catinfo ul li.nine:before {
        content: '\f23e'; }
      .catalogo .catinfo ul li.gpsfijo:before {
        content: '\f018'; }
      .catalogo .catinfo ul li.gpsmovil:before {
        content: '\f1eb'; }
      .catalogo .catinfo ul li.cerradura:before {
        content: '\f023'; }
      .catalogo .catinfo ul li.sensor:before {
        content: '\f0e4'; }
      .catalogo .catinfo ul li.watchdog:before {
        content: '\f0c1'; }
      .catalogo .catinfo ul li.micro:before {
        content: '\f130'; }
      .catalogo .catinfo ul li.boton:before {
        content: '\f06a'; }
  .catalogo .catimg {
    width: 40%; }
    @media only screen and (max-width: 650px) {
      .catalogo .catimg {
        width: 60%; } }

.descriptioner {
  padding-top: 5em; }
  .descriptioner h1 {
    color: #06557a; }
  .descriptioner h3 {
    text-align: left;
    padding: 1em;
    background: #06557a;
    color: #ffffff; }
  .descriptioner p {
    padding-bottom: 2em; }
  .descriptioner ul {
    padding-top: 1em; }
    .descriptioner ul li {
      padding: 1em; }

.loggst {
  background: #070f45;
  background: -moz-linear-gradient(-45deg, #070f45 0%, #459bb3 41%, #182557 100%);
  background: -webkit-gradient(left top, right bottom, color-stop(0%, #070f45), color-stop(41%, #459bb3), color-stop(100%, #182557));
  background: -webkit-linear-gradient(-45deg, #070f45 0%, #459bb3 41%, #182557 100%);
  background: -o-linear-gradient(-45deg, #070f45 0%, #459bb3 41%, #182557 100%);
  background: -ms-linear-gradient(-45deg, #070f45 0%, #459bb3 41%, #182557 100%);
  background: linear-gradient(135deg, #070f45 0%, #459bb3 41%, #182557 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#070f45', endColorstr='#182557', GradientType=1 );
  height: 100vh;
  min-height: 450px; }
  .loggst img {
    width: 70%;
    max-width: 500px;
    padding-bottom: 2em; }
  .loggst .logger {
    width: 70%;
    max-width: 500px;
    height: auto;
    padding: 1em;
    background: #ffffff;
    box-shadow: 0 0 5px #000000; }
    .loggst .logger input {
      outline: 0;
      background: #f2f2f2;
      border: 0;
      margin-bottom: 1em;
      margin-top: 1em;
      padding: 1em;
      box-sizing: border-box; }
    .loggst .logger button {
      font-weight: bold;
      text-transform: uppercase;
      background: #06557a;
      padding: 1em;
      color: #ffffff;
      font-size: 1em;
      -webkit-transition: all 0.3 ease;
      transition: all 0.3 ease;
      cursor: pointer; }
      .loggst .logger button:hover, .loggst .logger button:active, .loggst .logger button:focus {
        opacity: 0.8; }
    .loggst .logger .message {
      margin: 15px 0 0;
      color: #b3b3b3;
      font-size: 0.8em; }
      .loggst .logger .message a {
        color: #06557a;
        text-decoration: none; }
    .loggst .logger .register-form {
      display: none; }

.mapa {
  background: #052547;
  background: -moz-linear-gradient(-45deg, #052547 0%, #041e3a 18%, black 100%);
  background: -webkit-gradient(left top, right bottom, color-stop(0%, #052547), color-stop(18%, #041e3a), color-stop(100%, black));
  background: -webkit-linear-gradient(-45deg, #052547 0%, #041e3a 18%, black 100%);
  background: -o-linear-gradient(-45deg, #052547 0%, #041e3a 18%, black 100%);
  background: -ms-linear-gradient(-45deg, #052547 0%, #041e3a 18%, black 100%);
  background: linear-gradient(135deg, #052547 0%, #041e3a 18%, black 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#052547', endColorstr='#000000', GradientType=1 );
  padding-top: 8em;
  padding-bottom: 2em; }
  .mapa h1 {
    color: #ffffff; }
  .mapa .mitrack {
    width: 60%;
    max-width: 500px;
    padding-bottom: 3em;
    padding-top: 3em; }
  .mapa .grid {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    opacity: 0.8;
    background: url("../images/grid.png") no-repeat;
    background-size: cover;
    background-position: center; }
  .mapa .description {
    max-width: 600px;
    color: rgba(229, 229, 229, 0.7);
    text-align: center; }
  .mapa .distribution-map {
    padding: 20px;
    box-sizing: border-box; }
    .mapa .distribution-map .map-point {
      cursor: pointer;
      outline: none;
      z-index: 0;
      position: absolute;
      width: 40px;
      height: 40px;
      border-radius: 20px;
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      -moz-transition: opacity 0.25s ease-in-out 0.25s, width 0.25s ease-in-out 0.25s, height 0.25s ease-in-out 0.25s, z-index 0.25s ease-in-out 0.25s;
      -o-transition: opacity 0.25s ease-in-out 0.25s, width 0.25s ease-in-out 0.25s, height 0.25s ease-in-out 0.25s, z-index 0.25s ease-in-out 0.25s;
      -webkit-transition: opacity 0.25s ease-in-out, width 0.25s ease-in-out, height 0.25s ease-in-out, z-index 0.25s ease-in-out;
      -webkit-transition-delay: 0.25s, 0.25s, 0.25s, 0.25s;
      transition: opacity 0.25s ease-in-out 0.25s, width 0.25s ease-in-out 0.25s, height 0.25s ease-in-out 0.25s, z-index 0.25s ease-in-out 0.25s;
      background: rgba(0, 0, 0, 0.6);
      border: 2px solid #0080bc; }
      .mapa .distribution-map .map-point:hover {
        background: rgba(189, 43, 43, 0.6); }
      .mapa .distribution-map .map-point:active, .mapa .distribution-map .map-point:focus {
        margin: 0;
        padding: 0;
        filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
        opacity: 1;
        width: 300px;
        height: 220px;
        color: #ffffff;
        z-index: 1;
        transition: opacity 0.25s ease-in-out, width 0.25s ease-in-out, height 0.25s ease-in-out; }
        .mapa .distribution-map .map-point:active:hover, .mapa .distribution-map .map-point:focus:hover {
          background: rgba(0, 0, 0, 0.8); }
        .mapa .distribution-map .map-point:active .tituleishon, .mapa .distribution-map .map-point:focus .tituleishon {
          width: 100%; }
      .mapa .distribution-map .map-point:active .content, .mapa .distribution-map .map-point:focus .content {
        filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
        opacity: 1;
        -moz-transition: opacity 0.25s ease-in-out 0.25s, height 0.25s ease-in-out, overflow 0.25s ease-in-out;
        -o-transition: opacity 0.25s ease-in-out 0.25s, height 0.25s ease-in-out, overflow 0.25s ease-in-out;
        -webkit-transition: opacity 0.25s ease-in-out, height 0.25s ease-in-out, overflow 0.25s ease-in-out;
        -webkit-transition-delay: 0.25s, 0s, 0s;
        transition: opacity 0.25s ease-in-out 0.25s, height 0.25s ease-in-out, overflow 0.25s ease-in-out;
        overflow: hidden; }
      .mapa .distribution-map .map-point:active .content a:hover, .mapa .distribution-map .map-point:active .content a:active, .mapa .distribution-map .map-point:focus .content a:hover, .mapa .distribution-map .map-point:focus .content a:active {
        color: #ffffff; }
      @media only screen and (max-width: 600px) {
        .mapa .distribution-map .map-point {
          width: 20px;
          height: 20px;
          border-radius: 10px; }
          .mapa .distribution-map .map-point:active, .mapa .distribution-map .map-point:focus {
            width: 200px; } }
      .mapa .distribution-map .map-point .content {
        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
        opacity: 0;
        transition: opacity 0.25s ease-in-out;
        width: 100%;
        height: 100%;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        overflow: overlay; }
        .mapa .distribution-map .map-point .content .centered {
          position: absolute;
          top: 50%;
          left: 50%;
          -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }
        .mapa .distribution-map .map-point .content .centered-y {
          position: absolute;
          width: 100%;
          top: 50%;
          -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
          padding: 0 1em; }
          .mapa .distribution-map .map-point .content .centered-y h2 {
            color: #0080bc;
            font-size: 1.5em; }
          .mapa .distribution-map .map-point .content .centered-y a {
            background: #06557a;
            padding: 0.5em;
            border-radius: 10px;
            color: #ffffff; }
          .mapa .distribution-map .map-point .content .centered-y p {
            text-align: center; }
    .mapa .distribution-map .tituleishon {
      position: absolute;
      top: -3em;
      color: #ffffff;
      width: 100px;
      padding-bottom: 0.5em;
      border-bottom: 1px solid #ffffff;
      pointer-events: none;
      opacity: 0;
      transition: 0.5s all;
      -webkit-transition: 0.5s all; }
    .mapa .distribution-map .map-point:hover .tituleishon {
      opacity: 1; }
  .mapa .distribution-map > img {
    width: 100%;
    position: relative;
    margin: 0;
    padding: 0; }

.contactform {
  padding-top: 8em;
  padding-bottom: 4em; }

#contact {
  padding: 1em 0; }
  #contact fieldset {
    border: #434343 !important;
    margin-bottom: 1em;
    margin-right: 2%;
    margin-left: 2%;
    width: 46%;
    float: left;
    padding: 0; }
    @media only screen and (max-width: 800px) {
      #contact fieldset {
        width: 80%;
        margin: 1em 10%; } }
  #contact .textmen {
    width: 96%; }
    @media only screen and (max-width: 800px) {
      #contact .textmen {
        width: 80%;
        margin: 1em 10%; } }
  #contact textarea {
    height: 100px;
    max-width: 100%;
    resize: none; }

#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea {
  width: 100%;
  border: 1px solid;
  border-bottom: 1px solid #434343;
  background: none;
  padding: 10px;
  color: #434343; }

#contact input[type="text"]: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 #434343;
  background: rgba(250, 250, 250, 0.2);
  color: #434343; }

#contact button[type="submit"], .btncontact {
  cursor: pointer;
  width: 50%;
  border: none;
  border-radius: 10px;
  background: #434343;
  color: #ffffff;
  margin: 0;
  margin-left: 20%;
  padding: 10px;
  font-size: 1em;
  transition: 0.2s all;
  -webkit-transition: 0.2s all; }

#contact button[type="submit"]:hover, .btncontact: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 #ffffff; }

#contact input:focus, #contact textarea:focus {
  outline: 0;
  border: 1px solid #434343; }

::-webkit-input-placeholder {
  color: #434343; }

:-moz-placeholder {
  color: #434343; }

::-moz-placeholder {
  color: #434343; }

:-ms-input-placeholder {
  color: #434343; }

.btncontact {
  width: auto;
  text-align: center; }